X-Git-Url: https://scripts.mit.edu/gitweb/autoinstalls/wordpress.git/blobdiff_plain/53f4633144ed68c8b8fb5861f992b5489894a940..refs/tags/wordpress-4.5:/wp-admin/js/user-profile.js

diff --git a/wp-admin/js/user-profile.js b/wp-admin/js/user-profile.js
index 7ebdd778..5ec77bc8 100644
--- a/wp-admin/js/user-profile.js
+++ b/wp-admin/js/user-profile.js
@@ -6,23 +6,33 @@
 		$pass1Wrap,
 		$pass1,
 		$pass1Text,
-
+		$pass1Label,
 		$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() {
 		if ( typeof zxcvbn !== 'function' ) {
 			setTimeout( generatePassword, 50 );
 		} else {
 			$pass1.val( $pass1.data( 'pw' ) );
-			$pass1.trigger( 'pwupdate' );
+			$pass1.trigger( 'pwupdate' ).trigger( 'wp-check-valid-field' );
 			if ( 1 !== parseInt( $toggleButton.data( 'start-masked' ), 10 ) ) {
 				$pass1Wrap.addClass( 'show-password' );
 			} else {
@@ -47,7 +57,7 @@
 			.addClass( $pass1[0].className )
 			.data( 'pw', $pass1.data( 'pw' ) )
 			.val( $pass1.val() )
-			.on( 'keyup', function () {
+			.on( inputEvent, function () {
 				if ( $pass1Text.val() === currentPass ) {
 					return;
 				}
@@ -62,7 +72,7 @@
 			generatePassword();
 		}
 
-		$pass1.on( 'keyup pwupdate', function () {
+		$pass1.on( inputEvent + ' pwupdate', function () {
 			if ( $pass1.val() === currentPass ) {
 				return;
 			}
@@ -88,24 +98,31 @@
 		} );
 	}
 
+	function resetToggle() {
+		$toggleButton
+			.data( 'toggle', 0 )
+			.attr({
+				'aria-label': userProfileL10n.ariaHide
+			})
+			.find( '.text' )
+				.text( userProfileL10n.hide )
+			.end()
+			.find( '.dashicons' )
+				.removeClass( 'dashicons-visibility' )
+				.addClass( 'dashicons-hidden' );
+
+		$pass1Text.focus();
+
+		$pass1Label.attr( 'for', 'pass1-text' );
+	}
+
 	function bindToggleButton() {
 		$toggleButton = $pass1Row.find('.wp-hide-pw');
 		$toggleButton.show().on( 'click', function () {
 			if ( 1 === parseInt( $toggleButton.data( 'toggle' ), 10 ) ) {
 				$pass1Wrap.addClass( 'show-password' );
-				$toggleButton
-					.data( 'toggle', 0 )
-					.attr({
-						'aria-label': userProfileL10n.ariaHide
-					})
-					.find( '.text' )
-						.text( userProfileL10n.hide )
-					.end()
-					.find( '.dashicons' )
-						.removeClass('dashicons-visibility')
-						.addClass('dashicons-hidden');
 
-				$pass1Text.focus();
+				resetToggle();
 
 				if ( ! _.isUndefined( $pass1Text[0].setSelectionRange ) ) {
 					$pass1Text[0].setSelectionRange( 0, 100 );
@@ -126,6 +143,8 @@
 
 				$pass1.focus();
 
+				$pass1Label.attr( 'for', 'pass1' );
+
 				if ( ! _.isUndefined( $pass1[0].setSelectionRange ) ) {
 					$pass1[0].setSelectionRange( 0, 100 );
 				}
@@ -139,6 +158,8 @@
 			$cancelButton;
 
 		$pass1Row = $('.user-pass1-wrap');
+		$pass1Label = $pass1Row.find('th label').attr( 'for', 'pass1-text' );
+
 		// hide this
 		$('.user-pass2-wrap').hide();
 
@@ -165,7 +186,7 @@
 		 * This fixes the issue by copying any changes from the hidden
 		 * 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() );
 				$pass2.val('');
@@ -174,17 +195,34 @@
 			}
 		} );
 
-		$passwordWrapper = $pass1Row.find('.wp-pwd').hide();
+		// Disable hidden inputs to prevent autofill and submission.
+		if ( $pass1.is( ':hidden' ) ) {
+			$pass1.prop( 'disabled', true );
+			$pass2.prop( 'disabled', true );
+			$pass1Text.prop( 'disabled', true );
+		}
+
+		$passwordWrapper = $pass1Row.find( '.wp-pwd' );
+		$generateButton  = $pass1Row.find( 'button.wp-generate-pw' );
 
 		bindToggleButton();
 
-		$generateButton = $pass1Row.find( 'button.wp-generate-pw' ).show();
+		if ( $generateButton.length ) {
+			$passwordWrapper.hide();
+		}
+
+		$generateButton.show();
 		$generateButton.on( 'click', function () {
 			updateLock = true;
 
 			$generateButton.hide();
 			$passwordWrapper.show();
 
+			// Enable the inputs when showing.
+			$pass1.attr( 'disabled', false );
+			$pass2.attr( 'disabled', false );
+			$pass1Text.attr( 'disabled', false );
+
 			if ( $pass1Text.val().length === 0 ) {
 				generatePassword();
 			}
@@ -201,13 +239,39 @@
 		$cancelButton.on( 'click', function () {
 			updateLock = false;
 
+			// Clear any entered password.
+			$pass1Text.val( '' );
+
+			// Generate a new password.
+			wp.ajax.post( 'generate-password' )
+				.done( function( data ) {
+					$pass1.data( 'pw', data );
+				} );
+
 			$generateButton.show();
 			$passwordWrapper.hide();
+
+			$weakRow.hide( 0, function () {
+				$weakCheckbox.removeProp( 'checked' );
+			} );
+
+			// Disable the inputs when hiding to prevent autofill and submission.
+			$pass1.prop( 'disabled', true );
+			$pass2.prop( 'disabled', true );
+			$pass1Text.prop( 'disabled', true );
+
+			resetToggle();
+
+			// Clear password field to prevent update
+			$pass1.val( '' ).trigger( 'pwupdate' );
+			$submitButtons.prop( 'disabled', false );
 		} );
 
 		$pass1Row.closest('form').on( 'submit', function () {
 			updateLock = false;
 
+			$pass1.prop( 'disabled', false );
+			$pass2.prop( 'disabled', false );
 			$pass2.val( $pass1.val() );
 			$pass1Wrap.removeClass( 'show-password' );
 		});
@@ -246,7 +310,7 @@
 		var $colorpicker, $stylesheet, user_id, current_user_id,
 			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() {
 			$(this).siblings('input[name="admin_color"]').prop('checked', true);