diff --git a/packages/block-editor/src/components/link-control/search-results.js b/packages/block-editor/src/components/link-control/search-results.js index 37ef1f72ce3d8..9d7ee7ca41abd 100644 --- a/packages/block-editor/src/components/link-control/search-results.js +++ b/packages/block-editor/src/components/link-control/search-results.js @@ -8,7 +8,6 @@ import { VisuallyHidden } from '@wordpress/components'; * External dependencies */ import classnames from 'classnames'; -import { createElement, Fragment } from '@wordpress/element'; /** * Internal dependencies @@ -53,25 +52,16 @@ export default function LinkControlSearchResults( { // See: https://developer.mozilla.org/en-US/docs/Web/Accessibility/ARIA/Roles/listbox_role const searchResultsLabelId = `block-editor-link-control-search-results-label-${ instanceId }`; const labelText = isInitialSuggestions - ? __( 'Recently updated' ) + ? __( 'Suggestions' ) : sprintf( /* translators: %s: search term. */ __( 'Search results for "%s"' ), currentInputValue ); - - // VisuallyHidden rightly doesn't accept custom classNames - // so we conditionally render it as a wrapper to visually hide the label - // when that is required. - const searchResultsLabel = createElement( - isInitialSuggestions ? Fragment : VisuallyHidden, - {}, // Empty props. - + const searchResultsLabel = ( + { labelText } - + ); return ( diff --git a/packages/block-editor/src/components/link-control/style.scss b/packages/block-editor/src/components/link-control/style.scss index 634cc3c041015..2dd57e56c3422 100644 --- a/packages/block-editor/src/components/link-control/style.scss +++ b/packages/block-editor/src/components/link-control/style.scss @@ -125,12 +125,6 @@ $preview-image-height: 140px; } } -.block-editor-link-control__search-results-label { - padding: $grid-unit-20 $grid-unit-40 0; - display: block; - font-weight: 600; -} - .block-editor-link-control__search-results { margin: 0; padding: $grid-unit-20 * 0.5 $grid-unit-20 $grid-unit-20 * 0.5; diff --git a/packages/block-editor/src/components/link-control/test/index.js b/packages/block-editor/src/components/link-control/test/index.js index 7d741f3641040..55aab3816b27e 100644 --- a/packages/block-editor/src/components/link-control/test/index.js +++ b/packages/block-editor/src/components/link-control/test/index.js @@ -901,7 +901,7 @@ describe( 'Default search suggestions', () => { expect( await screen.findByRole( 'listbox', { - name: 'Recently updated', + name: 'Suggestions', } ) ).toBeVisible(); @@ -991,7 +991,7 @@ describe( 'Default search suggestions', () => { expect( searchInput ).toHaveValue( '' ); const initialResultsList = await screen.findByRole( 'listbox', { - name: 'Recently updated', + name: 'Suggestions', } ); expect( @@ -1008,7 +1008,7 @@ describe( 'Default search suggestions', () => { const searchInput = screen.getByRole( 'combobox', { name: 'URL' } ); const searchResultsField = screen.queryByRole( 'listbox', { - name: 'Recently updated', + name: 'Suggestions', } ); expect( searchResultsField ).not.toBeInTheDocument(); @@ -1598,7 +1598,7 @@ describe( 'Selecting links', () => { expect( await screen.findByRole( 'listbox', { - name: 'Recently updated', + name: 'Suggestions', } ) ).toBeVisible(); @@ -1610,7 +1610,7 @@ describe( 'Selecting links', () => { const searchResultElements = within( screen.getByRole( 'listbox', { - name: 'Recently updated', + name: 'Suggestions', } ) ).getAllByRole( 'option' );