I’ve spent hours looking at solutions online but the ones I’ve found are either not applicable or just don’t seem to be working for me. I’ve looked at the documentation as well and can’t see what I’m missing.
I am coding a chrome extension and I want the user to be able to right-click anywhere on a particular website and have the system return all links on that page.
Here are my bits of code:
manifest.json:
{
"manifest_version": 3,
"name": "Test Chrome Extension",
"description": "Testing access to the DOM using a v3
manifest Chrome extension.",
"version": "1.0",
"background": {
"service_worker" : "background.js"
},
"permissions": [
"contextMenus",
"activeTab",
"notifications"
],
"content_scripts": [{
"matches": ["/*"],
"js": ["content.js"]
}],
"host_permissions": [
"/*"
]
}
background.js
chrome.runtime.onInstalled.addListener(() => {
chrome.contextMenus.create({
id: 'stacko',
title: 'Read Dom from Stackoverflow.com',
type: 'normal',
contexts: ['all'],
targetUrlPatterns: ['/*']
});
});
chrome.contextMenus.onClicked.addListener((tab, info) =>
{
if (info.menuItemId === "stacko") {
chrome.tabs.sendMessage(tab.id, { action:
"getDOM" });
}
});
content.js:
var array = [];
var links = document.links;
for (var i = 0; i < links.length; i++) {
array.push(links[i].href);
}
console.log(links);
Initially I didn’t realise the background worker couldn’t access the DOM but read a bit on context scripts but I can’t seem to figure out where it’s referenced or fired off.