Issue Summary

In Search modal, the clear search ('x') button doesn’t have an accessible label.

Issue id: 724504

Tested URL

https://confsrva11ya.instenv.atl-test.space/#starred 

Steps to Reproduce

1. Navigate to confluence homepage.
2. Activate the 'Search' button in the header section.
3. In search modal, type keywords in search input field.
4. Navigate to 'x' button. 

Actual Results

While navigating with screen reader turned on, when user navigate to the 'x' button in search dialog, the screen reader doesn’t announce any label for it. The button element doesn’t have any label in the source code.

This makes screen reader users difficult to understand the purpose of the button.

<button type="button" id="search-ui-input-clear-button" class="aui-icon aui-icon-small aui-iconfont-cross"></button>

Expected Results

The button should have clear & descriptive accessible label which will be announced by screen reader. 

An accessible label can be provided via an aria-label attribute to the button. For Example : aria-label="clear search'.

<button aria-label="clear search" type="button" id="search-ui-input-clear-button" class="aui-icon aui-icon-small aui-iconfont-cross"></button>

Screenshot

Search-popout: https://axeauditor.dequecloud.com/api/v1/testrun-unit-screenshot/d574a4c4-4df7-11ec-9a95-1b65f454350f 

Workaround

Currently there is no known workaround for this behavior. A workaround will be added here when available