IntenseWebs/discourse
3
0
Fork 0
mirror of https://github.com/discourse/discourse.git synced 2025-02-25 18:55:32 -06:00
Code Issues Packages Projects Releases Wiki Activity

FIX: Add aria-labels to topic list items (#9048)

Browse Source 
* FIX: Add aria-labels to topic list items

Before this fix you could navigate the topic list using a screen reader
and a keyboard but some of the items were not as descriptive as they
could be. The newly added labels make it easier to understand what you
are tabbing over.

context:
https://meta.discourse.org/t/accessibility-aria-attributes-are-not-defined-for-links-under-replies-category/142539

* Update app/assets/javascripts/discourse/lib/utilities.js.es6

Co-Authored-By: Régis Hanol <regis@hanol.fr>

* Multiline fix

* Fix more tests

Co-authored-by: Régis Hanol <regis@hanol.fr>
This commit is contained in:
Robin Ward
2020-03-02 14:28:54 -05:00
committed by GitHub
parent f17459c620
commit a653737a66
5 changed files with 15 additions and 7 deletions
Download Patch File Download Diff File Expand all files Collapse all files

2
test/javascripts/lib/utilities-test.js.es6
View File

@@ -89,7 +89,7 @@ QUnit.test("avatarImg", assert => {
size: "tiny",
title: "evilest trout"
}),
"<img alt='' width='20' height='20' src='/path/to/avatar/40.png' class='avatar' title='evilest trout'>",
"<img alt='' width='20' height='20' src='/path/to/avatar/40.png' class='avatar' title='evilest trout' aria-label='evilest trout'>",
"it adds a title if supplied"
);

4
test/javascripts/models/report-test.js.es6
View File

@@ -459,7 +459,7 @@ QUnit.test("computed labels", assert => {
const computedUsernameLabel = usernameLabel.compute(row);
assert.equal(
computedUsernameLabel.formatedValue,
"<a href='/admin/users/1/joffrey'><img alt='' width='20' height='20' src='/' class='avatar' title='joffrey'><span class='username'>joffrey</span></a>"
"<a href='/admin/users/1/joffrey'><img alt='' width='20' height='20' src='/' class='avatar' title='joffrey' aria-label='joffrey'><span class='username'>joffrey</span></a>"
);
assert.equal(computedUsernameLabel.value, "joffrey");
@@ -542,6 +542,6 @@ QUnit.test("computed labels", assert => {
const userLink = computedLabels[0].compute(row).formatedValue;
assert.equal(
userLink,
"<a href='/forum/admin/users/1/joffrey'><img alt='' width='20' height='20' src='/forum/' class='avatar' title='joffrey'><span class='username'>joffrey</span></a>"
"<a href='/forum/admin/users/1/joffrey'><img alt='' width='20' height='20' src='/forum/' class='avatar' title='joffrey' aria-label='joffrey'><span class='username'>joffrey</span></a>"
);
});