WordPress.org

Make WordPress Core

Ticket #42852: 42852.diff

File 42852.diff, 13.2 KB (added by afercia, 3 years ago)
  • src/wp-admin/css/forms.css

     
    443443        vertical-align: baseline;
    444444}
    445445
     446.wp-generate-pw + .wp-pwd {
     447        margin-top: 1em;
     448}
     449
    446450#pass-strength-result {
    447451        background-color: #eee;
    448452        border: 1px solid #ddd;
  • src/wp-admin/css/login.css

     
    7474}
    7575
    7676.login .password-input-wrapper {
    77     display: table;
     77        display: table;
    7878}
    7979
    8080.login .input.password-input {
    81     display: table-cell;
    82     margin: 0;
     81        display: table-cell;
     82        margin: 0;
    8383}
    8484
    8585.login .pw-weak {
    86     margin-bottom: 15px;
     86        margin-bottom: 15px;
    8787}
    8888
     89.login .wp-hide-pw-wrapper {
     90        display: table-cell;
     91        vertical-align: top;
     92}
     93
    8994.login .button.button-secondary {
    90     display: table-cell;
    91     border-radius: 0;
    92     vertical-align: middle;
     95        height: 36px;
     96        margin: 0;
     97        border-radius: 0;
     98        line-height: normal;
    9399}
    94100
     101.login .wp-hide-pw .dashicons {
     102        position: static;
     103}
     104
    95105.login form {
    96106        margin-top: 20px;
    97107        margin-left: 0;
  • src/wp-admin/install.php

     
    137137                <?php if ( ! $user_table ) : ?>
    138138                <tr class="form-field form-required user-pass1-wrap">
    139139                        <th scope="row">
    140                                 <label for="pass1">
     140                                <label for="pass1" class="user-pass1-label">
    141141                                        <?php _e( 'Password' ); ?>
    142142                                </label>
    143143                        </th>
  • src/wp-admin/js/user-profile.js

     
    11/* global ajaxurl, pwsL10n, userProfileL10n */
    22(function($) {
    33        var updateLock = false,
    4 
    54                $pass1Row,
    65                $pass1Wrap,
    76                $pass1,
     
    1413                $submitButtons,
    1514                $submitButton,
    1615                currentPass,
    17                 inputEvent;
     16                inputEvent,
     17                $passwordWrapper;
    1818
    1919        /*
    2020         * Use feature detection to determine whether password inputs should use
     
    3131                if ( typeof zxcvbn !== 'function' ) {
    3232                        setTimeout( generatePassword, 50 );
    3333                        return;
    34                 } else if ( ! $pass1.val() ) {
     34                } else if ( ! $pass1.val() || $passwordWrapper.hasClass( 'is-open' ) ) {
    3535                        // zxcvbn loaded before user entered password.
    3636                        $pass1.val( $pass1.data( 'pw' ) );
    3737                        $pass1.trigger( 'pwupdate' );
    3838                        showOrHideWeakPasswordCheckbox();
    39                 }
    40                 else {
     39                } else {
    4140                        // zxcvbn loaded after the user entered password, check strength.
    4241                        check_pass_strength();
    4342                        showOrHideWeakPasswordCheckbox();
    4443                }
    4544
     45                // Install screen.
    4646                if ( 1 !== parseInt( $toggleButton.data( 'start-masked' ), 10 ) ) {
     47                        // Show the password not masked if admin_password hasn't been posted yet.
    4748                        $pass1Wrap.addClass( 'show-password' );
    4849                } else {
     50                        // Otherwise, mask the password.
    4951                        $toggleButton.trigger( 'click' );
    5052                }
    5153
     
    109111                                .removeClass( 'dashicons-visibility' )
    110112                                .addClass( 'dashicons-hidden' );
    111113
    112                 $pass1Text.focus();
    113 
    114114                $pass1Label.attr( 'for', 'pass1-text' );
    115115        }
    116116
     
    121121                                $pass1Wrap.addClass( 'show-password' );
    122122
    123123                                resetToggle();
    124 
    125                                 if ( ! _.isUndefined( $pass1Text[0].setSelectionRange ) ) {
    126                                         $pass1Text[0].setSelectionRange( 0, 100 );
    127                                 }
    128124                        } else {
    129125                                $pass1Wrap.removeClass( 'show-password' );
    130126                                $toggleButton
     
    139135                                                .removeClass('dashicons-hidden')
    140136                                                .addClass('dashicons-visibility');
    141137
    142                                 $pass1.focus();
    143 
    144138                                $pass1Label.attr( 'for', 'pass1' );
    145 
    146                                 if ( ! _.isUndefined( $pass1[0].setSelectionRange ) ) {
    147                                         $pass1[0].setSelectionRange( 0, 100 );
    148                                 }
    149139                        }
    150140                });
    151141        }
    152142
    153143        function bindPasswordForm() {
    154                 var $passwordWrapper,
    155                         $generateButton,
     144                var $generateButton,
    156145                        $cancelButton;
    157146
    158147                $pass1Row = $('.user-pass1-wrap');
    159                 $pass1Label = $pass1Row.find('th label').attr( 'for', 'pass1-text' );
     148                $pass1Label = $pass1Row.find( '.user-pass1-label' ).attr( 'for', 'pass1-text' );
    160149
    161                 // hide this
     150                // Hide the Repeat Password field.
    162151                $('.user-pass2-wrap').hide();
    163152
    164153                $submitButton = $( '#submit, #wp-submit' ).on( 'click', function () {
     
    178167                        bindPass1();
    179168                }
    180169
    181                 /**
     170                /*
    182171                 * Fix a LastPass mismatch issue, LastPass only changes pass2.
    183172                 *
    184173                 * This fixes the issue by copying any changes from the hidden
     
    205194
    206195                bindToggleButton();
    207196
    208                 if ( $generateButton.length ) {
    209                         $passwordWrapper.hide();
    210                 }
    211 
    212                 $generateButton.show();
    213197                $generateButton.on( 'click', function () {
    214198                        updateLock = true;
    215199
    216                         $generateButton.hide();
    217                         $passwordWrapper.show();
     200                        $generateButton.attr( 'aria-expanded', 'true' );
    218201
     202                        $passwordWrapper
     203                                .show()
     204                                .addClass( 'is-open' );
     205
    219206                        // Enable the inputs when showing.
    220207                        $pass1.attr( 'disabled', false );
    221208                        $pass2.attr( 'disabled', false );
    222209                        $pass1Text.attr( 'disabled', false );
    223210
    224                         if ( $pass1Text.val().length === 0 ) {
    225                                 generatePassword();
    226                         }
    227 
    228                         _.defer( function() {
    229                                 $pass1Text.focus();
    230                                 if ( ! _.isUndefined( $pass1Text[0].setSelectionRange ) ) {
    231                                         $pass1Text[0].setSelectionRange( 0, 100 );
    232                                 }
    233                         }, 0 );
     211                        // Always generate a password when clicking the button.
     212                        // Generate a new password.
     213                        wp.ajax.post( 'generate-password' )
     214                                .done( function( data ) {
     215                                        $pass1.data( 'pw', data );
     216                                        generatePassword();
     217                                        resetToggle();
     218                                } );
    234219                } );
    235220
    236221                $cancelButton = $pass1Row.find( 'button.wp-cancel-pw' );
     
    237222                $cancelButton.on( 'click', function () {
    238223                        updateLock = false;
    239224
    240                         // Clear any entered password.
     225                        // Clear password field to prevent update.
    241226                        $pass1Text.val( '' );
    242 
    243                         // Generate a new password.
    244                         wp.ajax.post( 'generate-password' )
    245                                 .done( function( data ) {
    246                                         $pass1.data( 'pw', data );
    247                                 } );
    248 
    249                         $generateButton.show();
    250                         $passwordWrapper.hide();
    251 
    252                         $weakRow.hide( 0, function () {
    253                                 $weakCheckbox.removeProp( 'checked' );
    254                         } );
    255 
    256                         // Disable the inputs when hiding to prevent autofill and submission.
    257                         $pass1.prop( 'disabled', true );
    258                         $pass2.prop( 'disabled', true );
    259                         $pass1Text.prop( 'disabled', true );
    260 
    261                         resetToggle();
    262 
    263                         if ( $pass1Row.closest( 'form' ).is( '#your-profile' ) ) {
    264                                 // Clear password field to prevent update
    265                                 $pass1.val( '' ).trigger( 'pwupdate' );
    266                                 $submitButtons.prop( 'disabled', false );
    267                         }
     227                        $pass1.val( '' ).trigger( 'pwupdate' );
    268228                } );
    269229
    270230                $pass1Row.closest( 'form' ).on( 'submit', function () {
     
    373333                                });
    374334                        });
    375335
    376                         /**
    377                          * Replaces "Howdy, *" in the admin toolbar whenever the display name dropdown is updated for one's own profile.
     336                        /*
     337                         * Replaces "Howdy, *" in the admin toolbar whenever the display name
     338                         * dropdown is updated for one's own profile.
    378339                         */
    379340                        select.on( 'change', function() {
    380341                                if ( user_id !== current_user_id ) {
     
    460421
    461422        window.generatePassword = generatePassword;
    462423
    463         /* Warn the user if password was generated but not saved */
     424        // Warn the user if password was generated but not saved.
    464425        $( window ).on( 'beforeunload', function () {
    465426                if ( true === updateLock ) {
    466427                        return userProfileL10n.warn;
  • src/wp-admin/user-edit.php

     
    601601        <h2><?php _e( 'Account Management' ); ?></h2>
    602602<table class="form-table">
    603603<tr id="password" class="user-pass1-wrap">
    604         <th><label for="pass1"><?php _e( 'New Password' ); ?></label></th>
     604        <th><label for="pass1" class="user-pass1-label"><?php _e( 'New Password' ); ?></label></th>
    605605        <td>
    606606                <input class="hidden" value=" " /><!-- #24364 workaround -->
    607                 <button type="button" class="button wp-generate-pw hide-if-no-js"><?php _e( 'Generate Password' ); ?></button>
     607                <button type="button" class="button wp-generate-pw hide-if-no-js" aria-expanded="false"><?php _e( 'Set New Password' ); ?></button>
    608608                <div class="wp-pwd hide-if-js">
    609609                        <span class="password-input-wrapper">
    610610                                <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" />
     
    613613                                <span class="dashicons dashicons-hidden"></span>
    614614                                <span class="text"><?php _e( 'Hide' ); ?></span>
    615615                        </button>
    616                         <button type="button" class="button wp-cancel-pw hide-if-no-js" data-toggle="0" aria-label="<?php esc_attr_e( 'Cancel password change' ); ?>">
     616                        <button type="button" class="button wp-cancel-pw hide-if-no-js" data-toggle="0" aria-label="<?php esc_attr_e( 'Cancel' ); ?>">
    617617                                <span class="text"><?php _e( 'Cancel' ); ?></span>
    618618                        </button>
    619619                        <div style="display:none" id="pass-strength-result" aria-live="polite"></div>
     
    623623<tr class="user-pass2-wrap hide-if-js">
    624624        <th scope="row"><label for="pass2"><?php _e( 'Repeat New Password' ); ?></label></th>
    625625        <td>
    626         <input name="pass2" type="password" id="pass2" class="regular-text" value="" autocomplete="off" />
    627         <p class="description"><?php _e( 'Type your new password again.' ); ?></p>
     626        <input name="pass2" type="password" id="pass2" class="regular-text" value="" autocomplete="off" aria-describedby="pass2-desc" />
     627        <?php if ( IS_PROFILE_PAGE ) : ?>
     628                <p class="description" id="pass2-desc"><?php _e( 'Type your new password again.' ); ?></p>
     629        <?php else : ?>
     630                <p class="description" id="pass2-desc"><?php _e( 'Type the new password again.' ); ?></p>
     631        <?php endif; ?>
    628632        </td>
    629633</tr>
    630634<tr class="pw-weak">
     
    632636        <td>
    633637                <label>
    634638                        <input type="checkbox" name="pw_weak" class="pw-checkbox" />
    635                         <span id="pw-weak-text-label"><?php _e( 'Confirm use of potentially weak password' ); ?></span>
     639                        <span id="pw-weak-text-label"><?php _e( 'Confirm use of weak password' ); ?></span>
    636640                </label>
    637641        </td>
    638642</tr>
  • src/wp-admin/user-new.php

     
    485485        </tr>
    486486        <tr class="form-field form-required user-pass1-wrap">
    487487                <th scope="row">
    488                         <label for="pass1">
     488                        <label for="pass1" class="user-pass1-label">
    489489                                <?php _e( 'Password' ); ?>
    490490                                <span class="description hide-if-js"><?php _e( '(required)' ); ?></span>
    491491                        </label>
     
    492492                </th>
    493493                <td>
    494494                        <input class="hidden" value=" " /><!-- #24364 workaround -->
    495                         <button type="button" class="button wp-generate-pw hide-if-no-js"><?php _e( 'Show password' ); ?></button>
     495                        <button type="button" class="button wp-generate-pw hide-if-no-js" aria-expanded="false"><?php _e( 'Set New Password' ); ?></button>
    496496                        <div class="wp-pwd hide-if-js">
    497497                                <?php $initial_password = wp_generate_password( 24 ); ?>
    498498                                <span class="password-input-wrapper">
     
    502502                                        <span class="dashicons dashicons-hidden"></span>
    503503                                        <span class="text"><?php _e( 'Hide' ); ?></span>
    504504                                </button>
    505                                 <button type="button" class="button wp-cancel-pw hide-if-no-js" data-toggle="0" aria-label="<?php esc_attr_e( 'Cancel password change' ); ?>">
     505                                <button type="button" class="button wp-cancel-pw hide-if-no-js" data-toggle="0" aria-label="<?php esc_attr_e( 'Cancel' ); ?>">
    506506                                        <span class="text"><?php _e( 'Cancel' ); ?></span>
    507507                                </button>
    508508                                <div style="display:none" id="pass-strength-result" aria-live="polite"></div>
     
    512512        <tr class="form-field form-required user-pass2-wrap hide-if-js">
    513513                <th scope="row"><label for="pass2"><?php _e( 'Repeat Password' ); ?> <span class="description"><?php _e( '(required)' ); ?></span></label></th>
    514514                <td>
    515                 <input name="pass2" type="password" id="pass2" autocomplete="off" />
     515                <input name="pass2" type="password" id="pass2" autocomplete="off" aria-describedby="pass2-desc" />
     516                <p class="description" id="pass2-desc"><?php _e( 'Type the password again.' ); ?></p>
    516517                </td>
    517518        </tr>
    518519        <tr class="pw-weak">
  • src/wp-login.php

     
    706706
    707707        <div class="user-pass1-wrap">
    708708                <p>
    709                         <label for="pass1"><?php _e( 'New password' ); ?></label>
     709                        <label for="pass1" class="user-pass1-label"><?php _e( 'New password' ); ?></label>
    710710                </p>
    711711
    712                 <div class="wp-pwd">
     712                <div class="login-wp-pwd">
    713713                        <div class="password-input-wrapper">
    714714                                <input type="password" data-reveal="1" data-pw="<?php echo esc_attr( wp_generate_password( 16 ) ); ?>" name="pass1" id="pass1" class="input password-input" size="24" value="" autocomplete="off" aria-describedby="pass-strength-result" />
    715                                 <span class="button button-secondary wp-hide-pw hide-if-no-js">
    716                                         <span class="dashicons dashicons-hidden"></span>
    717                                 </span>
     715                                <span class="wp-hide-pw-wrapper">
     716                                        <button type="button" class="button button-secondary wp-hide-pw hide-if-no-js">
     717                                                <span class="dashicons dashicons-hidden"></span>
     718                                        </button>
     719                        </span>
    718720                        </div>
    719721                        <div id="pass-strength-result" class="hide-if-no-js" aria-live="polite"><?php _e( 'Strength indicator' ); ?></div>
    720722                </div>