0

I have a very strange situation. I have an extension which copies stuff from the webpage based on the user's selection. But, when ever there are multiple frames its fails. For example on Gmail. If I select anything from Gmail and try to find the selection it will end up with an error:

Error: window.getSelection(...) is null

Here is my code (This is a working example. I didn't include the icon.):

manifest.json

{
    "description": "Adds a solid red border to all webpages matching mozilla.org. See https://developer.mozilla.org/en-US/Add-ons/WebExtensions/Examples#borderify",
    "manifest_version": 2,
    "name": "Borderify",
    "version": "1.0",
    "homepage_url": "https://github.com/mdn/webextensions-examples/tree/master/borderify",
    "icons": {
        "48": "icons/border-48.png"
    },
    "background": {
        "scripts": ["myaddone.js"]
    },
    "browser_action": {
        "default_icon": "icons/trash.svg",
        "default_title": "Forget it!"
    },
    "content_scripts": [{
        "matches": ["<all_urls>"],
        "js": ["callHere.js"],
        "all_frames": true
    }]
}

callHere.js

function logger(msg) {
    console.log("=============");
    console.log(msg);
    console.log("=============");
}
var getSelectedDataFromPage = function () {
    logger("fooo");
    selec = window.getSelection().toString().trim();
    return selec;
}
browser.runtime.onMessage.addListener(request => {
    var messageToCopy = request.greeting;
    if (messageToCopy == "findCopy") {
        var selectedText = getSelectedDataFromPage();
        return Promise.resolve({
            response: selectedText
        });
    }
    logger(messageToCopy);
    return Promise.resolve({
        response: "Fail"
    });
});

myaddone.js

function logger(msg) {
    console.log(msg);
}

function onError(error) {
    console.error(`Error: ${error}`);
}

function findSelectionTExt(tabs) {
    for (let tab of tabs) {
        browser.tabs.sendMessage(tab.id, {
            greeting: "findCopy"
        }).then(response => {
            logger(response.response);
        }).catch(onError);
    }
}
browser.browserAction.onClicked.addListener(() => {
    browser.tabs.query({
        currentWindow: true,
        active: true
    }).then(findSelectionTExt).catch(onError);
});

It is using a message system to content script to copy stuff from selection. It works perfectly fine with Stack Overflow and other sites, but not sites which use more frames etc., like Gmail.

Loop Image, as you can see it able to grab the text first time and then its keep sending the message I think.

enter image description here

What I am really missing?

Achayan
  • 5,720
  • 2
  • 39
  • 61
  • The code you are using to get the selection is insufficient. Use the more complex code which you can find in the snippet in: [Get the Highlighted/Selected text](https://stackoverflow.com/a/5379408). As you should be able to test, the code you are using will fail to get the selection in Firefox under some conditions. – Makyen Aug 12 '17 at 07:17
  • *Please*, use one [indenting style](https://en.wikipedia.org/wiki/Indent_style) consistently throughout your code. Doing so makes it **much** easier to read/maintain. As a side effect, doing so for code you place on Stack Overflow makes it much more likely that you will get people to up-vote your posts and makes it more likely that people will put time into Answering your Questions. It doesn't matter which style your choose (although, IMO, some are more appropriate for JavaScript than others). But, pick one and use it consistently for all code in a single project. – Makyen Aug 12 '17 at 07:19
  • Adjusting your code to include the more robust, and necessary, code at the link I provided may, or may not, fix your specific issue. It's not clear if that is your actual issue, or not. You have provided too little information about the circumstances in which you are using this for us to actually know. However, not using the more robust code *will* cause issues with not getting the selected text. Please include the more robust code and retest. – Makyen Aug 12 '17 at 07:30
  • I am pretty sure my code indenting style is fine and I am sure you didn't even tried to run this code .. its very basic and copied from firefox git repo. As I told my issue is it is not working where frames is used. It going some loop which I can't find where, other site like SO it works fine. Even the same code works fine in chrome even with gmail. I attached the trace back image. – Achayan Aug 12 '17 at 17:03
  • Althoguh I tried the solution which you mentioned in your first comment. Which also won't work. – Achayan Aug 12 '17 at 17:08
  • Firefox needs the more complex code under many circumstances. It's a common problem when trying to get the selection on Firefox. I don't need to run your code to see that your code to get the selection is insufficient to do so even under normal circumstances. It's clear from just looking at it (when you've previously dealt with the problem). Note: I didn't claim it was going to solve *this* problem, just that it is *a problem* which would cause you not to get the selection and that it *could* be the problem, but that there is not enough info in the question to know if it was *the* problem. – Makyen Aug 12 '17 at 17:34
  • When looking at SO questions, I commonly run the code provided. I did not for yours because there was something obvious which would cause what you are reporting. It's your code. We are volunteering our time to help you. It's not really our job to dig through multiple possible issues when you have not provided clear test cases (e.g. go to this site; try to select this; it does A (explicitly stated), but it should do B (explicitly stated)). For this it might help to provide a screen movie so we see what you are selecting. I use [LICECap](https://www.google.com/search?as_q=licecap) on Win/OSX. – Makyen Aug 12 '17 at 17:34
  • As to your use of indenting style: The code in the [original version](https://stackoverflow.com/revisions/e6294dde-4126-45ff-a264-e65ab485c9b3/view-source) of this question inconsistently placed `{` brackets either on the line with the preceding statement or on the next line in multiple places. As an example, see the first two function definitions in *myaddone.js*. Having these inconsistently placed and indenting not used (e.g. your `then(response => {` then not indenting `logger(response.response);` and multiple indents/not out-denting makes reading your code *significantly* more difficult. – Makyen Aug 12 '17 at 17:37
  • man its okay leave this thread alone, probably some one else have some hints. And I am so doing help in SO ..I am not a user who are trying to waste other people time .. – Achayan Aug 12 '17 at 17:54

1 Answers1

0

I did solved my issue using context menu item and it works very well with every where like iframes. I got a example from firefox repo. https://github.com/mdn/webextensions-examples/tree/master/context-menu-demo.

Achayan
  • 5,720
  • 2
  • 39
  • 61