Merge branch 'develop' into lforst-backfill-v9-migration-items

Author: Luca Forstner

.size-limit.js

@@ -40,7 +40,7 @@ module.exports = [
     path: 'packages/browser/build/npm/esm/index.js',
     import: createImport('init', 'browserTracingIntegration'),
     gzip: true,
-    limit: '36.5 KB',
+    limit: '37.5 KB',
   },
   {
     name: '@sentry/browser (incl. Tracing, Replay)',
@@ -124,7 +124,7 @@ module.exports = [
     import: createImport('init', 'ErrorBoundary', 'reactRouterV6BrowserTracingIntegration'),
     ignore: ['react/jsx-runtime'],
     gzip: true,
-    limit: '39.5 KB',
+    limit: '40.5 KB',
   },
   // Vue SDK (ESM)
   {
@@ -139,7 +139,7 @@ module.exports = [
     path: 'packages/vue/build/esm/index.js',
     import: createImport('init', 'browserTracingIntegration'),
     gzip: true,
-    limit: '38.5 KB',
+    limit: '39.5 KB',
   },
   // Svelte SDK (ESM)
   {
@@ -219,7 +219,7 @@ module.exports = [
     import: createImport('init'),
     ignore: ['$app/stores'],
     gzip: true,
-    limit: '37 KB',
+    limit: '38 KB',
   },
   // Node SDK (ESM)
   {

docs/migration/draft-v9-migration-guide.md

@@ -4,7 +4,20 @@
 
 ## General
 
-- Returning `null` from `beforeSendSpan` span is deprecated.
+- **Returning `null` from `beforeSendSpan` span is deprecated.**
+- **Passing `undefined` to `tracesSampleRate` / `tracesSampler` / `enableTracing` will be handled differently in v9**
+
+  In v8, a setup like the following:
+
+  ```ts
+  Sentry.init({
+    tracesSampleRate: undefined,
+  });
+  ```
+
+  Will result in tracing being _enabled_, although no spans will be generated.
+  In v9, we will streamline this behavior so that passing `undefined` will result in tracing being disabled, the same as not passing the option at all.
+  If you are relying on `undefined` being passed in and having tracing enabled because of this, you should update your config to set e.g. `tracesSampleRate: 0` instead, which will also enable tracing in v9.
 
 ## `@sentry/utils`
 
@@ -19,6 +32,7 @@
 - Deprecated `extractRequestData`. Instead manually extract relevant data off request.
 - Deprecated `arrayify`. No replacements.
 - Deprecated `memoBuilder`. No replacements.
+- Deprecated `getNumberOfUrlSegments`. No replacements.
 - Deprecated `BAGGAGE_HEADER_NAME`. No replacements.
 - Deprecated `makeFifoCache`. No replacements.
 - Deprecated `flatten`. No replacements.

packages/browser-utils/.eslintrc.js

@@ -6,9 +6,7 @@ module.exports = {
   overrides: [
     {
       files: ['src/**'],
-      rules: {
-        '@sentry-internal/sdk/no-optional-chaining': 'off',
-      },
+      rules: {},
     },
     {
       files: ['src/metrics/**'],

packages/browser-utils/src/metrics/browserMetrics.ts

@@ -1,11 +1,10 @@
 /* eslint-disable max-lines */
 import { SEMANTIC_ATTRIBUTE_SENTRY_ORIGIN, getActiveSpan } from '@sentry/core';
 import { setMeasurement } from '@sentry/core';
-import { browserPerformanceTimeOrigin, getComponentName, htmlTreeAsString, logger, parseUrl } from '@sentry/core';
+import { browserPerformanceTimeOrigin, getComponentName, htmlTreeAsString, parseUrl } from '@sentry/core';
 import type { Measurements, Span, SpanAttributes, StartSpanOptions } from '@sentry/types';
 
 import { spanToJSON } from '@sentry/core';
-import { DEBUG_BUILD } from '../debug-build';
 import { WINDOW } from '../types';
 import { trackClsAsStandaloneSpan } from './cls';
 import {
@@ -241,7 +240,6 @@ function _trackCLS(): () => void {
     if (!entry) {
       return;
     }
-    DEBUG_BUILD && logger.log(`[Measurements] Adding CLS ${metric.value}`);
     _measurements['cls'] = { value: metric.value, unit: '' };
     _clsEntry = entry;
   }, true);
@@ -255,7 +253,6 @@ function _trackLCP(): () => void {
       return;
     }
 
-    DEBUG_BUILD && logger.log('[Measurements] Adding LCP');
     _measurements['lcp'] = { value: metric.value, unit: 'millisecond' };
     _lcpEntry = entry as LargestContentfulPaint;
   }, true);
@@ -271,7 +268,6 @@ function _trackFID(): () => void {
 
     const timeOrigin = msToSec(browserPerformanceTimeOrigin as number);
     const startTime = msToSec(entry.startTime);
-    DEBUG_BUILD && logger.log('[Measurements] Adding FID');
     _measurements['fid'] = { value: metric.value, unit: 'millisecond' };
     _measurements['mark.fid'] = { value: timeOrigin + startTime, unit: 'second' };
   });
@@ -284,7 +280,6 @@ function _trackTtfb(): () => void {
       return;
     }
 
-    DEBUG_BUILD && logger.log('[Measurements] Adding TTFB');
     _measurements['ttfb'] = { value: metric.value, unit: 'millisecond' };
   });
 }
@@ -305,7 +300,6 @@ export function addPerformanceEntries(span: Span, options: AddPerformanceEntries
     return;
   }
 
-  DEBUG_BUILD && logger.log('[Tracing] Adding & adjusting spans using Performance API');
   const timeOrigin = msToSec(browserPerformanceTimeOrigin);
 
   const performanceEntries = performance.getEntries();
@@ -343,11 +337,9 @@ export function addPerformanceEntries(span: Span, options: AddPerformanceEntries
         const shouldRecord = entry.startTime < firstHidden.firstHiddenTime;
 
         if (entry.name === 'first-paint' && shouldRecord) {
-          DEBUG_BUILD && logger.log('[Measurements] Adding FP');
           _measurements['fp'] = { value: entry.startTime, unit: 'millisecond' };
         }
         if (entry.name === 'first-contentful-paint' && shouldRecord) {
-          DEBUG_BUILD && logger.log('[Measurements] Adding FCP');
           _measurements['fcp'] = { value: entry.startTime, unit: 'millisecond' };
         }
         break;
@@ -618,8 +610,6 @@ function _trackNavigator(span: Span): void {
 /** Add LCP / CLS data to span to allow debugging */
 function _setWebVitalAttributes(span: Span): void {
   if (_lcpEntry) {
-    DEBUG_BUILD && logger.log('[Measurements] Adding LCP Data');
-
     // Capture Properties of the LCP element that contributes to the LCP.
 
     if (_lcpEntry.element) {
@@ -652,7 +642,6 @@ function _setWebVitalAttributes(span: Span): void {
 
   // See: https://developer.mozilla.org/en-US/docs/Web/API/LayoutShift
   if (_clsEntry && _clsEntry.sources) {
-    DEBUG_BUILD && logger.log('[Measurements] Adding CLS Data');
     _clsEntry.sources.forEach((source, index) =>
       span.setAttribute(`cls.source.${index + 1}`, htmlTreeAsString(source.node)),
     );
@@ -685,7 +674,6 @@ function _addTtfbRequestTimeToMeasurements(_measurements: Measurements): void {
   const { responseStart, requestStart } = navEntry;
 
   if (requestStart <= responseStart) {
-    DEBUG_BUILD && logger.log('[Measurements] Adding TTFB Request Time');
     _measurements['ttfb.requestTime'] = {
       value: responseStart - requestStart,
       unit: 'millisecond',

packages/browser-utils/src/metrics/cls.ts

@@ -67,7 +67,11 @@ export function trackClsAsStandaloneSpan(): void {
   setTimeout(() => {
     const client = getClient();
 
-    const unsubscribeStartNavigation = client?.on('startNavigationSpan', () => {
+    if (!client) {
+      return;
+    }
+
+    const unsubscribeStartNavigation = client.on('startNavigationSpan', () => {
       _collectClsOnce();
       unsubscribeStartNavigation && unsubscribeStartNavigation();
     });
@@ -84,15 +88,15 @@ export function trackClsAsStandaloneSpan(): void {
 function sendStandaloneClsSpan(clsValue: number, entry: LayoutShift | undefined, pageloadSpanId: string) {
   DEBUG_BUILD && logger.log(`Sending CLS span (${clsValue})`);
 
-  const startTime = msToSec((browserPerformanceTimeOrigin || 0) + (entry?.startTime || 0));
+  const startTime = msToSec((browserPerformanceTimeOrigin || 0) + ((entry && entry.startTime) || 0));
   const routeName = getCurrentScope().getScopeData().transactionName;
 
-  const name = entry ? htmlTreeAsString(entry.sources[0]?.node) : 'Layout shift';
+  const name = entry ? htmlTreeAsString(entry.sources[0] && entry.sources[0].node) : 'Layout shift';
 
   const attributes: SpanAttributes = dropUndefinedKeys({
     [SEMANTIC_ATTRIBUTE_SENTRY_ORIGIN]: 'auto.http.browser.cls',
     [SEMANTIC_ATTRIBUTE_SENTRY_OP]: 'ui.webvital.cls',
-    [SEMANTIC_ATTRIBUTE_EXCLUSIVE_TIME]: entry?.duration || 0,
+    [SEMANTIC_ATTRIBUTE_EXCLUSIVE_TIME]: (entry && entry.duration) || 0,
     // attach the pageload span id to the CLS span so that we can link them in the UI
     'sentry.pageload.span_id': pageloadSpanId,
   });
@@ -104,19 +108,21 @@ function sendStandaloneClsSpan(clsValue: number, entry: LayoutShift | undefined,
     startTime,
   });
 
-  span?.addEvent('cls', {
-    [SEMANTIC_ATTRIBUTE_SENTRY_MEASUREMENT_UNIT]: '',
-    [SEMANTIC_ATTRIBUTE_SENTRY_MEASUREMENT_VALUE]: clsValue,
-  });
+  if (span) {
+    span.addEvent('cls', {
+      [SEMANTIC_ATTRIBUTE_SENTRY_MEASUREMENT_UNIT]: '',
+      [SEMANTIC_ATTRIBUTE_SENTRY_MEASUREMENT_VALUE]: clsValue,
+    });
 
-  // LayoutShift performance entries always have a duration of 0, so we don't need to add `entry.duration` here
-  // see: https://developer.mozilla.org/en-US/docs/Web/API/PerformanceEntry/duration
-  span?.end(startTime);
+    // LayoutShift performance entries always have a duration of 0, so we don't need to add `entry.duration` here
+    // see: https://developer.mozilla.org/en-US/docs/Web/API/PerformanceEntry/duration
+    span.end(startTime);
+  }
 }
 
 function supportsLayoutShift(): boolean {
   try {
-    return PerformanceObserver.supportedEntryTypes?.includes('layout-shift');
+    return PerformanceObserver.supportedEntryTypes.includes('layout-shift');
   } catch {
     return false;
   }

packages/browser-utils/src/metrics/inp.ts

@@ -112,12 +112,14 @@ function _trackINP(): () => void {
       startTime,
     });
 
-    span?.addEvent('inp', {
-      [SEMANTIC_ATTRIBUTE_SENTRY_MEASUREMENT_UNIT]: 'millisecond',
-      [SEMANTIC_ATTRIBUTE_SENTRY_MEASUREMENT_VALUE]: metric.value,
-    });
+    if (span) {
+      span.addEvent('inp', {
+        [SEMANTIC_ATTRIBUTE_SENTRY_MEASUREMENT_UNIT]: 'millisecond',
+        [SEMANTIC_ATTRIBUTE_SENTRY_MEASUREMENT_VALUE]: metric.value,
+      });
 
-    span?.end(startTime + duration);
+      span.end(startTime + duration);
+    }
   });
 }
 

packages/browser-utils/src/metrics/web-vitals/getINP.ts

@@ -66,7 +66,6 @@ const processEntry = (entry: PerformanceEventTiming) => {
   // The least-long of the 10 longest interactions.
   const minLongestInteraction = longestInteractionList[longestInteractionList.length - 1];
 
-  // eslint-disable-next-line @typescript-eslint/no-non-null-assertion
   const existingInteraction = longestInteractionMap[entry.interactionId!];
 
   // Only process the entry if it's possibly one of the ten longest,
@@ -82,7 +81,6 @@ const processEntry = (entry: PerformanceEventTiming) => {
       existingInteraction.latency = Math.max(existingInteraction.latency, entry.duration);
     } else {
       const interaction = {
-        // eslint-disable-next-line @typescript-eslint/no-non-null-assertion
         id: entry.interactionId!,
         latency: entry.duration,
         entries: [entry],

packages/browser-utils/test/utils/TestClient.ts

@@ -20,10 +20,8 @@ export class TestClient extends BaseClient<TestClientOptions> {
       exception: {
         values: [
           {
-            /* eslint-disable @typescript-eslint/no-unsafe-member-access */
             type: exception.name,
             value: exception.message,
-            /* eslint-enable @typescript-eslint/no-unsafe-member-access */
           },
         ],
       },

packages/browser/src/integrations/httpclient.ts

@@ -108,8 +108,8 @@ function _parseCookieHeaders(
     if (cookieString) {
       cookies = _parseCookieString(cookieString);
     }
-  } catch (e) {
-    DEBUG_BUILD && logger.log(`Could not extract cookies from header ${cookieHeader}`);
+  } catch {
+    // ignore it if parsing fails
   }
 
   return [headers, cookies];
@@ -138,14 +138,14 @@ function _xhrResponseHandler(
         if (cookieString) {
           responseCookies = _parseCookieString(cookieString);
         }
-      } catch (e) {
-        DEBUG_BUILD && logger.log('Could not extract cookies from response headers');
+      } catch {
+        // ignore it if parsing fails
       }
 
       try {
         responseHeaders = _getXHRResponseHeaders(xhr);
-      } catch (e) {
-        DEBUG_BUILD && logger.log('Could not extract headers from response');
+      } catch {
+        // ignore it if parsing fails
       }
 
       requestHeaders = headers;

packages/browser/src/tracing/browserTracingIntegration.ts

@@ -299,16 +299,20 @@ export const browserTracingIntegration = ((_options: Partial<BrowserTracingOptio
       let activeSpan: Span | undefined;
       let startingUrl: string | undefined = WINDOW.location && WINDOW.location.href;
 
+      function maybeEndActiveSpan(): void {
+        if (activeSpan && !spanToJSON(activeSpan).timestamp) {
+          DEBUG_BUILD && logger.log(`[Tracing] Finishing current active span with op: ${spanToJSON(activeSpan).op}`);
+          // If there's an open active span, we need to finish it before creating an new one.
+          activeSpan.end();
+        }
+      }
+
       client.on('startNavigationSpan', startSpanOptions => {
         if (getClient() !== client) {
           return;
         }
 
-        if (activeSpan && !spanToJSON(activeSpan).timestamp) {
-          DEBUG_BUILD && logger.log(`[Tracing] Finishing current root span with op: ${spanToJSON(activeSpan).op}`);
-          // If there's an open transaction on the scope, we need to finish it before creating an new one.
-          activeSpan.end();
-        }
+        maybeEndActiveSpan();
 
         activeSpan = _createRouteSpan(client, {
           op: 'navigation',
@@ -320,12 +324,7 @@ export const browserTracingIntegration = ((_options: Partial<BrowserTracingOptio
         if (getClient() !== client) {
           return;
         }
-
-        if (activeSpan && !spanToJSON(activeSpan).timestamp) {
-          DEBUG_BUILD && logger.log(`[Tracing] Finishing current root span with op: ${spanToJSON(activeSpan).op}`);
-          // If there's an open transaction on the scope, we need to finish it before creating an new one.
-          activeSpan.end();
-        }
+        maybeEndActiveSpan();
 
         const sentryTrace = traceOptions.sentryTrace || getMetaContent('sentry-trace');
         const baggage = traceOptions.baggage || getMetaContent('baggage');