Warning - this is going to be a little bit of a rant. And it’s not really specific to Meteor, except that I’ve encountered all of these issues as a result of learning Meteor.
I recently left (unnamed big company) where I spent the last two years building a library of JavaScript widgets that was used internally in dozens of major apps. One of my goals was to build world-class WAI-ARIA support into the library from the ground up, on both mobile and desktop platforms. I worked closely with a lot of experts in this area, including blind engineers and users. My goal was to make it so that application programmers didn’t have to think very much about accessibility, they would get most of the ARIA goodness for free.
Now I find myself in a new environment, where I’m learning about all of the various frameworks and libraries in the open-source ecosystem such as Meteor and React. And one of the thing that I’m looking at is what’s the state of ARIA / accessibility support. And to say the least, I’m not at all impressed by what I see.
To give a couple of examples: the ARIA authoring guidelines talk about a technique called “tab trapping”, which basically means that when you have a modal dialog up, and you have keyboard focus on the last field or button, the TAB key should wrap around to the first focusable field - it should not navigate to some other random part of the document. This is typically accomplished by placing dummy invisible fields with a tabindex before and after the dialog content, combined with a focus event listener that moves the focus to the first or last field as appropriate. Not terribly hard to do, and ideally this behavior should just be built into the dialog widget so you don’t have to think about it.
And yet, when I look at the most popular widget libraries, not only do they not do this - most of them don’t even support keyboard-based navigation at all! The dialog buttons can’t be tab-navigated, or the keyboard focus indicator is invisible. This doesn’t just affect blind or mobility-impaired users, it affects any user that uses the keyboard instead of a mouse or touchpad.
Another example: when a modal dialog or popup menu is displayed, and the user hits the browser’s ‘back’ button (or the android ‘back arrow’ button which is equivalent), the expected behavior, at least the behavior that is consistent with native apps, is to dismiss or cancel the popup - not to navigate to the previous page. Again, this is fairly easy to implement by inserting a callback into the browser’s history stack when opening the popup. But I haven’t found a single widget library that does this.
I could give more examples but I won’t. I could file bugs but I’d have to file them for every project
So I guess my question is, 1) are there any JS widget libraries out there that have decent accessibility support (ideally with good Meteor integration), and 2) does anyone even care about this?