fix(browser): Use DedicatedWorkerGlobalScope global object type in registerWebWorker (#17447)

Changes the type
from `WebWorker` to `DedicatedWorkerGlobalScope`*. Other worker types
don't support `postMessage`, so this type correctly scopes the API to
its intended use (i.e. in dedicated workers).

Author: Lms24

dev-packages/e2e-tests/test-applications/browser-webworker-vite/src/worker.ts

@@ -1,8 +1,6 @@
 import * as Sentry from '@sentry/browser';
 
-// type cast necessary because TS thinks this file is part of the main
-// thread where self is of type `Window` instead of `Worker`
-Sentry.registerWebWorker({ self: self as unknown as Worker });
+Sentry.registerWebWorker({ self });
 
 // Let the main thread know the worker is ready
 self.postMessage({

dev-packages/e2e-tests/test-applications/browser-webworker-vite/src/worker2.ts

@@ -1,8 +1,6 @@
 import * as Sentry from '@sentry/browser';
 
-// type cast necessary because TS thinks this file is part of the main
-// thread where self is of type `Window` instead of `Worker`
-Sentry.registerWebWorker({ self: self as unknown as Worker });
+Sentry.registerWebWorker({ self });
 
 // Let the main thread know the worker is ready
 self.postMessage({

dev-packages/e2e-tests/test-applications/browser-webworker-vite/src/worker3.ts

@@ -1,8 +1,6 @@
 import * as Sentry from '@sentry/browser';
 
-// type cast necessary because TS thinks this file is part of the main
-// thread where self is of type `Window` instead of `Worker`
-Sentry.registerWebWorker({ self: self as unknown as Worker });
+Sentry.registerWebWorker({ self });
 
 // Let the main thread know the worker is ready
 self.postMessage({

dev-packages/e2e-tests/test-applications/browser-webworker-vite/tsconfig.json

@@ -3,8 +3,9 @@
     "target": "ES2022",
     "useDefineForClassFields": true,
     "module": "ESNext",
-    "lib": ["ES2022", "DOM", "DOM.Iterable"],
-    "skipLibCheck": true,
+    "lib": ["ES2022", "DOM", "DOM.Iterable", "WebWorker"],
+    "skipLibCheck": false,
+    "skipDefaultLibCheck": true,
 
     /* Bundler mode */
     "moduleResolution": "bundler",

packages/browser/src/integrations/webWorker.ts

@@ -25,7 +25,7 @@ interface WebWorkerIntegration extends Integration {
  * any messages from the worker. Otherwise, your message handlers will receive
  * messages from the Sentry SDK which you need to ignore.
  *
- * This integration only has an effect, if you call `Sentry.registerWorker(self)`
+ * This integration only has an effect, if you call `Sentry.registerWebWorker(self)`
  * from within the worker(s) you're adding to the integration.
  *
  * Given that you want to initialize the SDK as early as possible, you most likely
@@ -113,8 +113,21 @@ function listenForSentryDebugIdMessages(worker: Worker): void {
   });
 }
 
+/**
+ * Minimal interface for DedicatedWorkerGlobalScope, only requiring the postMessage method.
+ * (which is the only thing we need from the worker's global object)
+ *
+ * @see https://developer.mozilla.org/en-US/docs/Web/API/DedicatedWorkerGlobalScope
+ *
+ * We can't use the actual type because it breaks everyone who doesn't have {"lib": ["WebWorker"]}
+ * but uses {"skipLibCheck": true} in their tsconfig.json.
+ */
+interface MinimalDedicatedWorkerGlobalScope {
+  postMessage: (message: unknown) => void;
+}
+
 interface RegisterWebWorkerOptions {
-  self: Worker & { _sentryDebugIds?: Record<string, string> };
+  self: MinimalDedicatedWorkerGlobalScope & { _sentryDebugIds?: Record<string, string> };
 }
 
 /**
@@ -125,7 +138,7 @@ interface RegisterWebWorkerOptions {
  * import * as Sentry from '@sentry/<your-sdk>';
  *
  * // Do this as early as possible in your worker.
- * Sentry.registerWorker({ self });
+ * Sentry.registerWebWorker({ self });
  *
  * // continue setting up your worker
  * self.postMessage(...)

packages/browser/tsconfig.json

@@ -4,6 +4,6 @@
   "include": ["src/**/*", "test/loader.js"],
 
   "compilerOptions": {
-    "lib": ["DOM", "ES2018"],
+    "lib": ["DOM", "ES2018", "WebWorker"]
   }
 }