diff --git a/packages/material-ui/src/ListItem/ListItem.test.js b/packages/material-ui/src/ListItem/ListItem.test.js index 670d5027a3fb40..15213eb9a30809 100644 --- a/packages/material-ui/src/ListItem/ListItem.test.js +++ b/packages/material-ui/src/ListItem/ListItem.test.js @@ -16,7 +16,7 @@ const NoContent = React.forwardRef(() => { describe('', () => { let mount; - const render = createClientRender({ strict: false }); + const render = createClientRender(); let classes; before(() => { @@ -126,6 +126,21 @@ describe('', () => { expect(listItem.querySelector(`div.${classes.root}`)).not.to.equal(null); }); + it('can autofocus a custom ContainerComponent', () => { + const { getByRole } = render( + + + + , + ); + + expect(getByRole('listitem')).toHaveFocus(); + }); + it('should allow customization of the wrapper', () => { const { getByRole } = render( @@ -177,6 +192,33 @@ describe('', () => { 'Material-UI: unable to set focus to a ListItem whose component has not been rendered.', ); }); + + // StrictMode compatible usage is illustrated in "can autofocus a custom ContainerComponent" + it('warns in StrictMode if the custom ContainerComponent is a class component', () => { + // eslint-disable-next-line react/prefer-stateless-function + class CustomListItemContainer extends React.Component { + // React dedupes the findDOMNode deprecation warning by displayName + // since we can't reset modules in watchmode we implement cache busting + // by creating a random display name + static displayName = `CustomListItemContainer-#${Math.random()}`; + + render() { + return
; + } + } + const { getByRole } = render( + + + + , + ); + + expect(getByRole('listitem')).toHaveFocus(); + expect(consoleErrorMock.callCount()).to.equal(1); + expect(consoleErrorMock.messages()[0]).to.include( + 'findDOMNode is deprecated in StrictMode', + ); + }); }); });