Ticket #47458: 47458.2.diff

src/js/media/views/attachment/details.js

@@ -18 +18 @@
         className: 'attachment-details',
         template:  wp.template('attachment-details'),
 
-        attributes: function() {
-                return {
-                        'tabIndex':     0,
-                        'data-id':      this.model.get( 'id' )
-                };
-        },
+        /*
+         * Reset all the attributes inherited from Attachment, including role=checkbox,
+         * tabindex, etc. that are inappropriate here. See #47458 and [30483] / #30390.
+         */
+        attributes: {},
 
         events: {
                 'change [data-setting]':          'updateSetting',

src/js/media/views/frame/edit-attachments.js

@@ -80 +80 @@
                 // Initialize modal container view.
                 if ( this.options.modal ) {
                         this.modal = new wp.media.view.Modal({
-                                controller: this,
-                                title:      this.options.title
+                                controller:     this,
+                                title:          this.options.title,
+                                hasCloseButton: false
                         });
 
                         this.modal.on( 'open', _.bind( function () {

src/js/media/views/modal.js

@@ -26 +26 @@
 
         initialize: function() {
                 _.defaults( this.options, {
-                        container: document.body,
-                        title:     '',
-                        propagate: true
+                        container:      document.body,
+                        title:          '',
+                        propagate:      true,
+                        hasCloseButton: true
                 });
 
                 this.focusManager = new wp.media.view.FocusManager({
@@ -40 +41 @@
          */
         prepare: function() {
                 return {
-                        title: this.options.title
+                        title:          this.options.title,
+                        hasCloseButton: this.options.hasCloseButton
                 };
         },
 

src/wp-includes/media-template.php

@@ -188 +188 @@
         <?php // Template for the media modal. ?>
         <script type="text/html" id="tmpl-media-modal">
                 <div tabindex="0" class="<?php echo $class; ?>">
-                        <button type="button" class="media-modal-close"><span class="media-modal-icon"><span class="screen-reader-text"><?php _e( 'Close media panel' ); ?></span></span></button>
+                        <# if ( data.hasCloseButton ) { #>
+                                <button type="button" class="media-modal-close"><span class="media-modal-icon"><span class="screen-reader-text"><?php _e( 'Close dialog' ); ?></span></span></button>
+                        <# } #>
                         <div class="media-modal-content"></div>
                 </div>
                 <div class="media-modal-backdrop"></div>
@@ -323 +325 @@
                 <div class="edit-media-header">
                         <button class="left dashicons <# if ( ! data.hasPrevious ) { #> disabled <# } #>"><span class="screen-reader-text"><?php _e( 'Previous' ); ?></span></button>
                         <button class="right dashicons <# if ( ! data.hasNext ) { #> disabled <# } #>"><span class="screen-reader-text"><?php _e( 'Next' ); ?></span></button>
+                        <button type="button" class="media-modal-close"><span class="media-modal-icon"><span class="screen-reader-text"><?php _e( 'Close dialog' ); ?></span></span></button>
                 </div>
                 <div class="media-frame-title"></div>
                 <div class="media-frame-content"></div>