fix: turn section into live region #306

[tricinel]

Issue: Older screen readers don't announce individual toasts

li elements are not allowed to have the role="status" tag as per MDN.

Fixes #306

What has been done:

• Removed aria-live, aria-atomic and role tags from the <li> element (the Toast)
• Added aria-live, aria-relevant and aria-atomic to the containing <section> element
• Removed the important key from the ToastT type

Screenshots/Videos:

Screen.Recording.2024-03-20.at.09.24.41.mov

Visually, not changed. Tests all pass. Build passes.

Notes

This is be a breaking change because we remove the important key from the ToastT type, meaning that consumers will get a type error if they've been using the key so far. Happy to discuss another solution to this, if any.

[vercel]

The latest updates on your projects. Learn more about Vercel for Git ↗︎

Name	Status	Preview	Comments	Updated (UTC)
sonner	✅ Ready (Inspect)	Visit Preview	💬 Add feedback	Nov 2, 2024 4:58pm

[tricinel]

As a proposal, we could have a way to deprecate the important key in the ToastT interface. And maybe "announce" it for the next few minor versions. Meaning, we keep it but it does nothing so we can warn users that it will disappear and they have time to prepare.

[tricinel]

Hm, I might need to update from main before it can be merged. I'll take care of that.

[andrewbarnesweb]

Is there any update on this PR? I could do with it as we have automated accessibility tests which it fails for... And for users 🙂

[tricinel]

I kept merging main into this, but I don't think it'll ever actually get merged, so I gave up :(

[tonyfarney]

@tricinel Why do you think it will not be merged?

[tricinel]

There are plenty of PRs unmerged 🤷

[emilkowalski]

Thanks, merged. My guess is that not a lot of people use important, so it's ok to merge.