Merge branch 'develop' into lforst-request-session-deprecations

Author: Luca Forstner

.github/workflows/build.yml

@@ -1408,6 +1408,10 @@ jobs:
           key: ${{ needs.job_build.outputs.dependency_cache_key }}
           enableCrossOsArchive: true
 
+      - name: Increase yarn network timeout on Windows
+        if: contains(matrix.os, 'windows')
+        run: yarn config set network-timeout 600000 -g
+
       - name: Install dependencies
         env:
           SKIP_PLAYWRIGHT_BROWSER_INSTALL: "1"
@@ -1418,10 +1422,6 @@ jobs:
         run: |
           git config --global --add safe.directory "*"
 
-      - name: Increase yarn network timeout on Windows
-        if: contains(matrix.os, 'windows')
-        run: yarn config set network-timeout 600000 -g
-
       - name: Setup python
         uses: actions/setup-python@v5
         if: ${{ !contains(matrix.container, 'alpine') }}

.github/workflows/issue-package-label.yml

@@ -83,12 +83,12 @@ jobs:
               "@sentry.solid": {
                 "label": "Package: solidstart"
               },
-              "@sentry.svelte": {
-                "label": "Package: svelte"
-              },
               "@sentry.sveltekit": {
                 "label": "Package: sveltekit"
               },
+              "@sentry.svelte": {
+                "label": "Package: svelte"
+              },
               "@sentry.vue": {
                 "label": "Package: vue"
               },

.size-limit.js

@@ -228,7 +228,7 @@ module.exports = [
     import: createImport('init'),
     ignore: [...builtinModules, ...nodePrefixedBuiltinModules],
     gzip: true,
-    limit: '140 KB',
+    limit: '160 KB',
   },
   {
     name: '@sentry/node - without tracing',
@@ -260,7 +260,7 @@ module.exports = [
     import: createImport('init'),
     ignore: [...builtinModules, ...nodePrefixedBuiltinModules],
     gzip: true,
-    limit: '130 KB',
+    limit: '150 KB',
   },
 ];
 

CHANGELOG.md

@@ -10,6 +10,59 @@
 
 - "You miss 100 percent of the chances you don't take. — Wayne Gretzky" — Michael Scott
 
