[WIP][ENG-4048] Keyboard Navigation Skip Link - Main Home

[chth0n1x]

• Ticket: https://openscience.atlassian.net/browse/ENG-4048
• Feature flag: feature/a11y-skip-link-home

Purpose

The purpose of these changes is to improve keyboard navigation functionality within the OSF. It is a hybridization between visually hidden elements that will not obscure or impair visual users but to alert users to more optimized handling of navigation within the web app.

Summary of Changes

-Skip link with a menu of keyboard options -JS event listeners to handle keyboard user input -Updated translation strings for VoiceOver -Removal of distracting or irrelevant technical terminology -Use of headers to landmark app sections for improved speed

Screenshot(s): TBU

Side Effects

These changes will initiate UI changes on the OSF Home page upon keyboard tab press. Testing should ensure that the element properly obscures itself when unfocusing of the element.

QA Notes

-Does the skip link render? -Does it obscure upon closing? Does it re-open at the start? -Do all translation strings pronounce letters properly? Did any words or abbreviations sound odd? -Does the skip link render on multiple SR settings? On browser only, on OS level?

[coveralls]

Pull Request Test Coverage Report for Build 4137406804

• 1 of 147 (0.68%) changed or added relevant lines in 3 files are covered.
• 5 unchanged lines in 1 file lost coverage.
• Overall coverage decreased (-1.5%) to 69.963%

---

Changes Missing Coverage	Covered Lines	Changed/Added Lines	%
app/home/-components/testimonials/component.ts	0	2	0.0%
app/home/controller.ts	1	70	1.43%
lib/osf-components/addon/components/carousel/component.ts	0	75	0.0%
<!--	Total:	1	147

Files with Coverage Reduction	New Missed Lines	%
lib/osf-components/addon/components/carousel/component.ts	5	11.97%
<!--	Total:	5

Totals
Change from base Build 4105425988:	-1.5%
Covered Lines:	5701
Relevant Lines:	7910

---

💛 - Coveralls