Escape auto focus

[cm9361]

Summary

What was changed:
Added the ability to select a cell by pressing Escape on an auto focused button or anchor element.

Why it was changed:
The change was made due to a functional requirement where consumers need to ability to select the cell and the button element.

Testing

This change was tested using:

• WDIO
• Jest
• Visual testing (please attach a screenshot or recording)
• Other (please describe below)
• No tests are needed

Reviews

In addition to engineering reviews, this PR needs:

• UX review
• Accessibility review
• Functional review

Additional Details

This PR resolves:

UXPLATFORM-10323

---

Thank you for contributing to Terra.
@cerner/terra

[adoroshk]

To make sure we are on the same page here, a double-check on terminology. Under select the cell we mean set focus to the whole cell, not change cells isSelected prop by calling onCellSelect method? I am approving presuming the above, as it's works as expected.

[cm9361]

To make sure we are on the same page here, a double-check on terminology. Under select the cell we mean set focus to the whole cell, not change cells isSelected prop by calling onCellSelect method? I am approving presuming the above, as it's works as expected.

Yes, that is correct.

[mjpalazzo]

@cm9361 - Thanks for turning this around so quickly. The Escape key interaction is working well. My only concern is that the screen reader user does not know this interaction is available. I am not sure what the best way is to provide this helper text. Since the focus is on the button or hyperlink, JAWS announces how to interact with those elements appropriately.
@eawww - Is my concern a valid one or do you think AT users will know to press escape when focus is on an interactive element in the cell? If this is a valid concern, do you have any suggestions on how to address it?

[mjpalazzo]

@cm9361 - JAWS announcement when focus is on the button is better. Here is a what I heard:
"Column 1, Alert, focus contained in cell. Press Escape to resume table navigation. Button, Column 2. To activate press Enter." Note that Column label and column index do not match. I believe Saad had fixed this.
However, when I press Escape and focus is on the cell, JAWS announces, "Escape, Alert, Focus contained in cell. Press Escape to resume Table navigation. Non-Focusable Text. Column 2. Table navigation resumed." The text in bold is not correct.
When focus is on the cell, JAWS should say, "Cell contains interactable elements. Press Enter to move focus inside the cell."

[mjpalazzo]

@cm9361 - JAWS announcement when focus is on the button is better. Here is a what I heard: "Column 1, Alert, focus contained in cell. Press Escape to resume table navigation. Button, Column 2. To activate press Enter." Note that Column label and column index do not match. I believe Saad had fixed this. However, when I press Escape and focus is on the cell, JAWS announces, "Escape, Alert, Focus contained in cell. Press Escape to resume Table navigation. Non-Focusable Text. Column 2. Table navigation resumed." The text in bold is not correct. When focus is on the cell, JAWS should say, "Cell contains interactable elements. Press Enter to move focus inside the cell."

The latest version is working as required. When I pressed Escape, JAWS announced the cell contents and "Table navigation resumed." Thanks also for fixing the text in the column headers.