ember-power-select
ember-power-select copied to clipboard
power select does not pass ember-a11y checks
https://github.com/ember-a11y is a plugin that does accessibility check and ember-power-select show a few errors.
Is it possible to fix them or add custom config to avoid them ?
I'll add below a few of the errors the plugins gives me
aria-valid-attr-value
for tag aria-controls="ember-power-select-trigger-ember489"
on the ul element with the options list
there is no element in the dom with that id
same goes for other aria-controls, such as the <input type="search" autocomplete="off"
Are you on the latest version? I'm aware of a couple a11y things that can me improved, but that one in particular I think that was fixed here: https://github.com/cibernox/ember-basic-dropdown/pull/224
one other rule is this one : "aria-required-children"
role="combo-box" must reference id of either a listbox or textbox with aria-owns attribute
@cibernox i'm using"ember-power-select": "1.6.1" npm dependency
@drallieiv can you check the version of ember-basic-dropdown?
npm -g ls says [email protected]
Third one is
ìn the selected line : li aria-selected="false" aria-current="true"
aria-current
does not exist in the aria specifications : https://www.w3.org/TR/wai-aria/states_and_properties#attrs_widgets
Added proper labels. I won't have time next week as I'll be travelling
As a summary, I think ember power select is in advance and use tags from WCAG 1.1 but ember-a11y-testing only supports WCAG 1.0
https://github.com/ember-a11y/ember-a11y-testing/issues/75
I have several failing checks as well - just with basic functionality. Have not yet tried multi-select. It's possible changes in #806 may resolve some of these issues.
For the moment, here are the failing checks as I see them. Some appear in different states - initial load, trigger (show options list), and selection of an option
- [critical]: Buttons must have discernible text
- [critical]: ARIA attributes must conform to valid values
- [serious]: Elements must have sufficient color contrast
- [critical]: Required ARIA attributes must be provided
- [critical]: Certain ARIA roles must contain particular children
- [critical]: Form elements must have labels
@AdrienNguyenWorldline I think you mean ARIA 1.0 and 1.1, not WCAG. axe-core
does support 1.1, so if you are using up-to-date version of ember-a11y-testing
, you have 1.1 support. I am using the latest version and I still have the errors above.
@ctcpip I won't have time this week to look at this, but have good A11Y is on my roadmap. Ping me back at the end of the next week so I can review this.
@cibernox Will do. Thanks. I am happy to help as well.
@cibernox
Ping me back at the end of the next week so I can review this.
I was overly optimistic with the amount of work a moving involves. I'm still assembling Ikea stuff. Can we delay it until mid-next week?
Any progress on this? Or any guidance on how to help out?
Any progress on this?
As I recall, the next step was to create a new issue to track all the a11y issues. This would be a checklist broken into 2 sections, one with issues specific to this addon, and another with issues specific to the base addon. Each item in the list would reference the already existing issue(s) where applicable, and those issues would be closed in favor of One Issue to Rule Them All. Of course, that doesn't do anything to actually resolve the a11y problems, but that was the starting point for organization, so we have everything in one place and can prioritize work.
I am using ember-power-select 3.0.2 with ember-a11y 0.2.1 on ember 3.11 and I get a lot of accessibility errors.
Will there be any movement on this?
@BitBrit I'm happy to help, but aria is not my area of expertise. I'd take any PR that help with this. I am particularly worried about the first error, what is going on there?
I would be willing to look into this issue provided an open, honest review process were I to ramp up on this project. Thanks!
A11y support was improved in last years and specially in v8.
If we need additional changes please create a new issue / PR with info, what is wrong / missing and how we shoud fix it