Skip to content

Instantly share code, notes, and snippets.

Embed
What would you like to do?
Get user-focusable elements within a context in tab order
// Source
const tabitha = (context = document) =>
[
...context.querySelectorAll('*')
]
.filter(element => {
const style =
window.getComputedStyle(element)
return (
element.tabIndex != -1
&&
style.display != 'none'
&&
style.visibility != 'hidden'
)
})
.sort((a, b) =>
a.tabIndex > b.tabIndex ? 1 : 0
)
const elements = tabitha()
// Proof (?)
let lastIndex
document.addEventListener('focus', ({target}) => {
const index = elements.indexOf(target)
console.log(target, index)
if(index == -1)
debugger
if(lastIndex === undefined)
return
if(index < lastIndex && !(index === 0 && lastIndex +1 === elements.length))
debugger
}, {
capture: true,
})
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
You can’t perform that action at this time.