tab-container-element icon indicating copy to clipboard operation
tab-container-element copied to clipboard

Published 20 hours ago • verified publisher icon github

Expose "selectTab" method for programmatic selection

Open thetutlage opened this issue 3 years ago • 2 comments

This PR moves the selectTab method on the TabContainer class. Doing so will enable programmatic select of tabs by calling this method. The proposal was shared in this issue https://github.com/github/tab-container-element/issues/55

Changes

  • The selectTab method no longer accepts the tabContainer instance. It uses this implicitly.
  • A conditional has been added to check for out of bounds index (since the method is public now). Right now, I am silently returning when the index > no of tabs. Maybe we can raise an exception here? Just wanted feedback on how to proceed with that.

Lemme know if something needs attention. Happy to improve the PR :)

thetutlage avatar Aug 10 '22 03:08 thetutlage

This looks fine to me. I've got slight worries that this might regress the experience for screenreader users, but I couldn't find anything about if we should announce when the tab changes to users.

koddsson avatar Aug 10 '22 11:08 koddsson

Not an accessibility expert at all. But, shouldn't setting aria-selected and tab-index will take care of it?

My use case is to have a language switch on the website and once you select language (ie TypeScript or JavaScript), all the codeblocks on that page will switch to the selected language.

https://user-images.githubusercontent.com/1706381/183889208-cc807fd6-6052-4506-99c5-9b385df75a1c.mov

thetutlage avatar Aug 10 '22 11:08 thetutlage

Any feedback guys?

thetutlage avatar Aug 24 '22 09:08 thetutlage

Thanks for your patience @thetutlage, this slipped between the cracks of our first responder rotation. @dgreif would you kindly give this some extra :eyes: and if you're happy merge+release?

keithamus avatar Aug 24 '22 09:08 keithamus

Thanks :)

thetutlage avatar Aug 25 '22 04:08 thetutlage