microsoft / tabster

Web Application Keyboard Navigation Tools
https://tabster.io
MIT License
122 stars 36 forks source link

Tabster swallows all tab keydowns #423

Closed evoactivity closed 1 week ago

evoactivity commented 1 week ago

Given this scenario

<div data-tabster='{"root":{}}'>
  <div data-tabster='{"mover":{}}'>
    <a href="#">1</a>
    <a href="#">2</a>
    <a href="#">3</a>
    <a href="#">4</a>
  </div>

  <div id="my-custom-thing"> 
    <!-- I want to do something completely custom with tab key here -->
    <a href="#">Hello</a>
    <a href="#">World</a>
  </div>
</div>
const myThing = document.getElementById('my-custom-thing');

myThing.addEventListener('keydown', () => {
  console.log('key pressed down');
});

key pressed down will never be logged if you hit the tab key, other keys will be fine.

Is there some way I can opt my-custom-thing out of being controlled by tabster at all?

evoactivity commented 1 week ago

Going through other issues I found this data-tabster='{"uncontrolled": {}}'.

Is there any documentation for this?