Monograph catalog modals should keep focus until closed

[Jonathan McGlone]

As a screen reader user, the modal windows on the monograph catalog page should hold focus until I either select an item or close the modal, so I do not end up focusing on elements outside of the modal window.

Currently, the monograph catalog "More" modal windows lose focus and allow a user to focus on elements and parts of the browser after moving through the modal display. An example of the focus order in Chrome when tabbing through the modal window:

It is likely this modal window is deep within Blacklight (or Hyrax's version of Blacklight) and it may be a better option to try and open a ticket and have changes made there. But it also may be possible to override Blacklight behavior with Javascript that adds ARIA attributes and maintains focus on the modal element by returning focus to position 1 after position 4 in the above screenshot.

• Investigate where the change should be made
• Add ARIA attributes role="dialog" and aria-labelledby="...", referencing the modal title, to .modal
• Add ARIA attributes role="document" to the .modal-dialog itself.
• Give a description of the modal dialog with aria-describedby on .modal
• Return focus to position 1 after position 4 by dynamically adjusting the tabindex attribute on elements.

Resources:
[1] https://getbootstrap.com/docs/3.3/javascript/#modals