browserAction.setBadgeText isn't being executed when used in tabs.executeScript callback

Question

I'm working on my first Chrome extension. I have a default popup popup.html which loads popup.js.

I used serg's answer to Chrome's tabs.executeScript - passing parameters and using libraries? as inspiration for the popup->page interaction.

The problem is that the following click handler in popup.js works:

function click(e) {
    chrome.browserAction.setBadgeText ( { text: "loading" } );
    chrome.tabs.executeScript(null,
        {code:"globalVarName = {'scriptOptions': {...}};" },
        chrome.tabs.executeScript(null, {file: "js/script.js"},
            chrome.browserAction.setBadgeText ( { text: "done" } ))
    );
    window.close();
}

But the following does not:

function click(e) {
    chrome.browserAction.setBadgeText ( { text: "loading" } );
    chrome.tabs.executeScript(null,
        {code:"globalVarName = {'scriptOptions': {...}};" },
        chrome.tabs.executeScript(null, {file: "js/script.js"},
            function(){chrome.browserAction.setBadgeText ( { text: "done" } );})
    );
    window.close();
}

I want to be able to do more than one thing on completion.

Edit:

I've realised that the first case immediately executes chrome.browserAction.setBadgeText(), not when the script has finished executing. So that case can be ignored. I've reworded the question title to reflect this.

What I'm looking for is why the second case's callback doesn't execute at all.

Once I got my facts straight, I realized the same thing. Are you sure `script.js` is actually executed without any errors? — Jasper, Nov 01 '12 at 13:21
I guessed that :). Yes. Well, it executes most of the time. Sometimes `globalVarName` isn't defined. I can add the contents of `script.js` to the question if you like. — Adam Lynch, Nov 01 '12 at 13:26
Are you also sure it executes all the way through? Putting an alert way at the end could help you find that out if you are having trouble with that. I think that experiment is far more useful than posting the code - either it works or it doesn't... — Jasper, Nov 01 '12 at 13:29
Hang on though, surely this will never work as you intend, shouldn't your second executeScript be wrapped in an anonymous function? As it's the callback from the initital executeScript?? — urbananimal, Nov 01 '12 at 13:42
@urbananimal ugh the same mistake. That should explain why `globalVarName` isn't defined sometimes. — Adam Lynch, Nov 01 '12 at 13:45
@AdamLynch does that fix your problem? I'll post as an answer. — urbananimal, Nov 01 '12 at 13:46
@urbananimal I'm afraid not. Now `script.js` isn't executing at all. — Adam Lynch, Nov 01 '12 at 13:49
Which would suggest there is a problem with the first script you're running? — urbananimal, Nov 01 '12 at 13:52
@urbananimal The first script is just a variable declaration though. The second script depends on that object too, and it was running fine most of the time. — Adam Lynch, Nov 01 '12 at 13:54
I've now simplified the code; `chrome.tabs.executeScript(null, {code:"var a = 'a';" }, function(){ chrome.tabs.executeScript(null, {file: "js/script.js"}); } );` But it's still not executing. — Adam Lynch, Nov 01 '12 at 14:00
OK, the code works for me. There is nothing wrong with the way things are being called. script.js runs for me... Are you getting any errors? Have you set your permissions correctly? — urbananimal, Nov 01 '12 at 14:25
@urbananimal I took the code I just quoted and began from scratch with that and built back up to what it was. I'm not 100% sure why but it's working now. My best guess is that the `window.close()` at the end of the click handling was causing problems. (It is now if I put it in, but I don't want the popup to close anyway). If you think that makes sense, add it to your answer and I'll accept — Adam Lynch, Nov 01 '12 at 14:59
Oh yeah... That would make sense :P I don't know the exact context of your particular application but executeScript is executing the the script in the open tab. Presumably your code is closing the window before the second script is executing... Doh. I won't add it to my answer. You should add it as your own answer :) — urbananimal, Nov 01 '12 at 15:36

score 3 · Accepted Answer · answered Nov 01 '12 at 16:01

I'm pretty sure the culprit here is window.close() which closes the popup. The same popup in which this code is executing (except script.js, that's executing on the actual page).

Therefore, the callback was never being executed. I'm only talking of course about case 2 here (see my edit to the question).

My latest fully working code for any future visitors:

var tabId = null;
function click(e) {
    chrome.browserAction.setBadgeText ( { text: "..." } );
    chrome.tabs.executeScript(tabId, 
        {code:"globalVarName= {...}" }, 
        function(){ 
            chrome.tabs.executeScript(tabId, {file: "js/script.js"},
                function(){chrome.browserAction.setBadgeText ( { text: "done" } );
                    setTimeout(function() { 
                        chrome.browserAction.setBadgeText ( { text: "" } ); 
                    }, 1000);
                }
            ); 
        } 
    );
}

Also note that the path to the script (script.js here) is relative to the extension source root, i.e. where the manifest.json is.

browserAction.setBadgeText isn't being executed when used in tabs.executeScript callback

Edit:

1 Answers1