Skip to content

Commit 1fd0dec

Browse files
committed
Fix errors
1 parent 36c6b28 commit 1fd0dec

File tree

42 files changed

+243
-191
lines changed

Some content is hidden

Large Commits have some content hidden by default. Use the searchbox below for content that may be hidden.

42 files changed

+243
-191
lines changed

packages-internal/test-utils/src/mochaHooks.test.js

+1
Original file line numberDiff line numberDiff line change
@@ -83,6 +83,7 @@ describe('mochaHooks', () => {
8383
// not wrapped in act()
8484
unsafeSetState(1);
8585
// make sure effects are flushed
86+
// eslint-disable-next-line testing-library/no-unnecessary-act
8687
act(() => {});
8788
});
8889

packages/mui-base/src/Button/Button.test.tsx

+7-13
Original file line numberDiff line numberDiff line change
@@ -67,9 +67,7 @@ describe('<Button />', () => {
6767
const { getByRole } = render(<Button focusableWhenDisabled disabled />);
6868

6969
const button = getByRole('button');
70-
act(() => {
71-
button.focus();
72-
});
70+
button.focus();
7371

7472
expect(document.activeElement).to.equal(button);
7573
});
@@ -83,14 +81,12 @@ describe('<Button />', () => {
8381
const button = getByRole('button');
8482
act(() => {
8583
button.focus();
86-
});
87-
88-
act(() => {
8984
button.click();
90-
fireEvent.keyDown(button, { key: 'Enter' });
91-
fireEvent.keyUp(button, { key: ' ' });
9285
});
9386

87+
fireEvent.keyDown(button, { key: 'Enter' });
88+
fireEvent.keyUp(button, { key: ' ' });
89+
9490
expect(handleClick.callCount).to.equal(0);
9591
});
9692
});
@@ -129,14 +125,12 @@ describe('<Button />', () => {
129125
const button = getByRole('button');
130126
act(() => {
131127
button.focus();
132-
});
133-
134-
act(() => {
135128
button.click();
136-
fireEvent.keyDown(button, { key: 'Enter' });
137-
fireEvent.keyUp(button, { key: ' ' });
138129
});
139130

131+
fireEvent.keyDown(button, { key: 'Enter' });
132+
fireEvent.keyUp(button, { key: ' ' });
133+
140134
expect(handleClick.callCount).to.equal(0);
141135
});
142136
});

packages/mui-base/src/ClickAwayListener/ClickAwayListener.test.js

