Changeset 55974

Timestamp:

06/22/2023 12:30:41 AM (3 years ago)

Author:

joedolson

Message:

Administration: Hide password in options/writing.

Hide the password for the "Post via e-mail" settings in writing options. Use the same password hiding mechanisms in use elsewhere in core.

Props mastrup, denis-de-bernardy, ryan, brookedot, wojtek.szkutnik, dd32, sabreuse, sergeybiryukov, costdev, peterwilsoncc, zgrkaralar, clorith, renyot, sabernhardt, boniu91, ironprogrammer, bgoewert.
Fixes #9883.

Location:

trunk/src

Files:

• js/_enqueues/admin/user-profile.js (modified) (4 diffs)
• wp-admin/css/forms.css (modified) (1 diff)
• wp-admin/options-writing.php (modified) (2 diffs)

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

@@ -53 +53 @@
 
                 // Focus the password field.
-                $( $pass1 ).trigger( 'focus' );
+                if ( 'mailserver_pass' !== $pass1.prop('id' ) ) {
+                        $( $pass1 ).trigger( 'focus' );
+                }
         }
 
@@ -172 +174 @@
                         $cancelButton;
 
-                $pass1Row = $( '.user-pass1-wrap, .user-pass-wrap, .reset-pass-submit' );
+                $pass1Row = $( '.user-pass1-wrap, .user-pass-wrap, .mailserver-pass-wrap, .reset-pass-submit' );
 
                 // Hide the confirm password field when JavaScript support is enabled.
@@ -189 +191 @@
                 } );
 
-                $pass1 = $('#pass1');
+                $pass1 = $('#pass1, #mailserver_pass');
                 if ( $pass1.length ) {
                         bindPass1();
@@ -315 +317 @@
 
         function showOrHideWeakPasswordCheckbox() {
-                var passStrength = $('#pass-strength-result')[0];
-
-                if ( passStrength.className ) {
-                        $pass1.addClass( passStrength.className );
-                        if ( $( passStrength ).is( '.short, .bad' ) ) {
-                                if ( ! $weakCheckbox.prop( 'checked' ) ) {
-                                        $submitButtons.prop( 'disabled', true );
+                var passStrengthResult = $('#pass-strength-result');
+
+                if ( passStrengthResult.length ) {
+                        var passStrength = passStrengthResult[0];
+
+                        if ( passStrength.className ) {
+                                $pass1.addClass( passStrength.className );
+                                if ( $( passStrength ).is( '.short, .bad' ) ) {
+                                        if ( ! $weakCheckbox.prop( 'checked' ) ) {
+                                                $submitButtons.prop( 'disabled', true );
+                                        }
+                                        $weakRow.show();
+                                } else {
+                                        if ( $( passStrength ).is( '.empty' ) ) {
+                                                $submitButtons.prop( 'disabled', true );
+                                                $weakCheckbox.prop( 'checked', false );
+                                        } else {
+                                                $submitButtons.prop( 'disabled', false );
+                                        }
+                                        $weakRow.hide();
                                 }
-                                $weakRow.show();
-                        } else {
-                                if ( $( passStrength ).is( '.empty' ) ) {
-                                        $submitButtons.prop( 'disabled', true );
-                                        $weakCheckbox.prop( 'checked', false );
-                                } else {
-                                        $submitButtons.prop( 'disabled', false );
-                                }
-                                $weakRow.hide();
                         }
                 }

trunk/src/wp-admin/css/forms.css

@@ -552 +552 @@
 .wp-pwd {
         margin-top: 1em;
+        position: relative;
+}
+
+.mailserver-pass-wrap .wp-pwd {
+        display: inline-block;
+        margin-top: 0;
+}
+
+/* rtl:ignore */
+#mailserver_pass {
+        direction: ltr;
+        padding-right: 2.5rem;
+}
+
+/* rtl:ignore */
+.mailserver-pass-wrap .button.wp-hide-pw {
+        background: transparent;
+        border: 1px solid transparent;
+        box-shadow: none;
+        font-size: 14px;
+        line-height: 2;
+        width: 2.5rem;
+        min-width: 40px;
+        margin: 0;
+        padding: 0 9px;
+        position: absolute;
+        right: 0;
+        top: 0;
+}
+
+.mailserver-pass-wrap .button.wp-hide-pw:hover {
+        background: transparent;
+        border-color: transparent;
+}
+
+.mailserver-pass-wrap .button.wp-hide-pw:focus {
+        background: transparent;
+        border-color: #3582c4;
+        border-radius: 4px;
+        box-shadow: 0 0 0 1px #3582c4;
+        /* Only visible in Windows High Contrast mode */
+        outline: 2px solid transparent;
+}
+
+.mailserver-pass-wrap .button.wp-hide-pw:active {
+        background: transparent;
+        box-shadow: none;
+        transform: none;
 }
 

trunk/src/wp-admin/options-writing.php

@@ -54 +54 @@
         '<p>' . __( '<a href="https://wordpress.org/support/forums/">Support forums</a>' ) . '</p>'
 );
+
+wp_enqueue_script( 'user-profile' );
 
 require_once ABSPATH . 'wp-admin/admin-header.php';
@@ -169 +171 @@
 <td><input name="mailserver_login" type="text" id="mailserver_login" value="<?php form_option( 'mailserver_login' ); ?>" class="regular-text ltr" /></td>
 </tr>
-<tr>
-<th scope="row"><label for="mailserver_pass"><?php _e( 'Password' ); ?></label></th>
-<td>
-<input name="mailserver_pass" type="text" id="mailserver_pass" value="<?php form_option( 'mailserver_pass' ); ?>" class="regular-text ltr" />
-</td>
+<tr class="mailserver-pass-wrap">
+        <th scope="row">
+                <label for="mailserver_pass">
+                        <?php _e( 'Password' ); ?>
+                </label>
+        </th>
+        <td>
+                <input type="hidden" value=" " /><!-- #24364 workaround -->
+                <span class="wp-pwd">
+                        <input type="text" name="mailserver_pass" id="mailserver_pass" class="regular-text ltr" autocomplete="off" data-reveal="1" data-pw="<?php echo esc_attr( get_option( 'mailserver_pass' ) ); ?>" />
+                        <button type="button" class="button wp-hide-pw hide-if-no-js" data-toggle="0" data-start-masked="1" aria-label="<?php esc_attr_e( 'Hide password' ); ?>">
+                                <span class="dashicons dashicons-visibility" aria-hidden="true"></span>
+                        </button>
+                </span>
+        </td>
 </tr>
 <tr>