There are numerous questions and answers regarding this issue, but I am struggling to adapt it to my specific case.
My extension fetches positions (1,2,...100) on the scores pages of a game. Upon initial page load, I receive the first 100 positions. However, there are additional pages that are loaded via ajax calls which I am unable to capture.
I have attempted to utilize Mutation Observers to monitor changes in the DOM, but so far, none of the code variations seem to be effective.
Here is my manifest.json file:
{
"manifest_version": 2,
"name": "Ogame Fleet Counter",
"short_name": "OFC",
"version": "1.0",
"icons": { "16": "16.png",
"48": "48.png",
"128": "128.png"
},
"browser_action": {
"default_icon": "48.png"
},
"background": {
"scripts": ["js/background.js"]
},
"content_scripts": [
{
"matches":[
"https://*.ogame.gameforge.com/game/index.php?page=shipyard*",
"https://*.ogame.gameforge.com/game/index.php?page=highscore"
],
"js": ["js/jquery.js", "js/content.js"]
}
]
}
Here is my background.js file:
chrome.browserAction.onClicked.addListener(function(tab) {
chrome.tabs.executeScript(null, { file: "js/jquery.js" }, function() {
chrome.tabs.executeScript(null, { file: "js/content.js" });
});
});
var insertedNodes = [];
var observer = new MutationObserver(function(mutations) {
mutations.forEach(function(mutation) {
for (var i = 0; i < mutation.addedNodes.length; i++)
insertedNodes.push(mutation.addedNodes[i]);
})
});
observer.observe(document, { childList: true });
console.log(insertedNodes);
My extension comprises only background.js, the content.js (content script), and jquery.js.
I have tried multiple code variations and made adjustments to my own code, all without success. Is there an alternative method other than Mutation Observers that I could consider? Perhaps adding an onclick function to all buttons to trigger my content script? Any assistance would be greatly appreciated.
Edit: Upon inspecting the DOM, it appears that I need to detect:
<span class=" activePager">1</span>