openlibrary
openlibrary copied to clipboard
Move registration formatting checks to frontend
Closes #9467.
Feature. Improves registration form performance by ensuring lightweight formatting checks (i.e. username field length, email format) all take place on the frontend before the backend query runs.
Technical
In realtime_account_validation.js
a set of formatting checks run first, and if any of them fail the appropriate error is rendered.
If they all pass, any errors are cleared and the query to the API endpoint in account.py
runs, to check whether the username/email address is taken. This meant I could remove the error-clearing else
condition from the ajax
call, as the errors will be auto-cleared before the call happens.
It also allowed me to remove the formatting checks from the API endpoint entirely, as they are now duplicated by the js validation -- but duplicative formatting checks do still run on the backend on submission (via forms.py
) so all bad inputs will be caught even if the user has turned off JavaScript.
Testing
- Log out (if logged in)
- Go to
/account/create
- Try to enter a badly formatted email/username
- You should see realtime errors appear on click/tab away as previously -- and they should appear/disappear much more quickly :)
Screenshot
Stakeholders
@cdrini @mekarpeles