Upgrade to ^4.0.7. Fix configuration issues.

Author: renovate[bot]

package.json

@@ -94,7 +94,7 @@
     "@types/yargs": "^17.0.34",
     "@typescript-eslint/parser": "catalog:",
     "@vitejs/plugin-react": "catalog:",
-    "@vitest/browser": "catalog:",
+    "@vitest/browser-playwright": "catalog:",
     "@vitest/coverage-v8": "catalog:",
     "@vvago/vale": "^3.12.0",
     "axe-core": "4.11.0",

packages/eslint-plugin-mui-x/vitest.config.node.mts

@@ -3,5 +3,6 @@ import { defineConfig } from 'vitest/config';
 export default defineConfig({
   test: {
     environment: 'node',
+    maxWorkers: 1,
   },
 });

packages/x-charts-premium/vitest.config.browser.mts

@@ -1,25 +1,16 @@
-/// <reference types="@vitest/browser/providers/playwright" />
-import { mergeConfig } from 'vitest/config';
+import { mergeConfig, defineConfig } from 'vitest/config';
 import sharedConfig from '../../vitest.shared.mts';
 import { getTestName } from '../../scripts/getTestName.mts';
 
-export default mergeConfig(sharedConfig, {
-  test: {
-    name: getTestName(import.meta.url),
-    browser: {
-      enabled: true,
-      instances: [
-        {
-          browser: 'chromium',
-          ...(process.env.PLAYWRIGHT_SERVER_WS
-            ? {
-                connect: {
-                  wsEndpoint: process.env.PLAYWRIGHT_SERVER_WS,
-                },
-              }
-            : {}),
-        },
-      ],
+export default mergeConfig(
+  sharedConfig,
+  defineConfig({
+    test: {
+      name: getTestName(import.meta.url),
+      browser: {
+        enabled: true,
+        instances: [{ browser: 'chromium' }],
+      },
     },
-  },
-});
+  }),
+);

packages/x-charts-pro/vitest.config.browser.mts

@@ -1,25 +1,16 @@
-/// <reference types="@vitest/browser/providers/playwright" />
-import { mergeConfig } from 'vitest/config';
+import { mergeConfig, defineConfig } from 'vitest/config';
 import sharedConfig from '../../vitest.shared.mts';
 import { getTestName } from '../../scripts/getTestName.mts';
 
-export default mergeConfig(sharedConfig, {
-  test: {
-    name: getTestName(import.meta.url),
-    browser: {
-      enabled: true,
-      instances: [
-        {
-          browser: 'chromium',
-          ...(process.env.PLAYWRIGHT_SERVER_WS
-            ? {
-                connect: {
-                  wsEndpoint: process.env.PLAYWRIGHT_SERVER_WS,
-                },
-              }
-            : {}),
-        },
-      ],
+export default mergeConfig(
+  sharedConfig,
+  defineConfig({
+    test: {
+      name: getTestName(import.meta.url),
+      browser: {
+        enabled: true,
+        instances: [{ browser: 'chromium' }],
+      },
     },
-  },
-});
+  }),
+);

packages/x-charts-vendor/vitest.config.browser.mts

@@ -1,18 +1,16 @@
-/// <reference types="@vitest/browser/providers/playwright" />
-import { mergeConfig } from 'vitest/config';
+import { defineConfig, mergeConfig } from 'vitest/config';
 import sharedConfig from '../../vitest.shared.mts';
 import { getTestName } from '../../scripts/getTestName.mts';
 
-export default mergeConfig(sharedConfig, {
-  test: {
-    name: getTestName(import.meta.url),
-    browser: {
-      enabled: true,
-      instances: [
-        {
-          browser: 'chromium',
-        },
-      ],
+export default mergeConfig(
+  sharedConfig,
+  defineConfig({
+    test: {
+      name: getTestName(import.meta.url),
+      browser: {
+        enabled: true,
+        instances: [{ browser: 'chromium' }],
+      },
     },
-  },
-});
+  }),
+);

packages/x-charts/src/hooks/useSeries.test.tsx

@@ -22,9 +22,7 @@ describe('useSeries', () => {
       'It looks like you rendered your component outside of a ChartDataProvider.';
     const errorMessage3 = 'The above error occurred in the <UseSeries> component:';
     const expectedError =
-      reactMajor < 19
-        ? [errorMessage1, errorMessage2, errorMessage3]
-        : [errorMessage1, errorMessage2].join('\n');
+      reactMajor < 19 ? [errorMessage3] : [errorMessage1, errorMessage2].join('\n');
 
     expect(() =>
       render(

packages/x-charts/src/hooks/useSvgRef.test.tsx

@@ -1,5 +1,5 @@
 import * as React from 'react';
-import { ErrorBoundary, createRenderer, reactMajor, screen } from '@mui/internal-test-utils';
+import { ErrorBoundary, createRenderer, screen } from '@mui/internal-test-utils';
 import { isJSDOM } from 'test/utils/skipIf';
 import { useSvgRef } from './useSvgRef';
 import { ChartProvider } from '../context/ChartProvider';
@@ -21,12 +21,7 @@ describe('useSvgRef', () => {
   it.skipIf(!isJSDOM)('should throw an error when parent context not present', () => {
     const errorRef = React.createRef<any>();
 
-    const errorMessages = [
-      'MUI X Charts: Could not find the Chart context.',
-      'It looks like you rendered your component outside of a ChartDataProvider.',
-      'The above error occurred in the <UseSvgRef> component',
-    ];
-    const expectedError = reactMajor < 19 ? errorMessages : errorMessages.slice(0, 2).join('\n');
+    const expectedError = ['The above error occurred in the <UseSvgRef> component'];
 
     expect(() =>
       render(

packages/x-charts/vitest.config.browser.mts

@@ -1,25 +1,16 @@
-/// <reference types="@vitest/browser/providers/playwright" />
-import { mergeConfig } from 'vitest/config';
+import { mergeConfig, defineConfig } from 'vitest/config';
 import sharedConfig from '../../vitest.shared.mts';
 import { getTestName } from '../../scripts/getTestName.mts';
 
-export default mergeConfig(sharedConfig, {
-  test: {
-    name: getTestName(import.meta.url),
-    browser: {
-      enabled: true,
-      instances: [
-        {
-          browser: 'chromium',
-          ...(process.env.PLAYWRIGHT_SERVER_WS
-            ? {
-                connect: {
-                  wsEndpoint: process.env.PLAYWRIGHT_SERVER_WS,
-                },
-              }
-            : {}),
-        },
-      ],
+export default mergeConfig(
+  sharedConfig,
+  defineConfig({
+    test: {
+      name: getTestName(import.meta.url),
+      browser: {
+        enabled: true,
+        instances: [{ browser: 'chromium' }],
+      },
     },
-  },
-});
+  }),
+);

packages/x-data-grid-premium/src/tests/columns.DataGridPremium.test.tsx

@@ -9,7 +9,7 @@ describe('<DataGridPremium /> - Columns', () => {
   describe('resizing', () => {
     // https://github.com/mui/mui-x/issues/10078
     // Needs layout
-    it.skipIf(isJSDOM)('should properly resize aggregated column', () => {
+    it.skipIf(isJSDOM)('should properly resize aggregated column', async () => {
       render(
         <div style={{ width: 300, height: 300 }}>
           <DataGridPremium
@@ -30,6 +30,9 @@ describe('<DataGridPremium /> - Columns', () => {
         </div>,
       );
 
+      // Fixes act warning
+      await act(() => Promise.resolve());
+
       const separator = document.querySelector(`.${gridClasses['columnSeparator--resizable']}`)!;
       fireEvent.mouseDown(separator, { clientX: 100 });
       fireEvent.mouseMove(separator, { clientX: 150, buttons: 1 });

packages/x-data-grid-premium/src/tests/rowSpanning.DataGridPremium.test.tsx

@@ -1,4 +1,4 @@
-import { createRenderer } from '@mui/internal-test-utils';
+import { act, createRenderer } from '@mui/internal-test-utils';
 import { DataGridPremium, DataGridPremiumProps } from '@mui/x-data-grid-premium';
 import { isJSDOM } from 'test/utils/skipIf';
 
@@ -106,7 +106,7 @@ describe('<DataGridPremium /> - Row spanning', () => {
   }
 
   // See https://github.com/mui/mui-x/issues/14691
-  it.skipIf(isJSDOM)('should not throw when initializing an aggregation model', () => {
+  it.skipIf(isJSDOM)('should not throw when initializing an aggregation model', async () => {
     expect(() =>
       render(
         <TestDataGrid
@@ -121,5 +121,8 @@ describe('<DataGridPremium /> - Row spanning', () => {
         />,
       ),
     ).not.toErrorDev();
+
+    // Fixes act warning
+    await act(() => Promise.resolve());
   });
 });