fix(react): Remove unused react.componentStack event context (#21183)

## Summary

Removes the `react.componentStack` event context set by
`captureReactException`.

The shipped string never has sourcemaps applied, so it's mostly
unreadable in the Sentry UI. For React >= 17 the same component stack is
already attached via `error.cause` (which *does* get sourcemaps); for
React < 17 it offers little value either. Maintainer-confirmed in
#20094.

## Root cause

`captureReactException` wrapped the capture in `withScope` solely to
attach the `react.componentStack` context. With that context gone the
`withScope` wrapper has no other mutation, so it collapses to a direct
`captureException` call (and `withScope` drops out of the imports).

Test sync: `scopeSetContextSpy` in `errorboundary.test.tsx` is removed.
The two
`expect(cause.stack).toEqual(scopeSetContextSpy.mock.calls[...])`
assertions become `expect.any(String)` — the strongest invariant left
now that the spy is gone, since the underlying `setCause` /
`errorBoundaryError.stack = componentStack` chain is unchanged. The
recursive-cause negation collapses into the existing `cause.name`
assertion, with an inline comment explaining why the original cause is
preserved when the chain loops.

Fixes #20094

---------

Co-authored-by: zhongrenfei1-hub <231221504+zhongrenfei1-hub@users.noreply.github.com>
Co-authored-by: Claude Opus 4.7 <noreply@anthropic.com>
Co-authored-by: Nicolas Hrubec <nico.hrubec@sentry.io>

Author: 4 people

packages/react/src/error.ts

@@ -1,4 +1,4 @@
-import { captureException, withScope } from '@sentry/browser';
+import { captureException } from '@sentry/browser';
 import { isError } from '@sentry/core/browser';
 import type { ErrorInfo } from 'react';
 import { version } from 'react';
@@ -64,10 +64,7 @@ export function captureReactException(
     setCause(error, errorBoundaryError);
   }
 
-  return withScope(scope => {
-    scope.setContext('react', { componentStack });
-    return captureException(error, hint);
-  });
+  return captureException(error, hint);
 }
 
 /**

packages/react/test/errorboundary.test.tsx

@@ -11,7 +11,6 @@ import type { ErrorBoundaryProps, FallbackRender } from '../src/errorboundary';
 import { ErrorBoundary, UNKNOWN_COMPONENT, withErrorBoundary } from '../src/errorboundary';
 
 const mockScope = new Scope();
-const scopeSetContextSpy = vi.spyOn(mockScope, 'setContext');
 const mockCaptureException = vi.fn();
 const mockShowReportDialog = vi.fn();
 const mockClientOn = vi.fn();
@@ -221,7 +220,6 @@ describe('ErrorBoundary', () => {
     mockCaptureException.mockClear();
     mockShowReportDialog.mockClear();
     mockClientOn.mockClear();
-    (mockScope.setContext as any).mockClear();
   });
 
   it('renders null if not given a valid `fallback` prop', () => {
@@ -388,16 +386,13 @@ describe('ErrorBoundary', () => {
         mechanism: { handled: true, type: 'auto.function.react.error_boundary' },
       });
 
-      expect(scopeSetContextSpy).toHaveBeenCalledTimes(1);
-      expect(scopeSetContextSpy).toHaveBeenCalledWith('react', { componentStack: expect.any(String) });
-
       expect(mockOnError.mock.calls[0]?.[0]).toEqual(mockCaptureException.mock.calls[0]?.[0]);
 
       // Check if error.cause -> react component stack
       const error = mockCaptureException.mock.calls[0]?.[0];
       const cause = error.cause;
 
-      expect(cause.stack).toEqual(scopeSetContextSpy.mock.calls[0]?.[1]?.componentStack);
+      expect(cause.stack).toEqual(expect.any(String));
       expect(cause.name).toContain('React ErrorBoundary');
       expect(cause.message).toEqual(error.message);
     });
@@ -447,9 +442,6 @@ describe('ErrorBoundary', () => {
         mechanism: { handled: true, type: 'auto.function.react.error_boundary' },
       });
 
-      expect(scopeSetContextSpy).toHaveBeenCalledTimes(1);
-      expect(scopeSetContextSpy).toHaveBeenCalledWith('react', { componentStack: expect.any(String) });
-
       // Check if error.cause -> react component stack
       const error = mockCaptureException.mock.calls[0]?.[0];
       expect(error.cause).not.toBeDefined();
@@ -486,16 +478,13 @@ describe('ErrorBoundary', () => {
         mechanism: { handled: true, type: 'auto.function.react.error_boundary' },
       });
 
-      expect(scopeSetContextSpy).toHaveBeenCalledTimes(1);
-      expect(scopeSetContextSpy).toHaveBeenCalledWith('react', { componentStack: expect.any(String) });
-
       expect(mockOnError.mock.calls[0]?.[0]).toEqual(mockCaptureException.mock.calls[0]?.[0]);
 
       const thirdError = mockCaptureException.mock.calls[0]?.[0];
       const secondError = thirdError.cause;
       const firstError = secondError.cause;
       const cause = firstError.cause;
-      expect(cause.stack).toEqual(scopeSetContextSpy.mock.calls[0]?.[1]?.componentStack);
+      expect(cause.stack).toEqual(expect.any(String));
       expect(cause.name).toContain('React ErrorBoundary');
       expect(cause.message).toEqual(thirdError.message);
     });
@@ -530,15 +519,14 @@ describe('ErrorBoundary', () => {
         mechanism: { handled: true, type: 'auto.function.react.error_boundary' },
       });
 
-      expect(scopeSetContextSpy).toHaveBeenCalledTimes(1);
-      expect(scopeSetContextSpy).toHaveBeenCalledWith('react', { componentStack: expect.any(String) });
-
       expect(mockOnError.mock.calls[0]?.[0]).toEqual(mockCaptureException.mock.calls[0]?.[0]);
 
       const error = mockCaptureException.mock.calls[0]?.[0];
       const cause = error.cause;
-      // We need to make sure that recursive error.cause does not cause infinite loop
-      expect(cause.stack).not.toEqual(scopeSetContextSpy.mock.calls[0]?.[1]?.componentStack);
+      // We need to make sure that recursive error.cause does not cause infinite loop:
+      // when the cause chain loops, captureReactException bails out of setCause and
+      // leaves the original (non-ErrorBoundary) cause intact instead of overwriting
+      // it with `errorBoundaryError`.
       expect(cause.name).not.toContain('React ErrorBoundary');
     });
 
@@ -697,9 +685,6 @@ describe('ErrorBoundary', () => {
         expect(mockCaptureException).toHaveBeenLastCalledWith(expect.any(Object), {
           mechanism: { handled: expected, type: 'auto.function.react.error_boundary' },
         });
-
-        expect(scopeSetContextSpy).toHaveBeenCalledTimes(1);
-        expect(scopeSetContextSpy).toHaveBeenCalledWith('react', { componentStack: expect.any(String) });
       },
     );
   });