Message input field: Cannot exit image preview dialog using keyboard only

[kangabell]

After adding an image to the chat and opening the preview dialog for it, there is no apparent way to exit with a keyboard only. Focus is trapped inside the dialog and the only way to exit is to refresh the browser page and start over.

Test Environment

http://159.89.83.1/c/new

WCAG Criteria

2.1.2 No Keyboard Trap - A

Testing Method

Manual - VO/Safari/MacOS

Screen Recording

https://share.zight.com/rRudNmQN
In this video, after opening the image preview, I try to get out of it using keyboard only (tab forward, tab backward, hit Enter key, hit Escape key, etc.), but can’t. Trapped!

Recommended Action

Add a keyboard-accessible close button to this dialog. Additionally, it is recommended that the Escape key can be used to close the dialog as well.