I am trying to build a chrome extension that toggles a large header on a certain website. I have code that I have verified performs the toggling when I code it into a test website. I am plugging it into my extension, but it is still not toggling. Why won't it toggle?
Manifest
Code:
{
"manifest_version": 2,
"name": "My extension",
"description": "Start action in background from popup.",
"version": "2.0",
"browser_action": {
"default_title": "My extension",
"default_popup": "popup.html"
},
"permissions": ["tabs"],
"background": {
"scripts": ["event.js"]
}
}
popup.js
Code:
chrome.runtime.sendMessage({text: "popup opened"});
popup.html
Code:
<!DOCTYPE html>
<html>
<head>
<script src="popup.js"></script>
</head>
<body>
<p>Background page has been notified</p>
</body>
</html>
events.js
Code:
chrome.runtime.onMessage.addListener(function(message,sender,sendResponse){
if (message.text == "popup opened") {
console.log ("Popup says it was opened.");
// Run your script from here
}
let x = window.document.getElementById("fixedTop");
if (x.style.display === "none") {
x.style.display = "block";
} else {
x.style.display = "none";
}
});