Fix focus loss happening when installing blocks from the directory (#…

…40340)
WordPress · Apr 19, 2022 · d6b76fe · d6b76fe
1 parent 09e53d7
commit d6b76fe
Show file tree

Hide file tree

Showing 2 changed files with 3 additions and 1 deletion.
diff --git a/packages/block-directory/src/components/downloadable-block-list-item/index.js b/packages/block-directory/src/components/downloadable-block-list-item/index.js
@@ -93,6 +93,7 @@ function DownloadableBlockListItem( { composite, item, onClick } ) {
 
 	return (
 		<CompositeItem
+			__experimentalIsFocusable
 			role="option"
 			as={ Button }
 			{ ...composite }

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
@@ -59,7 +59,8 @@ describe( 'DownloadableBlockListItem', () => {
 			<DownloadableBlockListItem onClick={ jest.fn() } item={ plugin } />
 		);
 		const button = getByRole( 'option' );
-		expect( button.disabled ).toBe( true );
+		// 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' );
 	} );