+Work in this release was contributed by @lsmurray. Thank you for your contribution!
+
+## 8.42.0
+
+### Important Changes
+
+- **feat(react): React Router v7 support (library) ([#14513](https://github.com/getsentry/sentry-javascript/pull/14513))**
+
+  This release adds support for [React Router v7 (library mode)](https://reactrouter.com/home#react-router-as-a-library).
+  Check out the docs on how to set up the integration: [Sentry React Router v7 Integration Docs](https://docs.sentry.io/platforms/javascript/guides/react/features/react-router/v7/)
+
+### Deprecations
+
+- **feat: Warn about source-map generation ([#14533](https://github.com/getsentry/sentry-javascript/pull/14533))**
+
+  In the next major version of the SDK we will change how source maps are generated when the SDK is added to an application.
+  Currently, the implementation varies a lot between different SDKs and can be difficult to understand.
+  Moving forward, our goal is to turn on source maps for every framework, unless we detect that they are explicitly turned off.
+  Additionally, if we end up enabling source maps, we will emit a log message that we did so.
+
+  With this particular release, we are emitting warnings that source map generation will change in the future and we print instructions on how to prepare for the next major.
+
+- **feat(nuxt): Deprecate `tracingOptions` in favor of `vueIntegration` ([#14530](https://github.com/getsentry/sentry-javascript/pull/14530))**
+
+  Currently it is possible to configure tracing options in two places in the Sentry Nuxt SDK:
+
+  - In `Sentry.init()`
+  - Inside `tracingOptions` in `Sentry.init()`
+
+  For tree-shaking purposes and alignment with the Vue SDK, it is now recommended to instead use the newly exported `vueIntegration()` and its `tracingOptions` option to configure tracing options in the Nuxt SDK:
+
+  ```ts
+  // sentry.client.config.ts
+  import * as Sentry from '@sentry/nuxt';
+
+  Sentry.init({
+    // ...
+    integrations: [
+      Sentry.vueIntegration({
+        tracingOptions: {
+          trackComponents: true,
+        },
+      }),
+    ],
+  });
+  ```
+
+### Other Changes
+
+- feat(browser-utils): Update `web-vitals` to v4.2.4 ([#14439](https://github.com/getsentry/sentry-javascript/pull/14439))
+- feat(nuxt): Expose `vueIntegration` ([#14526](https://github.com/getsentry/sentry-javascript/pull/14526))
+- fix(feedback): Handle css correctly in screenshot mode ([#14535](https://github.com/getsentry/sentry-javascript/pull/14535))
+
 ## 8.41.0
 
 ### Important Changes

dev-packages/browser-integration-tests/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@sentry-internal/browser-integration-tests",
-  "version": "8.41.0",
+  "version": "8.42.0",
   "main": "index.js",
   "license": "MIT",
   "engines": {
@@ -43,7 +43,7 @@
     "@babel/preset-typescript": "^7.16.7",
     "@playwright/test": "^1.44.1",
     "@sentry-internal/rrweb": "2.29.0",
-    "@sentry/browser": "8.41.0",
+    "@sentry/browser": "8.42.0",
     "axios": "1.7.7",
     "babel-loader": "^8.2.2",
     "html-webpack-plugin": "^5.5.0",

dev-packages/browser-integration-tests/suites/integrations/featureFlags/launchdarkly/basic/test.ts

@@ -0,0 +1,48 @@
+import { expect } from '@playwright/test';
+
+import { sentryTest } from '../../../../../utils/fixtures';
+
+import { envelopeRequestParser, shouldSkipFeatureFlagsTest, waitForErrorRequest } from '../../../../../utils/helpers';
+
+const FLAG_BUFFER_SIZE = 100; // Corresponds to constant in featureFlags.ts, in browser utils.
+
+sentryTest('Basic test with eviction, update, and no async tasks', async ({ getLocalTestUrl, page }) => {
+  if (shouldSkipFeatureFlagsTest()) {
+    sentryTest.skip();
+  }
+
+  await page.route('https://dsn.ingest.sentry.io/**/*', route => {
+    return route.fulfill({
+      status: 200,
+      contentType: 'application/json',
+      body: JSON.stringify({ id: 'test-id' }),
+    });
+  });
+
+  const url = await getLocalTestUrl({ testDir: __dirname, skipDsnRouteHandler: true });
+  await page.goto(url);
+
+  await page.evaluate(bufferSize => {
+    const ldClient = (window as any).initializeLD();
+    for (let i = 1; i <= bufferSize; i++) {
+      ldClient.variation(`feat${i}`, false);
+    }
+    ldClient.variation(`feat${bufferSize + 1}`, true); // eviction
+    ldClient.variation('feat3', true); // update
+    return true;
+  }, FLAG_BUFFER_SIZE);
+
+  const reqPromise = waitForErrorRequest(page);
+  await page.locator('#error').click();
+  const req = await reqPromise;
+  const event = envelopeRequestParser(req);
+
+  const expectedFlags = [{ flag: 'feat2', result: false }];
+  for (let i = 4; i <= FLAG_BUFFER_SIZE; i++) {
+    expectedFlags.push({ flag: `feat${i}`, result: false });
+  }
+  expectedFlags.push({ flag: `feat${FLAG_BUFFER_SIZE + 1}`, result: true });
+  expectedFlags.push({ flag: 'feat3', result: true });
+
+  expect(event.contexts?.flags?.values).toEqual(expectedFlags);
+});

dev-packages/browser-integration-tests/suites/integrations/featureFlags/launchdarkly/init.js

@@ -0,0 +1,35 @@
+import * as Sentry from '@sentry/browser';
+
+window.Sentry = Sentry;
+window.sentryLDIntegration = Sentry.launchDarklyIntegration();
+
+Sentry.init({
+  dsn: 'https://[email protected]/1337',
+  sampleRate: 1.0,
+  integrations: [window.sentryLDIntegration],
+});
+
+// Manually mocking this because LD only has mock test utils for the React SDK.
+// Also, no SDK has mock utils for FlagUsedHandler's.
+const MockLaunchDarkly = {
+  initialize(_clientId, context, options) {
+    const flagUsedHandler = options && options.inspectors ? options.inspectors[0].method : undefined;
+
+    return {
+      variation(key, defaultValue) {
+        if (flagUsedHandler) {
+          flagUsedHandler(key, { value: defaultValue }, context);
+        }
+        return defaultValue;
+      },
+    };
+  },
+};
+
+window.initializeLD = () => {
+  return MockLaunchDarkly.initialize(
+    'example-client-id',
+    { kind: 'user', key: 'example-context-key' },
+    { inspectors: [Sentry.buildLaunchDarklyFlagUsedHandler()] },
+  );
+};

dev-packages/browser-integration-tests/suites/integrations/featureFlags/launchdarkly/subject.js

@@ -0,0 +1,3 @@
+document.getElementById('error').addEventListener('click', () => {
+  throw new Error('Button triggered error');
+});

dev-packages/browser-integration-tests/suites/integrations/featureFlags/launchdarkly/template.html

@@ -0,0 +1,9 @@
+<!DOCTYPE html>
+<html>
+  <head>
+    <meta charset="utf-8" />
+  </head>
+  <body>
+    <button id="error">Throw Error</button>
+  </body>
+</html>

dev-packages/browser-integration-tests/suites/integrations/featureFlags/launchdarkly/withScope/test.ts

@@ -0,0 +1,65 @@
+import { expect } from '@playwright/test';
+
+import { sentryTest } from '../../../../../utils/fixtures';
+
+import { envelopeRequestParser, shouldSkipFeatureFlagsTest, waitForErrorRequest } from '../../../../../utils/helpers';
+
+import type { Scope } from '@sentry/browser';
+
+sentryTest('Flag evaluations in forked scopes are stored separately.', async ({ getLocalTestUrl, page }) => {
+  if (shouldSkipFeatureFlagsTest()) {
+    sentryTest.skip();
+  }
+
+  await page.route('https://dsn.ingest.sentry.io/**/*', route => {
+    return route.fulfill({
+      status: 200,
+      contentType: 'application/json',
+      body: JSON.stringify({ id: 'test-id' }),
+    });
+  });
+
+  const url = await getLocalTestUrl({ testDir: __dirname, skipDsnRouteHandler: true });
+  await page.goto(url);
+
+  const forkedReqPromise = waitForErrorRequest(page, event => !!event.tags && event.tags.isForked === true);
+  const mainReqPromise = waitForErrorRequest(page, event => !!event.tags && event.tags.isForked === false);
+
+  await page.evaluate(() => {
+    const Sentry = (window as any).Sentry;
+    const errorButton = document.querySelector('#error') as HTMLButtonElement;
+    const ldClient = (window as any).initializeLD();
+
+    ldClient.variation('shared', true);
+
+    Sentry.withScope((scope: Scope) => {
+      ldClient.variation('forked', true);
+      ldClient.variation('shared', false);
+      scope.setTag('isForked', true);
+      if (errorButton) {
+        errorButton.click();
+      }
+    });
+
+    ldClient.variation('main', true);
+    Sentry.getCurrentScope().setTag('isForked', false);
+    errorButton.click();
+    return true;
+  });
+
+  const forkedReq = await forkedReqPromise;
+  const forkedEvent = envelopeRequestParser(forkedReq);
+
+  const mainReq = await mainReqPromise;
+  const mainEvent = envelopeRequestParser(mainReq);
+
+  expect(forkedEvent.contexts?.flags?.values).toEqual([
+    { flag: 'forked', result: true },
+    { flag: 'shared', result: false },
+  ]);
+
+  expect(mainEvent.contexts?.flags?.values).toEqual([
+    { flag: 'shared', result: true },
+    { flag: 'main', result: true },
+  ]);
+});