?

Author: BYK

dev-packages/e2e-tests/test-applications/nextjs-15-spotlight/app/page.tsx

@@ -5,36 +5,17 @@ import * as Sentry from '@sentry/nextjs';
 
 // Next.js replaces process.env.NEXT_PUBLIC_* at BUILD TIME with literal values
 const NEXT_PUBLIC_SPOTLIGHT_VALUE = process.env.NEXT_PUBLIC_SENTRY_SPOTLIGHT;
-// Check internal values (these may or may not be replaced depending on bundler)
-const INTERNAL_SPOTLIGHT_PROCESS_ENV = process.env._sentrySpotlight;
 
 export default function SpotlightTestPage() {
   const [spotlightEnabled, setSpotlightEnabled] = useState<boolean | null>(null);
   const [integrationNames, setIntegrationNames] = useState<string[]>([]);
-  const [debugInfo, setDebugInfo] = useState<{
-    internalGlobal: string;
-    manualGlobal: string;
-    sdkDebug: unknown;
-    initCalled: unknown;
-  } | null>(null);
+  const [windowSpotlight, setWindowSpotlight] = useState<string>('loading...');
 
   useEffect(() => {
-    // Read globals at runtime (after init has run)
-    // @ts-expect-error - accessing globalThis for debugging
-    const internalGlobal = globalThis._sentrySpotlight;
-    // @ts-expect-error - accessing manual global
-    const manualGlobal = globalThis._sentrySpotlightManual;
-    // @ts-expect-error - accessing SDK debug info
-    const sdkDebug = globalThis._sentrySpotlightDebug;
-    // @ts-expect-error - accessing init marker
-    const initCalled = globalThis._sentryNextjsInitCalled;
-
-    setDebugInfo({
-      internalGlobal: String(internalGlobal ?? 'undefined'),
-      manualGlobal: String(manualGlobal ?? 'undefined'),
-      sdkDebug,
-      initCalled,
-    });
+    // Read window._sentrySpotlight at runtime
+    // @ts-expect-error - accessing window property
+    const windowValue = typeof window !== 'undefined' ? window._sentrySpotlight : undefined;
+    setWindowSpotlight(String(windowValue ?? 'undefined'));
 
     // Check if Spotlight integration is registered
     const client = Sentry.getClient();
@@ -49,11 +30,7 @@ export default function SpotlightTestPage() {
     // Log for debugging
     console.log('Spotlight test results:', {
       envValue: NEXT_PUBLIC_SPOTLIGHT_VALUE,
-      internalProcessEnv: INTERNAL_SPOTLIGHT_PROCESS_ENV,
-      internalGlobal,
-      manualGlobal,
-      sdkDebugInfo: sdkDebug,
-      initCalled,
+      windowSpotlight: windowValue,
       integrationFound: !!integration,
       clientExists: !!client,
       integrationNames: intNames,
@@ -67,15 +44,7 @@ export default function SpotlightTestPage() {
       <div data-testid="env-value">
         <h2>Environment Variable</h2>
         <p>NEXT_PUBLIC_SENTRY_SPOTLIGHT: {NEXT_PUBLIC_SPOTLIGHT_VALUE || 'undefined'}</p>
-        <p>process.env._sentrySpotlight: {String(INTERNAL_SPOTLIGHT_PROCESS_ENV) || 'undefined'}</p>
-        <p>globalThis._sentrySpotlight: {debugInfo?.internalGlobal || 'loading...'}</p>
-        <p>globalThis._sentrySpotlightManual: {debugInfo?.manualGlobal || 'loading...'}</p>
-      </div>
-
-      <div data-testid="sdk-debug">
-        <h2>SDK Debug Info (what SDK saw during init)</h2>
-        <p>init() called: {String(debugInfo?.initCalled ?? 'loading...')}</p>
-        <pre>{debugInfo?.sdkDebug ? JSON.stringify(debugInfo.sdkDebug, null, 2) : 'No debug info'}</pre>
+        <p>window._sentrySpotlight: {windowSpotlight}</p>
       </div>
 
       <div data-testid="spotlight-status">

dev-packages/e2e-tests/test-applications/nextjs-15-spotlight/instrumentation-client.ts

@@ -1,7 +1,10 @@
-// Debug: manually set the global BEFORE importing Sentry
-// This tests if the SDK can read globals at all
-// @ts-expect-error - setting global for debugging
-globalThis._sentrySpotlightManual = process.env.NEXT_PUBLIC_SENTRY_SPOTLIGHT;
+// Set the spotlight value on window BEFORE importing Sentry
+// Next.js replaces process.env.NEXT_PUBLIC_* at build time, so this works
+// The SDK will read window._sentrySpotlight during init()
+if (typeof window !== 'undefined') {
+  // @ts-expect-error - setting window property for SDK to read
+  window._sentrySpotlight = process.env.NEXT_PUBLIC_SENTRY_SPOTLIGHT;
+}
 
 import * as Sentry from '@sentry/nextjs';
 
@@ -10,7 +13,6 @@ Sentry.init({
   dsn: process.env.NEXT_PUBLIC_E2E_TEST_DSN,
   tunnel: `http://localhost:3031/`,
   tracesSampleRate: 1.0,
-  debug: true,
   // Note: We don't explicitly set spotlight here - it should be auto-enabled
-  // from NEXT_PUBLIC_SENTRY_SPOTLIGHT env var in development mode
+  // from window._sentrySpotlight which is set above
 });

dev-packages/e2e-tests/test-applications/nextjs-15-spotlight/tests/spotlight.test.ts

@@ -7,22 +7,21 @@ test.describe('Spotlight auto-enablement in Next.js development mode', () => {
     // Wait for client-side hydration and Sentry initialization
     await page.waitForTimeout(2000);
 
-    // Wait a bit for useEffect to run and update state
-    await page.waitForTimeout(1000);
+    // Wait for React to hydrate and useEffect to run
+    await page.waitForTimeout(2000);
 
     // Check environment variable is accessible
     const envValue = await page.getByTestId('env-value').textContent();
     expect(envValue).toContain('true');
 
     // Get diagnostic info before asserting
     const integrationNames = await page.getByTestId('integration-names').textContent();
-    const sdkDebug = await page.getByTestId('sdk-debug').textContent();
 
     // Check Spotlight integration is enabled
     const spotlightStatus = await page.getByTestId('spotlight-enabled').textContent();
     expect(
       spotlightStatus,
-      `Spotlight should be ENABLED.\nEnv values: ${envValue}\nSDK Debug: ${sdkDebug}\nIntegrations: ${integrationNames}`,
+      `Spotlight should be ENABLED.\nEnv values: ${envValue}\nIntegrations: ${integrationNames}`,
     ).toBe('ENABLED');
   });
 

packages/nextjs/src/client/index.ts

@@ -44,19 +44,13 @@ const globalWithInjectedValues = GLOBAL_OBJ as typeof GLOBAL_OBJ & {
   _sentryRelease?: string;
   _experimentalThirdPartyOriginStackFrames?: string;
   _sentrySpotlight?: string;
-  _sentrySpotlightManual?: string; // Debug: manually set by user in instrumentation-client.ts
 };
 
 // Treeshakable guard to remove all code related to tracing
 declare const __SENTRY_TRACING__: boolean;
 
 /** Inits the Sentry NextJS SDK on the browser with the React SDK. */
 export function init(options: BrowserOptions): Client | undefined {
-  // Debug marker to verify this init() is being called (for e2e tests)
-  if (typeof globalThis !== 'undefined') {
-    (globalThis as Record<string, unknown>)._sentryNextjsInitCalled = true;
-  }
-
   if (clientIsInitialized) {
     consoleSandbox(() => {
       // eslint-disable-next-line no-console
@@ -153,55 +147,28 @@ function getDefaultIntegrations(options: BrowserOptions): Integration[] {
   // 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 globalThis._sentrySpotlightManual in instrumentation-client.ts
+  // - Manual: user can set window._sentrySpotlight in instrumentation-client.ts
   const processEnvSpotlight = process.env._sentrySpotlight;
   const globalSpotlight = globalWithInjectedValues._sentrySpotlight;
-  const manualSpotlight = globalWithInjectedValues._sentrySpotlightManual;
-  // Also check raw globalThis directly in case GLOBAL_OBJ differs
-  const rawGlobalThis = typeof globalThis !== 'undefined' ? globalThis : undefined;
-  const rawManualSpotlightRaw = rawGlobalThis ? (rawGlobalThis as Record<string, unknown>)._sentrySpotlightManual : undefined;
-  const rawManualSpotlight = typeof rawManualSpotlightRaw === 'string' ? rawManualSpotlightRaw : undefined;
-  const spotlightEnvValue: string | undefined =
-    processEnvSpotlight || globalSpotlight || manualSpotlight || rawManualSpotlight;
-
-  // Expose debug info on globalThis for test verification
-  if (rawGlobalThis) {
-    (rawGlobalThis as Record<string, unknown>)._sentrySpotlightDebug = {
-      processEnvSpotlight,
-      globalSpotlight,
-      manualSpotlight,
-      rawManualSpotlightRaw,
-      rawManualSpotlight,
-      spotlightEnvValue,
-      optionsSpotlight: options.spotlight,
-      GLOBAL_OBJ_keys: Object.keys(GLOBAL_OBJ),
-    };
-  }
 
-  // eslint-disable-next-line no-console
-  console.log('[Sentry Next.js DEBUG] Spotlight detection:', {
-    'process.env._sentrySpotlight': processEnvSpotlight,
-    'globalThis._sentrySpotlight': globalSpotlight,
-    'globalThis._sentrySpotlightManual': manualSpotlight,
-    'rawGlobalThis._sentrySpotlightManual (raw)': rawManualSpotlightRaw,
-    'rawGlobalThis._sentrySpotlightManual': rawManualSpotlight,
-    resolved: spotlightEnvValue,
-    'options.spotlight': options.spotlight,
-  });
+  // 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;
+
+  const spotlightEnvValue: string | undefined =
+    processEnvSpotlight ||
+    globalSpotlight ||
+    (typeof windowSpotlight === 'string' ? windowSpotlight : undefined);
 
   if (spotlightEnvValue !== undefined && options.spotlight === undefined) {
     const boolValue = envToBool(spotlightEnvValue, { strict: true });
     const spotlightConfig = boolValue !== null ? boolValue : spotlightEnvValue;
     const spotlightValue = resolveSpotlightOptions(undefined, spotlightConfig);
 
-    // eslint-disable-next-line no-console
-    console.log('[Sentry Next.js DEBUG] Spotlight resolved:', { boolValue, spotlightConfig, spotlightValue });
-
     if (spotlightValue) {
       const spotlightArgs = typeof spotlightValue === 'string' ? { sidecarUrl: spotlightValue } : undefined;
       customDefaultIntegrations.push(spotlightBrowserIntegration(spotlightArgs));
-      // eslint-disable-next-line no-console
-      console.log('[Sentry Next.js DEBUG] Spotlight integration ADDED');
     }
   }