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.

Sign up for GitHub

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

Focus skip link on navigation #21108

Closed
wants to merge 12 commits into from
Closed

Focus skip link on navigation #21108

Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
12 commits
Select commit Hold shift + click to select a range
93161c0
WIP draft
Jan 29, 2020
733b0bb
rough draft
Jan 29, 2020
7e5bc37
Apply stylistic suggestions from code review
madalynrose Jan 30, 2020
c86e9ab
add links to issues for upcoming features
madalynrose Jan 30, 2020
b5bd870
update verbiage for a11y nav issue link
madalynrose Jan 30, 2020
7987e54
remove unnecessary "/"
madalynrose Jan 30, 2020
9f4a7ba
focus skip link on page change
Jan 31, 2020
60593e3
Merge branch 'master' of github.com:gatsbyjs/gatsby into focus-skip-link
Jan 31, 2020
910d18c
change query selector for skip link
Jan 31, 2020
dbd9d31
remove irrelevant file
Jan 31, 2020
c5394b7
update announcer live region to be polite
Mar 11, 2020
5f8ffd9
Merge branch 'master' of github.com:gatsbyjs/gatsby into focus-skip-link
Mar 11, 2020
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
2 changes: 1 addition & 1 deletion packages/gatsby/cache-dir/navigation.js
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -199,7 +199,7 @@ class RouteAnnouncer extends React.Component {
whiteSpace: `nowrap`,
border: 0,
}}
aria-live="assertive"
aria-live="polite"
aria-atomic="true"
ref={this.announcementRef}
></div>
Expand Down
8 changes: 8 additions & 0 deletions www/gatsby-browser.js
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -0,0 +1,8 @@
exports.onRouteUpdate = ({ location, prevLocation }) => {
Copy link
Contributor

Choose a reason for hiding this comment

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

location is unused. I wonder why linting is not complaining about this...

if (prevLocation !== null) {
const skipLink = document.querySelector("[data-reach-skip-link]")
if (skipLink) {
skipLink.focus()
}
}
}