Jest: Upgrade jest to fix issue with logging scene objects (#1426)

Author: torkelo

package.json

@@ -60,14 +60,14 @@
     "@grafana/eslint-config": "^8.1.0",
     "@grafana/tsconfig": "^1.3.0-rc1",
     "@stylistic/eslint-plugin-ts": "3.1.0",
-    "@swc/core": "^1.2.162",
-    "@swc/jest": "^0.2.36",
+    "@swc/core": "^1.15.24",
+    "@swc/jest": "^0.2.39",
     "@testing-library/dom": "9.3.4",
     "@testing-library/jest-dom": "6.4.2",
     "@testing-library/react": "14.2.1",
     "@testing-library/react-hooks": "8.0.1",
     "@testing-library/user-event": "14.5.2",
-    "@types/jest": "29.5.12",
+    "@types/jest": "30.0.0",
     "@typescript-eslint/eslint-plugin": "^8.34.0",
     "@typescript-eslint/parser": "^8.34.0",
     "auto": "^11.0.7",
@@ -80,9 +80,9 @@
     "eslint-plugin-react": "^7.37.5",
     "eslint-plugin-react-hooks": "^5.2.0",
     "husky": "^8.0.3",
-    "jest": "29.7.0",
-    "jest-environment-jsdom": "29.7.0",
-    "jest-matcher-utils": "29.7.0",
+    "jest": "30.3.0",
+    "jest-environment-jsdom": "30.3.0",
+    "jest-matcher-utils": "30.3.0",
     "lerna": "^9.0.0",
     "lint-staged": "^13.2.0",
     "prettier": "2.5.1",
@@ -91,7 +91,7 @@
     "rollup-plugin-dts": "^6.2.0",
     "rollup-plugin-esbuild": "^6.2.1",
     "rollup-plugin-node-externals": "^8.0.0",
-    "ts-jest": "29.1.2",
+    "ts-jest": "29.4.9",
     "ts-node": "10.9.2",
     "turbo": "^2.5.8",
     "typescript": "^5.4.3"

packages/scenes-app/package.json

@@ -29,7 +29,7 @@
     "@swc/jest": "^0.2.36",
     "@testing-library/jest-dom": "^6.4.2",
     "@testing-library/react": "^12.1.3",
-    "@types/jest": "^29.5.12",
+    "@types/jest": "^30.0.0",
     "@types/node": "^20.11.30",
     "@typescript-eslint/eslint-plugin": "^8.34.0",
     "@typescript-eslint/parser": "^8.34.0",
@@ -43,7 +43,7 @@
     "eslint-plugin-react-hooks": "^5.2.0",
     "eslint-webpack-plugin": "5.0.2",
     "fork-ts-checker-webpack-plugin": "^7.2.0",
-    "jest": "29.7.0",
+    "jest": "30.3.0",
     "prettier": "^2.5.0",
     "raw-loader": "^4.0.2",
     "replace-in-file-webpack-plugin": "^1.0.6",

packages/scenes/package.json

@@ -87,7 +87,7 @@
     "@types/uuid": "8.3.4",
     "eslint": "^9.28.0",
     "i18next-parser": "9.3.0",
-    "jest": "29.7.0",
+    "jest": "30.3.0",
     "jest-canvas-mock": "^2.5.2",
     "react-router-dom": "^6.28.0",
     "rimraf": "^3.0.2",

packages/scenes/src/components/SceneRefreshPicker.test.ts

@@ -58,7 +58,7 @@ describe('SceneRefreshPicker', () => {
       .useFakeTimers({
         doNotFake: ['setTimeout'],
       })
-      .setSystemTime(new Date('2023-01-01'));
+      .setSystemTime(new Date('2023-01-01').valueOf());
   });
 
   it('updates time range on provided interval', async () => {

packages/scenes/src/components/VizPanel/VizPanel.test.tsx

@@ -278,6 +278,15 @@ describe('VizPanel', () => {
         },
       ];
     });
+
+    global.ResizeObserver = class {
+      // eslint-disable-next-line @typescript-eslint/explicit-member-accessibility
+      observe() {}
+      // eslint-disable-next-line @typescript-eslint/explicit-member-accessibility
+      unobserve() {}
+      // eslint-disable-next-line @typescript-eslint/explicit-member-accessibility
+      disconnect() {}
+    };
   });
 
   describe('when activated', () => {
@@ -858,15 +867,6 @@ describe('VizPanel', () => {
     beforeEach(() => {
       panelRenderCount = 0;
       panelProps = undefined;
-
-      global.ResizeObserver = class {
-        // eslint-disable-next-line @typescript-eslint/explicit-member-accessibility
-        observe() {}
-        // eslint-disable-next-line @typescript-eslint/explicit-member-accessibility
-        unobserve() {}
-        // eslint-disable-next-line @typescript-eslint/explicit-member-accessibility
-        disconnect() {}
-      };
     });
 
     let panel: VizPanel<OptionsPlugin1, FieldConfigPlugin1>;
@@ -1067,7 +1067,8 @@ describe('VizPanel', () => {
         expect(panel.state.showMenuAlways).toBe(false);
         render(<panel.Component model={panel} />);
 
-        const menuButton = screen.queryByRole('button', { name: /menu/i });
+        // For some reason queryByRole('button', { name: /menu/i }) is not finding the element, even it's there in the DOM, with title Menu same as the test on above
+        const menuButton = screen.getByTitle('Menu');
         expect(menuButton).toHaveClass('show-on-hover');
       });
     });

packages/scenes/src/core/PanelBuilders/__snapshots__/VizPanelBuilder.test.ts.snap

@@ -1,4 +1,4 @@
-// Jest Snapshot v1, https://goo.gl/fbAQLP
+// Jest Snapshot v1, https://jestjs.io/docs/snapshot-testing
 
 exports[`VizPanelBuilder options and field config standard panels defaults provides barchart defaults 1`] = `
 {

packages/scenes/src/core/SceneTimeRange.test.tsx

@@ -8,7 +8,7 @@ import { SceneReactObject } from '../components/SceneReactObject';
 import { defaultTimeZone as browserTimeZone } from '@grafana/schema';
 
 function simulateDelay(newDateString: string, scene: EmbeddedScene) {
-  jest.setSystemTime(new Date(newDateString));
+  jest.setSystemTime(new Date(newDateString).valueOf());
   scene.activate();
 }
 
@@ -111,14 +111,14 @@ describe('SceneTimeRange', () => {
       to: toUtc('2020-01-02'),
       raw: { from: toUtc('2020-01-01'), to: toUtc('2020-01-02') },
     });
-    expect(stateSpy).toBeCalledTimes(1);
+    expect(stateSpy).toHaveBeenCalledTimes(1);
 
     timeRange.onTimeRangeChange({
       from: toUtc('2020-01-01'),
       to: toUtc('2020-01-02'),
       raw: { from: toUtc('2020-01-01'), to: toUtc('2020-01-02') },
     });
-    expect(stateSpy).toBeCalledTimes(1);
+    expect(stateSpy).toHaveBeenCalledTimes(1);
   });
 
   it('should not allow invalid date values', () => {
@@ -214,7 +214,7 @@ describe('SceneTimeRange', () => {
     const mockedNow = '2021-01-01T10:00:00.000Z';
     beforeAll(() => {
       jest.useFakeTimers();
-      jest.setSystemTime(new Date(mockedNow));
+      jest.setSystemTime(new Date(mockedNow).valueOf());
     });
 
     it('when created should evaluate time range applying the delay value to now', () => {
@@ -298,7 +298,7 @@ describe('SceneTimeRange', () => {
 
     beforeEach(() => {
       jest.useFakeTimers();
-      jest.setSystemTime(new Date(mockedNow));
+      jest.setSystemTime(new Date(mockedNow).valueOf());
     });
 
     it('should NOT invalidate stale time range that does not meet refresh threshold', () => {

packages/scenes/src/querying/__snapshots__/SceneQueryRunner.test.ts.snap

@@ -1,4 +1,4 @@
-// Jest Snapshot v1, https://goo.gl/fbAQLP
+// Jest Snapshot v1, https://jestjs.io/docs/snapshot-testing
 
 exports[`SceneQueryRunner when running query should build DataQueryRequest object 2`] = `
 {

packages/scenes/src/querying/layers/SceneDataLayerBase.test.ts

@@ -24,7 +24,7 @@ describe('SceneDataLayerBase', () => {
 
       layer.activate();
 
-      expect(runLayerSpy).toBeCalledTimes(0);
+      expect(runLayerSpy).toHaveBeenCalledTimes(0);
     });
 
     it('should run query when there is no data', () => {
@@ -35,7 +35,7 @@ describe('SceneDataLayerBase', () => {
       });
       layer.activate();
 
-      expect(runLayerSpy).toBeCalledTimes(1);
+      expect(runLayerSpy).toHaveBeenCalledTimes(1);
     });
 
     it('should not run query there is data', () => {
@@ -53,7 +53,7 @@ describe('SceneDataLayerBase', () => {
 
       layer.activate();
 
-      expect(runLayerSpy).toBeCalledTimes(0);
+      expect(runLayerSpy).toHaveBeenCalledTimes(0);
     });
   });
 
@@ -67,8 +67,8 @@ describe('SceneDataLayerBase', () => {
       });
       layer.activate();
 
-      expect(enableSpy).toBeCalledTimes(1);
-      expect(disableSpy).not.toBeCalled();
+      expect(enableSpy).toHaveBeenCalledTimes(1);
+      expect(disableSpy).not.toHaveBeenCalled();
     });
 
     it('should call onDisable handler when activated', () => {
@@ -82,8 +82,8 @@ describe('SceneDataLayerBase', () => {
 
       deactivate();
 
-      expect(enableSpy).toBeCalledTimes(1);
-      expect(disableSpy).toBeCalledTimes(1);
+      expect(enableSpy).toHaveBeenCalledTimes(1);
+      expect(disableSpy).toHaveBeenCalledTimes(1);
     });
   });
 
@@ -97,8 +97,8 @@ describe('SceneDataLayerBase', () => {
       });
       layer.activate();
 
-      expect(enableSpy).not.toBeCalled();
-      expect(disableSpy).not.toBeCalled();
+      expect(enableSpy).not.toHaveBeenCalled();
+      expect(disableSpy).not.toHaveBeenCalled();
     });
 
     it('should call onDisable handler when activated', () => {
@@ -112,8 +112,8 @@ describe('SceneDataLayerBase', () => {
 
       deactivate();
 
-      expect(enableSpy).not.toBeCalled();
-      expect(disableSpy).toBeCalledTimes(1);
+      expect(enableSpy).not.toHaveBeenCalled();
+      expect(disableSpy).toHaveBeenCalledTimes(1);
     });
   });
 
