Accessibility - fix keyboard focus for popups/dialogs (e.g. support), change secondary form button (e.g. cancel) style

[kaitlinnewson]

Tested in 4.10 and 4.11 in both Scholars Portal and Harvard Dataverses, in Firefox and Chrome (OSX).

When opening an overlay, e.g. the Support form, the user's keyboard focus should go there. The overlay is automatically added to the end of the tab order, meaning the user has to tab through the whole page underneath before they can get to the overlay window.

[TaniaSchlatter]

Hi @kaitlinnewson, thanks for opening this issue. We are working on improving accessibility when working on related functionality. Its helpful to raise the visibility of this and other accessibility issues. Have you come across any best practices for addressing accessible popups?

[kaitlinnewson]

Hi @TaniaSchlatter, this article from uxplanet outlines some best practices (both for ux and accessibility): https://uxplanet.org/best-practices-for-modals-overlays-dialog-windows-c00c66cddd8c

[TaniaSchlatter]

I also found an accessibility plugin for Bootstrap that addresses popup focus. I am not sure if this might be a fit, but the team will review these references and make a plan. https://github.com/paypal/bootstrap-accessibility-plugin.