diff --git a/src/legacy/core_plugins/data/public/query/query_bar/components/query_bar_input.tsx b/src/legacy/core_plugins/data/public/query/query_bar/components/query_bar_input.tsx index b8a8331b70..6fa0dd2d3c 100644 --- a/src/legacy/core_plugins/data/public/query/query_bar/components/query_bar_input.tsx +++ b/src/legacy/core_plugins/data/public/query/query_bar/components/query_bar_input.tsx @@ -460,10 +460,21 @@ export class QueryBarInputUI extends Component {
@@ -486,28 +497,23 @@ export class QueryBarInputUI extends Component { }} autoComplete="off" spellCheck={false} - aria-label={ - this.props.screenTitle - ? this.props.intl.formatMessage( - { - id: 'data.query.queryBar.searchInputAriaLabel', - defaultMessage: - 'You are on search box of {previouslyTranslatedPageTitle} page. Start typing to search and filter the {pageType}', - }, - { - previouslyTranslatedPageTitle: this.props.screenTitle, - pageType: this.props.appName, - } - ) - : undefined - } + aria-label={this.props.intl.formatMessage( + { + id: 'data.query.queryBar.searchInputAriaLabel', + defaultMessage: 'Start typing to search and filter the {pageType} page', + }, + { + pageType: this.props.appName, + } + )} type="text" data-test-subj="queryInput" aria-autocomplete="list" - aria-controls="kbnTypeahead__items" - aria-activedescendant={ - this.state.isSuggestionsVisible ? 'suggestion-' + this.state.index : '' - } + {...(this.state.isSuggestionsVisible && { 'aria-controls': 'kbnTypeahead__items' })} + {...(this.state.isSuggestionsVisible && + typeof this.state.index === 'number' && { + 'aria-activedescendant': `suggestion-${this.state.index}`, + })} role="textbox" prepend={this.props.prepend} append={