[#17543] - [a11y] Icons: Print, Email, Edit - change to button
- Fixed in Code Base
- 17 Aug 2017
- Medium
- Build: staging
- # 17543
- Diff
- zwiastunsw:article_tag
User tests: Successful: Unsuccessful:
Summary of Changes
- Change the tag a to button
- Add ARIA
- Add new language string: JUSER_TOOLS="User tools
Testing Instructions
- Open the page with the article and the Print, Email, Edit icon
- Check the appearance of the button
- Check keyboard support
- Make sure the screen reader (e.g. NVDA and add-on ChromeVox to Chrome) announces the menu button as a user tool
Expected result
- TAB - moves focus
- ENTER - expands menu
- Down arrow / TAB - moves to Print, Email, Edit icon
Screen reader announces the menu button as a user tool
Actual result
The assistive technology user is informed that he is dealing with a link.
He does not know where the link leads. But this is not a link.
On the blog page, the link repeat several times with the goal: "eight" (incomprehensible word...)
Documentation Changes Required
No changes to the documentation required - no new functionality introduced.
joomla-cms-bot
- | Category | ⇒ | Language & Strings Layout |
| Status | New | ⇒ | Pending |
| Labels |
Added:
?
?
|
||
@zero-24 @franz-wohlkoenig Please add accessibility category.
This comment was created with the J!Tracker Application at issues.joomla.org/tracker/joomla-cms/17543.
| Category | Language & Strings Layout | ⇒ | Accessibility Language & Strings Layout |
| Labels | |||
done. As this is a tracker category this can be done using the tracker
This comment was created with the J!Tracker Application at issues.joomla.org/tracker/joomla-cms/17543.
At request I made an Accessibility label here on GitHub the other day (apparently someone had deleted it), just added it back.
Why do we add labels on github when we have a much better way to do that over the tracker? So no one need push access to add that label / category?
Expecial as this category is much older than this new github label :P
I thought that a ID had to be unique
Aria haspopup is for menus. I am not sure if these links constitute a menu.
https://www.w3.org/TR/wai-aria/states_and_properties#aria-haspopup
I have tested this item
The ID attribute must be unique on a page and if you are on a blog page then this code will create multiple ID
https://dequeuniversity.com/rules/axe/1.1/duplicate-id
This is a level A a11y requirement
This comment was created with the J!Tracker Application at issues.joomla.org/tracker/joomla-cms/17543.
| Labels |
Added:
?
|
||
Thanks, @brianteeman.
- I changed ID.
- In my opinion, this is user's tool menu
-
thanks but why add it the labelledby to the ul - surely that isnt needed
-
ok
- For compatibility with Bootstrap pattern
I dont see that in the bootstrap documentation could you point me to it please
This PR is for bootstrap 2 ;)
Sorry I just found it in the bootstrap 2 docs as well
I have tested this item
Thanks
This comment was created with the J!Tracker Application at issues.joomla.org/tracker/joomla-cms/17543.
I have tested this item
This comment was created with the J!Tracker Application at issues.joomla.org/tracker/joomla-cms/17543.
I have tested this item
This comment was created with the J!Tracker Application at issues.joomla.org/tracker/joomla-cms/17543.
| Status | Pending | ⇒ | Ready to Commit |
RTC after two successful tests.
| Status | Ready to Commit | ⇒ | Fixed in Code Base |
| Closed_Date | 0000-00-00 00:00:00 | ⇒ | 2017-08-17 12:16:06 |
| Closed_By | ⇒ | mbabker | |
| Labels |
Added:
?
|
||
@zwiastunsw @Quy i have just fixed this and a space bug in the layout file with the new "button" tag