Passing a variable before injecting a content script

Question

I am working on a Chrome Extension that works mainly within a pop-up. I would like the user to enter some text (a string) into an input field in the pop-up, and this string will serve as a "variable" in a script I would like to inject and run on a specific page.

I have tried achieving this by making a content script that will execute the script, using the following well documented way:

var s = document.createElement('script');


s.src = chrome.runtime.getURL('pageSearch.js');
s.onload = function() {
   this.parentNode.removeChild(this);
};

(document.head||document.documentElement).appendChild(s);

Basically, I would like to pass the user's input all the way to the code in pageScript.js before executing the script on the page.

What would be the best way to approach this? I will not be getting any information back to the extension.

Thanks.

possible duplicate of [Chrome Extension - Message Passing from Popup to Content Script](http://stackoverflow.com/questions/6108906/chrome-extension-message-passing-from-popup-to-content-script) — levi, Feb 24 '15 at 20:25
Hey, thank you. I am afraid that this does not address the issue. — Boris Ablamunits, Feb 25 '15 at 07:38

score 2 · Accepted Answer · edited May 23 '17 at 12:12

To pass a variable from the popup to the dynamically inserted content script, see Pass a parameter to a content script injected using chrome.tabs.executeScript().

After getting a variable in the content script, there are plenty of ways to get the variable to the script in the page.

E.g. by setting attributes on the script tag, and accessing this <script> tag using document.currentScript. Note: document.currentScript only refers to the script tag right after inserting the tag in the document. If you want to refer to the original script tag later (e.g. within a timer or an event handler), you have to save a reference to the script tag in a local variable.

Content script:

var s = document.createElement('script');
s.dataset.variable = 'some string variable';
s.dataset.not_a_string = JSON.stringify({some: 'object'});
s.src = chrome.runtime.getURL('pageSearch.js');
s.onload = function() {
   this.remove();
};
(document.head||document.documentElement).appendChild(s);

pageSearch.js:

(function() {
    var variable = document.currentScript.dataset.variable;
    var not_a_string = JSON.parse(document.currentScript.dataset.not_a_string);
    // TODO: Use variable or not_a_string.
})();

Hi Rob, this was exactly the missing piece I needed. Your other comments throughout this site have also been of great help during my learning. Thank you very much. — Boris Ablamunits, Feb 25 '15 at 16:36

Passing a variable before injecting a content script

1 Answers1