Hacker News new | ask | show | jobs
by PaulHoule 63 days ago
Funny I have modals on my mind this afternoon and boy does it drive me up the wall that mainstream React frameworks still aren't using the <dialog> element and without that you will fail WCAG because all the other schemes that are supposed to hide the rest of the page don't.

It isn't even that hard, like I've been able to update the parts of MUI and reactstrap that my applications use even to calculate coordinates for portalized flyovers correctly. I could send but I just don't want to do the 5x work to do all the other components I don't use and then face the politics of a community that probably doesn't care if disabled people can use their products or even if they can check the boxes and pass WCAG. <dialog> is easy to use with HTMX and just a touch awkward with React because React insists on being level-triggered in edge-triggered situations but once you have it coded up <DialogsThatReallyWork/> just work.

3 comments

I tried to use <dialog> and found it to be a pain. I wanted to close it when clicking outside, but Safari doesn't support closedBy. Some Safari versions on iOS broke when trying to style my backdrop with tailwind. The tailwind CSS reset didn't include <dialog>. I get the allure of just using a position: fixed;
WCAG is lot lot more than just using <dialog> and unless you do a thorough review with a professional in this field, <dialog> won't solve anything. Do you know how many other WCAG guidelines your app or your site misses. No one knows that.
We do pretty good on Siteimprove and similar checkers although these are frequently wrong and in some cases I think think the specs are actually wrong or miss important things for political reasons. We have customers who send us bug reports and we fix them, we catch others preemptively ourselves.

It is a problem that the experiences of disabled people are erased by the current regime, I haven't once seen an organization actually ask a disabled person if they can use the site or how it can be better.

Also I think accessibility tools are trash. If I start NVDA on my dev machine I have to power cycle it to get control back. Microsoft Narrator sorta works but the more you use landmarks and other aria-markup the more it starts blurting out things like "LANDMARK NAVIGATION LANDMARK!" in the middle of reading something even thought Siteimprove thinks it is all peachy. Is it a fail? Or did the tool fail? My tester or myself can look at an application as a sighted user and test it in Firefox/Chrome/Safari and say "it works" but it is not clear at all what the "definition is done" for testing with screen readers.

I hear JAWS is better than the others but it costs about as much as a car. In the meantime though I know when we don't use <dialog> we fail and I've seen a lot of third party modals that don't use <dialog> that all fail.

Dialog is easy to use with just plain JavaScript.
It's just plain easy. It boggles my mind that nobody uses it.

But then again it boggles my mind that you can pass WCAG with those "is this a motorcycle?" things or that stupid anime girl you see on Linux pages or a GDPR popup and you can. People will say "what if you have to support WCAG and GDPR?" and I say "sometimes you have to make a choice", I mean a11y work is damned if you damned and damned if you don't, just damned all the time and personally the EU screws up my life a lot more than Iran ever did.