Change of variables via popup

Question

I am doing a Chrome extension and I have a problem. It is supposed to click button on the page.

I want to use a variable that I can change via the popup because I don't want to go to the script all the time and change the variable. How do I do that?

I want to change the variable sku via popup.

Manifest:

{
      "name": "Clicker",
      "manifest_version": 2,
      "version": "0.0.1",
         "browser_action": {
         "default_popup": "popup.html",
         "default_title": "popup",
         "default_icon": "icon.png"
             },
      "description": "Clicker",
        "content_scripts": [
        {
            "matches": ["https://www.zalando.pl/*"],
            "js": ["content.js"]
        }
    ],
        "permissions": [
        "tabs", "storage" ,"activeTab", "http://*/*", "https://*/*",    
        "<all_urls>",
            "*://*/*",
            "tabs",
            "storage", 
            "webRequest",
            "webRequestBlocking",
        "webNavigation",
        "alarms",
        "cookies"
      ]
}

popup.html:

<html>
    <body>
    <h1>Esensial Scripts</h1>
    <input type="text" id="sku" placeholder="Enter Sku Here"/>
    <input type="submit" id="Save" value="Save"/>
    </body>
</html>

content.js:

var spicker = "size-picker-";
var sku = "NI112O0J9-A110075000";

//example var sku = "XXXXXXXXX-XXXXXXXXXX";
                 
const sleep = (milliseconds) => {
        return new Promise(resolve => setTimeout(resolve, milliseconds))
}
    
window.addEventListener('load', function () {
    sleep(1).then(() => {
        document.getElementById(spicker + sku).click();
    })
})

score 0 · Answer 1 · answered May 14 '21 at 18:11

I suggest you use Message Passing. You should call chrome.tabs.sendMessage in popup.html (or to be more concise popup.js loaded by popup.html) when the button is clicked and listen to the message with chrome.runtime.onMessage in content.js.

There are other methods that you can find here.

Change of variables via popup

1 Answers1