tests: bump jest version to 30.x

CLAUDE.md

@@ -42,14 +42,14 @@ If builds behave unexpectedly, clear the Nx cache: `rm -rf .nx/cache`
 pnpm run test-jest                                          # All JSDOM tests
 
 # Single file/pattern — invoke Jest directly.
-# Note: this repo currently uses Jest 29.x, where the flag is --testPathPattern (singular).
-pnpm exec jest --no-coverage --runInBand --selectProjects jsdom-tests --testPathPattern "<pattern>"
+# Note: this repo uses Jest 30.x, where the flag is --testPathPatterns (plural).
+pnpm exec jest --no-coverage --runInBand --selectProjects jsdom-tests --testPathPatterns "<pattern>"
 
 # Watch mode for a single file/pattern:
-pnpm exec jest --watch --no-coverage --selectProjects jsdom-tests --testPathPattern "<pattern>"
+pnpm exec jest --watch --no-coverage --selectProjects jsdom-tests --testPathPatterns "<pattern>"
 ```
 
-Example: `pnpm exec jest --no-coverage --runInBand --selectProjects jsdom-tests --testPathPattern "js/__internal/grids/data_grid/ai_assistant/commands/__tests__/summary.test.ts"`
+Example: `pnpm exec jest --no-coverage --runInBand --selectProjects jsdom-tests --testPathPatterns "js/__internal/grids/data_grid/ai_assistant/commands/__tests__/summary.test.ts"`
 
 Jest tests for grid components live under `js/__internal/grids/` — typically in `__tests__/` subdirectories alongside the source (in `grid_core/`, `data_grid/`, and `tree_list/`).
 

apps/demos/package.json

@@ -116,7 +116,7 @@
         "@vue/eslint-config-typescript": "12.0.0",
         "@vue/tsconfig": "0.9.1",
         "axe-core": "catalog:",
-        "babel-jest": "29.7.0",
+        "babel-jest": "30.4.1",
         "consola": "3.4.2",
         "cookie-parser": "1.4.7",
         "cross-env": "7.0.3",
@@ -137,8 +137,8 @@
         "glob": "11.1.0",
         "globals": "catalog:",
         "http-server": "14.1.1",
-        "jest": "29.7.0",
-        "jest-environment-node": "29.7.0",
+        "jest": "30.4.2",
+        "jest-environment-node": "30.4.1",
         "lodash": "4.18.1",
         "looks-same": "7.3.0",
         "minimist": "1.2.8",

jest.config.base.js

@@ -9,7 +9,9 @@ module.exports = {
       },
     ]
   },
-  testURL: 'http://localhost',
+  testEnvironmentOptions: {
+    url: 'http://localhost',
+  },
   testRegex: "(\\.|/)(test|spec)\\.(jsx?|tsx?)$",
   moduleFileExtensions: [
     "ts",

package.json

@@ -33,7 +33,7 @@
     "@nx/devkit": "23.0.1",
     "@nx/jest": "23.0.1",
     "@nx/js": "23.0.1",
-    "@types/jest": "29.5.14",
+    "@types/jest": "30.0.0",
     "@types/node": "catalog:tools",
     "@types/shelljs": "0.8.15",
     "axe-core": "catalog:",
@@ -42,7 +42,7 @@
     "devextreme-internal-tools": "catalog:tools",
     "devextreme-metadata": "workspace:*",
     "husky": "8.0.3",
-    "jest": "29.7.0",
+    "jest": "30.4.2",
     "lint-staged": "14.0.1",
     "nx": "23.0.1",
     "shelljs": "0.8.5",

packages/devextreme-monorepo-tools/package.json

@@ -6,11 +6,11 @@
     "tar-fs": "3.1.2"
   },
   "devDependencies": {
-    "@types/jest": "29.5.14",
+    "@types/jest": "30.0.0",
     "@types/node": "catalog:tools",
     "@types/shelljs": "0.8.15",
     "@types/tar-fs": "2.0.4",
-    "ts-jest": "29.1.3",
+    "ts-jest": "29.4.12",
     "typescript": "catalog:tools"
   }
 }

packages/devextreme-react/jest.config.js

@@ -5,6 +5,5 @@ const packageName = pack.name;
 
 module.exports = {
   ...base,
-  name: packageName,
   displayName: packageName,
 };

packages/devextreme-react/package.json

@@ -72,10 +72,10 @@
     "@types/react": "18.3.28",
     "@types/react-dom": "18.3.7",
     "devextreme-metadata": "workspace:*",
-    "jest-environment-jsdom": "29.7.0",
+    "jest-environment-jsdom": "30.4.1",
     "react": "18.3.1",
     "react-dom": "18.3.1",
-    "ts-jest": "29.1.3",
+    "ts-jest": "29.4.12",
     "typescript": "4.9.5",
     "eslint": "catalog:",
     "@babel/eslint-parser": "catalog:",

packages/devextreme-react/src/core/__tests__/component.test.tsx

@@ -411,7 +411,7 @@ describe('disposing', () => {
 
     component.unmount();
 
-    expect(Widget.dispose).toBeCalled();
+    expect(Widget.dispose).toHaveBeenCalled();
   });
 
   it('fires dxremove', () => {

packages/devextreme-react/src/core/__tests__/props-updating.test.tsx

@@ -1021,23 +1021,23 @@ describe('cfg-component option control', () => {
     // simulate option changing in jQuery control
     optionsManager.onOptionChanged({ name: 'value', value: 2, fullName: 'value' });
     // add guards for restore value
-    expect((optionsManager as any).addGuard).toBeCalled();
+    expect((optionsManager as any).addGuard).toHaveBeenCalled();
     // but no call it
-    expect((optionsManager as any).setValue).not.toBeCalled();
+    expect((optionsManager as any).setValue).not.toHaveBeenCalled();
     // re-render container. Unschedule guards and wait template render for schedule it back
     rerender(<TestContainer value={2} />);
-    expect(OptionsManagerModule.scheduleGuards).not.toBeCalled();
-    expect(OptionsManagerModule.unscheduleGuards).toBeCalled();
-    expect((optionsManager as any).setValue).not.toBeCalled();
+    expect(OptionsManagerModule.scheduleGuards).not.toHaveBeenCalled();
+    expect(OptionsManagerModule.unscheduleGuards).toHaveBeenCalled();
+    expect((optionsManager as any).setValue).not.toHaveBeenCalled();
     jest.runAllTimers();
     // simulate Request Animation Frame for template re-render
     act(() => renderTemplate());
     // guards are scheduled
-    expect(OptionsManagerModule.scheduleGuards).toBeCalled();
+    expect(OptionsManagerModule.scheduleGuards).toHaveBeenCalled();
     const updatedConfig = { ...config, options: { value: 2 } };
     // value changed and options manager set value and remove scheduled guard
     optionsManager.update(updatedConfig, {});
-    expect((optionsManager as any).setValue).toBeCalled();
+    expect((optionsManager as any).setValue).toHaveBeenCalled();
     jest.runAllTimers();
     expect((optionsManager as any).setValue).toHaveBeenCalledTimes(1);
   });
@@ -1380,7 +1380,7 @@ describe('onXXXChange', () => {
           onTextChange={onPropChange}
         />,
       );
-      expect(onPropChange).not.toBeCalled();
+      expect(onPropChange).not.toHaveBeenCalled();
 
       const sampleProps = { text: '1' };
       rerender(
@@ -1389,15 +1389,15 @@ describe('onXXXChange', () => {
           onTextChange={onPropChange}
         />,
       );
-      expect(onPropChange).not.toBeCalled();
+      expect(onPropChange).not.toHaveBeenCalled();
 
       fireOptionChange('text', '2');
       expect(onPropChange).toHaveBeenCalledTimes(1);
-      expect(onPropChange).toBeCalledWith('2');
+      expect(onPropChange).toHaveBeenCalledWith('2');
 
       fireOptionChange('text', '3');
       expect(onPropChange).toHaveBeenCalledTimes(2);
-      expect(onPropChange).toBeCalledWith('3');
+      expect(onPropChange).toHaveBeenCalledWith('3');
     });
 
     it('is not called if received value is being modified', () => {
@@ -1454,11 +1454,11 @@ describe('onXXXChange', () => {
           complexOption={{ text: '0', onTextChange: onPropChange }}
         />,
       );
-      expect(onPropChange).not.toBeCalled();
+      expect(onPropChange).not.toHaveBeenCalled();
 
       fireOptionChange('complexOption.text', '1');
       expect(onPropChange).toHaveBeenCalledTimes(1);
-      expect(onPropChange).toBeCalledWith('1');
+      expect(onPropChange).toHaveBeenCalledWith('1');
     });
 
     it('is called on component changes array option', () => {
@@ -1472,12 +1472,12 @@ describe('onXXXChange', () => {
           ]}
         />,
       );
-      expect(onFirstPropChange).not.toBeCalled();
-      expect(onSecondPropChange).not.toBeCalled();
+      expect(onFirstPropChange).not.toHaveBeenCalled();
+      expect(onSecondPropChange).not.toHaveBeenCalled();
 
       fireOptionChange('arrayOption[0].text', '1');
       expect(onFirstPropChange).toHaveBeenCalledTimes(1);
-      expect(onSecondPropChange).not.toBeCalled();
+      expect(onSecondPropChange).not.toHaveBeenCalled();
       expect(onFirstPropChange).toHaveBeenCalledWith('1');
 
       fireOptionChange('arrayOption[1].text', '2');
@@ -1518,19 +1518,19 @@ describe('onXXXChange', () => {
 
       fireOptionChange('items[1].a', 1);
       expect(onCollectionPropChange).toHaveBeenCalledTimes(1);
-      expect(onCollectionPropChange).toBeCalledWith(1);
+      expect(onCollectionPropChange).toHaveBeenCalledWith(1);
 
       fireOptionChange('items[1].subItems[0].a', 2);
       expect(onSubCollectionPropChange).toHaveBeenCalledTimes(1);
-      expect(onSubCollectionPropChange).toBeCalledWith(2);
+      expect(onSubCollectionPropChange).toHaveBeenCalledWith(2);
 
       fireOptionChange('nestedOption.value', '3');
       expect(onNestedPropChange).toHaveBeenCalledTimes(1);
-      expect(onNestedPropChange).toBeCalledWith('3');
+      expect(onNestedPropChange).toHaveBeenCalledWith('3');
 
       fireOptionChange('items[1].nestedOption.value', '4');
       expect(onSubNestedPropChange).toHaveBeenCalledTimes(1);
-      expect(onSubNestedPropChange).toBeCalledWith('4');
+      expect(onSubNestedPropChange).toHaveBeenCalledWith('4');
     });
 
     it('is called on nested option changed (options in custom configuration components)', () => {
@@ -1574,19 +1574,19 @@ describe('onXXXChange', () => {
 
       fireOptionChange('items[1].a', 1);
       expect(onCollectionPropChange).toHaveBeenCalledTimes(1);
-      expect(onCollectionPropChange).toBeCalledWith(1);
+      expect(onCollectionPropChange).toHaveBeenCalledWith(1);
 
       fireOptionChange('items[1].subItems[0].a', 2);
       expect(onSubCollectionPropChange).toHaveBeenCalledTimes(1);
-      expect(onSubCollectionPropChange).toBeCalledWith(2);
+      expect(onSubCollectionPropChange).toHaveBeenCalledWith(2);
 
       fireOptionChange('nestedOption.value', '3');
       expect(onNestedPropChange).toHaveBeenCalledTimes(1);
-      expect(onNestedPropChange).toBeCalledWith('3');
+      expect(onNestedPropChange).toHaveBeenCalledWith('3');
 
       fireOptionChange('items[1].nestedOption.value', '4');
       expect(onSubNestedPropChange).toHaveBeenCalledTimes(1);
-      expect(onSubNestedPropChange).toBeCalledWith('4');
+      expect(onSubNestedPropChange).toHaveBeenCalledWith('4');
     });
 
     it('is called on nested array option changed', () => {
@@ -1709,7 +1709,7 @@ describe('onXXXChange', () => {
           <div ref={ref} />
         </TestComponent>,
       );
-      expect(onPropChange).not.toBeCalled();
+      expect(onPropChange).not.toHaveBeenCalled();
       Widget.option.mockImplementation(
         (name: string) => {
           if (name === 'text') {
@@ -1751,7 +1751,7 @@ describe('onXXXChange', () => {
           onTextChange={onPropChange}
         />,
       );
-      expect(onPropChange).not.toBeCalled();
+      expect(onPropChange).not.toHaveBeenCalled();
       Widget.option.mockImplementation(
         (name: string) => {
           if (name === 'text') {

packages/devextreme-react/src/core/__tests__/template.test.tsx

@@ -304,7 +304,7 @@ function testTemplateOption(testedOption: string) {
     act(() => { renderItemTemplate({ text: 'with data' }, undefined, undefined, onRendered); });
 
     jest.runAllTimers();
-    expect(onRendered).toBeCalled();
+    expect(onRendered).toHaveBeenCalled();
   });
 
   it('renders empty template without errors', () => {
@@ -374,7 +374,7 @@ describe('function template', () => {
       </ComponentWithTemplates>,
     );
     act(() => { renderItemTemplate('with data', ref.current); });
-    expect(itemRender).toBeCalled();
+    expect(itemRender).toHaveBeenCalled();
 
     expect(container.querySelector('.template')?.outerHTML).toBe('<div class="template">Template with data</div>');
   });
@@ -394,7 +394,7 @@ describe('function template', () => {
       </ComponentWithTemplates>,
     );
     act(() => { renderItemTemplate(undefined, ref.current, 5); });
-    expect(itemRender).toBeCalled();
+    expect(itemRender).toHaveBeenCalled();
     expect(container.querySelector('.template')?.outerHTML).toBe('<div class="template">Index 5</div>');
   });
 });

packages/devextreme-scss/package.json

@@ -13,7 +13,7 @@
     "stylelint": "catalog:",
     "stylelint-config-standard-scss": "14.0.0",
     "stylelint-scss": "6.10.0",
-    "ts-jest": "29.1.2"
+    "ts-jest": "29.4.12"
   },
   "scripts": {
     "build": "pnpm --workspace-root nx build devextreme-scss",

packages/devextreme-themebuilder/package.json

@@ -53,7 +53,7 @@
     "immutable": "5.1.9",
     "precinct": "11.0.5",
     "sinon": "18.0.1",
-    "ts-jest": "29.1.2",
+    "ts-jest": "29.4.12",
     "ts-node": "10.9.2",
     "typescript": "4.9.5"
   }

packages/devextreme-themebuilder/tests/metadata/generator.test.ts

@@ -143,7 +143,7 @@ $base-color: rgb(0,170,0);
 `;
 
   test('parse items with duplicates', () => {
-    expect(() => MetadataGenerator.getMetaItems(sample)).toThrowError('$slideout-background has duplicated comment');
+    expect(() => MetadataGenerator.getMetaItems(sample)).toThrow('$slideout-background has duplicated comment');
   });
 });
 
