Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Improvements to focus order #4952

Open
wants to merge 2 commits into
base: master
Choose a base branch
from
Open

Conversation

lucascumsille
Copy link
Contributor

@lucascumsille lucascumsille commented May 7, 2024

Fixes: https://github.com/mysociety/societyworks/issues/4212

Both of these fixes should improve how users using assistive devices travel across inputs by modifying which focus element we are focusing, making it easier to rectify errors or previous steps.

List of commits

Added fix to email input focus behaviour when there is an error
First commit fixes:
SW ref 30: Local RSS feeds and email alerts - part 2

  • When the Subscribe by email form is submitted with an error, focus should be sent to the "Email address' input element.

Added fix for focus behaviour in pages with a .form-section-preview
SW ref 29: Reported issue - provide an update form - tell us about you (step 2)

  • When the second part of the form loads, focus is sent to the Full Name input element. This bypasses the Your Update component, and the opportunity to review the first part of the form.

[Skip changelog]

Currently when users makes mistake or leaves the email input empty the focus returns to the begining of the page causing the user to have to travel across multiple elements to be able to re-enter their email. With this fix the focus goes back to the email input element.
The current behaviour for the focus state when providing an update to a report is going directly into the first input after the .form-section-preview and its content, making it difficult for users using assistive devices to edit an "update" once they have pressed the "continue" button, because they would need to travel across the whole page in order to reach "Edit your update" button. With this fix the focus state goes directly to the content inside ".form-section-preview" if this element exist.
@lucascumsille lucascumsille requested a review from dracos May 7, 2024 12:53
Copy link

codecov bot commented May 7, 2024

Codecov Report

Attention: Patch coverage is 40.00000% with 6 lines in your changes are missing coverage. Please review.

Project coverage is 82.80%. Comparing base (c34f2ee) to head (28c7613).
Report is 4 commits behind head on master.

Files Patch % Lines
web/cobrands/fixmystreet/fixmystreet.js 40.00% 6 Missing ⚠️
Additional details and impacted files
@@            Coverage Diff             @@
##           master    #4952      +/-   ##
==========================================
+ Coverage   82.62%   82.80%   +0.18%     
==========================================
  Files         391      392       +1     
  Lines       30483    31045     +562     
  Branches     4813     4966     +153     
==========================================
+ Hits        25186    25707     +521     
- Misses       3861     3893      +32     
- Partials     1436     1445       +9     

☔ View full report in Codecov by Sentry.
📢 Have feedback on the report? Share it here.

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
Development

Successfully merging this pull request may close these issues.

None yet

1 participant