Search Result selection (select any of the options from the search results) : Missing keyboard support for interactive element

Issue Summary

The interactive element is not keyboard accessible

Element:

• Start watching

Location:
Present on the main content

Steps to Reproduce

1. Open the homepage
2. Navigate to the "Assets" link and activate it
3. Navigate to "Search for object" and activate it
4. Navigate to the input field and search for the object
5. Navigate to the links present in the table and activate it
6. Observe the mentioned interactive elements are not accessible with the keyboard.

Actual Results

Keyboard support is missing for the "Stop watching" interactive elements.

This made it difficult for keyboard-only and screen-reader users to access the interactive element.

Expected Results

• Mark up the mentioned interactive element using the native <button> element.

• Modify the scripts to ensure that the button is accessible with a keyboard as well as a mouse.

<button class="iamWatchers__link e2e-watch-link">Start watching</button>

Alternatively,

If the above implementation is not possible, use custom role="button" and tabindex="0" to make sure that this button receives keyboard focus and has an interactive role. The focus indicator should be clear with a sufficient color contrast ratio.

<a class="iamWatchers__link e2e-watch-link" role="button" tabindex="0">Start watching</a>

Screenshot

Workaround

Not Available

Bug Ref: 746545

Bulldog Ref: JSMDC-13233