Log error in case of multiple injections (#176)

package.json

@@ -1,6 +1,6 @@
 {
   "name": "webext-messenger",
-  "version": "0.24.0",
+  "version": "0.25.0-0",
   "description": "Browser Extension component messaging framework",
   "keywords": [],
   "repository": "pixiebrix/webext-messenger",

source/global.d.ts

@@ -2,4 +2,6 @@ import type { Browser } from "webextension-polyfill";
 
 declare global {
   const browser: Browser;
+  // eslint-disable-next-line no-var -- `let/const` behave differently https://stackoverflow.com/a/69208755/288906
+  var __webextMessenger: string;
 }

source/index.ts

@@ -8,4 +8,6 @@ export { toggleLogging } from "./logging.js";
 
 import { initPrivateApi } from "./thisTarget.js";
 
+// Required side effect to better track errors:
+// https://github.com/pixiebrix/webext-messenger/pull/80
 initPrivateApi();

source/thisTarget.ts

@@ -173,6 +173,21 @@ export async function getTopLevelFrame(): Promise<TopLevelFrame> {
 }
 
 export function initPrivateApi(): void {
+  // Improve DX by informing the developer that it's being loaded the wrong way
+  // https://github.com/pixiebrix/webext-messenger/issues/88
+  if (globalThis.__webextMessenger) {
+    // TODO: Use Error#cause after https://bugs.chromium.org/p/chromium/issues/detail?id=1211260
+    console.log(
+      globalThis.__webextMessenger.replace(/^Error/, "webext-messenger")
+    );
+    console.error(
+      "webext-messenger: Duplicate execution. This is a fatal error.\nhttps://github.com/pixiebrix/webext-messenger/issues/88"
+    );
+    return;
+  }
+
+  // Use Error to capture the stack and make it easier to find the cause
+  globalThis.__webextMessenger = new Error("First execution").stack!;
   if (isExtensionContext()) {
     // Only `runtime` pages can handle this message but I can't remove it because its listener
     // also serves the purpose of throwing a specific error when no methods have been registered.