I tried to make a plugin but got the error: undefined query. I tried to solve this issue and tested in different projects but the error persisted.
Content.js
chrome.runtime.onMessage.addListener(function (request, sender, sendResponse) {
if (request.action === "convert") {
document.documentElement.style.filter = "grayscale(100%)";
sendResponse({ message: "Website converted to black and white." });
} else if (request.action === "reset") {
document.documentElement.style.filter = "none";
sendResponse({ message: "Website reset to original colors." });
}
});
popup.html
<!DOCTYPE html>
<html>
<head>
<link rel="stylesheet" type="text/css" href="popup.css">
<script src="popup.js"></script>
</head>
<body>
<h1>Black & White Converter</h1>
<button id="convertButton">Convert</button>
<button id="resetButton">Reset</button>
</body>
</html>