Skip to content

Commit

Permalink
[test] Enable "missing act()"-warnings (#21802)
Browse files Browse the repository at this point in the history
  • Loading branch information
@eps1lon
eps1lon authored Jul 15, 2020
1 parent a660002 commit f505b79
Show file tree
Hide file tree
Showing 29 changed files with 723 additions and 260 deletions.
62 changes: 46 additions & 16 deletions packages/material-ui-lab/src/Autocomplete/Autocomplete.test.js
View file
Original file line number Diff line number Diff line change
Expand Up @@ -37,10 +37,17 @@ describe('<Autocomplete />', () => {
<Autocomplete {...defaultProps} renderInput={(params) => <TextField {...params} />} />,
);
const input = getByRole('textbox');
input.focus();
fireEvent.change(document.activeElement, { target: { value: 'a' } });

act(() => {
input.focus();
fireEvent.change(document.activeElement, { target: { value: 'a' } });
});

expect(input.value).to.equal('a');
document.activeElement.blur();

act(() => {
document.activeElement.blur();
});
expect(input.value).to.equal('');
});

Expand Down Expand Up @@ -218,7 +225,9 @@ describe('<Autocomplete />', () => {
// include hidden clear button because JSDOM thinks it's visible
expect(getAllByRole('button', { hidden: true })).to.have.lengthOf(4);

getByRole('textbox').focus();
act(() => {
getByRole('textbox').focus();
});
expect(container.textContent).to.equal('onetwothree');
expect(getAllByRole('button', { hidden: false })).to.have.lengthOf(5);
});
Expand All @@ -239,7 +248,9 @@ describe('<Autocomplete />', () => {
// include hidden clear button because JSDOM thinks it's visible
expect(getAllByRole('button', { hidden: true })).to.have.lengthOf(2);

getByRole('textbox').focus();
act(() => {
getByRole('textbox').focus();
});
expect(container.textContent).to.equal('onetwothree');
expect(getAllByRole('button', { hidden: false })).to.have.lengthOf(5);
});
Expand Down Expand Up @@ -292,7 +303,9 @@ describe('<Autocomplete />', () => {
fireEvent.change(textbox, { target: { value: 'o' } });
fireEvent.keyDown(textbox, { key: 'ArrowDown' });
fireEvent.change(textbox, { target: { value: 'oo' } });
textbox.blur();
act(() => {
textbox.blur();
});

expect(handleChange.callCount).to.equal(1);
expect(handleChange.args[0][1]).to.deep.equal('oo');
Expand All @@ -314,9 +327,11 @@ describe('<Autocomplete />', () => {
);
const textbox = screen.getByRole('textbox');

fireEvent.change(textbox, { target: { value: 't' } });
fireEvent.keyDown(textbox, { key: 'ArrowDown' });
textbox.blur();
act(() => {
fireEvent.change(textbox, { target: { value: 't' } });
fireEvent.keyDown(textbox, { key: 'ArrowDown' });
textbox.blur();
});

expect(handleChange.callCount).to.equal(1);
expect(handleChange.args[0][1]).to.deep.equal(options);
Expand All @@ -334,8 +349,12 @@ describe('<Autocomplete />', () => {
renderInput={(params) => <TextField {...params} autoFocus />}
/>,
);

fireEvent.change(document.activeElement, { target: { value: 'a' } });
document.activeElement.blur();
act(() => {
document.activeElement.blur();
});

expect(handleChange.callCount).to.equal(1);
expect(handleChange.args[0][1]).to.deep.equal(['a']);
});
Expand All @@ -351,9 +370,12 @@ describe('<Autocomplete />', () => {
/>,
);
const input = getByRole('textbox');
input.focus();
document.activeElement.blur();
input.focus();

act(() => {
input.focus();
document.activeElement.blur();
input.focus();
});
});

it('should remove the last option', () => {
Expand Down Expand Up @@ -861,7 +883,10 @@ describe('<Autocomplete />', () => {
fireEvent.click(textbox);
expect(combobox).to.have.attribute('aria-expanded', 'false');

document.activeElement.blur();
act(() => {
document.activeElement.blur();
});

expect(combobox).to.have.attribute('aria-expanded', 'false');
expect(textbox).not.toHaveFocus();

Expand Down Expand Up @@ -1373,9 +1398,12 @@ describe('<Autocomplete />', () => {
const textbox = getByRole('textbox');
fireEvent.click(textbox);
expect(textbox).toHaveFocus();
textbox.blur();

act(() => {
textbox.blur();
});
fireEvent.click(queryByTitle('Open'));

expect(textbox).toHaveFocus();
});

Expand Down Expand Up @@ -1693,7 +1721,9 @@ describe('<Autocomplete />', () => {

fireEvent.keyDown(textbox, { key: 'ArrowDown' });
fireEvent.keyDown(textbox, { key: 'ArrowDown' });
textbox.blur();
act(() => {
textbox.blur();
});

expect(handleChange.callCount).to.equal(1);
expect(handleChange.args[0][1]).to.equal(options[0]);
Expand Down
11 changes: 9 additions & 2 deletions packages/material-ui-lab/src/SpeedDialAction/SpeedDialAction.test.js
View file
Original file line number Diff line number Diff line change
Expand Up @@ -3,7 +3,7 @@ import { expect } from 'chai';
import { getClasses } from '@material-ui/core/test-utils';
import { useFakeTimers } from 'sinon';
import createMount from 'test/utils/createMount';
import { createClientRender, fireEvent } from 'test/utils/createClientRender';
import { act, createClientRender, fireEvent } from 'test/utils/createClientRender';
import Icon from '@material-ui/core/Icon';
import Tooltip from '@material-ui/core/Tooltip';
import Fab from '@material-ui/core/Fab';
Expand Down Expand Up @@ -52,8 +52,15 @@ describe('<SpeedDialAction />', () => {
);

fireEvent.mouseOver(container.querySelector('button'));
clock.tick(100);
act(() => {
clock.tick(100);
});

expect(getByText('placeholder')).to.have.class('bar');

// TODO: Unclear why not running triggers microtasks but runAll does not trigger microtasks
// can be removed once Popper#update is sync
clock.runAll();
});

it('should render a Fab', () => {
Expand Down
24 changes: 17 additions & 7 deletions packages/material-ui/src/AccordionSummary/AccordionSummary.test.js
View file
Original file line number Diff line number Diff line change
Expand Up @@ -4,7 +4,7 @@ import { spy } from 'sinon';
import { getClasses } from '@material-ui/core/test-utils';
import createMount from 'test/utils/createMount';
import describeConformance from '../test-utils/describeConformance';
import { createClientRender, fireEvent } from 'test/utils/createClientRender';
import { act, createClientRender, fireEvent } from 'test/utils/createClientRender';
import Accordion from '../Accordion';
import AccordionSummary from './AccordionSummary';
import ButtonBase from '../ButtonBase';
Expand Down Expand Up @@ -73,8 +73,10 @@ describe('<AccordionSummary />', () => {
fireEvent.mouseDown(document.body); // pointer device
const button = getByRole('button');

fireEvent.keyDown(document.body, { key: 'Tab' }); // not actually focusing (yet)
button.focus();
act(() => {
fireEvent.keyDown(document.body, { key: 'Tab' }); // not actually focusing (yet)
button.focus();
});

expect(button).toHaveFocus();
expect(button).to.have.class(classes.focused);
Expand All @@ -85,9 +87,13 @@ describe('<AccordionSummary />', () => {
fireEvent.mouseDown(document.body); // pointer device
fireEvent.keyDown(document.body, { key: 'Tab' }); // not actually focusing (yet)
const button = getByRole('button');
button.focus();

button.blur();
act(() => {
button.focus();
});
act(() => {
button.blur();
});

expect(button).not.toHaveFocus();
expect(button).not.to.have.class(classes.focused);
Expand All @@ -110,7 +116,9 @@ describe('<AccordionSummary />', () => {
</Accordion>,
);

getByRole('button').click();
act(() => {
getByRole('button').click();
});

expect(handleChange.callCount).to.equal(1);
});
Expand All @@ -123,7 +131,9 @@ describe('<AccordionSummary />', () => {

// this doesn't actually apply focus like in the browser. we need to move focus manually
fireEvent.keyDown(document.body, { key: 'Tab' });
getByRole('button').focus();
act(() => {
getByRole('button').focus();
});

expect(handleFocusVisible.callCount).to.equal(1);
});
Expand Down
18 changes: 13 additions & 5 deletions packages/material-ui/src/Breadcrumbs/BreadcrumbCollapsed.test.js
View file
Original file line number Diff line number Diff line change
Expand Up @@ -3,7 +3,7 @@ import { expect } from 'chai';
import { spy } from 'sinon';
import { getClasses } from '@material-ui/core/test-utils';
import BreadcrumbCollapsed from './BreadcrumbCollapsed';
import { fireEvent, createClientRender } from 'test/utils/createClientRender';
import { act, fireEvent, createClientRender } from 'test/utils/createClientRender';

describe('<BreadcrumbCollapsed />', () => {
let classes;
Expand All @@ -25,17 +25,25 @@ describe('<BreadcrumbCollapsed />', () => {
const handleClick = spy();
const { container } = render(<BreadcrumbCollapsed onClick={handleClick} />);
const expand = container.firstChild;
expand.focus();
fireEvent.keyDown(expand, { key: 'Enter' });

act(() => {
expand.focus();
fireEvent.keyDown(expand, { key: 'Enter' });
});

expect(handleClick.callCount).to.equal(1);
});

it(`should be called on key up - Space`, () => {
const handleClick = spy();
const { container } = render(<BreadcrumbCollapsed onClick={handleClick} />);
const expand = container.firstChild;
expand.focus();
fireEvent.keyUp(expand, { key: ' ' });

act(() => {
expand.focus();
fireEvent.keyUp(expand, { key: ' ' });
});

expect(handleClick.callCount).to.equal(1);
});
});
Expand Down
7 changes: 5 additions & 2 deletions packages/material-ui/src/Breadcrumbs/Breadcrumbs.test.js
View file
Original file line number Diff line number Diff line change
Expand Up @@ -4,7 +4,7 @@ import { getClasses } from '@material-ui/core/test-utils';
import createMount from 'test/utils/createMount';
import describeConformance from '../test-utils/describeConformance';
import Breadcrumbs from './Breadcrumbs';
import { createClientRender, screen } from 'test/utils/createClientRender';
import { act, createClientRender, screen } from 'test/utils/createClientRender';

describe('<Breadcrumbs />', () => {
const mount = createMount();
Expand Down Expand Up @@ -76,7 +76,10 @@ describe('<Breadcrumbs />', () => {
</Breadcrumbs>,
);

getByRole('button').click();
act(() => {
getByRole('button').click();
});

expect(document.activeElement).to.equal(getByText('first'));
expect(getAllByRole('listitem', { hidden: false })).to.have.length(9);
});
Expand Down
Loading

0 comments on commit f505b79

Please sign in to comment.