+1
Original file line numberDiff line numberDiff line change
@@ -25,6 +25,7 @@ describe('<ClickAwayListener />', () => {
2525
* React bug: https://github.com/facebook/react/issues/20074
2626
*/
2727
function render(...args) {
28+
// eslint-disable-next-line testing-library/render-result-naming-convention
2829
const result = clientRender(...args);
2930
clock.tick(0);
3031
return result;

packages/mui-base/src/Dropdown/Dropdown.test.tsx

+1
Original file line numberDiff line numberDiff line change
@@ -22,6 +22,7 @@ describe('<Dropdown />', () => {
2222
element: React.ReactElement<any, string | React.JSXElementConstructor<any>>,
2323
options?: RenderOptions,
2424
): Promise<MuiRenderResult> {
25+
// eslint-disable-next-line testing-library/render-result-naming-convention
2526
const rendered = internalRender(element, options);
2627
await flushMicrotasks();
2728
return rendered;

packages/mui-base/src/Menu/Menu.test.tsx

+1
Original file line numberDiff line numberDiff line change
@@ -32,6 +32,7 @@ describe('<Menu />', () => {
3232
element: React.ReactElement<any, string | React.JSXElementConstructor<any>>,
3333
options?: RenderOptions,
3434
): Promise<MuiRenderResult> {
35+
// eslint-disable-next-line testing-library/render-result-naming-convention
3536
const rendered = internalRender(element, options);
3637
await flushMicrotasks();
3738
return rendered;

packages/mui-base/src/MenuButton/MenuButton.test.tsx

+1-1
Original file line numberDiff line numberDiff line change
@@ -98,7 +98,7 @@ describe('<MenuButton />', () => {
9898
button.focus();
9999
});
100100

101-
expect(document.activeElement).to.equal(button);
101+
expect(button).toHaveFocus();
102102
});
103103
});
104104

packages/mui-base/src/Select/Select.test.tsx

+13-11
Original file line numberDiff line numberDiff line change
@@ -9,6 +9,7 @@ import {
99
MuiRenderResult,
1010
RenderOptions,
1111
flushMicrotasks,
12+
within,
1213
} from '@mui/internal-test-utils';
1314
import userEvent from '@testing-library/user-event';
1415
import { Select, SelectListboxSlotProps, selectClasses } from '@mui/base/Select';
@@ -28,6 +29,7 @@ describe('<Select />', () => {
2829
element: React.ReactElement<any, string | React.JSXElementConstructor<any>>,
2930
options?: RenderOptions,
3031
): Promise<MuiRenderResult> {
32+
// eslint-disable-next-line testing-library/render-result-naming-convention
3133
const rendered = internalRender(element, options);
3234
await flushMicrotasks();
3335
return rendered;
@@ -918,15 +920,15 @@ describe('<Select />', () => {
918920
});
919921

920922
it('renders a zero-width space when there is no selected value nor placeholder and renderValue is not provided', async () => {
921-
const { getByRole } = await render(
923+
await render(
922924
<Select>
923925
<Option value={1}>One</Option>
924926
<Option value={2}>Two</Option>
925927
</Select>,
926928
);
927929

928-
const select = getByRole('combobox');
929-
const zws = select.querySelector('.notranslate');
930+
const select = screen.getByRole('combobox');
931+
const zws = within(select).getByText('​'); // zero-width space
930932

931933
expect(zws).not.to.equal(null);
932934
});
@@ -1160,7 +1162,7 @@ describe('<Select />', () => {
11601162
);
11611163

11621164
const input = getAllByRole('textbox')[0];
1163-
expect(document.activeElement).to.equal(input);
1165+
expect(input).toHaveFocus();
11641166
});
11651167

11661168
it('scrolls to initially highlighted option after opening', async function test() {
@@ -1219,7 +1221,7 @@ describe('<Select />', () => {
12191221
);
12201222

12211223
const select = getByRole('combobox');
1222-
expect(document.activeElement).to.equal(select);
1224+
expect(select).toHaveFocus();
12231225
});
12241226
});
12251227

@@ -1346,15 +1348,15 @@ describe('<Select />', () => {
13461348
describe('browser autofill', () => {
13471349
it('sets value and calls external onChange when browser autofills', async () => {
13481350
const onChangeHandler = spy();
1349-
const { container } = await render(
1351+
await render(
13501352
<Select onChange={onChangeHandler} defaultValue="germany" autoComplete="country">
13511353
<Option value="france">France</Option>
13521354
<Option value="germany">Germany</Option>
13531355
<Option value="china">China</Option>
13541356
</Select>,
13551357
);
13561358

1357-
const hiddenInput = container.querySelector('[autocomplete="country"]');
1359+
const hiddenInput = screen.getByRole('textbox', { hidden: true });
13581360

13591361
expect(hiddenInput).not.to.eq(null);
13601362
expect(hiddenInput).to.have.value('germany');
@@ -1372,15 +1374,15 @@ describe('<Select />', () => {
13721374

13731375
it('does not set value when browser autofills invalid value', async () => {
13741376
const onChangeHandler = spy();
1375-
const { container } = await render(
1377+
await render(
13761378
<Select onChange={onChangeHandler} defaultValue="germany" autoComplete="country">
13771379
<Option value="france">France</Option>
13781380
<Option value="germany">Germany</Option>
13791381
<Option value="china">China</Option>
13801382
</Select>,
13811383
);
13821384

1383-
const hiddenInput = container.querySelector('[autocomplete="country"]');
1385+
const hiddenInput = screen.getByRole('textbox', { hidden: true });
13841386

13851387
expect(hiddenInput).not.to.eq(null);
13861388
expect(hiddenInput).to.have.value('germany');
@@ -1397,15 +1399,15 @@ describe('<Select />', () => {
13971399

13981400
it('clears value and calls external onChange when browser clears autofill', async () => {
13991401
const onChangeHandler = spy();
1400-
const { container } = await render(
1402+
await render(
14011403
<Select onChange={onChangeHandler} defaultValue="germany" autoComplete="country">
14021404
<Option value="france">France</Option>
14031405
<Option value="germany">Germany</Option>
14041406
<Option value="china">China</Option>
14051407
</Select>,
14061408
);
14071409

1408-
const hiddenInput = container.querySelector('[autocomplete="country"]');
1410+
const hiddenInput = screen.getByRole('textbox', { hidden: true });
14091411

14101412
expect(hiddenInput).not.to.eq(null);
14111413
expect(hiddenInput).to.have.value('germany');

packages/mui-base/src/Snackbar/Snackbar.test.tsx

+1
Original file line numberDiff line numberDiff line change
@@ -18,6 +18,7 @@ describe('<Snackbar />', () => {
1818
* React bug: https://github.com/facebook/react/issues/20074
1919
*/
2020
function render(...args: [React.ReactElement<any>]) {
21+
// eslint-disable-next-line testing-library/render-result-naming-convention
2122
const result = clientRender(...args);
2223
clock.tick(0);
2324
return result;

packages/mui-base/src/Unstable_NumberInput/NumberInput.test.tsx

+8-10
Original file line numberDiff line numberDiff line change
@@ -357,21 +357,21 @@ describe('<NumberInput />', () => {
357357
const incrementButton = getByTestId('increment-btn');
358358
const decrementButton = getByTestId('decrement-btn');
359359

360-
expect(document.activeElement).to.equal(document.body);
360+
expect(document.body).toHaveFocus();
361361

362362
await userEvent.click(incrementButton);
363363

364-
expect(document.activeElement).to.equal(input);
364+
expect(input).toHaveFocus();
365365

366366
act(() => {
367367
input.blur();
368368
});
369369

370-
expect(document.activeElement).to.equal(document.body);
370+
expect(document.body).toHaveFocus();
371371

372372
await userEvent.click(decrementButton);
373373

374-
expect(document.activeElement).to.equal(input);
374+
expect(input).toHaveFocus();
375375
});
376376
});
377377

@@ -554,13 +554,13 @@ describe('<NumberInput />', () => {
554554
const { getByRole } = render(<NumberInput />);
555555

556556
const input = getByRole('textbox') as HTMLInputElement;
557-
expect(document.activeElement).to.equal(document.body);
557+
expect(document.body).toHaveFocus();
558558

559559
await userEvent.keyboard('[Tab]');
560-
expect(document.activeElement).to.equal(input);
560+
expect(input).toHaveFocus();
561561

562562
await userEvent.keyboard('[Tab]');
563-
expect(document.activeElement).to.equal(document.body);
563+
expect(document.body).toHaveFocus();
564564
});
565565
});
566566

@@ -600,9 +600,7 @@ describe('<NumberInput />', () => {
600600
const input = getByRole('textbox') as HTMLInputElement;
601601
const button = getByTestId('button') as HTMLButtonElement;
602602

603-
act(() => {
604-
fireEvent.click(button);
605-
});
603+
fireEvent.click(button);
606604

607605
await userEvent.click(input);
608606
expect(input.value).to.equal('20');

packages/mui-base/src/Unstable_Popup/Popup.test.tsx

+1
Original file line numberDiff line numberDiff line change
@@ -52,6 +52,7 @@ describe('<Popup />', () => {
5252
describeConformanceUnstyled(<Popup {...defaultProps} />, () => ({
5353
inheritComponent: 'div',
5454
render: async (...renderArgs) => {
55+
// eslint-disable-next-line testing-library/render-result-naming-convention
5556
const result = render(...renderArgs);
5657
await waitForPosition();
5758

packages/mui-base/src/unstable_useNumberInput/useNumberInput.test.tsx

+6-6
Original file line numberDiff line numberDiff line change
@@ -132,7 +132,7 @@ describe('useNumberInput', () => {
132132
expect(handleChange.callCount).to.equal(0);
133133

134134
await userEvent.keyboard('[Tab]');
135-
expect(document.activeElement).to.equal(document.body);
135+
expect(document.body).toHaveFocus();
136136

137137
expect(handleChange.callCount).to.equal(1);
138138
expect(handleChange.args[0][1]).to.equal(34);
@@ -180,7 +180,7 @@ describe('useNumberInput', () => {
180180
await userEvent.keyboard('9');
181181

182182
await userEvent.keyboard('[Tab]');
183-
expect(document.activeElement).to.equal(document.body);
183+
expect(document.body).toHaveFocus();
184184

185185
expect(handleChange.args[0][1]).to.equal(5);
186186
});
@@ -204,7 +204,7 @@ describe('useNumberInput', () => {
204204
await userEvent.keyboard('-9');
205205

206206
await userEvent.keyboard('[Tab]');
207-
expect(document.activeElement).to.equal(document.body);
207+
expect(document.body).toHaveFocus();
208208

209209
expect(handleChange.args[0][1]).to.equal(5);
210210
});
@@ -229,7 +229,7 @@ describe('useNumberInput', () => {
229229
await userEvent.keyboard('4');
230230

231231
await userEvent.keyboard('[Tab]');
232-
expect(document.activeElement).to.equal(document.body);
232+
expect(document.body).toHaveFocus();
233233

234234
expect(handleChange.args[0][1]).to.equal(5);
235235
});
@@ -254,7 +254,7 @@ describe('useNumberInput', () => {
254254
expect(input.value).to.equal('');
255255

256256
await userEvent.keyboard('[Tab]');
257-
expect(document.activeElement).to.equal(document.body);
257+
expect(document.body).toHaveFocus();
258258

259259
expect(handleChange.callCount).to.equal(1);
260260
expect(handleChange.args[0][1]).to.equal(null);
@@ -280,7 +280,7 @@ describe('useNumberInput', () => {
280280
expect(input.value).to.equal('-');
281281

282282
await userEvent.keyboard('[Tab]');
283-
expect(document.activeElement).to.equal(document.body);
283+
expect(document.body).toHaveFocus();
284284

285285
expect(handleChange.callCount).to.equal(1);
286286
expect(handleChange.args[0][1]).to.equal(null);

packages/mui-base/src/useAutocomplete/useAutocomplete.test.js

+3-5
Original file line numberDiff line numberDiff line change
@@ -1,6 +1,6 @@
11
import * as React from 'react';
22
import { expect } from 'chai';
3-
import { createRenderer, screen, ErrorBoundary, act, fireEvent } from '@mui/internal-test-utils';
3+
import { createRenderer, screen, ErrorBoundary, fireEvent } from '@mui/internal-test-utils';
44
import { spy } from 'sinon';
55
import { useAutocomplete, createFilterOptions } from '@mui/base/useAutocomplete';
66

@@ -319,10 +319,8 @@ describe('useAutocomplete', () => {
319319
render(<Test options={['foo', 'bar']} />);
320320
const input = screen.getByRole('combobox');
321321

322-
act(() => {
323-
fireEvent.change(input, { target: { value: 'free' } });
324-
input.blur();
325-
});
322+
fireEvent.change(input, { target: { value: 'free' } });
323+
fireEvent.blur(input);
326324

327325
expect(input.value).to.equal('free');
328326
});

packages/mui-joy/src/Accordion/Accordion.test.tsx

+2-2
Original file line numberDiff line numberDiff line change
@@ -121,13 +121,13 @@ describe('<Accordion />', () => {
121121
});
122122

123123
it('should warn when switching from controlled to uncontrolled', () => {
124-
const wrapper = render(
124+
const { setProps } = render(
125125
<Accordion expanded>
126126
<AccordionSummary>Header</AccordionSummary>
127127
</Accordion>,
128128
);
129129

130-
expect(() => wrapper.setProps({ expanded: undefined })).to.toErrorDev(
130+
expect(() => setProps({ expanded: undefined })).to.toErrorDev(
131131
'MUI: A component is changing the controlled expanded state of Accordion to be uncontrolled.',
132132
);
133133
});

packages/mui-joy/src/Autocomplete/Autocomplete.test.tsx

+5-3
Original file line numberDiff line numberDiff line change
@@ -102,9 +102,10 @@ describe('Joy <Autocomplete />', () => {
102102

103103
act(() => {
104104
input.focus();
105-
fireEvent.change(document.activeElement!, { target: { value: 'a' } });
106105
});
107106

107+
fireEvent.change(document.activeElement!, { target: { value: 'a' } });
108+
108109
expect(input.value).to.equal('a');
109110

110111
act(() => {
@@ -344,9 +345,10 @@ describe('Joy <Autocomplete />', () => {
344345
);
345346
const textbox = screen.getByRole('combobox');
346347

348+
fireEvent.change(textbox, { target: { value: 't' } });
349+
fireEvent.keyDown(textbox, { key: 'ArrowDown' });
350+
347351
act(() => {
348-
fireEvent.change(textbox, { target: { value: 't' } });
349-
fireEvent.keyDown(textbox, { key: 'ArrowDown' });
350352
textbox.blur();
351353
});
352354

packages/mui-joy/src/Checkbox/Checkbox.test.tsx

+2-4
Original file line numberDiff line numberDiff line change
@@ -90,10 +90,8 @@ describe('<Checkbox />', () => {
9090
const { getByRole } = render(<Checkbox defaultChecked />);
9191

9292
// how a user would trigger it
93-
act(() => {
94-
getByRole('checkbox').click();
95-
fireEvent.change(getByRole('checkbox'), { target: { checked: '' } });
96-
});
93+
fireEvent.click(getByRole('checkbox'));
94+
fireEvent.change(getByRole('checkbox'), { target: { checked: '' } });
9795

9896
expect(getByRole('checkbox')).to.have.property('checked', false);
9997
});

0 commit comments

Comments
 (0)