This prevents a brief flash of unstyled tab content that can be noticed especially
in debug builds.
What happens currently is that we first append child content into the tab
upon connection, then we do attribute inheritance which sets the relevant
styling properties.
With this change we first set up the child content and attributes _before_ appending
the tab into the DOM, so that it's ready to render after being appended.
Differential Revision: https://phabricator.services.mozilla.com/D50837
--HG--
extra : moz-landing-system : lando
This means we only need to call parseXULToFragment a max of once per document
instead of a maximum of once per tab (which in practice isn't any better than
not caching since we only run connectedCallback logic once per tab).
Differential Revision: https://phabricator.services.mozilla.com/D50137
--HG--
extra : moz-landing-system : lando
The tool tip for a browser tab exposes information such as the process ids (on Nightly) and the container tab name.
It appears when a user mouses over the tab, but this isn't really accessible to screen reader users.
Ideally, we'd expose this information as the accessible description for all browser tabs.
However, doing this for all tabs and keeping it up to date is rather difficult and potentially expensive.
Instead, just expose this description for a tab when it gets focus; i.e. the user has to focus the tab bar to access it.
To enable this, XUL tab elements now fire an AriaFocus event on the ARIA focused tab when the ariaFocusedItem property is set.
Differential Revision: https://phabricator.services.mozilla.com/D38027
--HG--
extra : moz-landing-system : lando
A bunch of existing code assumes that <tab> elements are the immediate
and only children of a <tabs> element, and uses dom apis to traverse
relationships between these elements. To simplify conversion of <tabs>
to a custom element (and hopefully improve readability a bit at the same
time!), introduce new apis:
On <tab>
this.parentNode -> this.container
this.nextElementSibling -> this.container.findNextTab(...)
this.previousElementSibiling -> this.container.findNextTab(...)
On <tabs>
this.children -> this.allTabs
Differential Revision: https://phabricator.services.mozilla.com/D34648
--HG--
extra : source : f4e21e465f384b90fa1e768141c4db708748bf66
extra : histedit_source : 95d8a4242e8e04df9e29c2b647558d37e910b845
A bunch of existing code assumes that <tab> elements are the immediate
and only children of a <tabs> element, and uses dom apis to traverse
relationships between these elements. To simplify conversion of <tabs>
to a custom element (and hopefully improve readability a bit at the same
time!), introduce new apis:
On <tab>
this.parentNode -> this.container
this.nextElementSibling -> this.container.findNextTab(...)
this.previousElementSibiling -> this.container.findNextTab(...)
On <tabs>
this.children -> this.allTabs
Differential Revision: https://phabricator.services.mozilla.com/D34648
--HG--
extra : rebase_source : affeda0295a5195124709f322de524aea3a28a3f