content_script not running on GitHub when following links

Question

I am writing a Chrome Extension mainly for Pull Requests on Github Enterprise and have ran into an issue. When the page is loaded via a refresh or direct entering of the url from your browser it runs, when it is ran from clicking a link within Github it does not.

For instance if you go to this page with Pull Requests and click into one of them it will not run. But if you refresh that same page it will run.

manifest.json

{
    "name": "Github Sample",
    "manifest_version": 2,
    "version": "0.0.1",
    "description": "Sample",
    "permissions": [
        "tabs", "<all_urls>",
        "http://github.com/*"
    ],
    "content_scripts": [
        {
            "matches": [ "https://github.com/*" ],
            "js": ["github.sample.js"],
            "run_at": "document_end"
        }
    ]
}

github.sample.json

// ==UserScript==
// @author Jacob Schoen
// ==/UserScript==

alert("Extension has Ran");

To make this easier I have pushed this to github.

Any ideas on how to address this?

score 3 · Accepted Answer · edited May 23 '17 at 11:59

GitHub site uses jquery-pjax library (see How to make github style page transitions by pjax).

Basically you only need to run the content script once and attach pjax event handlers inside an injected <script> element code which will be reusing a jQueryor $ variable of the site.
- In those handlers you can send a message with document.dispatchEvent to your content script that will receive it in its window.addEventListener("blabla", ...)
- or you can allow the access to chrome.runtime.sendMessage on the github site in manifest.json so that page-injected code will be able to send a message that can be received by the extension in chrome.runtime.onMessageExternal listener.
Alternatively you can use chrome.webNavigation.onHistoryStateUpdated in the background script but that will cause a warning during the installation that the extension can "Read your browsing history" which is a global permission unlike the content script solution.

Thanks I think this has me moving in the right direction now. — Jacob Schoen, Oct 16 '15 at 01:23
Thanks again, I was able to get it working with your explanation. — Jacob Schoen, Oct 16 '15 at 02:17

Jacob Schoen · Answer 2 · 2015-10-16T02:17:33.040

The working example I came up with, in case it helps anyone else.

manifest.json

{
    "name": "Github Sample",
    "manifest_version": 2,
    "version": "0.0.1",
    "description": "Sample",
    "permissions": [
        "activeTab",
        "tabs", "<all_urls>",
        "http://github.com/*"
    ],
    "content_scripts": [
        {
            "matches": [ "https://github.com/*" ],
            "js": ["github.sample.js"],
            "run_at": "document_idle"
        }
    ],
    "web_accessible_resources": ["inject.js"]
}

github.sample.js

// ==UserScript==
// @author Jacob Schoen
// ==/UserScript==

function myAlert() {
    alert("Extension has Ran");
}

window.addEventListener("pageLoadTransition", myAlert);

var s = document.createElement('script');
// TODO: add "script.js" to web_accessible_resources in manifest.json
s.src = chrome.extension.getURL('inject.js');
s.onload = function() {
    this.parentNode.removeChild(this);
};
(document.head||document.documentElement).appendChild(s);

//still have to load this one for direct page loads
myAlert();

inject.js

$(document).on('pjax:success', function() {
  var evt=document.createEvent("CustomEvent");
    evt.initCustomEvent("pageLoadTransition", true, true, null);
    document.dispatchEvent(evt);
})

I also updated the Github repository with the working example.

content_script not running on GitHub when following links

2 Answers2