svelte
svelte copied to clipboard
fix: warnings in examples page
What does this PR do
Fixes all warnings in examples page.
@dummdidumm @PuruVJ .
Thanks for the PR! There's a few issues I see:
- some of the places where you added
role='button'
would be better to use an actual<button>
element. This is because we use role=button, we also have to listen for key events and handle Space and Enter appropriately. It's simpler to just use the native button- some of the examples heavily rely on mouse movement so can't really be made accessible by adding buttons. We may want to rethink these examples in the future to not be so mouse-reliant but for now should ignore the warnings instead of adding roles that don't actually make the example more accessible.
- some of the warnings you resolved were false positives and should be rightfully ignored.
I think this PR shows that our current a11y warnings could definitely be improved to be more helpful and/or actionable (and avoid warnings that are false positives). They're pretty ARIA-heavy right now, and in most cases the solution is to use native HTML elements instead of ARIA. But that's something to be tackled separately from this PR.
I will fix the issues.
@geoffrich Made the changes as per your request. Review it.
Thanks for updating these! I think what Geoff meant with "ignore this warning" was to add a <!-- svelte-ignore [warning code] -->
for each a11y warning that still appears.
Thanks for updating these! I think what Geoff meant with "ignore this warning" was to add a
<!-- svelte-ignore [warning code] -->
for each a11y warning that still appears.
I have tried all the warning codes as per docs, but none of the warnings worked.