Chrome extensions - modify script before execution

Question

I'm kinda new to this chrome-extensions stuff, and i'm trying to modify a script before it is executed.

Example:

<script type="text/javascript">
    function() {
        var count = 10;
        countDown = setInterval(function() {
            if(count == 0) {
                // do Stuff
            }
            count--;
        }, 1000);
    }
</script>

My goal is to either remove this script from the site (before it is executed) and inject my own (i already did the injection-part) or modify it (for example set count to 20 so it takes 20 seconds).

I've already tried a lot of things but i just can't find a good way.

Hope you can help me :)

using getElementsByTagName getting all scripts and checking which is the right one (works) and then remove it using .parentNode.removeChild. — Niphram, Jul 20 '15 at 17:34
The script is inside the HTML page, i don't know i i could do that, if it is executed right away (also my javascript knowledge is kinda limited) the best thing would be to stop the script from executing, then i could just use my own script — Niphram, Jul 20 '15 at 17:42
is it your HTML script, because you could use Notepad++ or Brackets — JMP, Jul 20 '15 at 17:45
No, the script is on a website, and when i load that website i want to override the already given script with my own — Niphram, Jul 20 '15 at 17:48
It's a website i wrote myself (just a simple countdown) but i don't want to edit the site itself, i want to create a chrome extension to basically "hijack" the script — Niphram, Jul 20 '15 at 18:02
doubt its possible unless you trap the page "get" from background network hook and modify response — Zig Mandel, Jul 20 '15 at 21:22
if you wrote the website yourself, why do you want to hijack it? — JMP, Jul 21 '15 at 03:19

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

It's going to be pretty difficult to hijack that part on the fly, but at least you can stop the timer.

All you need to do is to call

clearInterval(countDown);

..in the right context.

At this point the extension architecture and the concept of isolated worlds come into play.

The only part of the extension that can interact with the webpage is a content script. But then, the content script lives in a separate context:

Content scripts execute in a special environment called an isolated world. They have access to the DOM of the page they are injected into, but not to any JavaScript variables or functions created by the page. It looks to each content script as if there is no other JavaScript executing on the page it is running on. The same is true in reverse: JavaScript running on the page cannot call any functions or access any variables defined by content scripts.

But you need to access the page's JavaScript. There's a way, by injecting your code into the page as a <script> tag:

var script = document.createElement('script');
script.textContent = "clearInterval(countDown);";
(document.head||document.documentElement).appendChild(script);
script.parentNode.removeChild(script);

Chrome extensions - modify script before execution

1 Answers1