From cdd8b92ea6ab20cc68484c32fc50abe333edbebe Mon Sep 17 00:00:00 2001 From: Andrea Fercia Date: Wed, 20 May 2020 13:31:32 +0000 Subject: [PATCH] Accessibility: Media: Hide the invisible "file input" on media views from assistive technologies. The file input button is visually hidden, but was announced by screen readers in workflows unrelated to file uploads. It is now hidden from assistive technologies by the means of an `aria-hidden` attribute, as its CSS display property must not be changed to make sure it still works on old browsers. See #49753. Fixes #47611. git-svn-id: https://develop.svn.wordpress.org/trunk@47834 602fd350-edb4-49c9-b593-d223f7449a82 --- .../_enqueues/vendor/plupload/wp-plupload.js | 19 ++++++++++++------- 1 file changed, 12 insertions(+), 7 deletions(-) diff --git a/src/js/_enqueues/vendor/plupload/wp-plupload.js b/src/js/_enqueues/vendor/plupload/wp-plupload.js index e42288fbe4..6839fd81d7 100644 --- a/src/js/_enqueues/vendor/plupload/wp-plupload.js +++ b/src/js/_enqueues/vendor/plupload/wp-plupload.js @@ -120,8 +120,7 @@ window.wp = window.wp || {}; * @param {plupload.File} file File that was uploaded. */ tryAgain = function( message, data, file ) { - var times; - var id; + var times, id; if ( ! data || ! data.responseHeaders ) { error( pluploadL10n.http_error_image, data, file, 'no-retry' ); @@ -210,8 +209,8 @@ window.wp = window.wp || {}; * @param {string} retry Whether to try again to create image sub-sizes. Passing 'no-retry' will prevent it. */ error = function( message, data, file, retry ) { - var isImage = file.type && file.type.indexOf( 'image/' ) === 0; - var status = data && data.status; + var isImage = file.type && file.type.indexOf( 'image/' ) === 0, + status = data && data.status; // If the file is an image and the error is HTTP 5xx try to create sub-sizes again. if ( retry !== 'no-retry' && isImage && status >= 500 && status < 600 ) { @@ -327,10 +326,16 @@ window.wp = window.wp || {}; this.browser.on( 'mouseenter', this.refresh ); } else { this.uploader.disableBrowse( true ); - // If HTML5 mode, hide the auto-created file container. - $('#' + this.uploader.id + '_html5_container').hide(); } + $( self ).on( 'uploader:ready', function() { + $( '.moxie-shim-html5 input[type="file"]' ) + .attr( { + tabIndex: '-1', + 'aria-hidden': 'true' + } ); + } ); + /** * After files were filtered and added to the queue, create a model for each. * @@ -521,7 +526,7 @@ window.wp = window.wp || {}; /* * If the browser node is not attached to the DOM, - * use a temporary container to house it, as the browser button shims + * use a temporary container to house it, as the browser button shims * require the button to exist in the DOM at all times. */ if ( ! attached ) {