MDL-80279 core: Set new attributes for user profile initials
When the user does not have a profile photo and initials are displayed, there is no alt text for the initials which causes accessibility issues, so with this change I added the user's full name to the title and aria-label attributes and I set a role='img' when the element span is rendered.
This commit is contained in:
@@ -2732,10 +2732,16 @@ class core_renderer extends renderer_base {
|
||||
// Get the image html output first, auto generated based on initials if one isn't already set.
|
||||
if ($user->picture == 0 && empty($CFG->enablegravatar) && !defined('BEHAT_SITE_RUNNING')) {
|
||||
$initials = \core_user::get_initials($user);
|
||||
$fullname = fullname($userpicture->user, $canviewfullnames);
|
||||
// Don't modify in corner cases where neither the firstname nor the lastname appears.
|
||||
$output = html_writer::tag(
|
||||
'span', $initials,
|
||||
['class' => 'userinitials size-' . $size]
|
||||
[
|
||||
'class' => 'userinitials size-' . $size,
|
||||
'title' => $fullname,
|
||||
'aria-label' => $fullname,
|
||||
'role' => 'img',
|
||||
]
|
||||
);
|
||||
} else {
|
||||
$output = html_writer::empty_tag('img', $attributes);
|
||||
|
||||
@@ -917,7 +917,8 @@ class user_test extends \advanced_testcase {
|
||||
// Display profile picture.
|
||||
$context = \context_system::instance();
|
||||
// No image, show initials.
|
||||
$this->assertStringContainsString("<span class=\"userinitials size-35\">JD</span></a>",
|
||||
$this->assertStringContainsString(
|
||||
"<span class=\"userinitials size-35\" title=\"John Doe\" aria-label=\"John Doe\" role=\"img\">JD</span></a>",
|
||||
$OUTPUT->render(\core_user::get_profile_picture($user1, $context)));
|
||||
// With Image.
|
||||
$expectedimagesrc = $CFG->wwwroot . '/pluginfile.php/' . \context_user::instance($user2->id)->id .
|
||||
@@ -927,12 +928,14 @@ class user_test extends \advanced_testcase {
|
||||
|
||||
// Display profile picture with options.
|
||||
$options = ['size' => 50, 'includefullname' => true];
|
||||
$this->assertStringContainsString("<span class=\"userinitials size-50\">JD</span>John Doe</a>",
|
||||
$this->assertStringContainsString(
|
||||
"<span class=\"userinitials size-50\" title=\"John Doe\" aria-label=\"John Doe\" role=\"img\">JD</span>John Doe</a>",
|
||||
$OUTPUT->render(\core_user::get_profile_picture($user1, $context, $options)));
|
||||
|
||||
// Display profile picture with options, no link.
|
||||
$options = ['link' => false];
|
||||
$this->assertEquals("<span class=\"userinitials size-35\">JD</span>",
|
||||
$this->assertEquals(
|
||||
"<span class=\"userinitials size-35\" title=\"John Doe\" aria-label=\"John Doe\" role=\"img\">JD</span>",
|
||||
$OUTPUT->render(\core_user::get_profile_picture($user1, $context, $options)));
|
||||
}
|
||||
|
||||
|
||||
Reference in New Issue
Block a user