[wp-trac] [WordPress Trac] #31608: Shiny Updates: fine-tune UI for filesystem credentials request modal

[WordPress Trac]

#31608: Shiny Updates: fine-tune UI for filesystem credentials request modal
-------------------------------------+-------------------------------------
 Reporter:  ericlewis                |       Owner:  ericlewis
     Type:  enhancement              |      Status:  assigned
 Priority:  normal                   |   Milestone:  4.2
Component:  Upgrade/Install          |     Version:  trunk
 Severity:  normal                   |  Resolution:
 Keywords:  has-patch ui-feedback    |     Focuses:  ui, accessibility,
  dev-feedback                       |  javascript
-------------------------------------+-------------------------------------
Changes (by afercia):

 * keywords:  has-patch ui-feedback => has-patch ui-feedback dev-feedback
 * focuses:  ui, accessibility => ui, accessibility, javascript


Comment:

 Thanks @joedolson :) Updated patch is a first accessibility treatment
 pass:
 - add role=dialog and aria-labelledby on the modal container
 - add aria-describedby to the relevant form field, targeting the existing
 descriptions
 - I'd suggest to change "e.g." in "example:" for better readability
 - JavaScript: move focus to the modal first input field when the modal
 opens
 - JavaScript: constrain keyboard navigation inside the modal
 - JavaScript: make the "close modal" function reusable
 - JavaScript: close the modal when pressing Escape or clicking the overlay
 - JavaScript: set focus back to the previously active element (if any) or
 a reasonable element ("Select" checkbox)

 Would recommend a JavaScript review from some lead dev, when they have a
 chance :)

--
Ticket URL: <https://core.trac.wordpress.org/ticket/31608#comment:17>
WordPress Trac <https://core.trac.wordpress.org/>
WordPress publishing platform