Changeset 34060

Timestamp:

09/11/2015 09:51:31 PM (9 years ago)

Author:

ocean90

Message:

Passwords: Refresh password fields when content is pasted into fields.

Use feature detection to determine whether password inputs should use the keyup or input event.

Props peterwilsoncc, adamsilverstein.
Fixes #33398.

File:

• trunk/src/wp-admin/js/user-profile.js (modified) (5 diffs)

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

@@ -7 +7 @@
         $pass1,
         $pass1Text,
-
         $pass2,
-
         $weakRow,
         $weakCheckbox,
-
         $toggleButton,
         $submitButtons,
         $submitButton,
-        currentPass;
+        currentPass,
+        inputEvent;
+
+    /*
+     * Use feature detection to determine whether password inputs should use
+     * the `keyup` or `input` event. Input is preferred but lacks support
+     * in legacy browsers.
+     */
+    if ( 'oninput' in document.createElement( 'input' ) ) {
+        inputEvent = 'input';
+    } else {
+        inputEvent = 'keyup';
+    }
 
     function generatePassword() {
@@ -48 +57 @@
             .data( 'pw', $pass1.data( 'pw' ) )
             .val( $pass1.val() )
-            .on( 'keyup', function () {
+            .on( inputEvent, function () {
                 if ( $pass1Text.val() === currentPass ) {
                     return;
@@ -63 +72 @@
         }
 
-        $pass1.on( 'keyup pwupdate', function () {
+        $pass1.on( inputEvent + ' pwupdate', function () {
             if ( $pass1.val() === currentPass ) {
                 return;
@@ -166 +175 @@
          * pass2 field to the pass1 field, then running check_pass_strength.
          */
-        $pass2 = $('#pass2').on( 'keyup', function () {
+        $pass2 = $('#pass2').on( inputEvent, function () {
             if ( $pass2.val().length > 0 ) {
                 $pass1.val( $pass2.val() );
@@ -251 +260 @@
             select = $( '#display_name' );
 
-        $('#pass1').val('').on( 'keyup pwupdate', check_pass_strength );
+        $('#pass1').val('').on( inputEvent + ' pwupdate', check_pass_strength );
         $('#pass-strength-result').show();
         $('.color-palette').click( function() {