simplifications

Author: BYK

CONTRIBUTING.md

@@ -73,6 +73,72 @@ the tests in each location. Check out the `scripts` entry of the corresponding `
 
 Note: you must run `yarn build` before `yarn test` will work.
 
+## Running E2E Tests Locally
+
+The E2E tests in `dev-packages/e2e-tests/test-applications/` use Playwright and pnpm. To run them locally:
+
+### Prerequisites
+
+1. **Enable pnpm support in Volta** (required for E2E tests):
+
+   ```bash
+   export VOLTA_FEATURE_PNPM=1
+   ```
+
+   Add this to your shell profile (`.bashrc`, `.zshrc`, etc.) for persistence.
+
+2. **Build the SDK packages** you want to test:
+
+   ```bash
+   yarn build:dev:filter @sentry/nextjs  # or whichever package you're testing
+   ```
+
+### Running a specific E2E test app
+
+1. Navigate to the test application directory:
+
+   ```bash
+   cd dev-packages/e2e-tests/test-applications/<app-name>
+   ```
+
+2. Install dependencies:
+
+   ```bash
+   pnpm install
+   ```
+
+3. Link local SDK packages (to test your changes instead of the published version):
+
+   ```bash
+   # Remove existing @sentry packages and create symlinks to local builds
+   rm -rf node_modules/@sentry
+   mkdir -p node_modules/@sentry
+   ln -sf ../../../../../../../../packages/nextjs node_modules/@sentry/nextjs
+   ln -sf ../../../../../../../../packages/core node_modules/@sentry/core
+   ln -sf ../../../../../../../../packages/browser node_modules/@sentry/browser
+   ln -sf ../../../../../../../../packages/react node_modules/@sentry/react
+   # Add other packages as needed for your test
+   ```
+
+4. Install Playwright browsers (first time only):
+
+   ```bash
+   npx playwright install chromium
+   ```
+
+5. Run the tests:
+
+   ```bash
+   npx playwright test
+   ```
+
+### Troubleshooting
+
+- **WSL2 Chromium issues**: If you encounter "Invalid file descriptor to ICU data" or segfaults, you may need a newer
+  Playwright version. The test apps use `@playwright/test: ~1.56.0` which works in WSL2.
+- **Stale builds**: After making SDK changes, rebuild with `yarn build:dev:filter @sentry/<package>` and re-link.
+- **Port conflicts**: Check if the test app's port (usually 3030) is available.
+
 ## Debug Build Flags
 
 Throughout the codebase, you will find a `__DEBUG_BUILD__` constant. This flag serves two purposes:

dev-packages/e2e-tests/.gitignore

@@ -4,3 +4,4 @@ tmp
 .tmp_build_stderr
 pnpm-lock.yaml
 .last-run.json
+.next

packages/browser/src/utils/env.ts

@@ -1,8 +1,9 @@
 /**
  * Safely gets an environment variable value with defensive guards for browser environments.
- * Checks both process.env and import.meta.env to support different bundlers:
+ * Checks multiple sources to support different bundlers:
  * - process.env: Webpack, Next.js, Create React App, Parcel (works in both ESM and CJS)
  * - import.meta.env: Vite, Astro, SvelteKit (ESM only - stripped from CJS builds)
+ * - globalThis: Turbopack and other bundlers that inject values at runtime
  *
  * @param key - The environment variable key to look up
  * @returns The value of the environment variable or undefined if not found
@@ -38,5 +39,17 @@ export function getEnvValue(key: string): string | undefined {
   }
   /* rollup-esm-only-end */
 
+  // Check globalThis for bundler-injected values (e.g., Turbopack's valueInjectionLoader)
+  try {
+    if (typeof globalThis !== 'undefined') {
+      const value = (globalThis as Record<string, unknown>)[key];
+      if (typeof value === 'string') {
+        return value;
+      }
+    }
+  } catch (e) {
+    // Silently ignore
+  }
+
   return undefined;
 }

packages/nextjs/src/client/index.ts

@@ -2,21 +2,9 @@
 // can be removed once following issue is fixed: https://github.com/import-js/eslint-plugin-import/issues/703
 /* eslint-disable import/export */
 import type { Client, EventProcessor, Integration } from '@sentry/core';
-import {
-  addEventProcessor,
-  applySdkMetadata,
-  consoleSandbox,
-  envToBool,
-  getGlobalScope,
-  GLOBAL_OBJ,
-  resolveSpotlightOptions,
-} from '@sentry/core';
+import { addEventProcessor, applySdkMetadata, consoleSandbox, getGlobalScope, GLOBAL_OBJ } from '@sentry/core';
 import type { BrowserOptions } from '@sentry/react';
-import {
-  getDefaultIntegrations as getReactDefaultIntegrations,
-  init as reactInit,
-  spotlightBrowserIntegration,
-} from '@sentry/react';
+import { getDefaultIntegrations as getReactDefaultIntegrations, init as reactInit } from '@sentry/react';
 import { devErrorSymbolicationEventProcessor } from '../common/devErrorSymbolicationEventProcessor';
 import { getVercelEnv } from '../common/getVercelEnv';
 import { isRedirectNavigationError } from '../common/nextNavigationErrorUtils';
@@ -43,7 +31,6 @@ const globalWithInjectedValues = GLOBAL_OBJ as typeof GLOBAL_OBJ & {
   _sentryBasePath?: string;
   _sentryRelease?: string;
   _experimentalThirdPartyOriginStackFrames?: string;
-  _sentrySpotlight?: string;
 };
 
 // Treeshakable guard to remove all code related to tracing
@@ -143,39 +130,11 @@ function getDefaultIntegrations(options: BrowserOptions): Integration[] {
     }),
   );
 
-  // Auto-enable Spotlight from NEXT_PUBLIC_SENTRY_SPOTLIGHT env var
-  // The value is injected at build time:
-  // - Webpack: via DefinePlugin which replaces process.env._sentrySpotlight
-  // - Turbopack: via valueInjectionLoader which sets globalThis._sentrySpotlight
-  // - Manual: user can set window._sentrySpotlight in instrumentation-client.ts
-  const processEnvSpotlight = process.env._sentrySpotlight;
-  const globalSpotlight = globalWithInjectedValues._sentrySpotlight;
-
-  // Check window directly for manual setting (most reliable in browser)
-  // This is set in instrumentation-client.ts before Sentry.init()
-  const windowObj = typeof window !== 'undefined' ? window : undefined;
-  const windowSpotlight = windowObj ? (windowObj as unknown as Record<string, unknown>)._sentrySpotlight : undefined;
-
-  // Convert window value to string if it's a boolean or other type
-  const windowSpotlightStr =
-    typeof windowSpotlight === 'string'
-      ? windowSpotlight
-      : typeof windowSpotlight === 'boolean'
-        ? String(windowSpotlight)
-        : undefined;
-
-  const spotlightEnvValue: string | undefined = processEnvSpotlight || globalSpotlight || windowSpotlightStr;
-
-  if (spotlightEnvValue !== undefined && options.spotlight === undefined) {
-    const boolValue = envToBool(spotlightEnvValue, { strict: true });
-    const spotlightConfig = boolValue !== null ? boolValue : spotlightEnvValue;
-    const spotlightValue = resolveSpotlightOptions(undefined, spotlightConfig);
-
-    if (spotlightValue) {
-      const spotlightArgs = typeof spotlightValue === 'string' ? { sidecarUrl: spotlightValue } : undefined;
-      customDefaultIntegrations.push(spotlightBrowserIntegration(spotlightArgs));
-    }
-  }
+  // Note: Spotlight auto-enablement from NEXT_PUBLIC_SENTRY_SPOTLIGHT is handled by the
+  // browser SDK's init() function. The Next.js build config injects the env var value via:
+  // - Webpack: DefinePlugin replaces process.env.NEXT_PUBLIC_SENTRY_SPOTLIGHT
+  // - Turbopack: valueInjectionLoader sets globalThis.NEXT_PUBLIC_SENTRY_SPOTLIGHT
+  // The browser SDK's getEnvValue() checks both sources.
 
   return customDefaultIntegrations;
 }

packages/nextjs/src/config/turbopack/generateValueInjectionRules.ts

@@ -35,9 +35,11 @@ export function generateValueInjectionRules({
     isomorphicValues._sentryRewritesTunnelPath = tunnelPath;
   }
 
-  // Inject Spotlight config for client (Spotlight is a client-side feature)
+  // Inject Spotlight config for client so the browser SDK can auto-enable Spotlight.
+  // Next.js doesn't expose NEXT_PUBLIC_* vars to node_modules, so we inject it via
+  // globalThis. The browser SDK's getEnvValue() checks globalThis as a fallback.
   if (spotlightConfig) {
-    clientValues._sentrySpotlight = spotlightConfig;
+    clientValues.NEXT_PUBLIC_SENTRY_SPOTLIGHT = spotlightConfig;
   }
 
   if (Object.keys(isomorphicValues).length > 0) {

packages/nextjs/src/config/webpack.ts

@@ -447,13 +447,14 @@ export function constructWebpackConfigFunction({
       }),
     );
 
-    // Inject Spotlight config for client builds so the SDK can auto-enable Spotlight
-    // when NEXT_PUBLIC_SENTRY_SPOTLIGHT is set. We use DefinePlugin because Next.js
-    // doesn't replace process.env.* in node_modules code.
+    // Inject Spotlight config for client builds so the browser SDK can auto-enable Spotlight.
+    // Next.js doesn't replace process.env.NEXT_PUBLIC_* in node_modules code, so we use
+    // DefinePlugin to inject the value directly. The browser SDK's getSpotlightConfig()
+    // already checks for NEXT_PUBLIC_SENTRY_SPOTLIGHT.
     if (runtime === 'client' && spotlightConfig) {
       newConfig.plugins.push(
         new buildContext.webpack.DefinePlugin({
-          'process.env._sentrySpotlight': JSON.stringify(spotlightConfig),
+          'process.env.NEXT_PUBLIC_SENTRY_SPOTLIGHT': JSON.stringify(spotlightConfig),
         }),
       );
     }