[test] Use internal-test-utils from npm (mui#424)

ssahgal · Jun 11, 2024 · 926162e · 926162e
1 parent d40b500
commit 926162e
Show file tree

Hide file tree

Showing 13 changed files with 105 additions and 175 deletions.
diff --git a/.circleci/config.yml b/.circleci/config.yml
@@ -89,7 +89,7 @@ commands:
                   corepack enable
             - run:
                 name: Prepare playwright hash
-                command: pnpm list --json --filter playwright > /tmp/playwright_info.json
+                command: pnpm list --recursive --json --filter @mui-internal/tests playwright > /tmp/playwright_info.json
             - store_artifacts:
                 name: Debug playwright hash
                 path: /tmp/playwright_info.json
@@ -319,7 +319,7 @@ jobs:
     <<: *default-job
     resource_class: 'medium+'
     docker:
-      - image: mcr.microsoft.com/playwright:v1.43.1-focal
+      - image: mcr.microsoft.com/playwright:v1.44.1-focal
         environment:
           NODE_ENV: development # Needed if playwright is in `devDependencies`
     steps:
@@ -350,7 +350,7 @@ jobs:
   test_profile:
     <<: *default-job
     docker:
-      - image: mcr.microsoft.com/playwright:v1.43.1-focal
+      - image: mcr.microsoft.com/playwright:v1.44.1-focal
         environment:
           NODE_ENV: development # Needed if playwright is in `devDependencies`
     steps:
@@ -378,7 +378,7 @@ jobs:
   test_regressions:
     <<: *default-job
     docker:
-      - image: mcr.microsoft.com/playwright:v1.43.1-focal
+      - image: mcr.microsoft.com/playwright:v1.44.1-focal
         environment:
           NODE_ENV: development # Needed if playwright is in `devDependencies`
     steps:
@@ -395,13 +395,16 @@ jobs:
   test_e2e:
     <<: *default-job
     docker:
-      - image: mcr.microsoft.com/playwright:v1.43.1-focal
+      - image: mcr.microsoft.com/playwright:v1.44.1-focal
         environment:
           NODE_ENV: development # Needed if playwright is in `devDependencies`
     steps:
       - checkout
       - install_js:
           browsers: true
+      - run:
+          name: install Playwright browsers
+          command: pnpm exec playwright install
       - run:
           name: pnpm test:e2e
           command: pnpm test:e2e

diff --git a/docs/package.json b/docs/package.json
@@ -77,7 +77,7 @@
     "@babel/plugin-transform-react-constant-elements": "^7.24.6",
     "@babel/preset-typescript": "^7.24.6",
     "@mui/internal-docs-utils": "^1.0.7",
-    "@mui/internal-test-utils": "https://pkg.csb.dev/mui/material-ui/commit/fb183624/@mui/internal-test-utils",
+    "@mui/internal-test-utils": "1.0.0-dev.20240529-082515-213b5e33ab",
     "@types/autosuggest-highlight": "^3.2.3",
     "@types/chai": "^4.3.16",
     "@types/node": "^18.19.33",
@@ -90,7 +90,6 @@
     "cross-fetch": "^4.0.0",
     "framer-motion": "^11.2.10",
     "marked": "^12.0.2",
-    "playwright": "^1.43.1",
     "prettier": "^3.2.5",
     "serve": "^14.2.3",
     "tailwindcss": "^3.4.3",

diff --git a/package.json b/package.json
@@ -80,13 +80,13 @@
     "@mui/internal-docs-utils": "^1.0.7",
     "@mui/internal-markdown": "^1.0.4",
     "@mui/internal-scripts": "^1.0.9",
-    "@mui/internal-test-utils": "https://pkg.csb.dev/mui/material-ui/commit/fb183624/@mui/internal-test-utils",
+    "@mui/internal-test-utils": "1.0.0-dev.20240529-082515-213b5e33ab",
     "@mui/material": "6.0.0-alpha.10",
     "@mui/monorepo": "github:mui/material-ui#v6.0.0-alpha.10",
     "@mui/utils": "6.0.0-alpha.9",
     "@next/eslint-plugin-next": "^14.2.3",
     "@octokit/rest": "^20.1.1",
-    "@playwright/test": "1.43.1",
+    "@playwright/test": "1.44.1",
     "@types/enzyme": "^3.10.18",
     "@types/fs-extra": "^11.0.4",
     "@types/lodash": "^4.17.4",

diff --git a/packages/mui-base/package.json b/packages/mui-base/package.json
@@ -50,7 +50,7 @@
   },
   "devDependencies": {
     "@mui/internal-babel-macros": "^1.0.1",
-    "@mui/internal-test-utils": "https://pkg.csb.dev/mui/material-ui/commit/fb183624/@mui/internal-test-utils",
+    "@mui/internal-test-utils": "1.0.0-dev.20240529-082515-213b5e33ab",
     "@testing-library/react": "^15.0.7",
     "@testing-library/user-event": "^14.5.2",
     "@types/chai": "^4.3.16",

diff --git a/packages/mui-base/src/NumberField/Decrement/NumberFieldDecrement.test.tsx b/packages/mui-base/src/NumberField/Decrement/NumberFieldDecrement.test.tsx
@@ -1,7 +1,6 @@
 import * as React from 'react';
 import { expect } from 'chai';
-import { fireEvent } from '@testing-library/react';
-import { createRenderer, screen } from '@mui/internal-test-utils';
+import { createRenderer, screen, fireEvent } from '@mui/internal-test-utils';
 import * as NumberField from '@base_ui/react/NumberField';
 import { NumberFieldContext, type NumberFieldContextValue } from '@base_ui/react/NumberField';
 import { CHANGE_VALUE_TICK_DELAY, START_AUTO_CHANGE_DELAY } from '../utils/constants';

diff --git a/packages/mui-base/src/NumberField/Increment/NumberFieldIncrement.test.tsx b/packages/mui-base/src/NumberField/Increment/NumberFieldIncrement.test.tsx
@@ -1,7 +1,6 @@
 import * as React from 'react';
 import { expect } from 'chai';
-import { fireEvent } from '@testing-library/react';
-import { createRenderer, screen } from '@mui/internal-test-utils';
+import { createRenderer, screen, fireEvent } from '@mui/internal-test-utils';
 import * as NumberField from '@base_ui/react/NumberField';
 import { NumberFieldContext, type NumberFieldContextValue } from '@base_ui/react/NumberField';
 import { CHANGE_VALUE_TICK_DELAY, START_AUTO_CHANGE_DELAY } from '../utils/constants';

diff --git a/packages/mui-base/src/NumberField/Input/NumberFieldInput.test.tsx b/packages/mui-base/src/NumberField/Input/NumberFieldInput.test.tsx
@@ -1,9 +1,8 @@
 import * as React from 'react';
 import { expect } from 'chai';
-import { act, createRenderer, screen } from '@mui/internal-test-utils';
+import { act, createRenderer, screen, fireEvent } from '@mui/internal-test-utils';
 import * as NumberField from '@base_ui/react/NumberField';
 import { NumberFieldContext, type NumberFieldContextValue } from '@base_ui/react/NumberField';
-import { fireEvent } from '@testing-library/react';
 import { describeConformance } from '../../../test/describeConformance';
 
 const testContext = {

diff --git a/packages/mui-base/src/NumberField/Root/NumberFieldRoot.test.tsx b/packages/mui-base/src/NumberField/Root/NumberFieldRoot.test.tsx
@@ -1,8 +1,7 @@
 import * as React from 'react';
 import { expect } from 'chai';
 import { spy } from 'sinon';
-import { act, createRenderer, screen } from '@mui/internal-test-utils';
-import { fireEvent } from '@testing-library/react';
+import { act, createRenderer, screen, fireEvent } from '@mui/internal-test-utils';
 import * as NumberFieldBase from '@base_ui/react/NumberField';
 import { describeConformance } from '../../../test/describeConformance';
 
@@ -335,34 +334,34 @@ describe('<NumberField />', () => {
     it('should increment the value by the default `largeStep` prop of 10 while holding the shift key', () => {
       render(<NumberField defaultValue={5} />);
       const input = screen.getByRole('textbox');
-      fireEvent.keyDown(window, { shiftKey: true });
+      fireEvent.keyDown(document.body, { shiftKey: true });
       fireEvent.pointerDown(screen.getByLabelText('Increase'));
       expect(input).to.have.value('20');
     });
 
     it('should decrement the value by the default `largeStep` prop of 10 while holding the shift key', () => {
       render(<NumberField defaultValue={6} />);
       const input = screen.getByRole('textbox');
-      fireEvent.keyDown(window, { shiftKey: true });
+      fireEvent.keyDown(document.body, { shiftKey: true });
       fireEvent.pointerDown(screen.getByLabelText('Decrease'));
       expect(input).to.have.value('0');
     });
 
     it('should use explicit `largeStep` value if provided while holding the shift key', () => {
       render(<NumberField defaultValue={5} largeStep={5} />);
       const input = screen.getByRole('textbox');
-      fireEvent.keyDown(window, { shiftKey: true });
+      fireEvent.keyDown(document.body, { shiftKey: true });
       fireEvent.pointerDown(screen.getByLabelText('Increase'));
       expect(input).to.have.value('10');
     });
 
     it('should not use the `largeStep` prop if no longer holding the shift key', () => {
       render(<NumberField defaultValue={5} largeStep={5} />);
       const input = screen.getByRole('textbox');
-      fireEvent.keyDown(window, { shiftKey: true });
+      fireEvent.keyDown(document.body, { shiftKey: true });
       fireEvent.pointerDown(screen.getByLabelText('Increase'));
       expect(input).to.have.value('10');
-      fireEvent.keyUp(window, { shiftKey: true });
+      fireEvent.keyUp(input, { shiftKey: true });
       fireEvent.pointerDown(screen.getByLabelText('Increase'));
       expect(input).to.have.value('15');
     });
@@ -372,23 +371,23 @@ describe('<NumberField />', () => {
     it('should increment the value by the default `smallStep` prop of 0.1 while holding the alt key', () => {
       render(<NumberField defaultValue={5} />);
       const input = screen.getByRole('textbox');
-      fireEvent.keyDown(window, { altKey: true });
+      fireEvent.keyDown(document.body, { altKey: true });
       fireEvent.pointerDown(screen.getByLabelText('Increase'));
       expect(input).to.have.value('5.1');
     });
 
     it('should decrement the value by the default `smallStep` prop of 0.1 while holding the alt key', () => {
       render(<NumberField defaultValue={6} />);
       const input = screen.getByRole('textbox');
-      fireEvent.keyDown(window, { altKey: true });
+      fireEvent.keyDown(document.body, { altKey: true });
       fireEvent.pointerDown(screen.getByLabelText('Decrease'));
       expect(input).to.have.value('5.9');
     });
 
     it('should use explicit `smallStep` value if provided while holding the alt key', () => {
       render(<NumberField defaultValue={5} smallStep={0.5} />);
       const input = screen.getByRole('textbox');
-      fireEvent.keyDown(window, { altKey: true });
+      fireEvent.keyDown(document.body, { altKey: true });
       fireEvent.pointerDown(screen.getByLabelText('Increase'));
       expect(input).to.have.value('5.5');
     });
@@ -397,10 +396,10 @@ describe('<NumberField />', () => {
       render(<NumberField defaultValue={5} smallStep={0.5} />);
       const input = screen.getByRole('textbox');
       const button = screen.getByLabelText('Increase');
-      fireEvent.keyDown(window, { altKey: true });
+      fireEvent.keyDown(document.body, { altKey: true });
       fireEvent.pointerDown(button);
       expect(input).to.have.value('5.5');
-      fireEvent.keyUp(window, { altKey: false });
+      fireEvent.keyUp(input, { altKey: false });
       fireEvent.pointerDown(button);
       expect(input).to.have.value('6.5');
     });
@@ -519,6 +518,7 @@ describe('<NumberField />', () => {
   it('should allow navigation keys and not prevent their default behavior', () => {
     render(<NumberField />);
     const input = screen.getByRole('textbox') as HTMLInputElement;
+    input.focus();
     fireEvent.change(input, { target: { value: '123' } });
 
     const navigateKeys = ['Backspace', 'Delete', 'ArrowLeft', 'ArrowRight', 'Tab', 'Enter'];

diff --git a/packages/mui-base/src/Tooltip/Provider/TooltipProvider.test.tsx b/packages/mui-base/src/Tooltip/Provider/TooltipProvider.test.tsx
@@ -1,8 +1,7 @@
 import * as React from 'react';
 import * as Tooltip from '@base_ui/react/Tooltip';
-import { createRenderer, act } from '@mui/internal-test-utils';
+import { createRenderer, act, screen, fireEvent } from '@mui/internal-test-utils';
 import { expect } from 'chai';
-import { fireEvent, screen } from '@testing-library/react';
 
 const waitForPosition = async () => act(async () => {});
 

diff --git a/packages/mui-base/src/legacy/useSelect/useSelect.test.tsx b/packages/mui-base/src/legacy/useSelect/useSelect.test.tsx
@@ -1,6 +1,6 @@
 import { expect } from 'chai';
 import sinon from 'sinon';
-import { act, renderHook } from '@testing-library/react';
+import { act, renderHook } from '@mui/internal-test-utils';
 import { useSelect } from './useSelect';
 
 describe('useSelect', () => {

diff --git a/packages/mui-base/src/legacy/useTransition/useTransitionTrigger.test.ts b/packages/mui-base/src/legacy/useTransition/useTransitionTrigger.test.ts
@@ -1,6 +1,5 @@
 import { expect } from 'chai';
-import { renderHook } from '@testing-library/react';
-import { act } from '@mui/internal-test-utils';
+import { act, renderHook } from '@mui/internal-test-utils';
 import { useTransitionTrigger } from './useTransitionTrigger';
 
 describe('useTransitionTrigger', () => {