Make WordPress Core

Opened 8 years ago

Last modified 5 weeks ago

#32510 accepted enhancement

Add HTML5 "required" attributes to the login form

Reported by: aznadesign's profile aznadesign Owned by: joedolson's profile joedolson
Milestone: 6.3 Priority: normal
Severity: normal Version: 2.1
Component: Login and Registration Keywords: has-patch required-fields
Focuses: ui, accessibility Cc:

Description

Hi evety one,
Today i try to login to WordPress dashboard and i knowed if i don`t write any thing in the input of username or password and then show message login error, I think if we add html5 tag "required" to the inputs of forms to validate the input labels not empty it is better for server and WordPress.
An also add feature to allow users and admins login by emails and add "type="email" required for login form.
And add feature to allow users to change admin dashboard design, like virtual menu, insert of customized code e.g #cd2122 by users
At end add stat menu to admin panel and show how many times WordPress up-time proudly, how many users, comments, plugins, alexa rank and etc
An also add Better WordPress menu that has 2 sub menu, one for security of WordPress like plugins and 2nd Performance and speed of site e.g minifity css and js and etc
Also add menu to seo features of core WordPress like add social icons to bottom of posts to allow visitor to share posts or add https://developers.google.com/structured-data/testing-tool/ codes to seo WordPress Sites.
This feature available by the plugins but if in core WordPress is better and faster and structure of WordPress is better.
Best regards,
Milad Shahi

Attachments (4)

html5-inputs-login.32510.diff (7.4 KB) - added by sanchothefat 7 years ago.
Adds required attributes to the login / register / forgot pass form fields as well as autofocus on first form field in each case
32510-2.patch (4.1 KB) - added by alexstine 5 years ago.
Adds required attribute to all form fields in wp-login.php.
32510.diff (4.3 KB) - added by nant82 4 years ago.
Added attibute required to all mandatory inputs. Including register form, login form and password recovery form.
32510.1.diff (4.3 KB) - added by sabernhardt 3 years ago.
refresh for spacing and attribute values

Download all attachments as: .zip

Change History (24)

#1 @wonderboymusic
8 years ago

  • Keywords needs-patch added
  • Type changed from feature request to enhancement
  • Version changed from 4.2.2 to 2.1

#2 @swissspidy
8 years ago

  • Component changed from General to Login and Registration
  • Focuses accessibility added; administration performance removed

The first two points are the ones relevant here:

  • Add required attributes to required input fields, like in the login form
  • Use input type email for the username login field (although emails aren't allowed by default)

@sanchothefat
7 years ago

Adds required attributes to the login / register / forgot pass form fields as well as autofocus on first form field in each case

#3 @sanchothefat
7 years ago

  • Keywords has-patch added; needs-patch removed

#4 @afercia
7 years ago

  • Keywords needs-refresh added

The required attribute is a boolean attribute, doesn't need a value.
http://www.w3.org/TR/html5/forms.html#the-required-attribute

Autofocus too is a boolean attribute
http://www.w3.org/TR/html5/forms.html#autofocusing-a-form-control:-the-autofocus-attribute
but it should be used carefully, and generally avoided. If really, really, necessary then it should be disabled for mobile devices.

See for example the discussion on autofocus on #29102.

This ticket was mentioned in Slack in #core-customize by celloexpressions. View the logs.


7 years ago

This ticket was mentioned in Slack in #accessibility by afercia. View the logs.


7 years ago

#7 @afercia
7 years ago

  • Milestone changed from Awaiting Review to Future Release
  • Summary changed from Add HTML5 Tags to WordPress to Add HTML5 "required" attributes to the login form

Adding required to the input fields has some value, it would at least avoid to submit the form with empty fields. Something worth considering. The username field now accepts also emails so not sure what can be done here about the type attribute.

As per the other points, please do feel free to open separate tickets if still relevant. Mixing together several issues in one single ticket makes things pretty unmanageable.

#8 @swissspidy
7 years ago

The username field now accepts also emails so not sure what can be done here about the type attribute.

I think now it makes even more sense because it will change the keyboard on mobile devices accordingly.

#9 @afercia
7 years ago

  • Keywords required-fields added

This ticket was mentioned in Slack in #accessibility by afercia. View the logs.


6 years ago

#11 @alexstine
5 years ago

  • Keywords needs-refresh removed

My patch adds required attribute to all fields. I suggest not adding type="email" right now as that would force HTML to validate the field for email address only and a username could not be used. The only way around this would be to add novalidate to the <form> tag which defeats the purpose of HTML5 validation.

@alexstine
5 years ago

Adds required attribute to all form fields in wp-login.php.

@nant82
4 years ago

Added attibute required to all mandatory inputs. Including register form, login form and password recovery form.

@sabernhardt
3 years ago

refresh for spacing and attribute values

#12 @sabernhardt
3 years ago

32510.1.diff has a few coding standards fixes.

According to HTML coding Standards, attributes do need the value. (The standards document could be updated, but these inputs are self-closing for valid XHTML anyway.)

#13 @afercia
3 years ago

Related: #47595 and #47505 and the Slack conversations linked on those tickets. Specifically, the HTML5 Constraint validation API seems to be still inconsistent across browsers. Also, a good first step to take would be some research to see what the current support from assistive technologies is.

This ticket was mentioned in Slack in #accessibility by sabernhardt. View the logs.


2 years ago

This ticket was mentioned in Slack in #accessibility by ryokuhi. View the logs.


2 years ago

This ticket was mentioned in Slack in #accessibility by joedolson. View the logs.


7 weeks ago

#17 @joedolson
7 weeks ago

  • Milestone changed from Future Release to 6.3
  • Owner set to joedolson
  • Status changed from new to accepted

#18 @sabernhardt
7 weeks ago

  • Keywords needs-refresh added

@ryokuhi shared some old research into the required attribute in Slack.

This ticket was mentioned in PR #4354 on WordPress/wordpress-develop by @D SIGNED.


6 weeks ago
#19

  • Keywords needs-refresh removed

#20 @sabernhardt
5 weeks ago

Thanks for refreshing the patch!

Additional research to consider:

Firefox still announces "invalid entry" before having the chance to type anything in the field, even when adding aria-invalid="false" (Firefox 112, Windows 10, NVDA 2023.1).

Note: See TracTickets for help on using tickets.