A11Y: aria-label for mobile topic list avatar (#23693)
This commit is contained in:
parent
3fe5ce7ab4
commit
a523f17ed7
|
@ -75,7 +75,7 @@ export function avatarImg(options, customGetURL) {
|
|||
let title = "";
|
||||
if (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}>`;
|
||||
|
|
|
@ -6,7 +6,7 @@
|
|||
<input type="checkbox" class="bulk-select" id="bulk-select-{{topic.id}}">
|
||||
</label>
|
||||
{{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}}
|
||||
</div>
|
||||
<div class='right'>
|
||||
|
|
|
@ -69,7 +69,7 @@ module("Unit | Utilities", function (hooks) {
|
|||
size: "tiny",
|
||||
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"
|
||||
);
|
||||
|
||||
|
|
|
@ -370,7 +370,7 @@ module("Unit | Model | report", function (hooks) {
|
|||
const computedUsernameLabel = usernameLabel.compute(row);
|
||||
assert.strictEqual(
|
||||
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");
|
||||
|
||||
|
@ -459,7 +459,7 @@ module("Unit | Model | report", function (hooks) {
|
|||
const userLink = computedLabels[0].compute(row).formattedValue;
|
||||
assert.strictEqual(
|
||||
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>"
|
||||
);
|
||||
});
|
||||
});
|
||||
|
|
|
@ -3933,6 +3933,7 @@ en:
|
|||
other {}
|
||||
}
|
||||
|
||||
latest_poster_link: "%{username}'s profile, latest poster"
|
||||
original_post: "Original Post"
|
||||
views: "Views"
|
||||
sr_views: "Sort by views"
|
||||
|
|
Loading…
Reference in New Issue