WordPress.org

Make WordPress Core

Ticket #42852: 42852.4.diff

File 42852.4.diff, 9.3 KB (added by bookdude13, 7 months ago)

A cleaner refresh

  • src/js/_enqueues/admin/user-profile.js

    diff --git src/js/_enqueues/admin/user-profile.js src/js/_enqueues/admin/user-profile.js
    index ff4830242c..4fc0a2134f 100644
     
    1414                $toggleButton,
    1515                $submitButtons,
    1616                $submitButton,
    17                 currentPass;
     17                currentPass,
     18                $passwordWrapper;
    1819
    1920        function generatePassword() {
    2021                if ( typeof zxcvbn !== 'function' ) {
    2122                        setTimeout( generatePassword, 50 );
    2223                        return;
    23                 } else if ( ! $pass1.val() ) {
    24                         // zxcvbn loaded before user entered password.
     24                } else if ( ! $pass1.val() || $passwordWrapper.hasClass( 'is-open' ) ) {
     25                        // zxcvbn loaded before user entered password, or generating new password.
    2526                        $pass1.val( $pass1.data( 'pw' ) );
    2627                        $pass1.trigger( 'pwupdate' );
    2728                        showOrHideWeakPasswordCheckbox();
    28                 }
    29                 else {
     29                } else {
    3030                        // zxcvbn loaded after the user entered password, check strength.
    3131                        check_pass_strength();
    3232                        showOrHideWeakPasswordCheckbox();
    3333                }
    3434
     35                // Install screen.
    3536                if ( 1 !== parseInt( $toggleButton.data( 'start-masked' ), 10 ) ) {
     37                        // Show the password not masked if admin_password hasn't been posted yet.
    3638                        $pass1.attr( 'type', 'text' );
    3739                } else {
     40                        // Otherwise, mask the password.
    3841                        $toggleButton.trigger( 'click' );
    3942                }
    4043
     
    5659
    5760                        currentPass = $pass1.val();
    5861
     62                        // Refresh password strength area
    5963                        $pass1.removeClass( 'short bad good strong' );
    6064                        showOrHideWeakPasswordCheckbox();
    6165                } );
     
    8488                                $pass1.attr( 'type', 'password' );
    8589                                resetToggle( true );
    8690                        }
    87 
    88                         $pass1.focus();
    89 
    90                         if ( ! _.isUndefined( $pass1[0].setSelectionRange ) ) {
    91                                 $pass1[0].setSelectionRange( 0, 100 );
    92                         }
    9391                });
    9492        }
    9593
    9694        function bindPasswordForm() {
    97                 var $passwordWrapper,
    98                         $generateButton,
     95                var $generateButton,
    9996                        $cancelButton;
    10097
    10198                $pass1Row = $( '.user-pass1-wrap, .user-pass-wrap' );
     
    123120                        $pass1 = $( '#user_pass' );
    124121                }
    125122
    126                 /**
     123                /*
    127124                 * Fix a LastPass mismatch issue, LastPass only changes pass2.
    128125                 *
    129126                 * This fixes the issue by copying any changes from the hidden
     
    149146
    150147                bindToggleButton();
    151148
    152                 if ( $generateButton.length ) {
    153                         $passwordWrapper.hide();
    154                 }
    155 
    156149                $generateButton.show();
    157150                $generateButton.on( 'click', function () {
    158151                        updateLock = true;
    159152
    160                         $generateButton.hide();
    161                         $passwordWrapper.show();
     153                        // Make sure the password fields are shown.
     154                        $generateButton.attr( 'aria-expanded', 'true' );
     155                        $passwordWrapper
     156                                .show()
     157                                .addClass( 'is-open' );
    162158
    163159                        // Enable the inputs when showing.
    164160                        $pass1.attr( 'disabled', false );
    165161                        $pass2.attr( 'disabled', false );
    166162
    167                         if ( $pass1.val().length === 0 ) {
    168                                 generatePassword();
    169                         }
    170                 } );
    171 
    172                 $cancelButton = $pass1Row.find( 'button.wp-cancel-pw' );
    173                 $cancelButton.on( 'click', function () {
    174                         updateLock = false;
    175 
    176                         // Clear any entered password.
    177                         $pass1.val( '' );
    178 
    179                         // Generate a new password.
     163                        // Generate a new password each time it opens
    180164                        wp.ajax.post( 'generate-password' )
    181165                                .done( function( data ) {
     166                                        // Set password in data attribute
    182167                                        $pass1.data( 'pw', data );
    183                                 } );
    184168
    185                         $generateButton.show().focus();
    186                         $passwordWrapper.hide();
     169                                        // Actually update the password
     170                                        generatePassword();
    187171
    188                         $weakRow.hide( 0, function () {
    189                                 $weakCheckbox.removeProp( 'checked' );
    190                         } );
     172                                        // Show generated password in plaintext by default
     173                                        resetToggle ( false );
     174                                } );
     175                } );
     176
     177                $cancelButton = $pass1Row.find( 'button.wp-cancel-pw' );
     178                $cancelButton.on( 'click', function () {
     179                        updateLock = false;
    191180
    192181                        // Disable the inputs when hiding to prevent autofill and submission.
    193182                        $pass1.prop( 'disabled', true );
    194183                        $pass2.prop( 'disabled', true );
    195184
     185                        // Clear password field and update the ui
     186                        $pass1.val( '' ).trigger( 'pwupdate' );
    196187                        resetToggle( false );
    197188
    198189                        if ( $pass1Row.closest( 'form' ).is( '#your-profile' ) ) {
    199                                 // Clear password field to prevent update.
    200                                 $pass1.val( '' ).trigger( 'pwupdate' );
     190                                // Stop an empty password from being submitted as a change
    201191                                $submitButtons.prop( 'disabled', false );
    202192                        }
    203193                } );
     
    399389
    400390        window.generatePassword = generatePassword;
    401391
    402         /* Warn the user if password was generated but not saved */
     392        // Warn the user if password was generated but not saved.
    403393        $( window ).on( 'beforeunload', function () {
    404394                if ( true === updateLock ) {
    405395                        return userProfileL10n.warn;
  • src/wp-admin/css/forms.css

    diff --git src/wp-admin/css/forms.css src/wp-admin/css/forms.css
    index f86fbddd68..512a847329 100644
    fieldset label, 
    529529        margin: 0 0 1em;
    530530}
    531531
     532.wp-generate-pw {
     533        margin-top: 1em;
     534}
     535
     536.wp-pwd {
     537        margin-top: 1em;
     538}
     539
    532540#misc-publishing-actions label {
    533541        vertical-align: baseline;
    534542}
  • src/wp-admin/user-edit.php

    diff --git src/wp-admin/user-edit.php src/wp-admin/user-edit.php
    index de5131af24..bb75b5dc59 100644
    endif; 
    628628        <th><label for="pass1"><?php _e( 'New Password' ); ?></label></th>
    629629        <td>
    630630                <input class="hidden" value=" " /><!-- #24364 workaround -->
    631                 <button type="button" class="button wp-generate-pw hide-if-no-js"><?php _e( 'Generate Password' ); ?></button>
     631                <button type="button" class="button wp-generate-pw hide-if-no-js" aria-expanded="false"><?php _e( 'Set New Password' ); ?></button>
    632632                <div class="wp-pwd hide-if-js">
    633633                        <span class="password-input-wrapper">
    634634                                <input type="password" name="pass1" id="pass1" class="regular-text" value="" autocomplete="off" data-pw="<?php echo esc_attr( wp_generate_password( 24 ) ); ?>" aria-describedby="pass-strength-result" />
    endif; 
    637637                                <span class="dashicons dashicons-hidden" aria-hidden="true"></span>
    638638                                <span class="text"><?php _e( 'Hide' ); ?></span>
    639639                        </button>
    640                         <button type="button" class="button wp-cancel-pw hide-if-no-js" data-toggle="0" aria-label="<?php esc_attr_e( 'Cancel password change' ); ?>">
     640                        <button type="button" class="button wp-cancel-pw hide-if-no-js" data-toggle="0" aria-label="<?php esc_attr_e( 'Cancel' ); ?>">
    641641                                <span class="dashicons dashicons-no" aria-hidden="true"></span>
    642642                                <span class="text"><?php _e( 'Cancel' ); ?></span>
    643643                        </button>
    endif; 
    648648<tr class="user-pass2-wrap hide-if-js">
    649649        <th scope="row"><label for="pass2"><?php _e( 'Repeat New Password' ); ?></label></th>
    650650        <td>
    651         <input name="pass2" type="password" id="pass2" class="regular-text" value="" autocomplete="off" />
    652         <p class="description"><?php _e( 'Type your new password again.' ); ?></p>
     651        <input name="pass2" type="password" id="pass2" class="regular-text" value="" autocomplete="off" aria-describedby="pass2-desc" />
     652        <?php if ( IS_PROFILE_PAGE ) : ?>
     653                <p class="description" id="pass2-desc"><?php _e( 'Type your new password again.' ); ?></p>
     654        <?php else : ?>
     655                <p class="description" id="pass2-desc"><?php _e( 'Type the new password again.' ); ?></p>
     656        <?php endif; ?>
    653657        </td>
    654658</tr>
    655659<tr class="pw-weak">
    endif; 
    657661        <td>
    658662                <label>
    659663                        <input type="checkbox" name="pw_weak" class="pw-checkbox" />
    660                         <span id="pw-weak-text-label"><?php _e( 'Confirm use of potentially weak password' ); ?></span>
     664                        <span id="pw-weak-text-label"><?php _e( 'Confirm use of weak password' ); ?></span>
    661665                </label>
    662666        </td>
    663667</tr>
  • src/wp-admin/user-new.php

    diff --git src/wp-admin/user-new.php src/wp-admin/user-new.php
    index be4b5083bc..c2d9d0532a 100644
    if ( current_user_can( 'create_users' ) ) { 
    507507                </th>
    508508                <td>
    509509                        <input class="hidden" value=" " /><!-- #24364 workaround -->
    510                         <button type="button" class="button wp-generate-pw hide-if-no-js"><?php _e( 'Show password' ); ?></button>
    511                         <div class="wp-pwd hide-if-js">
     510                        <button type="button" class="button wp-generate-pw hide-if-no-js" aria-expanded="true"><?php _e( 'Generate New Password' ); ?></button>
     511                        <div class="wp-pwd">
    512512                                <?php $initial_password = wp_generate_password( 24 ); ?>
    513513                                <span class="password-input-wrapper">
    514514                                        <input type="password" name="pass1" id="pass1" class="regular-text" autocomplete="off" data-reveal="1" data-pw="<?php echo esc_attr( $initial_password ); ?>" aria-describedby="pass-strength-result" />
    if ( current_user_can( 'create_users' ) ) { 
    517517                                        <span class="dashicons dashicons-hidden" aria-hidden="true"></span>
    518518                                        <span class="text"><?php _e( 'Hide' ); ?></span>
    519519                                </button>
    520                                 <button type="button" class="button wp-cancel-pw hide-if-no-js" data-toggle="0" aria-label="<?php esc_attr_e( 'Cancel password change' ); ?>">
     520                                <button type="button" class="button wp-cancel-pw hide-if-no-js" data-toggle="0" aria-label="<?php esc_attr_e( 'Cancel' ); ?>">
    521521                                        <span class="dashicons dashicons-no" aria-hidden="true"></span>
    522522                                        <span class="text"><?php _e( 'Cancel' ); ?></span>
    523523                                </button>
    if ( current_user_can( 'create_users' ) ) { 
    528528        <tr class="form-field form-required user-pass2-wrap hide-if-js">
    529529                <th scope="row"><label for="pass2"><?php _e( 'Repeat Password' ); ?> <span class="description"><?php _e( '(required)' ); ?></span></label></th>
    530530                <td>
    531                 <input name="pass2" type="password" id="pass2" autocomplete="off" />
     531                <input name="pass2" type="password" id="pass2" autocomplete="off" aria-describedby="pass2-desc" />
     532                <p class="description" id="pass2-desc"><?php _e( 'Type the password again.' ); ?></p>
    532533                </td>
    533534        </tr>
    534535        <tr class="pw-weak">