A11y Slacker archive 2017-08-12

zakim-robot

@zakim-robot
Aug 12 02:54

[johnkmcnabb] Can someone with Ember experience please tell me if this code is valid? It looks odd to me - there's a ui-checkbox tag with role="checkbox", and nested inside of that is a native input tag with type="checkbox". Isn't it strange to have a checkbox within a checkbox?

<div class="checkbox-wrapper">
<div id="ember859" class="ember-view ui-set-checkbox">
<ui-checkbox id="ember870" role="checkbox" aria-label="Don't show this again" aria-checked="false" tabindex="0" class="ember-view ui-checkbox ui-display-default">
<input type="checkbox" tabindex="0" aria-hidden="true" id="ember870-input">
<div class="ui-wrapper">

</div>
</ui-checkbox>
<label class="ui-partial-label" id="ember870-label" for="ember870-input">
Don't show this again

</label>


<div id="ember879" aria-live="assertive" class="ember-view ui-set-messages">

</div>
</div>
</div>

This code seems to be causing problems on some browser + screen reader combinations, but the Ember developer says it works with most browsers and screen readers, so it must be fine.
[nathanhammond] Custom elements don't mean anything to AT.
[nathanhammond] I suspect that this is fine.
[nathanhammond] However, it depends on whatever the ui-checkbox is set up to do.
zakim-robot

@zakim-robot
Aug 12 03:00

[nathanhammond] (Note: that code isn't nearly enough to analyze correctness.)
zakim-robot

@zakim-robot
Aug 12 03:08

[johnkmcnabb] Hmmm, thanks. I would never have coded a checkbox inside another checkbox, but I'm not an Ember developer.
[nathanhammond] Note that it's not a checkbox in a checkbox.
[nathanhammond] It's a custom element wrapping a checkbox.
[johnkmcnabb] No? What about the role="checkbox" attribute? Doesn't that specify a checkbox, at least semantically?
[nathanhammond] (This has little to nothing to do with Ember.)
zakim-robot

@zakim-robot
Aug 12 03:15

[johnkmcnabb] I'm not sure what that custom element will turn into (that depends on Ember, right?), but the actual input tag with type="checkbox" has aria-hidden="true" which does impact AT.
zakim-robot

@zakim-robot
Aug 12 03:28

[johnkmcnabb] I'm sorry I couldn't share more of the code, but it's not easy to get content from my work laptop (it's completely locked down).

But from this code it appears to me that the developer is creating an Ember checkbox and a native checkbox - each with partial functionality - rather than creating one checkbox that has everything we need.
zakim-robot

@zakim-robot
Aug 12 06:41

[nathanhammond] That ui-checkbox is not an Ember-supplied custom element. You're looking at a rendered output (made clear by those strange comment placeholders). It's coming as the output from an Ember component whose tag name has been bound to ui-checkbox, but behavior is fully custom to whatever the dev is using for that component (possibly hand-rolled, possibly from an addon).
[nathanhammond] Without seeing the backing JS I can't tell what all it does, or why it was coded this way, and what problems the code is intended to solve.
zakim-robot

@zakim-robot
Aug 12 06:47

[nathanhammond] In other words, evaluate this on its merits at use, file bugs for bad AT behavior.
zakim-robot

@zakim-robot
Aug 12 12:48

[johnkmcnabb] OK, thanks.
zakim-robot

@zakim-robot
Aug 12 20:10

[cameron] Friends, I'm working on a fix for Ruby on Rails to stop generating alt text based on filename
[cameron] the catch is that it'll cause failures automated testing tools. Failures that are correct but otherwise new.
[cameron] this might be surprising to developers to have new failures, and so I wanted to gauge here what folks are doing for testing
[cameron] who's using automated accessibility in Rails apps?
[cameron] If you're in Slack you can post a reaction to this message, or else respond
[cameron] or any kind of accessibility linting/QA for that matter

Gitter Channel Archive 12th of August 2017