Do more on the web, with a fast and secure browser!

Download Opera browser with:

  • built-in ad blocker
  • battery saver
  • free VPN
Download Opera

Web Panel

  • to solve CORS problems, maybe you can inject script that will send message to your extension (background) with all the info you need (window.loaction.href or something like that)

  • @vux777:

    The problem is, how do I access the DOM content in the sidebar? When I use a content script, it works on all tabs/pages except on the sidebar.

  • @gustavwiz
    have you tried to open iFrame and insert script?
    something like this:
    http://jaspreetchahal.org/how-to-inject-javascript-into-an-iframe/

    in your case:
    var iFrameHead = iframe.document.getElementsByTagName("head")[0];
    var myscript = document.createElement('script');
    myscript.type = 'text/javascript';
    myscript.src = 'myscript.js'; // replace this with your SCRIPT
    iFrameHead.appendChild(myscript);

    ...........
    no use of manifest content scripts, they reefer to legit browser tabs

  • @vux777

    THINGS TO LOOK FOR
    You can only perform this task if the iFrame source is loaded from same domain. i.e. if you are running
    a site abc.com then iframe src could be abc.com/hello.html
    
    
    Read more: http://jaspreetchahal.org/how-to-inject-javascript-into-an-iframe/#ixzz3iz32VvM5
    

    This is the problem.

  • year ago I was playing with iFrames, but I had "other way around" situation
    I was injecting iframes into some other domains but with my content
    (my zoom popup extension works something similar)
    but you have your own environment (panel) with iframe src from different domains

    btw are you sure you can't inject anything into that iframe content?
    either with chrome tabs executeScript (all frames) or with content script...
    because my smooth scroll extension works on pages loaded in your panel

  • @vux777

    When I used 'all frames', it worked! (in content script).

    The problem now is how do I identify the iframe in the sidebar? So I know that it's not any other iframe on another random site/tab? I tried to name the iframe with a spacial id, and then get it with window.frameElement.id in content script, but then I got the cross origin error the other way around 🙂 (ie, the site in the iframe was trying to gain access to the iframe itself, which is on another site (where "another site" in this case is the side panel)).

    Just to clarify, the thing that worked was to, from the content script, get access to the iframe content. Not the iframe itself and other panel content.

  • I guess webNavigation/webRequest APIs won't fire event for iFrame in sidebar?

    I would inject code (content script) that will give me window.location.href so you can maintain list of visited URLs, and when user wants to go back, load last in array, and so on...
    You should be able to send message from iFrame to your extension with
    chrome.runtime.sendMessage({newURL: "fromCS", url: window.location.href});
    with every new page, CS will be loaded and send you data needed
    you will probably want to fetch window.onunload... also, so that you can know that user is navigating away from current page....and prepare some things, whatever
    this takes a lot of testing btw 🙂
    happy coding :party:

  • ohhh.... btw
    compare your user input with messages from iframes (if there is no other way)
    and maybe listen for clicks on links and where it takes....

    ................
    or by sender.tabId
    it should be something different than from regular tabs
    that's under presumption that messaging will work from iframe

  • This is a great extension, I couldn't live without it, as I always used a webpanel in Opera 12 to follow tennis live scores (using the mobile site http://m.tennistemple.com/ )

    The only thing that that I'm missing from the Opera 12 webpanel feature is the possibility to reduce the font size (zoom). As I generally use 110% or 125% zoom in for websites (on high resolution monitors), the font on the webpanel is a bit too large. In Opera 12, I zoomed the webpanel out to 80% in order to make it more compact while still being readable.

  • @gustavwiz
    Vivaldi just pushed version with web panel
    they don't have x-frame restrictions ofc (they made it internally)

  • Yeah, I'm using vivaldi right now, their web panel function is actually awesome. Web panel doesn't reload when you change sidebar tab. It doesn't have a back or forward button yet though.

  • @gustavwiz
    Vivaldi just pushed version with web panel
    they don't have x-frame restrictions ofc (they made it internally)

    It can be done with the webRequest API. https://developer.chrome.com/extensions/webRequest

    I was experimenting with a similar extension, and I was able to load any site. There is an extension to bypass the x-frame. It worth to take a look at the source code. https://chrome.google.com/webstore/detail/ignore-x-frame-headers/gleekbfjekiniecknbkamfmkohkpodhe

  • @vux777:

    and maybe listen for clicks on links and where it takes....

    The problem is that I can only do this from the content script 🙂

    It is really in the content script I need to find out if the frame is the iframe in the sidebar.

  • @nekomajin

    It can be done with the webRequest API. https://developer.chrome.com/extensions/webRequest

    I was experimenting with a similar extension, and I was able to load any site. There is an extension to bypass the x-frame. It worth to take a look at the source code. https://chrome.google.com/webstore/detail/ignore-x-frame-headers/gleekbfjekiniecknbkamfmkohkpodhe

    Actually I'm already using the code from that extension 🙂

    It's working on several sites, but not all.

  • Actually I'm already using the code from that extension
    It's working on several sites, but not all.

    Is there anything common in those sites?

  • @nekomajin

    Is there anything common in those sites?

    I don't know, I haven't analyzed this further.

  • The problem is that I can only do this from the content script
    It is really in the content script I need to find out if the frame is the iframe in the sidebar.

    I think there is a couple of tricks to get what you need (messaging from iframe?!)
    document.referrer from within iframe is one of them and probably the simplest one
    compare it to your extension panel url and set the flag in your content script for further actions

  • @vux777

    document.referrer doesn't work. Either it shows nothing, or on some sites, like instagram, it shows the url of that site...

  • ok, another solution is messaging system
    content script with all frames

    this is a content script

    window.onload = function() {
    	if (window !== window.top) {
    		var allLinks = document.links;
    		for (var i=allLinks.length-1; i>=0; i--) {
    			if (allLinks[i].href.startsWith('http://') || allLinks[i].href.startsWith('https://'))
    				allLinks[i].addEventListener('click', clickLink, false);
    		}
    	} 
    }
    
    function clickLink(e) {
    	chrome.runtime.sendMessage({fromCnt: 'newLink', link: this.href});
    }
    

    in your panel script add:

    chrome.runtime.onMessage.addListener(function(message, sender) {
    	if (message.fromCnt && !sender.frameId) console.log(message.link);
    });
    

    and observe console log (from panel)
    you will get link clicks only from your iframe panel, and you can save those links in array to be able to go back
    you already have links that user inserted into address form

    from regular tabs, every sender object have frameId and object tab
    from sidebar frame, there is only sender ID (extension id) and URL
    ...this is for every page I tested...with iframes or without iframes

    so this could be the pattern to recognize where from message came, and ofc. to mantain the list of user navigation... simply save those urls in array and on button BACK load n-1

  • The web panel has become completely unusable sadly. It reloads not only whenever you change to another sidebar extension, but also when you hide sidebar or just web panel itself. I know it's opera's fault, but is there nothing that can be done about it?

Log in to reply