I am using Bookmark Highlighter. The problem with it is that, it sometimes does not work when the extension is loaded before the page is loaded.
For Example: If you bookmark https://www.pluralsight.com/courses/protocol-deep-dive-icmp
, then go to https://www.pluralsight.com/search?q=Protocol%20Deep%20Dive
, it does not highlight the bookmark.
In the extension review page it says
It looks like some links on your example site are being added after the extension has a chance to execute.
I have modified the manifest.json
to:
{
"manifest_version": 2,
"name": "Bookmark Highlighter",
"version": "2.1",
"description": "Highlights links to any URLs that are bookmarked",
"icons": {
"48": "icons/highlighter-48.png",
"96": "icons/highlighter-96.png"
},
"content_scripts": [
{
"matches": [
"<all_urls>"
],
"js": [
"contentScript.js"
],
"run_at": "document_idle"
}
],
"background": {
"scripts": [
"backgroundScript.js"
]
},
"permissions": [
"bookmarks",
"storage"
],
"options_ui": {
"page": "options.html"
},
"applications": {
"gecko": {
"id": "jid0-CNA8w9TYZz7H2Wrq5ZfmSO5yB0I@jetpack"
}
}
}
I have also replaced "document_idle"
with "document_end"
. Not working. What can I do?
In case anyone is interested, the contentScript.js
is:
// Default settings
var linkBackground = "rgba(0, 153, 255, 0.2)";
var imgBorder = "1px dashed blue";
var cssForText = "";
var cssForImage = "";
// Load settings from config
function onError(error) {
console.log(`Error: ${error}`);
}
function onGot(item) {
if (item.backgroundColor) {
linkBackground = "rgba(" + item.backgroundColor.join(",") + ")";
//console.log("Background color: " + linkBackground);
}
if (item.cssForText) {
cssForText = item.cssForText;
//console.log("Custom CSS for text: " + cssForText);
}
if (item.cssForImage) {
cssForImage = item.cssForImage;
//console.log("Custom CSS for image: " + cssForImage);
}
}
var getting = browser.storage.local.get(["backgroundColor", "cssForText", "cssForImage"]);
getting.then(onGot, onError);
// Set up communication port
var port = browser.runtime.connect({name:"bookmark-highlighter"});
// Listen for response from background script
port.onMessage.addListener(function(m) {
// Highlight bookmarked links
if (m.bookmarks) {
for (var i = 0; i < document.links.length; i++) {
var link = document.links[i];
if (!m.bookmarks[link.href]) {
continue;
}
if (linkBackground != null && linkBackground.trim().length > 0) {
link.style.background = linkBackground;
}
link.className += " bmh-bookmarked-link";
// Add custom CSS if defined
if (cssForText) {
link.style.cssText += ';' + cssForText;
}
var child = link.firstChild;
if (child && child.tagName == "IMG") {
if (imgBorder != null && imgBorder.trim().length > 0) {
child.style.border = imgBorder;
}
child.className += " bmh-bookmarked-image";
// Add custom CSS if defined
if (cssForImage) {
child.style.cssText += ';' + cssForImage;
}
}
}
}
});
// Collect list of links
var hrefs = [];
for (var i = 0; i < document.links.length; i++) {
var item = document.links[i];
hrefs.push(item.href);
}
// Ask background script to check for bookmarks
port.postMessage({hrefs: hrefs});
The backgroundScript.js
is:
var port;
function connected(p) {
port = p;
port.onMessage.addListener(function(m) {
var searches = [];
if (m.hrefs) {
// Content script is asking if links have been bookmarked
// Kick off a bunch of searches
for (var i = 0; i < m.hrefs.length; i++) {
var href = m.hrefs[i];
searches.push(browser.bookmarks.search({url: href}));
}
}
// Wait for all searches to finish before continuing
Promise.all(searches).then(function (results) {
var bookmarks = {};
var foundBookmarks = false;
// Collect results into a single object
for (var i = 0; i < results.length; i++) {
var result = results[i];
if (result.length > 0) {
bookmarks[result[0].url] = true;
foundBookmarks = true;
}
}
// Pass the good news back to content script
if (foundBookmarks) {
var msg = { bookmarks: bookmarks };
port.postMessage(msg);
}
});
});
}
browser.runtime.onConnect.addListener(connected);