wwnorton/design-system

Out-of-sync server/client ids [NDS-22]

sh0ji opened this issue · 2 comments

sh0ji commented

While looking more deeply into #92, I realized that the issue of internal component ids is quite complex and is not fully resolved. Specifically, as implemented, there's no guarantee that the server's initial hydration of the components will generate the same IDs as the client, which could cause issues in isomorphic applications.

This is addressed by quite a few of other systems and libraries:

Also note that the incubating Accessibility Object Model (AOM) spec proposes a DOM-like solution to this where we wouldn't be required to use ids to set ARIA relationship properties, making this whole thing much easier. Setting relationship properties without needing to use IDREFs.

NDS-22

sh0ji commented

Just noticed that we're seeing this (or something like it) on the website's color scheme switch:

image

The aria-labelledby="nds-tooltip-2" should point to the id of the <div aria-hidden="true" id="nds-tooltip-4" hidden="">Dark mode</div>.

Issue linked to JIRA Story: NDS-22