diff --git a/packages/block-directory/src/components/downloadable-block-list-item/test/index.js b/packages/block-directory/src/components/downloadable-block-list-item/test/index.js index f336c8f7a1ff3..e8b9ea59921d8 100644 --- a/packages/block-directory/src/components/downloadable-block-list-item/test/index.js +++ b/packages/block-directory/src/components/downloadable-block-list-item/test/index.js @@ -1,7 +1,8 @@ /** * External dependencies */ -import { render, fireEvent } from '@testing-library/react'; +import { render, screen } from '@testing-library/react'; +import userEvent from '@testing-library/user-event'; /** * WordPress dependencies @@ -27,11 +28,11 @@ describe( 'DownloadableBlockListItem', () => { isInstallable: true, } ) ); - const { queryByText } = render( + render( ); - const author = queryByText( `by ${ plugin.author }` ); - const description = queryByText( plugin.description ); + const author = screen.queryByText( `by ${ plugin.author }` ); + const description = screen.queryByText( plugin.description ); expect( author ).not.toBeNull(); expect( description ).not.toBeNull(); } ); @@ -42,10 +43,10 @@ describe( 'DownloadableBlockListItem', () => { isInstallable: true, } ) ); - const { queryByText } = render( + render( ); - const statusLabel = queryByText( 'Installing…' ); + const statusLabel = screen.queryByText( 'Installing…' ); expect( statusLabel ).not.toBeNull(); } ); @@ -55,27 +56,30 @@ describe( 'DownloadableBlockListItem', () => { isInstallable: false, } ) ); - const { getByRole } = render( + render( ); - const button = getByRole( 'option' ); + const button = screen.getByRole( 'option' ); // Keeping it false to avoid focus loss and disable it using aria-disabled. expect( button.disabled ).toBe( false ); expect( button.getAttribute( 'aria-disabled' ) ).toBe( 'true' ); } ); - it( 'should try to install the block plugin', () => { + it( 'should try to install the block plugin', async () => { + const user = userEvent.setup( { + advanceTimers: jest.advanceTimersByTime, + } ); + useSelect.mockImplementation( () => ( { isInstalling: false, isInstallable: true, } ) ); const onClick = jest.fn(); - const { getByRole } = render( + render( ); - const button = getByRole( 'option' ); - fireEvent.click( button ); + await user.click( screen.getByRole( 'option' ) ); expect( onClick ).toHaveBeenCalledTimes( 1 ); } );