From 05438d99a85c5cb8825dbb7d481cd34237302460 Mon Sep 17 00:00:00 2001
From: Matthew Campbell <mwc+github@mwcampbell.us>
Date: Wed, 24 Oct 2018 06:58:42 -0700
Subject: [PATCH] FIX: Ensure the like button always has a title, for
 accessibility (#6525)

The like button previously didn't have a title for anonymous users,
because the `canToggleLike` flag wasn't set, but the `liked` flag wasn't
set either. This made the button inaccessible to blind users.
---
 .../javascripts/discourse/widgets/post-menu.js.es6  | 13 +++++++++----
 test/javascripts/widgets/post-test.js.es6           |  6 ++++++
 2 files changed, 15 insertions(+), 4 deletions(-)

diff --git a/app/assets/javascripts/discourse/widgets/post-menu.js.es6 b/app/assets/javascripts/discourse/widgets/post-menu.js.es6
index 7e65b0ac47..0a1eaf0e16 100644
--- a/app/assets/javascripts/discourse/widgets/post-menu.js.es6
+++ b/app/assets/javascripts/discourse/widgets/post-menu.js.es6
@@ -67,13 +67,18 @@ registerButton("like", attrs => {
     className
   };
 
-  if (attrs.canToggleLike) {
+  // If the user has already liked the post and doesn't have permission
+  // to undo that operation, then indicate via the title that they've liked it
+  // and disable the button. Otherwise, set the title even if the user
+  // is anonymous (meaning they don't currently have permission to like);
+  // this is important for accessibility.
+  if (attrs.liked && !attrs.canToggleLike) {
+    button.title = "post.controls.has_liked";
+    button.disabled = true;
+  } else {
     button.title = attrs.liked
       ? "post.controls.undo_like"
       : "post.controls.like";
-  } else if (attrs.liked) {
-    button.title = "post.controls.has_liked";
-    button.disabled = true;
   }
 
   return button;
diff --git a/test/javascripts/widgets/post-test.js.es6 b/test/javascripts/widgets/post-test.js.es6
index f01f7df534..5c4ff36fd3 100644
--- a/test/javascripts/widgets/post-test.js.es6
+++ b/test/javascripts/widgets/post-test.js.es6
@@ -206,6 +206,12 @@ widgetTest("anon liking", {
     assert.ok(!!this.$(".actions button.like").length);
     assert.ok(this.$(".actions button.like-count").length === 0);
 
+    assert.equal(
+      this.$("button.like").attr("title"),
+      I18n.t("post.controls.like"),
+      `shows the right button title for anonymous users`
+    );
+
     await click(".actions button.like");
     assert.ok(this.loginShown);
   }