GetSelection.getRangeAt (0) in the Google Chrome extension

I am trying to determine the position of selected text in my browser. I need a position to show a tooltip above the selected text. I assume that if I get the boundaries, I can figure out the middle of this. I was busy and looked at the offers here, but could not find a solution.

If I'm not mistaken, does this seem to be a problem with Google Chrome?

Remember that I am trying to create a chrome extension, so there is no need to test if it works in Firefox / IE ...

This is all the code causing the problem:

var selection = window.getSelection();

// calculate the posiition of the selection
var oRange = selection.getRangeAt(0);
var oRect = oRange.getBoundingClientRect();
console.log(oRect);

(I tried to refer to this example here )

The error looks like this:

background.js: 20 Uncaught DOMException: Failed to execute 'getRangeAt' in 'Selection': 0 is not a valid index.

jQuery, , JavaScript.

background.js

chrome.contextMenus.create({
    "title": "Übersetzen",
    "contexts": ["selection"],
    "onclick" : clickHandler
});

function clickHandler(e) {

    var translateUrl = "https://glosbe.com/gapi/translate?from=eng&dest=deu&format=json&phrase=" + encodeURI(e.selectionText.toLowerCase()) + "&pretty=true";
    $.getJSON(translateUrl, callback);
    // console.log(data.responseTex);
}

function callback(data) {
    var translation = data.tuc[0].phrase.text;
    var selection = document.getSelection();

     console.log(selection);


    // calculate the position of the selection
    var oRange = selection.getRangeAt(0);
    var oRect = oRange.getBoundingClientRect();
    console.log(oRect);
    var selection = "";

    chrome.tabs.query({active: true, currentWindow: true}, function(tabs){
        chrome.tabs.sendMessage(tabs[0].id, {translation: translation}, function(response) {});
    });
}

:. , ( )

Update2: , : ( mouseclick) , .

Update3: -HTML. script, , ( )

4: ( chrome.tabs.executeScript - )

+4
1

script, script. "onMessage" var s = window.getSelection(). , .

+1

Source: https://habr.com/ru/post/1690087/


All Articles