Ucontrol/popup.js

// Sync the selected categories in the popup

chrome.storage.sync.get(["categories", "selected"], (result) => {
	let categories = result.categories;
	let selected = result.selected;
	listCategories(categories, selected);
});

const listCategories = function (categories, selected) {
	let selectedList = document.getElementById("selected-list");
	let reference = selectedList.querySelector(".category.reference");

	for (const [key, category] of Object.entries(categories)) {
		item = reference.cloneNode(true);
		item.classList.remove("reference");
		item.querySelector(".title").innerHTML = category.title;

		let checkbox = item.querySelector(".switch input");
		checkbox.checked = selected.includes(key);

		checkbox.addEventListener("change", () => {
			checkbox.checked ? selected.push(key) : selected.splice(selected.indexOf(key), 1);
			chrome.storage.sync.set({ selected });
		});

		selectedList.appendChild(item);
	}

	reference.remove();
};

const preferences = document.getElementById("preferences");
preferences.addEventListener("click", () => {
	chrome.runtime.openOptionsPage();
});

const activate = document.getElementById("activate");
activate.addEventListener("click", async () => {
	activate.classList.toggle("active");

	let [tab] = await chrome.tabs.query({ active: true, currentWindow: true });

	chrome.scripting.executeScript({
		target: { tabId: tab.id },
		function: highlightSelected,
	});
});

function highlightSelected() {
	chrome.storage.sync.get(["categories", "selected"], (result) => {
		for (category of result.selected) {
			result.categories[category].keywords.forEach((keyword) => {
				let findings = contains("p, span, li, h1, h2, h3, h4, h5, h6", keyword);

				if (findings.length) {
					findings.forEach((finding) => (finding.style.color = "red"));
				}
			});
		}
	});

	function contains(selector, text) {
		var elements = document.querySelectorAll(selector);
		return Array.prototype.filter.call(elements, function (element) {
			return RegExp(text).test(element.textContent.toLowerCase());
		});
	}
}