@@ -156,7 +156,7 @@ $slideout-background: #000;
 `;
 
   test('parse items with duplicates', () => {
-    expect(() => MetadataGenerator.getMetaItems(sample)).toThrowError('$slideout-background value has no \'!default\' flag');
+    expect(() => MetadataGenerator.getMetaItems(sample)).toThrow('$slideout-background value has no \'!default\' flag');
   });
 });
 

packages/devextreme-themebuilder/tests/modules/compile-manager.test.ts

@@ -118,7 +118,7 @@ describe('Compile manager - integration test on test sass', () => {
     return expect(manager.compile({
       makeSwatch: true,
       outColorScheme: 'error for sass compiler :)',
-    })).rejects.toThrowError(Error);
+    })).rejects.toThrow(Error);
   });
 
   test('compile test bundle with removeExternalResources option', async () => {

packages/devextreme-themebuilder/tests/modules/logger.test.ts

@@ -21,22 +21,22 @@ describe('Logger tests', () => {
   test('No logging when THEMEBUILDER_DEBUG is not defined', () => {
     console.log = jest.fn();
     log('test message');
-    expect(console.log).not.toBeCalled();
+    expect(console.log).not.toHaveBeenCalled();
   });
 
   test('Logging when THEMEBUILDER_DEBUG is defined', () => {
     process.env.THEMEBUILDER_DEBUG = '';
 
     log('test message');
-    expect(console.log).toBeCalled();
-    expect(console.log).toBeCalledWith('1985-12-03T00:00:00.000Z: test message');
+    expect(console.log).toHaveBeenCalled();
+    expect(console.log).toHaveBeenCalledWith('1985-12-03T00:00:00.000Z: test message');
   });
 
   test('Logging with additional info', () => {
     process.env.THEMEBUILDER_DEBUG = '';
 
     log('test message', { data: '123' });
-    expect(console.log).toBeCalled();
-    expect(console.log).toBeCalledWith('1985-12-03T00:00:00.000Z: test message: {\n  "data": "123"\n}');
+    expect(console.log).toHaveBeenCalled();
+    expect(console.log).toHaveBeenCalledWith('1985-12-03T00:00:00.000Z: test message: {\n  "data": "123"\n}');
   });
 });

packages/devextreme-themebuilder/tests/modules/widgets-handler.test.ts

@@ -72,17 +72,17 @@ describe('Widgets handler tests', () => {
     const widgetsHandler = new WidgetsHandler([], '/path/dx.light.scss', {});
     await widgetsHandler.getIndexContent();
 
-    expect(fs.promises.readFile).toBeCalledTimes(1);
-    expect(fs.promises.readFile).toBeCalledWith(join('/', 'widgets', 'generic', '_index.scss'));
+    expect(fs.promises.readFile).toHaveBeenCalledTimes(1);
+    expect(fs.promises.readFile).toHaveBeenCalledWith(join('/', 'widgets', 'generic', '_index.scss'));
     (fs.promises.readFile as jest.Mock).mockClear();
   });
 
   test('getIndexContent (material)', async () => {
     const widgetsHandler = new WidgetsHandler([], '/path/dx.material.blue.light.scss', {});
     await widgetsHandler.getIndexContent();
 
-    expect(fs.promises.readFile).toBeCalledTimes(1);
-    expect(fs.promises.readFile).toBeCalledWith(join('/', 'widgets', 'material', '_index.scss'));
+    expect(fs.promises.readFile).toHaveBeenCalledTimes(1);
+    expect(fs.promises.readFile).toHaveBeenCalledWith(join('/', 'widgets', 'material', '_index.scss'));
     (fs.promises.readFile as jest.Mock).mockClear();
   });
 

packages/devextreme-vue/jest.config.js

@@ -5,7 +5,6 @@ const packageName = pack.name;
 
 module.exports = {
   ...base,
-  name: packageName,
   displayName: packageName,
   moduleNameMapper: {
     "^vue$": "vue/dist/vue.cjs",