[wp-trac] [WordPress Trac] #47144: Text inadvertently rendered by assistive technologies

[WordPress Trac]

#47144: Text inadvertently rendered by assistive technologies
-----------------------------------------+----------------------------
 Reporter:  anevins                      |       Owner:  (none)
     Type:  defect (bug)                 |      Status:  new
 Priority:  normal                       |   Milestone:  5.3
Component:  Media                        |     Version:
 Severity:  normal                       |  Resolution:
 Keywords:  needs-patch wpcampus-report  |     Focuses:  accessibility
-----------------------------------------+----------------------------
Changes (by afercia):

 * keywords:  needs-patch wpcampus-report needs-screenshots => needs-patch
     wpcampus-report


Comment:

 @joemcgill sure. The "Settings panels" is the Gutenberg sidebar, which is
 rendered close to the end of the markup. That's just to indicate that
 after that, at the very end of the markup, there's a button.

 This button is generated by `wp-plupload.js`. It's positioned off-screen
 but still focusable and operable. Perceived by assistive technologies,
 hidden only from humans:

 [[Image(http://cldup.com/Sgy0DUdP87.jpg)]]

 I'm not sure if `wp-plupload.js` is really needed in the Gutenberg
 context. For sure, the way the "insert" frame is initialized in Gutenberg
 is a bit different from Classic Editor.

 Seems to me in Gutenberg this button is rendered only after a block with
 an image is added:

 [[Image(http://cldup.com/QqpNyL_itl.jpg)]]

 Worth also noting that a new `insert` frame is rendered each time a block
 with an image is added. In this scenario, there are multiple insert frames
 and multiple buttons:

 [[Image(http://cldup.com/PTGQSfg-PM.jpg)]]

 To my understanding, this is different from core Classic Editor, where
 same care has been taken to reuse the insert frame, if it already exists.
 For a simple example of the core usage, see
 https://core.trac.wordpress.org/browser/trunk/src/js/_enqueues/admin
 /custom-background.js?rev=43347&marks=86-143#L79

 If I remember correctly, there are other places in core where a similar
 check runs.

 Not sure initializing multiple insert media frames is ideal from a
 performance perspective. Regardless, the button should be hidden either
 with `display: none` or `visibility: hidden` until there's the actual need
 to use it. (Not 100% sure but I ''think'' it's never actually used and
 works as sort of fallback).

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