fix(react): use new captureException API

Author: AbhiPrasad

packages/react/src/errorboundary.tsx

@@ -35,10 +35,7 @@ class ErrorBoundary extends React.Component<ErrorBoundaryProps, ErrorBoundarySta
   public state: ErrorBoundaryState = INITIAL_STATE;
 
   public componentDidCatch(error: Error, { componentStack }: React.ErrorInfo): void {
-    Sentry.withScope(scope => {
-      scope.setExtra('componentStack', componentStack);
-      Sentry.captureException(error);
-    });
+    Sentry.captureException(error, { contexts: { componentStack } });
     const { onError, showDialog, dialogOptions } = this.props;
     if (onError) {
       onError(error, componentStack);

packages/react/test/errorboundary.test.tsx

@@ -3,22 +3,16 @@ import * as React from 'react';
 
 import { ErrorBoundary, ErrorBoundaryProps, FALLBACK_ERR_MESSAGE } from '../src/errorboundary';
 
-const mockSetExtra = jest.fn();
 const mockCaptureException = jest.fn();
 const mockShowReportDialog = jest.fn();
 
 jest.mock('@sentry/browser', () => ({
-  captureException: (err: any) => {
-    mockCaptureException(err);
+  captureException: (err: any, ctx: any) => {
+    mockCaptureException(err, ctx);
   },
   showReportDialog: (options: any) => {
     mockShowReportDialog(options);
   },
-  withScope: (callback: Function) => {
-    callback({
-      setExtra: mockSetExtra,
-    });
-  },
 }));
 
 const TestApp: React.FC<ErrorBoundaryProps> = ({ children, ...props }) => {
@@ -45,7 +39,6 @@ describe('ErrorBoundary', () => {
 
   afterEach(() => {
     consoleErrorSpy.mockClear();
-    mockSetExtra.mockClear();
     mockCaptureException.mockClear();
     mockShowReportDialog.mockClear();
   });
@@ -179,7 +172,6 @@ describe('ErrorBoundary', () => {
 
       expect(mockOnError).toHaveBeenCalledTimes(0);
       expect(mockCaptureException).toHaveBeenCalledTimes(0);
-      expect(mockSetExtra).toHaveBeenCalledTimes(0);
 
       const btn = screen.getByTestId('errorBtn');
       fireEvent.click(btn);
@@ -188,10 +180,9 @@ describe('ErrorBoundary', () => {
       expect(mockOnError).toHaveBeenCalledWith(expect.any(Error), expect.any(String));
 
       expect(mockCaptureException).toHaveBeenCalledTimes(1);
-      expect(mockCaptureException).toHaveBeenCalledWith(expect.any(Error));
-
-      expect(mockSetExtra).toHaveBeenCalledTimes(1);
-      expect(mockSetExtra).toHaveBeenCalledWith('componentStack', expect.any(String));
+      expect(mockCaptureException).toHaveBeenCalledWith(expect.any(Error), {
+        contexts: { componentStack: expect.any(String) },
+      });
     });
 
     it('shows a Sentry Report Dialog with correct options', () => {