WordPress.org

Make WordPress Core

Ticket #37383: 37383.diff

File 37383.diff, 2.2 KB (added by afercia, 4 years ago)
  • src/wp-admin/js/theme.js

     
    669669                this.$el.toggleClass( 'active', this.model.get( 'active' ) );
    670670        },
    671671
    672         // Keeps :focus within the theme details elements
     672        // Set initial focus and constrain tabbing within the theme browser modal.
    673673        containFocus: function( $el ) {
    674                 var $target;
    675674
    676                 // Move focus to the primary action
     675                // Set initial focus on the primary action control.
    677676                _.delay( function() {
    678677                        $( '.theme-wrap a.button-primary:visible' ).focus();
    679                 }, 500 );
     678                }, 100 );
    680679
     680                // Constrain tabbing within the modal.
    681681                $el.on( 'keydown.wp-themes', function( event ) {
     682                        var $firstFocusable = $el.find( '.theme-header button:not(.disabled)' ).first(),
     683                                $lastFocusable = $el.find( '.theme-actions a:visible' ).last();
    682684
    683                         // Tab key
    684                         if ( event.which === 9 ) {
    685                                 $target = $( event.target );
    686 
    687                                 // Keep focus within the overlay by making the last link on theme actions
    688                                 // switch focus to button.left on tabbing and vice versa
    689                                 if ( $target.is( 'button.left' ) && event.shiftKey ) {
    690                                         $el.find( '.theme-actions a:last-child' ).focus();
     685                        // Check for the Tab key.
     686                        if ( 9 === event.which ) {
     687                                if ( $firstFocusable[0] === event.target && event.shiftKey ) {
     688                                        $lastFocusable.focus();
    691689                                        event.preventDefault();
    692                                 } else if ( $target.is( '.theme-actions a:last-child' ) ) {
    693                                         $el.find( 'button.left' ).focus();
     690                                } else if ( $lastFocusable[0] === event.target && ! event.shiftKey ) {
     691                                        $firstFocusable.focus();
    694692                                        event.preventDefault();
    695693                                }
    696694                        }
     
    747745
    748746                // Disable Left/Right when at the start or end of the collection
    749747                if ( this.model.cid === this.model.collection.at(0).cid ) {
    750                         this.$el.find( '.left' ).addClass( 'disabled' );
     748                        this.$el.find( '.left' )
     749                                .addClass( 'disabled' )
     750                                .prop( 'disabled', true );
    751751                }
    752752                if ( this.model.cid === this.model.collection.at( this.model.collection.length - 1 ).cid ) {
    753                         this.$el.find( '.right' ).addClass( 'disabled' );
     753                        this.$el.find( '.right' )
     754                                .addClass( 'disabled' )
     755                                .prop( 'disabled', true );
    754756                }
    755757        },
    756758