message passing between background and content

src/background/index.js

@@ -0,0 +1,4 @@
+browser.runtime.onMessage.addListener((request, sender, sendResponse) => {
+  console.log("Pressed " + request.which);
+  sendResponse({ response: "Response from background script" });
+});

src/content/index.js

@@ -0,0 +1,9 @@
+window.addEventListener("keypress", (e) => {
+  browser.runtime.sendMessage({
+    which: e.which || e.keyCode,
+  }).then((msg) => {
+    console.log(`Message from the background script:  ${msg.response}`);
+  }, (err) => {
+    console.log(`Error: ${err}`);
+  });
+});

src/index.js

@@ -1,3 +0,0 @@
-import * as Module from './module';
-
-Module.initialize()

src/module.js

@@ -1,18 +0,0 @@
-const initialize = () => {
-  let p = document.createElement("p");
-  p.textContent = "Hello Vim Vixen";
-  p.style.position = 'fixed';
-  p.style.right = '0';
-  p.style.bottom = '0';
-  p.style.padding = '0rem .5rem';
-  p.style.margin = '0';
-  p.style.backgroundColor = 'lightgray';
-  p.style.border = 'gray';
-  p.style.boxShadow = '0 0 2px gray inset';
-  p.style.borderRadius = '3px';
-  p.style.fontFamily = 'monospace';
-
-  document.body.append(p)
-}
-
-export { initialize };