0

Documentation

Consider this code:

// background.js
function Action(tab) {
    let title;
    function domTitle() {
        return document.title;
    }

    chrome.scripting.executeScript({target: {tabId: tab.id}, func: domTitle}, injectionResults => { 
        for (const frameResult of injectionResults) {
            this.title = frameResult.result;
            console.log(this);       // line 10
            console.log(this.title); // line 11
        }
    });
}

chrome.contextMenus.onClicked.addListener(((info, tab) => {
    const action = new Action(tab);
    console.log(action);        // line 29
    console.log(action.title);  // line 30
}));

Console output: Console screenshot

Why line 30 ( the title property title of Action ) is undefined? The property has clearly been set.

How to fix it? So line 30 will hold the value that was set by chrome.scripting.executeScript.

Francisco Luz
  • 2,775
  • 2
  • 25
  • 35

1 Answers1

0

Pretty much all the chrome.* functions from the new v3 manifest api return promises.

Here is my solution:

// background.js
const contextMenu = () => {
    chrome.contextMenus.create({
        "id": "myIdContextMenu",
        "title": "My Context Menu Title",
        "documentUrlPatterns": [
            "http://*/*",
            "https://*/*"
        ]
    });
};

async function getValues(tab) {
    function domTitle() {
        return document.title;
    }

    const dom = chrome.scripting.executeScript({target: {tabId: tab.id}, func: domTitle})
        .then(result => {return {name: "cookies", values: result}});
    const cookies = chrome.cookies.getAll({domain: "google.com"})
        .then(result => {return {name: "dom", values: result}});

    return await Promise.all([cookies, dom]);
}

chrome.contextMenus.onClicked.addListener((info, tab) => {
    getValues(tab).then(values => {
        console.log(values);

        // Rest of my logic here.
    })
    .catch(error => {
      console.error(error.message)
    });
});

chrome.runtime.onStartup.addListener(contextMenu);
chrome.runtime.onInstalled.addListener(contextMenu);
Francisco Luz
  • 2,775
  • 2
  • 25
  • 35
  • 1
    Have a look at [How do I convert an existing callback API to promises?](https://stackoverflow.com/q/22519784/1048572) for how to make the `await` work – Bergi Nov 05 '21 at 02:07
  • Thank you @Bergi . I am a PHP developer and until now I was having a hard time grasping all this promise concept that javascript has. After playing around with it I finally get it ( I hope ). I've edited my answer and added my solution using the promise way of doing it. – Francisco Luz Nov 16 '21 at 06:47