Discource-C
/
discourse
mirror of https://github.com/discourse/discourse.git
1
0
Fork 0
Code Issues Packages Projects Releases Wiki Activity

A11Y: aria-label for mobile topic list avatar (#23693)

This commit is contained in:
Kris 2023-09-28 13:29:56 -04:00 committed by GitHub
parent 3fe5ce7ab4
commit a523f17ed7
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
5 changed files with 6 additions and 5 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

2
app/assets/javascripts/discourse-common/addon/lib/avatar-utils.js
View File

@ -75,7 +75,7 @@ export function avatarImg(options, customGetURL) {
let title = ""; let title = "";
if (options.title) { if (options.title) {
const escaped = escape(options.title || ""); const escaped = escape(options.title || "");
title = ` title='${escaped}' aria-label='${escaped}'`; title = ` title='${escaped}'`;
} }
return `<img loading='lazy' alt='' width='${size}' height='${size}' src='${url}' class='${classes}'${title}>`; return `<img loading='lazy' alt='' width='${size}' height='${size}' src='${url}' class='${classes}'${title}>`;

2
app/assets/javascripts/discourse/app/raw-templates/mobile/list/topic-list-item.hbr
View File

@ -6,7 +6,7 @@
<input type="checkbox" class="bulk-select" id="bulk-select-{{topic.id}}"> <input type="checkbox" class="bulk-select" id="bulk-select-{{topic.id}}">
</label> </label>
{{else}} {{else}}
<a href="{{topic.lastPostUrl}}" data-user-card="{{topic.lastPosterUser.username}}">{{avatar topic.lastPosterUser imageSize="large"}}</a> <a href="{{topic.lastPostUrl}}" aria-label="{{i18n 'latest_poster_link' username=topic.lastPosterUser.username}}" data-user-card="{{topic.lastPosterUser.username}}">{{avatar topic.lastPosterUser imageSize="large"}}</a>
{{/if}} {{/if}}
</div> </div>
<div class='right'> <div class='right'>

2
app/assets/javascripts/discourse/tests/unit/lib/avatar-utils-test.js
View File

@ -69,7 +69,7 @@ module("Unit | Utilities", function (hooks) {
size: "tiny", size: "tiny",
title: "evilest trout", title: "evilest trout",
}), }),
"<img loading='lazy' alt='' width='24' height='24' src='/path/to/avatar/48.png' class='avatar' title='evilest trout' aria-label='evilest trout'>", "<img loading='lazy' alt='' width='24' height='24' src='/path/to/avatar/48.png' class='avatar' title='evilest trout'>",
"it adds a title if supplied" "it adds a title if supplied"
); );

4
app/assets/javascripts/discourse/tests/unit/models/report-test.js
View File

@ -370,7 +370,7 @@ module("Unit | Model | report", function (hooks) {
const computedUsernameLabel = usernameLabel.compute(row); const computedUsernameLabel = usernameLabel.compute(row);
assert.strictEqual( assert.strictEqual(
computedUsernameLabel.formattedValue, computedUsernameLabel.formattedValue,
"<a href='/admin/users/1/joffrey'><img loading='lazy' alt='' width='24' height='24' src='/' class='avatar' title='joffrey' aria-label='joffrey'><span class='username'>joffrey</span></a>" "<a href='/admin/users/1/joffrey'><img loading='lazy' alt='' width='24' height='24' src='/' class='avatar' title='joffrey'><span class='username'>joffrey</span></a>"
); );
assert.strictEqual(computedUsernameLabel.value, "joffrey"); assert.strictEqual(computedUsernameLabel.value, "joffrey");
@ -459,7 +459,7 @@ module("Unit | Model | report", function (hooks) {
const userLink = computedLabels[0].compute(row).formattedValue; const userLink = computedLabels[0].compute(row).formattedValue;
assert.strictEqual( assert.strictEqual(
userLink, userLink,
"<a href='/forum/admin/users/1/joffrey'><img loading='lazy' alt='' width='24' height='24' src='/forum/' class='avatar' title='joffrey' aria-label='joffrey'><span class='username'>joffrey</span></a>" "<a href='/forum/admin/users/1/joffrey'><img loading='lazy' alt='' width='24' height='24' src='/forum/' class='avatar' title='joffrey'><span class='username'>joffrey</span></a>"
); );
}); });
}); });

1
config/locales/client.en.yml
View File

@ -3933,6 +3933,7 @@ en:
other {} other {}
} }
latest_poster_link: "%{username}'s profile, latest poster"
original_post: "Original Post" original_post: "Original Post"
views: "Views" views: "Views"
sr_views: "Sort by views" sr_views: "Sort by views"