Login and Registration: Add autocomplete attributes.

Set valid autocomplete attributes for registration and login fields for username, email, and current password. Autocomplete values are required in WCAG 2.1 at level AA for login forms.

Props johnjamesjacoby, dhanendran, rianrietveld, joedolson, peterwilsoncc.
Fixes #41136.

Built from https://develop.svn.wordpress.org/trunk@53041


git-svn-id: http://core.svn.wordpress.org/trunk@52630 1a063a9b-81f0-0310-95a4-ce76da25c4cd
This commit is contained in:
joedolson 2022-03-31 17:13:01 +00:00
parent 18fd303a61
commit 9131d74641
4 changed files with 13 additions and 13 deletions

View File

@ -586,7 +586,7 @@ function wp_login_form( $args = array() ) {
sprintf(
'<p class="login-username">
<label for="%1$s">%2$s</label>
<input type="text" name="log" id="%1$s" class="input" value="%3$s" size="20" />
<input type="text" name="log" id="%1$s" autocomplete="username" class="input" value="%3$s" size="20" />
</p>',
esc_attr( $args['id_username'] ),
esc_html( $args['label_username'] ),
@ -595,7 +595,7 @@ function wp_login_form( $args = array() ) {
sprintf(
'<p class="login-password">
<label for="%1$s">%2$s</label>
<input type="password" name="pwd" id="%1$s" class="input" value="" size="20" />
<input type="password" name="pwd" id="%1$s" autocomplete="current-password" class="input" value="" size="20" />
</p>',
esc_attr( $args['id_password'] ),
esc_html( $args['label_password'] )

View File

@ -16,7 +16,7 @@
*
* @global string $wp_version
*/
$wp_version = '6.0-alpha-53040';
$wp_version = '6.0-alpha-53041';
/**
* Holds the WordPress DB revision, increments when changes are made to the WordPress DB schema.

View File

@ -827,7 +827,7 @@ switch ( $action ) {
<form name="lostpasswordform" id="lostpasswordform" action="<?php echo esc_url( network_site_url( 'wp-login.php?action=lostpassword', 'login_post' ) ); ?>" method="post">
<p>
<label for="user_login"><?php _e( 'Username or Email Address' ); ?></label>
<input type="text" name="user_login" id="user_login" class="input" value="<?php echo esc_attr( $user_login ); ?>" size="20" autocapitalize="off" />
<input type="text" name="user_login" id="user_login" class="input" value="<?php echo esc_attr( $user_login ); ?>" size="20" autocapitalize="off" autocomplete="username" />
</p>
<?php
@ -1060,11 +1060,11 @@ switch ( $action ) {
<form name="registerform" id="registerform" action="<?php echo esc_url( site_url( 'wp-login.php?action=register', 'login_post' ) ); ?>" method="post" novalidate="novalidate">
<p>
<label for="user_login"><?php _e( 'Username' ); ?></label>
<input type="text" name="user_login" id="user_login" class="input" value="<?php echo esc_attr( wp_unslash( $user_login ) ); ?>" size="20" autocapitalize="off" />
<input type="text" name="user_login" id="user_login" class="input" value="<?php echo esc_attr( wp_unslash( $user_login ) ); ?>" size="20" autocapitalize="off" autocomplete="username" />
</p>
<p>
<label for="user_email"><?php _e( 'Email' ); ?></label>
<input type="email" name="user_email" id="user_email" class="input" value="<?php echo esc_attr( wp_unslash( $user_email ) ); ?>" size="25" />
<input type="email" name="user_email" id="user_email" class="input" value="<?php echo esc_attr( wp_unslash( $user_email ) ); ?>" size="25" autocomplete="email" />
</p>
<?php
@ -1387,13 +1387,13 @@ switch ( $action ) {
<form name="loginform" id="loginform" action="<?php echo esc_url( site_url( 'wp-login.php', 'login_post' ) ); ?>" method="post">
<p>
<label for="user_login"><?php _e( 'Username or Email Address' ); ?></label>
<input type="text" name="log" id="user_login"<?php echo $aria_describedby_error; ?> class="input" value="<?php echo esc_attr( $user_login ); ?>" size="20" autocapitalize="off" />
<input type="text" name="log" id="user_login"<?php echo $aria_describedby_error; ?> class="input" value="<?php echo esc_attr( $user_login ); ?>" size="20" autocapitalize="off" autocomplete="username" />
</p>
<div class="user-pass-wrap">
<label for="user_pass"><?php _e( 'Password' ); ?></label>
<div class="wp-pwd">
<input type="password" name="pwd" id="user_pass"<?php echo $aria_describedby_error; ?> class="input password-input" value="" size="20" />
<input type="password" name="pwd" id="user_pass"<?php echo $aria_describedby_error; ?> class="input password-input" value="" size="20" autocomplete="current-password" />
<button type="button" class="button button-secondary wp-hide-pw hide-if-no-js" data-toggle="0" aria-label="<?php esc_attr_e( 'Show password' ); ?>">
<span class="dashicons dashicons-visibility" aria-hidden="true"></span>
</button>

View File

@ -118,10 +118,10 @@ function show_blog_form( $blogname = '', $blog_title = '', $errors = '' ) {
}
if ( ! is_subdomain_install() ) {
echo '<span class="prefix_address">' . $current_network->domain . $current_network->path . '</span><input name="blogname" type="text" id="blogname" value="' . esc_attr( $blogname ) . '" maxlength="60" /><br />';
echo '<span class="prefix_address">' . $current_network->domain . $current_network->path . '</span><input name="blogname" type="text" id="blogname" value="' . esc_attr( $blogname ) . '" maxlength="60" autocomplete="off" /><br />';
} else {
$site_domain = preg_replace( '|^www\.|', '', $current_network->domain );
echo '<input name="blogname" type="text" id="blogname" value="' . esc_attr( $blogname ) . '" maxlength="60" /><span class="suffix_address">.' . esc_html( $site_domain ) . '</span><br />';
echo '<input name="blogname" type="text" id="blogname" value="' . esc_attr( $blogname ) . '" maxlength="60" autocomplete="off" /><span class="suffix_address">.' . esc_html( $site_domain ) . '</span><br />';
}
if ( ! is_user_logged_in() ) {
@ -149,7 +149,7 @@ function show_blog_form( $blogname = '', $blog_title = '', $errors = '' ) {
<p class="error"><?php echo $errmsg; ?></p>
<?php
}
echo '<input name="blog_title" type="text" id="blog_title" value="' . esc_attr( $blog_title ) . '" />';
echo '<input name="blog_title" type="text" id="blog_title" value="' . esc_attr( $blog_title ) . '" autocomplete="off" />';
?>
<?php
@ -260,7 +260,7 @@ function show_user_form( $user_name = '', $user_email = '', $errors = '' ) {
if ( $errmsg ) {
echo '<p class="error">' . $errmsg . '</p>';
}
echo '<input name="user_name" type="text" id="user_name" value="' . esc_attr( $user_name ) . '" autocapitalize="none" autocorrect="off" maxlength="60" /><br />';
echo '<input name="user_name" type="text" id="user_name" value="' . esc_attr( $user_name ) . '" autocapitalize="none" autocorrect="off" maxlength="60" autocomplete="username" /><br />';
_e( '(Must be at least 4 characters, letters and numbers only.)' );
?>
@ -271,7 +271,7 @@ function show_user_form( $user_name = '', $user_email = '', $errors = '' ) {
?>
<p class="error"><?php echo $errmsg; ?></p>
<?php } ?>
<input name="user_email" type="email" id="user_email" value="<?php echo esc_attr( $user_email ); ?>" maxlength="200" /><br /><?php _e( 'We send your registration email to this address. (Double-check your email address before continuing.)' ); ?>
<input name="user_email" type="email" id="user_email" value="<?php echo esc_attr( $user_email ); ?>" maxlength="200" autocomplete="email" /><br /><?php _e( 'We send your registration email to this address. (Double-check your email address before continuing.)' ); ?>
<?php
$errmsg = $errors->get_error_message( 'generic' );
if ( $errmsg ) {