Users: Check zxcvbn is defined before calling.

Prevents JavaScript errors by checking zxcvbn is defined before calling.

Changes `wp.passwordStrength.meter()` to return `-1` if the strength of the password is unknown.

On the user profile screen, `generatePassword()` checks if the user has entered the password before setting the value of the password input box.

Props peterwilsoncc, adamsilverstein.
Fixes #34905.


git-svn-id: https://develop.svn.wordpress.org/trunk@37940 602fd350-edb4-49c9-b593-d223f7449a82

src/wp-admin/js/password-strength-meter.js

@@ -18,6 +18,11 @@ var passwordStrength;
 			if (password1 != password2 && password2 && password2.length > 0)
 				return 5;
 
+			if ( 'undefined' === typeof window.zxcvbn ) {
+				// Password strength unknown.
+				return -1;
+			}
+
 			var result = zxcvbn( password1, blacklist );
 			return result.score;
 		},

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

@@ -30,20 +30,30 @@
 	function generatePassword() {
 		if ( typeof zxcvbn !== 'function' ) {
 			setTimeout( generatePassword, 50 );
-		} else {
+			return;
+		} else if ( ! $pass1.val() ) {
+			// zxcvbn loaded before user entered password.
 			$pass1.val( $pass1.data( 'pw' ) );
-			$pass1.trigger( 'pwupdate' ).trigger( 'wp-check-valid-field' );
+			$pass1.trigger( 'pwupdate' );
-			if ( 1 !== parseInt( $toggleButton.data( 'start-masked' ), 10 ) ) {
+			showOrHideWeakPasswordCheckbox();
-				$pass1Wrap.addClass( 'show-password' );
-			} else {
-				$toggleButton.trigger( 'click' );
-			}
 		}
+		else {
+			// zxcvbn loaded after the user entered password, check strength.
+			check_pass_strength();
+			showOrHideWeakPasswordCheckbox();
+		}
+
+		if ( 1 !== parseInt( $toggleButton.data( 'start-masked' ), 10 ) ) {
+			$pass1Wrap.addClass( 'show-password' );
+		} else {
+			$toggleButton.trigger( 'click' );
+		}
+
+		// Once zxcvbn loads, passwords strength is known.
+		$( '#pw-weak-text-label' ).html( userProfileL10n.warnWeak );
 	}
 
 	function bindPass1() {
-		var passStrength = $('#pass-strength-result')[0];
-
 		currentPass = $pass1.val();
 
 		$pass1Wrap = $pass1.parent();
@@ -82,19 +92,7 @@
 				$pass1Text.val( currentPass );
 			}
 			$pass1.add( $pass1Text ).removeClass( 'short bad good strong' );
-
+			showOrHideWeakPasswordCheckbox();
-			if ( passStrength.className ) {
-				$pass1.add( $pass1Text ).addClass( passStrength.className );
-				if ( 'short' === passStrength.className || 'bad' === passStrength.className ) {
-					if ( ! $weakCheckbox.prop( 'checked' ) ) {
-						$submitButtons.prop( 'disabled', true );
-					}
-					$weakRow.show();
-				} else {
-					$submitButtons.prop( 'disabled', false );
-					$weakRow.hide();
-				}
-			}
 		} );
 	}
 
@@ -289,6 +287,9 @@
 		strength = wp.passwordStrength.meter( pass1, wp.passwordStrength.userInputBlacklist(), pass1 );
 
 		switch ( strength ) {
+			case -1:
+				$( '#pass-strength-result' ).addClass( 'bad' ).html( pwsL10n.unknown );
+				break;
 			case 2:
 				$('#pass-strength-result').addClass('bad').html( pwsL10n.bad );
 				break;
@@ -306,6 +307,23 @@
 		}
 	}
 
+	function showOrHideWeakPasswordCheckbox() {
+		var passStrength = $('#pass-strength-result')[0];
+
+		if ( passStrength.className ) {
+			$pass1.add( $pass1Text ).addClass( passStrength.className );
+			if ( 'short' === passStrength.className || 'bad' === passStrength.className ) {
+				if ( ! $weakCheckbox.prop( 'checked' ) ) {
+					$submitButtons.prop( 'disabled', true );
+				}
+				$weakRow.show();
+			} else {
+				$submitButtons.prop( 'disabled', false );
+				$weakRow.hide();
+			}
+		}
+	}
+
 	$(document).ready( function() {
 		var $colorpicker, $stylesheet, user_id, current_user_id,
 			select = $( '#display_name' );

src/wp-admin/user-edit.php

@@ -531,7 +531,7 @@ if ( $show_password_fields = apply_filters( 'show_password_fields', true, $profi
 	<td>
 		<label>
 			<input type="checkbox" name="pw_weak" class="pw-checkbox" />
-			<?php _e( 'Confirm use of weak password' ); ?>
+			<span id="pw-weak-text-label"><?php _e( 'Confirm use of potentially weak password' ); ?></span>
 		</label>
 	</td>
 </tr>

src/wp-includes/script-loader.php

@@ -380,6 +380,7 @@ function wp_default_scripts( &$scripts ) {
 
 	$scripts->add( 'password-strength-meter', "/wp-admin/js/password-strength-meter$suffix.js", array( 'jquery', 'zxcvbn-async' ), false, 1 );
 	did_action( 'init' ) && $scripts->localize( 'password-strength-meter', 'pwsL10n', array(
+		'unknown'  => _x( 'Password strength unknown', 'password strength' ),
 		'short'    => _x( 'Very weak', 'password strength' ),
 		'bad'      => _x( 'Weak', 'password strength' ),
 		'good'     => _x( 'Medium', 'password strength' ),
@@ -390,6 +391,7 @@ function wp_default_scripts( &$scripts ) {
 	$scripts->add( 'user-profile', "/wp-admin/js/user-profile$suffix.js", array( 'jquery', 'password-strength-meter', 'wp-util' ), false, 1 );
 	did_action( 'init' ) && $scripts->localize( 'user-profile', 'userProfileL10n', array(
 		'warn'     => __( 'Your new password has not been saved.' ),
+		'warnWeak' => __( 'Confirm use of weak password.' ),
 		'show'     => __( 'Show' ),
 		'hide'     => __( 'Hide' ),
 		'cancel'   => __( 'Cancel' ),