diff --git a/static/app-strings.json b/static/app-strings.json index db3a632c5..524f02dfc 100644 --- a/static/app-strings.json +++ b/static/app-strings.json @@ -2055,5 +2055,6 @@ "added to": "added to", "removed from": "removed from", "Item removed from Watch Later": "Item removed from Watch Later", + "Skip navigation": "Skip navigation", "--end--": "--end--" } diff --git a/ui/component/header/view.jsx b/ui/component/header/view.jsx index 8d127823a..2d03a19dd 100644 --- a/ui/component/header/view.jsx +++ b/ui/component/header/view.jsx @@ -64,6 +64,24 @@ type Props = { activeChannelStakedLevel: number, }; +const SkipNavigationButton = () => { + const skipNavigation = (e) => { + // Match any focusable element + const focusableElementQuery = ` + #main-content [tabindex]:not([tabindex="-1"]):not(:disabled), + #main-content a:not([aria-hidden]):not([tabindex="-1"]):not(:disabled), + #main-content button:not([aria-hidden]):not([tabindex="-1"]):not(:disabled) + `; + // Find first focusable element + const element = document.querySelector(focusableElementQuery); + // Trigger focus to skip navigation + if (element && element.focus) { + element.focus(); + } + }; + return