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

[326] | Skip to main content navigation #352

Merged
merged 2 commits into from
Jan 10, 2025
Merged

[326] | Skip to main content navigation #352

merged 2 commits into from
Jan 10, 2025

Conversation

emmabjj
Copy link
Contributor

@emmabjj emmabjj commented Jan 8, 2025

Related ticket: #326

Add "skip to main content" accessibility navigation to the top of the page. This allows a user to jump to the main page area using keyboard navigation.

skip_to_main


Screenshot 2025-01-08 at 4 17 05 PM

WAVE

Screenshot 2025-01-08 at 4 20 35 PM

@emmabjj emmabjj self-assigned this Jan 8, 2025
@emmabjj emmabjj requested a review from stepchud January 8, 2025 22:22
Comment on lines +24 to +28
it 'moves focus to main content when using keyboard' do
find('body').send_keys(:tab)
find('.usa-skipnav', visible: true).send_keys(:return)
expect(page.evaluate_script('document.activeElement.id')).to eq('main-content')
end
Copy link
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

💯

Copy link
Contributor

@stepchud stepchud left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Other than the duplicated specs this looks great! I think it's important to keep system specs as minimal as possible to keep the overall test suite running faster.
Skip button works well though 🎉 How did you find the usa-skipnav? I can't even find it on google 👀

Comment on lines 30 to 32
it 'passes accessibility checks' do
expect(page).to be_axe_clean
end
Copy link
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

duplicated in logins_spec.rb

Comment on lines 53 to 55
it 'passes accessibility checks' do
expect(page).to be_axe_clean
end
Copy link
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

duplicated in phases_spec.rb

Copy link
Contributor Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

@stepchud I'll remove those duplicate tests, thanks! As for usa-skipnav - I was super surprised that USWDS didn't have any information about skip navs, so I tabbed while on the USWDS site and it uses a usa-skipnav component. It works well and is exactly what USWDS uses!
Screenshot 2025-01-10 at 8 08 54 AM

@r-bartlett-gsa r-bartlett-gsa added this to the Sprint 01/14/25 milestone Jan 10, 2025
@r-bartlett-gsa r-bartlett-gsa linked an issue Jan 10, 2025 that may be closed by this pull request
37 tasks
@emmabjj emmabjj merged commit 7348242 into dev Jan 10, 2025
11 checks passed
@emmabjj emmabjj deleted the 326_skip_to_main branch January 10, 2025 14:34
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.

Skip to Main
3 participants