search

hathitrust / firebird-common

Other
0 stars 0 forks source link

issue #89: add event listener for escape key #90

Closed carylwyatt closed 3 months ago

carylwyatt commented 4 months ago

Re: @mwarin's suggestion in PR #88

1: As a user relying on keyboard/screen-reader, I think it would be neat if the form modal would close on ESC, rather than having to tab back to the beginning of the form to close it. This might be accessibility-heresy, so take that as the personal preference it is.

I did some testing and found an additional bug: my original fix returned the focus to the GET HELP link when you use the CLOSE button on the modal, but the ESC key returned the focus back to the body element.

This event listener (with a few .focus() methods thrown in for fallback/good measure) picks up on ESC keys and invokes the hide() function (which sets the focus back to GET HELP).

This closes issue #89.

To test: head over to dev-3 and tab through the nav menu to GET HELP. Select with ENTER and tab down to Ask a Question. Hit ENTER again to open the modal. Hit ESC to close modal. Focus should be returned to GET HELP in navbar. If you tab through some fields in the form, you have to hit ESC to exit the form field, then ESC again should close the modal and return focus to GET HELP.

netlify[bot] commented 4 months ago

Deploy Preview for hathitrust-firebird-common ready!

Name Link
Latest commit 736309f753efd3de7865d034297d98bb315479a5
Latest deploy log https://app.netlify.com/sites/hathitrust-firebird-common/deploys/66859bf920a4220008fc2584
Deploy Preview https://deploy-preview-90--hathitrust-firebird-common.netlify.app
Preview on mobile
Toggle QR Code...

QR Code

Use your smartphone camera to open QR code link.

To edit notification comments on pull requests, go to your Netlify site configuration.

carylwyatt commented 3 months ago

@angelinanz @giramesh This has already been marked as "fixed" with deque because we passed their benchmark, but I agreed with @mwarin's assessment about the ESC key for the feedback form modal. This is staged on test.www.hathitrust.org if you want to give it a spin!

I'll deploy on monday.

giramesh commented 3 months ago

can confirm that the ESC key for the feedback form modal works as expected on chrome, firefox, safari, edge! initially on chrome and edge i had to hit 'ESC' twice when in the form field (as the testing instructions mentioned), but after a few tries, just hitting 'ESC' once did the job.