fix(react): Fix attachReduxState option (#10381)

Co-authored-by: Luca Forstner <[email protected]>

Author: AleshaOleg

packages/react/src/redux.ts

@@ -1,5 +1,5 @@
 /* eslint-disable @typescript-eslint/no-explicit-any */
-import { addEventProcessor, getClient, getCurrentScope } from '@sentry/browser';
+import { getClient, getCurrentScope, getGlobalScope } from '@sentry/core';
 import type { Scope } from '@sentry/types';
 import { addNonEnumerableProperty } from '@sentry/utils';
 
@@ -97,7 +97,7 @@ function createReduxEnhancer(enhancerOptions?: Partial<SentryEnhancerOptions>):
   return (next: StoreEnhancerStoreCreator): StoreEnhancerStoreCreator =>
     <S = any, A extends Action = AnyAction>(reducer: Reducer<S, A>, initialState?: PreloadedState<S>) => {
       options.attachReduxState &&
-        addEventProcessor((event, hint) => {
+        getGlobalScope().addEventProcessor((event, hint) => {
           try {
             // @ts-expect-error try catch to reduce bundle size
             if (event.type === undefined && event.contexts.state.state.type === 'redux') {
@@ -117,6 +117,7 @@ function createReduxEnhancer(enhancerOptions?: Partial<SentryEnhancerOptions>):
         const newState = reducer(state, action);
 
         const scope = getCurrentScope();
+
         /* Action breadcrumbs */
         const transformedAction = options.actionTransformer(action);
         if (typeof transformedAction !== 'undefined' && transformedAction !== null) {

packages/react/test/redux.test.ts

@@ -5,24 +5,28 @@ import { createReduxEnhancer } from '../src/redux';
 
 const mockAddBreadcrumb = jest.fn();
 const mockSetContext = jest.fn();
+const mockGlobalScopeAddEventProcessor = jest.fn();
 
-jest.mock('@sentry/browser', () => ({
-  ...jest.requireActual('@sentry/browser'),
+jest.mock('@sentry/core', () => ({
+  ...jest.requireActual('@sentry/core'),
   getCurrentScope() {
     return {
       addBreadcrumb: mockAddBreadcrumb,
       setContext: mockSetContext,
     };
   },
+  getGlobalScope() {
+    return {
+      addEventProcessor: mockGlobalScopeAddEventProcessor,
+    };
+  },
   addEventProcessor: jest.fn(),
 }));
 
-const mockAddEventProcessor = Sentry.addEventProcessor as jest.Mock;
-
 afterEach(() => {
   mockAddBreadcrumb.mockReset();
   mockSetContext.mockReset();
-  mockAddEventProcessor.mockReset();
+  mockGlobalScopeAddEventProcessor.mockReset();
 });
 
 describe('createReduxEnhancer', () => {
@@ -257,9 +261,9 @@ describe('createReduxEnhancer', () => {
 
       Redux.createStore((state = initialState) => state, enhancer);
 
-      expect(mockAddEventProcessor).toHaveBeenCalledTimes(1);
+      expect(mockGlobalScopeAddEventProcessor).toHaveBeenCalledTimes(1);
 
-      const callbackFunction = mockAddEventProcessor.mock.calls[0][0];
+      const callbackFunction = mockGlobalScopeAddEventProcessor.mock.calls[0][0];
 
       const mockEvent = {
         contexts: {
@@ -306,7 +310,7 @@ describe('createReduxEnhancer', () => {
 
       Redux.createStore((state = initialState) => state, enhancer);
 
-      expect(mockAddEventProcessor).toHaveBeenCalledTimes(0);
+      expect(mockGlobalScopeAddEventProcessor).toHaveBeenCalledTimes(0);
     });
 
     it('does not attach when state.type is not redux', () => {
@@ -318,9 +322,9 @@ describe('createReduxEnhancer', () => {
 
       Redux.createStore((state = initialState) => state, enhancer);
 
-      expect(mockAddEventProcessor).toHaveBeenCalledTimes(1);
+      expect(mockGlobalScopeAddEventProcessor).toHaveBeenCalledTimes(1);
 
-      const callbackFunction = mockAddEventProcessor.mock.calls[0][0];
+      const callbackFunction = mockGlobalScopeAddEventProcessor.mock.calls[0][0];
 
       const mockEvent = {
         contexts: {
@@ -353,9 +357,9 @@ describe('createReduxEnhancer', () => {
 
       Redux.createStore((state = initialState) => state, enhancer);
 
-      expect(mockAddEventProcessor).toHaveBeenCalledTimes(1);
+      expect(mockGlobalScopeAddEventProcessor).toHaveBeenCalledTimes(1);
 
-      const callbackFunction = mockAddEventProcessor.mock.calls[0][0];
+      const callbackFunction = mockGlobalScopeAddEventProcessor.mock.calls[0][0];
 
       const mockEvent = {
         contexts: {
@@ -385,9 +389,9 @@ describe('createReduxEnhancer', () => {
 
       Redux.createStore((state = initialState) => state, enhancer);
 
-      expect(mockAddEventProcessor).toHaveBeenCalledTimes(1);
+      expect(mockGlobalScopeAddEventProcessor).toHaveBeenCalledTimes(1);
 
-      const callbackFunction = mockAddEventProcessor.mock.calls[0][0];
+      const callbackFunction = mockGlobalScopeAddEventProcessor.mock.calls[0][0];
 
       const mockEvent = {
         type: 'not_redux',