A11Y: ensures avatar image in site header has alt attribute (#12161)

[jjaffeux]

A11Y: ensures avatar image in site header has alt attribute (#12161)

diff --git a/app/assets/javascripts/discourse/app/widgets/header.js b/app/assets/javascripts/discourse/app/widgets/header.js
index e581b7d..6dd0b8d 100644
--- a/app/assets/javascripts/discourse/app/widgets/header.js
+++ b/app/assets/javascripts/discourse/app/widgets/header.js
@@ -60,7 +60,12 @@ createWidget("header-notifications", {
     const contents = [
       avatarImg(
         this.settings.avatarSize,
-        addExtraUserClasses(user, avatarAttrs)
+        Object.assign(
+          {
+            alt: "user.avatar.header_title",
+          },
+          addExtraUserClasses(user, avatarAttrs)
+        )
       ),
     ];
 
diff --git a/app/assets/javascripts/discourse/app/widgets/post.js b/app/assets/javascripts/discourse/app/widgets/post.js
index b2dc65a..0b0bf69 100644
--- a/app/assets/javascripts/discourse/app/widgets/post.js
+++ b/app/assets/javascripts/discourse/app/widgets/post.js
@@ -37,17 +37,21 @@ export function avatarImg(wanted, attrs) {
   }
 
   let title;
-
   if (!attrs.hideTitle) {
     title = attrs.name || formatUsername(attrs.username);
   }
 
+  let alt = "";
+  if (attrs.alt) {
+    alt = I18n.t(attrs.alt);
+  }
+
   let className =
     "avatar" + (attrs.extraClasses ? " " + attrs.extraClasses : "");
 
   const properties = {
     attributes: {
-      alt: "",
+      alt,
       width: size,
       height: size,
       src: getURLWithCDN(url),

GitHub sha: 72258c66