fix tests

Author: AbhiPrasad

packages/react/src/profiler.tsx

@@ -82,16 +82,15 @@ class Profiler extends React.Component<ProfilerProps> {
       const changedProps = Object.keys(updateProps).filter(k => updateProps[k] !== this.props.updateProps[k]);
       if (changedProps.length > 0 && !this._updateSpan) {
         const now = timestampInSeconds();
-        const scope = new Scope();
-        scope.setSpan(this._mountSpan);
+        const scope = new Scope().setSpan(this._mountSpan);
         this._updateSpan = startInactiveSpan({
           scope,
           name: `<${this.props.name}>`,
           op: REACT_UPDATE_OP,
           origin: 'auto.ui.react.profiler',
           startTimestamp: now,
           attributes: {
-            changedProps,
+            'ui.react.changed_props': changedProps,
             'ui.component_name': this.props.name,
           },
         });
@@ -206,8 +205,7 @@ function useProfiler(
     return (): void => {
       const endTime = timestampInSeconds();
       if (mountSpan && options.hasRenderSpan) {
-        const scope = new Scope();
-        scope.setSpan(mountSpan);
+        const scope = new Scope().setSpan(mountSpan);
         const renderSpan = startInactiveSpan({
           scope,
           name: `<${name}>`,

packages/react/test/profiler.test.tsx

@@ -1,3 +1,4 @@
+import { Scope } from '@sentry/browser';
 import type { SpanContext } from '@sentry/types';
 import { render } from '@testing-library/react';
 import { renderHook } from '@testing-library/react-hooks';
@@ -14,31 +15,26 @@ const mockFinish = jest.fn();
 class MockSpan {
   public constructor(public readonly ctx: SpanContext) {}
 
-  public startChild(ctx: SpanContext): MockSpan {
-    mockStartChild(ctx);
-    return new MockSpan(ctx);
-  }
-
   public end(): void {
     mockFinish();
   }
 }
 
-let activeTransaction: Record<string, any>;
+let activeSpan: Record<string, any>;
 
 jest.mock('@sentry/browser', () => ({
-  getCurrentHub: () => ({
-    getIntegration: () => undefined,
-    getScope: () => ({
-      getTransaction: () => activeTransaction,
-    }),
-  }),
+  ...jest.requireActual('@sentry/browser'),
+  getActiveSpan: () => activeSpan,
+  startInactiveSpan: (ctx: SpanContext) => {
+    mockStartChild(ctx);
+    return new MockSpan(ctx);
+  },
 }));
 
 beforeEach(() => {
   mockStartChild.mockClear();
   mockFinish.mockClear();
-  activeTransaction = new MockSpan({ op: 'pageload' });
+  activeSpan = new MockSpan({ op: 'pageload' });
 });
 
 describe('withProfiler', () => {
@@ -78,10 +74,10 @@ describe('withProfiler', () => {
 
       expect(mockStartChild).toHaveBeenCalledTimes(1);
       expect(mockStartChild).toHaveBeenLastCalledWith({
-        description: `<${UNKNOWN_COMPONENT}>`,
+        name: `<${UNKNOWN_COMPONENT}>`,
         op: REACT_MOUNT_OP,
         origin: 'auto.ui.react.profiler',
-        data: { 'ui.component_name': 'unknown' },
+        attributes: { 'ui.component_name': 'unknown' },
       });
     });
   });
@@ -96,12 +92,11 @@ describe('withProfiler', () => {
 
       expect(mockStartChild).toHaveBeenCalledTimes(2);
       expect(mockStartChild).toHaveBeenLastCalledWith({
-        description: `<${UNKNOWN_COMPONENT}>`,
-        endTimestamp: expect.any(Number),
+        name: `<${UNKNOWN_COMPONENT}>`,
         op: REACT_RENDER_OP,
         origin: 'auto.ui.react.profiler',
         startTimestamp: undefined,
-        data: { 'ui.component_name': 'unknown' },
+        attributes: { 'ui.component_name': 'unknown' },
       });
     });
 
@@ -128,22 +123,24 @@ describe('withProfiler', () => {
       rerender(<ProfiledComponent num={1} />);
       expect(mockStartChild).toHaveBeenCalledTimes(2);
       expect(mockStartChild).toHaveBeenLastCalledWith({
-        data: { changedProps: ['num'], 'ui.component_name': 'unknown' },
-        description: `<${UNKNOWN_COMPONENT}>`,
+        attributes: { 'ui.react.changed_props': ['num'], 'ui.component_name': 'unknown' },
+        name: `<${UNKNOWN_COMPONENT}>`,
         op: REACT_UPDATE_OP,
         origin: 'auto.ui.react.profiler',
         startTimestamp: expect.any(Number),
+        scope: expect.any(Scope),
       });
       expect(mockFinish).toHaveBeenCalledTimes(2);
       // New props yet again
       rerender(<ProfiledComponent num={2} />);
       expect(mockStartChild).toHaveBeenCalledTimes(3);
       expect(mockStartChild).toHaveBeenLastCalledWith({
-        data: { changedProps: ['num'], 'ui.component_name': 'unknown' },
-        description: `<${UNKNOWN_COMPONENT}>`,
+        attributes: { 'ui.react.changed_props': ['num'], 'ui.component_name': 'unknown' },
+        name: `<${UNKNOWN_COMPONENT}>`,
         op: REACT_UPDATE_OP,
         origin: 'auto.ui.react.profiler',
         startTimestamp: expect.any(Number),
+        scope: expect.any(Scope),
       });
       expect(mockFinish).toHaveBeenCalledTimes(3);
 
@@ -179,10 +176,10 @@ describe('useProfiler()', () => {
 
       expect(mockStartChild).toHaveBeenCalledTimes(1);
       expect(mockStartChild).toHaveBeenLastCalledWith({
-        description: '<Example>',
+        name: '<Example>',
         op: REACT_MOUNT_OP,
         origin: 'auto.ui.react.profiler',
-        data: { 'ui.component_name': 'Example' },
+        attributes: { 'ui.component_name': 'Example' },
       });
     });
   });
@@ -203,10 +200,10 @@ describe('useProfiler()', () => {
       expect(mockStartChild).toHaveBeenCalledTimes(2);
       expect(mockStartChild).toHaveBeenLastCalledWith(
         expect.objectContaining({
-          description: '<Example>',
+          name: '<Example>',
           op: REACT_RENDER_OP,
           origin: 'auto.ui.react.profiler',
-          data: { 'ui.component_name': 'Example' },
+          attributes: { 'ui.component_name': 'Example' },
         }),
       );
     });