WordPress.org

Make WordPress Core

Changeset 35681


Ignore:
Timestamp:
11/18/2015 08:09:21 PM (6 years ago)
Author:
wonderboymusic
Message:

Plugins: add dismissible notices to update failures.

Adds unit test.

Props afercia, mehulkaklotar.
Fixes #33465.

Location:
trunk/src
Files:
4 edited

Legend:

Unmodified
Added
Removed
  • trunk/src/wp-admin/css/list-tables.css

    r35566 r35681  
    15791579}
    15801580
     1581.plugin-card-update-failed .update-now {
     1582    font-weight: 600;
     1583}
     1584
     1585.plugin-card-update-failed .notice-error {
     1586    margin: 0;
     1587    padding-left: 16px;
     1588    -webkit-box-shadow: 0 -1px 0 #dedede;
     1589    box-shadow: 0 -1px 0 #dedede;
     1590}
     1591
     1592.plugin-card-update-failed .plugin-card-bottom {
     1593    display: none;
     1594}
     1595
    15811596.plugin-card .column-rating {
    15821597    line-height: 23px;
  • trunk/src/wp-admin/js/common.js

    r35516 r35681  
    401401
    402402    // Make notices dismissible
    403     $( '.notice.is-dismissible' ).each( function() {
    404         var $this = $( this ),
    405             $button = $( '<button type="button" class="notice-dismiss"><span class="screen-reader-text"></span></button>' ),
    406             btnText = commonL10n.dismiss || '';
    407 
    408         // Ensure plain text
    409         $button.find( '.screen-reader-text' ).text( btnText );
    410 
    411         $this.append( $button );
    412 
    413         $button.on( 'click.wp-dismiss-notice', function( event ) {
    414             event.preventDefault();
    415             $this.fadeTo( 100 , 0, function() {
    416                 $(this).slideUp( 100, function() {
    417                     $(this).remove();
     403    function makeNoticesDismissible() {
     404        $( '.notice.is-dismissible' ).each( function() {
     405            var $el = $( this ),
     406                $button = $( '<button type="button" class="notice-dismiss"><span class="screen-reader-text"></span></button>' ),
     407                btnText = commonL10n.dismiss || '';
     408
     409            // Ensure plain text
     410            $button.find( '.screen-reader-text' ).text( btnText );
     411            $button.on( 'click.wp-dismiss-notice', function( event ) {
     412                event.preventDefault();
     413                $el.fadeTo( 100, 0, function() {
     414                    $el.slideUp( 100, function() {
     415                        $el.remove();
     416                    });
    418417                });
    419418            });
    420         });
     419
     420            $el.append( $button );
     421        });
     422    }
     423
     424    $document.on( 'wp-plugin-update-error', function() {
     425        makeNoticesDismissible();
    421426    });
    422427
     
    896901    setPinMenu();
    897902    currentMenuItemHasPopup();
     903    makeNoticesDismissible();
    898904
    899905    $document.on( 'wp-pin-menu wp-window-resized.pin-menu postboxes-columnchange.pin-menu postbox-toggled.pin-menu wp-collapse-menu.pin-menu wp-scroll-start.pin-menu', setPinMenu );
  • trunk/src/wp-admin/js/updates.js

    r35155 r35681  
    147147     */
    148148    wp.updates.updatePlugin = function( plugin, slug ) {
    149         var $message, name;
     149        var $message, name,
     150            $card = $( '.plugin-card-' + slug );
     151
    150152        if ( 'plugins' === pagenow || 'plugins-network' === pagenow ) {
    151153            $message = $( '[data-slug="' + slug + '"]' ).next().find( '.update-message' );
    152154        } else if ( 'plugin-install' === pagenow ) {
    153             $message = $( '.plugin-card-' + slug ).find( '.update-now' );
     155            $message = $card.find( '.update-now' );
    154156            name = $message.data( 'name' );
    155157            $message.attr( 'aria-label', wp.updates.l10n.updatingLabel.replace( '%s', name ) );
     158            // Remove previous error messages, if any.
     159            $card.removeClass( 'plugin-card-update-failed' ).find( '.notice.notice-error' ).remove();
    156160        }
    157161
     
    249253     */
    250254    wp.updates.updateError = function( response ) {
    251         var $message, name;
     255        var $card = $( '.plugin-card-' + response.slug ),
     256            $message,
     257            $button,
     258            name,
     259            error_message;
     260
    252261        wp.updates.updateDoneSuccessfully = false;
     262
    253263        if ( response.errorCode && response.errorCode == 'unable_to_connect_to_filesystem' && wp.updates.shouldRequestFilesystemCredentials ) {
    254264            wp.updates.credentialError( response, 'update-plugin' );
    255265            return;
    256266        }
     267
     268        error_message = wp.updates.l10n.updateFailed.replace( '%s', response.error );
     269
    257270        if ( 'plugins' === pagenow || 'plugins-network' === pagenow ) {
    258271            $message = $( '[data-slug="' + response.slug + '"]' ).next().find( '.update-message' );
     272            $message.html( error_message ).removeClass( 'updating-message' );
    259273        } else if ( 'plugin-install' === pagenow ) {
    260             $message = $( '.plugin-card-' + response.slug ).find( '.update-now' );
    261 
    262             name = $message.data( 'name' );
    263             $message.attr( 'aria-label', wp.updates.l10n.updateFailedLabel.replace( '%s', name ) );
    264         }
    265         $message.removeClass( 'updating-message' );
    266         $message.html( wp.updates.l10n.updateFailed.replace( '%s', response.error ) );
    267         wp.a11y.speak( wp.updates.l10n.updateFailed );
     274            $button = $card.find( '.update-now' );
     275            name = $button.data( 'name' );
     276
     277            $card
     278                .addClass( 'plugin-card-update-failed' )
     279                .append( '<div class="notice notice-error is-dismissible"><p>' + error_message + '</p></div>' );
     280
     281            $button
     282                .attr( 'aria-label', wp.updates.l10n.updateFailedLabel.replace( '%s', name ) )
     283                .html( wp.updates.l10n.updateFailedShort ).removeClass( 'updating-message' );
     284
     285            $card.on( 'click', '.notice.is-dismissible .notice-dismiss', function() {
     286                // Use same delay as the total duration of the notice fadeTo + slideUp animation.
     287                setTimeout( function() {
     288                    $card
     289                        .removeClass( 'plugin-card-update-failed' )
     290                        .find( '.column-name a' ).focus();
     291                }, 200 );
     292            });
     293        }
     294
     295        wp.a11y.speak( error_message, 'assertive' );
    268296
    269297        /*
  • trunk/src/wp-includes/script-loader.php

    r35615 r35681  
    584584                'updating'          => __( 'Updating...' ), // no ellipsis
    585585                'updated'           => __( 'Updated!' ),
     586                'updateFailedShort' => __( 'Update Failed!' ),
    586587                /* translators: Error string for a failed update */
    587588                'updateFailed'      => __( 'Update Failed: %s' ),
Note: See TracChangeset for help on using the changeset viewer.