detect if Chrome extension content script has been injected / content script include guard

Question

I want to execute a content script function whenever a tab is updated. The problem is that, sometimes the tab update is ajax (without a page reload), while still changing th

Answer 1

You can try sending a message to content script (Message Passing). If the content script successfully returns a response then it means that the content script is already there otherwise an empty response is returned, you can check for an empty response and inject the content script.

Background:

chrome.tabs.query({active: true, currentWindow: true}, function(tabs) {
    chrome.tabs.sendMessage(tabs[0].id, {greeting: "hello"}, function(response) {
        if (response) {
            console.log("Already there");
        }
        else {
            console.log("Not there, inject contentscript");
        }
    });
});

ContentScript:

chrome.runtime.onMessage.addListener(
    function(request, sender, sendResponse) {
        if (request.greeting == "hello")
            sendResponse({message: "hi"});
 });

Answer 2

Implementing an include guard is extremely easy:

(function() {
    if (window.hasRun) return;
    window.hasRun = true;
    // Rest of code
})();

If you want to programatically inject a content script, consider using one of the webNavigation events (e.g. onCommitted) instead of chrome.tabs.onUpdated. Unlike the tabs events, the webNavigation events are also triggered for navigation within frames, and offer a way to declare an URL filter in advance.