fix(browser/v7): Don't assume window.document is available (#11598)

Author: Luca Forstner

packages/tracing-internal/src/browser/backgroundtab.ts

@@ -10,11 +10,11 @@ import { WINDOW } from './types';
  * document is hidden.
  */
 export function registerBackgroundTabDetection(): void {
-  if (WINDOW && WINDOW.document) {
+  if (WINDOW.document) {
     WINDOW.document.addEventListener('visibilitychange', () => {
       // eslint-disable-next-line deprecation/deprecation
       const activeTransaction = getActiveTransaction() as IdleTransaction;
-      if (WINDOW.document.hidden && activeTransaction) {
+      if (WINDOW.document!.hidden && activeTransaction) {
         const statusType: SpanStatusType = 'cancelled';
 
         const { op, status } = spanToJSON(activeTransaction);

packages/tracing-internal/src/browser/browserTracingIntegration.ts

@@ -292,7 +292,7 @@ export const browserTracingIntegration = ((_options: Partial<BrowserTracingOptio
 
     if (isPageloadTransaction && WINDOW.document) {
       WINDOW.document.addEventListener('readystatechange', () => {
-        if (['interactive', 'complete'].includes(WINDOW.document.readyState)) {
+        if (['interactive', 'complete'].includes(WINDOW.document!.readyState)) {
           idleTransaction.sendAutoFinishSignal();
         }
       });
@@ -538,7 +538,9 @@ function registerInteractionListener(
   };
 
   ['click'].forEach(type => {
-    addEventListener(type, registerInteractionTransaction, { once: false, capture: true });
+    if (WINDOW.document) {
+      addEventListener(type, registerInteractionTransaction, { once: false, capture: true });
+    }
   });
 }
 

packages/tracing-internal/src/browser/browsertracing.ts

@@ -418,14 +418,16 @@ export class BrowserTracing implements Integration {
     );
 
     if (isPageloadTransaction) {
-      WINDOW.document.addEventListener('readystatechange', () => {
+      if (WINDOW.document) {
+        WINDOW.document.addEventListener('readystatechange', () => {
+          if (['interactive', 'complete'].includes(WINDOW.document!.readyState)) {
+            idleTransaction.sendAutoFinishSignal();
+          }
+        });
+
         if (['interactive', 'complete'].includes(WINDOW.document.readyState)) {
           idleTransaction.sendAutoFinishSignal();
         }
-      });
-
-      if (['interactive', 'complete'].includes(WINDOW.document.readyState)) {
-        idleTransaction.sendAutoFinishSignal();
       }
     }
 
@@ -496,7 +498,9 @@ export class BrowserTracing implements Integration {
     };
 
     ['click'].forEach(type => {
-      addEventListener(type, registerInteractionTransaction, { once: false, capture: true });
+      if (WINDOW.document) {
+        addEventListener(type, registerInteractionTransaction, { once: false, capture: true });
+      }
     });
   }
 

packages/tracing-internal/src/browser/types.ts

@@ -1,3 +1,6 @@
 import { GLOBAL_OBJ } from '@sentry/utils';
 
-export const WINDOW = GLOBAL_OBJ as typeof GLOBAL_OBJ & Window;
+export const WINDOW = GLOBAL_OBJ as typeof GLOBAL_OBJ &
+  // document is not available in all browser environments (webworkers). We make it optional so you have to explicitly check for it
+  Omit<Window, 'document'> &
+  Partial<Pick<Window, 'document'>>;

packages/tracing-internal/src/browser/web-vitals/getLCP.ts

@@ -14,6 +14,7 @@
  * limitations under the License.
  */
 
+import { WINDOW } from '../types';
 import { bindReporter } from './lib/bindReporter';
 import { getActivationStart } from './lib/getActivationStart';
 import { getVisibilityWatcher } from './lib/getVisibilityWatcher';
@@ -71,7 +72,9 @@ export const onLCP = (onReport: ReportCallback): StopListening | undefined => {
     // stop LCP observation, it's unreliable since it can be programmatically
     // generated. See: https://github.com/GoogleChrome/web-vitals/issues/75
     ['keydown', 'click'].forEach(type => {
-      addEventListener(type, stopListening, { once: true, capture: true });
+      if (WINDOW.document) {
+        addEventListener(type, stopListening, { once: true, capture: true });
+      }
     });
 
     onHidden(stopListening, true);

packages/tracing-internal/src/browser/web-vitals/lib/getVisibilityWatcher.ts

@@ -19,10 +19,12 @@ import { onHidden } from './onHidden';
 
 let firstHiddenTime = -1;
 
-const initHiddenTime = (): number => {
+const initHiddenTime = (): void => {
   // If the document is hidden and not prerendering, assume it was always
   // hidden and the page was loaded in the background.
-  return WINDOW.document.visibilityState === 'hidden' && !WINDOW.document.prerendering ? 0 : Infinity;
+  if (WINDOW.document && WINDOW.document.visibilityState) {
+    firstHiddenTime = WINDOW.document.visibilityState === 'hidden' && !WINDOW.document.prerendering ? 0 : Infinity;
+  }
 };
 
 const trackChanges = (): void => {
@@ -40,7 +42,7 @@ export const getVisibilityWatcher = (): {
     // since navigation start. This isn't a perfect heuristic, but it's the
     // best we can do until an API is available to support querying past
     // visibilityState.
-    firstHiddenTime = initHiddenTime();
+    initHiddenTime();
     trackChanges();
   }
   return {

packages/tracing-internal/src/browser/web-vitals/lib/initMetric.ts

@@ -25,7 +25,7 @@ export const initMetric = (name: Metric['name'], value?: number): Metric => {
   let navigationType: Metric['navigationType'] = 'navigate';
 
   if (navEntry) {
-    if (WINDOW.document.prerendering || getActivationStart() > 0) {
+    if ((WINDOW.document && WINDOW.document.prerendering) || getActivationStart() > 0) {
       navigationType = 'prerender';
     } else {
       navigationType = navEntry.type.replace(/_/g, '-') as Metric['navigationType'];

packages/tracing-internal/src/browser/web-vitals/lib/onHidden.ts

@@ -22,16 +22,19 @@ export interface OnHiddenCallback {
 
 export const onHidden = (cb: OnHiddenCallback, once?: boolean): void => {
   const onHiddenOrPageHide = (event: Event): void => {
-    if (event.type === 'pagehide' || WINDOW.document.visibilityState === 'hidden') {
+    if (event.type === 'pagehide' || WINDOW.document!.visibilityState === 'hidden') {
       cb(event);
       if (once) {
         removeEventListener('visibilitychange', onHiddenOrPageHide, true);
         removeEventListener('pagehide', onHiddenOrPageHide, true);
       }
     }
   };
-  addEventListener('visibilitychange', onHiddenOrPageHide, true);
-  // Some browsers have buggy implementations of visibilitychange,
-  // so we use pagehide in addition, just to be safe.
-  addEventListener('pagehide', onHiddenOrPageHide, true);
+
+  if (WINDOW.document) {
+    addEventListener('visibilitychange', onHiddenOrPageHide, true);
+    // Some browsers have buggy implementations of visibilitychange,
+    // so we use pagehide in addition, just to be safe.
+    addEventListener('pagehide', onHiddenOrPageHide, true);
+  }
 };