@@ -140,7 +140,7 @@ describe('SceneDataLayerBase', () => {
       expect(result).toBeDefined();
       expect(result!.data.series).toEqual([]);
       expect(result!.data.state).toEqual(LoadingState.Done);
-      expect(disableSpy).toBeCalledTimes(1);
+      expect(disableSpy).toHaveBeenCalledTimes(1);
     });
   });
 
@@ -157,7 +157,7 @@ describe('SceneDataLayerBase', () => {
 
       layer.activate();
 
-      expect(enableSpy).not.toBeCalled();
+      expect(enableSpy).not.toHaveBeenCalled();
 
       layer.getResultsStream().subscribe((r) => {
         result = r;
@@ -166,7 +166,7 @@ describe('SceneDataLayerBase', () => {
 
       layer.setState({ isEnabled: true });
 
-      expect(enableSpy).toBeCalledTimes(1);
+      expect(enableSpy).toHaveBeenCalledTimes(1);
 
       layer.completeRun();
 

packages/scenes/src/querying/layers/annotations/AnnotationsDataLayer.test.ts

@@ -246,7 +246,7 @@ describe.each(['11.1.2', '11.1.1'])('AnnotationsDataLayer', (v) => {
         expect(layer.state.data?.series).toBeDefined();
         expect(layer.state.data?.series?.[0].length).toBe(5);
 
-        expect(runRequestMock).toBeCalledTimes(2);
+        expect(runRequestMock).toHaveBeenCalledTimes(2);
         const { scopedVars } = sentRequest!;
 
         expect(scopedVars['__sceneObject']).toBeDefined();