Skip to content

Commit

Permalink
[test] Enable more StrictMode tests (#21817)
Browse files Browse the repository at this point in the history
  • Loading branch information
eps1lon committed Jul 20, 2020
1 parent b38ea28 commit 7fcb995
Show file tree
Hide file tree
Showing 20 changed files with 508 additions and 240 deletions.
2 changes: 1 addition & 1 deletion packages/material-ui-lab/src/SpeedDial/SpeedDial.test.js
Original file line number Diff line number Diff line change
Expand Up @@ -14,7 +14,7 @@ import SpeedDial from './SpeedDial';
import SpeedDialAction from '../SpeedDialAction';

describe('<SpeedDial />', () => {
// StrictModeViolation: uses Zoom
// StrictModeViolation: not using act(), prefer test/utils/createClientRender
const mount = createMount({ strict: false });
let classes;

Expand Down
Original file line number Diff line number Diff line change
Expand Up @@ -20,9 +20,8 @@ describe('<SpeedDialAction />', () => {
clock.restore();
});

// StrictModeViolation: uses Tooltip
const mount = createMount({ strict: false });
const render = createClientRender({ strict: false });
const mount = createMount({ strict: true });
const render = createClientRender();
let classes;
const fabClasses = getClasses(<Fab>Fab</Fab>);

Expand Down
157 changes: 109 additions & 48 deletions packages/material-ui-lab/src/TreeItem/TreeItem.test.js
Original file line number Diff line number Diff line change
Expand Up @@ -16,9 +16,8 @@ import TreeView from '../TreeView';

describe('<TreeItem />', () => {
let classes;
// StrictModeViolation: uses Collapse
const mount = createMount({ strict: false });
const render = createClientRender({ strict: false });
const mount = createMount({ strict: true });
const render = createClientRender();

before(() => {
classes = getClasses(<TreeItem nodeId="one" label="one" />);
Expand Down Expand Up @@ -147,7 +146,9 @@ describe('<TreeItem />', () => {
</TreeView>,
);

getByTestId('test').focus();
act(() => {
getByTestId('test').focus();
});

expect(handleFocus.callCount).to.equal(1);
});
Expand All @@ -161,8 +162,9 @@ describe('<TreeItem />', () => {
</TreeView>,
);
const treeitem = screen.getByRole('treeitem');

treeitem.focus();
act(() => {
treeitem.focus();
});

fireEvent.keyDown(treeitem, { key: 'Enter' });
fireEvent.keyDown(treeitem, { key: 'A' });
Expand Down Expand Up @@ -298,11 +300,16 @@ describe('<TreeItem />', () => {
</React.Fragment>,
);

getByTestId('start').focus();
act(() => {
getByTestId('start').focus();
});

expect(getByTestId('start')).toHaveFocus();

fireEvent.keyDown(getByTestId('start'), { key: 'Tab' });
getByTestId('one').focus();
act(() => {
fireEvent.keyDown(getByTestId('start'), { key: 'Tab' });
getByTestId('one').focus();
});

expect(getByTestId('one')).toHaveFocus();
});
Expand Down Expand Up @@ -342,7 +349,10 @@ describe('<TreeItem />', () => {
expect(getByTestId('one')).to.have.attribute('tabindex', '0');
expect(getByTestId('two')).to.have.attribute('tabindex', '-1');

getByTestId('two').focus();
act(() => {
getByTestId('two').focus();
});

expect(getByTestId('one')).to.have.attribute('tabindex', '-1');
expect(getByTestId('two')).to.have.attribute('tabindex', '0');
});
Expand All @@ -361,7 +371,9 @@ describe('<TreeItem />', () => {

expect(getByTestId('one')).to.have.attribute('aria-expanded', 'false');

getByTestId('one').focus();
act(() => {
getByTestId('one').focus();
});
fireEvent.keyDown(getByTestId('one'), { key: 'ArrowRight' });

expect(getByTestId('one')).to.have.attribute('aria-expanded', 'true');
Expand All @@ -379,8 +391,10 @@ describe('<TreeItem />', () => {

expect(getByTestId('one')).to.have.attribute('aria-expanded', 'true');

getByTestId('one').focus();
fireEvent.keyDown(getByTestId('one'), { key: 'ArrowRight' });
act(() => {
getByTestId('one').focus();
fireEvent.keyDown(getByTestId('one'), { key: 'ArrowRight' });
});

expect(getByTestId('two')).toHaveFocus();
});
Expand Down Expand Up @@ -420,8 +434,10 @@ describe('<TreeItem />', () => {

expect(firstItem).to.have.attribute('aria-expanded', 'true');

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

expect(firstItem).to.have.attribute('aria-expanded', 'false');
expect(firstItem).toHaveFocus();
Expand Down Expand Up @@ -483,7 +499,10 @@ describe('<TreeItem />', () => {
</TreeView>,
);

getByTestId('one').focus();
act(() => {
getByTestId('one').focus();
});

expect(getByTestId('one')).to.have.attribute('aria-expanded', 'false');
fireEvent.keyDown(getByTestId('one'), { key: 'ArrowLeft' });
expect(getByTestId('one')).toHaveFocus();
Expand All @@ -496,8 +515,10 @@ describe('<TreeItem />', () => {
</TreeView>,
);

getByTestId('one').focus();
fireEvent.keyDown(getByTestId('one'), { key: 'ArrowLeft' });
act(() => {
getByTestId('one').focus();
fireEvent.keyDown(getByTestId('one'), { key: 'ArrowLeft' });
});

expect(getByTestId('one')).toHaveFocus();
});
Expand All @@ -512,8 +533,10 @@ describe('<TreeItem />', () => {
</TreeView>,
);

getByTestId('one').focus();
fireEvent.keyDown(getByTestId('one'), { key: 'ArrowDown' });
act(() => {
getByTestId('one').focus();
fireEvent.keyDown(getByTestId('one'), { key: 'ArrowDown' });
});

expect(getByTestId('two')).toHaveFocus();
});
Expand All @@ -529,8 +552,10 @@ describe('<TreeItem />', () => {

expect(getByTestId('one')).to.have.attribute('aria-expanded', 'true');

getByTestId('one').focus();
fireEvent.keyDown(getByTestId('one'), { key: 'ArrowDown' });
act(() => {
getByTestId('one').focus();
fireEvent.keyDown(getByTestId('one'), { key: 'ArrowDown' });
});

expect(getByTestId('two')).toHaveFocus();
});
Expand Down Expand Up @@ -568,8 +593,10 @@ describe('<TreeItem />', () => {
fireEvent.click(getByTestId('button'));
expect(getByTestId('one')).not.to.equal(null);

getByTestId('one').focus();
fireEvent.keyDown(getByTestId('one'), { key: 'ArrowDown' });
act(() => {
getByTestId('one').focus();
fireEvent.keyDown(getByTestId('one'), { key: 'ArrowDown' });
});

expect(getByTestId('two')).toHaveFocus();
});
Expand Down Expand Up @@ -688,7 +715,9 @@ describe('<TreeItem />', () => {
</TreeView>,
);

getByTestId('one').focus();
act(() => {
getByTestId('one').focus();
});

expect(getByTestId('one')).toHaveFocus();

Expand All @@ -711,7 +740,9 @@ describe('<TreeItem />', () => {
</TreeView>,
);

getByTestId('one').focus();
act(() => {
getByTestId('one').focus();
});

expect(getByTestId('one')).toHaveFocus();

Expand All @@ -732,7 +763,9 @@ describe('<TreeItem />', () => {
</TreeView>,
);

getByTestId('one').focus();
act(() => {
getByTestId('one').focus();
});

expect(getByTestId('one')).toHaveFocus();

Expand All @@ -759,7 +792,9 @@ describe('<TreeItem />', () => {
</TreeView>,
);

getByTestId('one').focus();
act(() => {
getByTestId('one').focus();
});

expect(getByTestId('one')).toHaveFocus();

Expand All @@ -786,7 +821,9 @@ describe('<TreeItem />', () => {
</TreeView>,
);

getByTestId('apple').focus();
act(() => {
getByTestId('apple').focus();
});

expect(getByTestId('apple')).toHaveFocus();

Expand Down Expand Up @@ -826,8 +863,10 @@ describe('<TreeItem />', () => {
expect(navTreeItem).not.toHaveFocus();

expect(() => {
getByTestId('keyDown').focus();
fireEvent.keyDown(getByTestId('keyDown'), { key: 'a' });
act(() => {
getByTestId('keyDown').focus();
fireEvent.keyDown(getByTestId('keyDown'), { key: 'a' });
});
}).not.to.throw();

expect(navTreeItem).toHaveFocus();
Expand Down Expand Up @@ -855,7 +894,9 @@ describe('<TreeItem />', () => {
</TreeView>,
);

getByTestId('one').focus();
act(() => {
getByTestId('one').focus();
});

expect(getByTestId('one')).to.have.attribute('aria-expanded', 'false');
expect(getByTestId('three')).to.have.attribute('aria-expanded', 'false');
Expand Down Expand Up @@ -885,7 +926,9 @@ describe('<TreeItem />', () => {
</TreeView>,
);

getByTestId('one').focus();
act(() => {
getByTestId('one').focus();
});

expect(getByTestId('one')).to.have.attribute('aria-expanded', 'false');

Expand Down Expand Up @@ -923,7 +966,9 @@ describe('<TreeItem />', () => {
</TreeView>,
);

getByTestId('one').focus();
act(() => {
getByTestId('one').focus();
});

expect(getByTestId('one')).to.not.have.attribute('aria-selected');

Expand All @@ -939,8 +984,10 @@ describe('<TreeItem />', () => {
</TreeView>,
);

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

expect(getByTestId('one')).not.to.have.attribute('aria-selected');
});
Expand Down Expand Up @@ -1139,8 +1186,10 @@ describe('<TreeItem />', () => {
</TreeView>,
);

getByTestId('five').focus();
fireEvent.keyDown(getByTestId('five'), { key: 'End', shiftKey: true, ctrlKey: true });
act(() => {
getByTestId('five').focus();
fireEvent.keyDown(getByTestId('five'), { key: 'End', shiftKey: true, ctrlKey: true });
});

expect(getByTestId('five')).to.have.attribute('aria-selected', 'true');
expect(getByTestId('six')).to.have.attribute('aria-selected', 'true');
Expand Down Expand Up @@ -1178,8 +1227,10 @@ describe('<TreeItem />', () => {
</TreeView>,
);

getByTestId('five').focus();
fireEvent.keyDown(getByTestId('five'), { key: 'End', shiftKey: true, ctrlKey: true });
act(() => {
getByTestId('five').focus();
fireEvent.keyDown(getByTestId('five'), { key: 'End', shiftKey: true, ctrlKey: true });
});

expect(container.querySelectorAll('[aria-selected=true]')).to.have.length(0);

Expand Down Expand Up @@ -1252,7 +1303,9 @@ describe('<TreeItem />', () => {
</TreeView>,
);

getByTestId('one').focus();
act(() => {
getByTestId('one').focus();
});

expect(getByTestId('one')).to.have.attribute('aria-selected', 'false');
expect(getByTestId('two')).to.have.attribute('aria-selected', 'false');
Expand All @@ -1262,8 +1315,10 @@ describe('<TreeItem />', () => {
expect(getByTestId('one')).to.have.attribute('aria-selected', 'true');
expect(getByTestId('two')).to.have.attribute('aria-selected', 'false');

getByTestId('two').focus();
fireEvent.keyDown(getByTestId('two'), { key: ' ', ctrlKey: true });
act(() => {
getByTestId('two').focus();
fireEvent.keyDown(getByTestId('two'), { key: ' ', ctrlKey: true });
});

expect(getByTestId('one')).to.have.attribute('aria-selected', 'true');
expect(getByTestId('two')).to.have.attribute('aria-selected', 'true');
Expand Down Expand Up @@ -1317,8 +1372,10 @@ describe('<TreeItem />', () => {
</TreeView>,
);

getByTestId('one').focus();
fireEvent.keyDown(getByTestId('one'), { key: 'a', ctrlKey: true });
act(() => {
getByTestId('one').focus();
fireEvent.keyDown(getByTestId('one'), { key: 'a', ctrlKey: true });
});

expect(container.querySelectorAll('[aria-selected=true]')).to.have.length(5);
});
Expand All @@ -1334,8 +1391,10 @@ describe('<TreeItem />', () => {
</TreeView>,
);

getByTestId('one').focus();
fireEvent.keyDown(getByTestId('one'), { key: 'a', ctrlKey: true });
act(() => {
getByTestId('one').focus();
fireEvent.keyDown(getByTestId('one'), { key: 'a', ctrlKey: true });
});

expect(container.querySelectorAll('[aria-selected=true]')).to.have.length(0);
});
Expand Down Expand Up @@ -1393,7 +1452,9 @@ describe('<TreeItem />', () => {

expect(getByTestId('two')).toHaveFocus();

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

expect(getByRole('button')).toHaveFocus();

Expand Down
Loading

0 comments on commit 7fcb995

Please sign in to comment.