From 8b963986b32d8fa951815aaad83b614f8895d9ba Mon Sep 17 00:00:00 2001
From: Robert <35533304+merefield@users.noreply.github.com>
Date: Fri, 5 Jul 2024 09:55:14 +0100
Subject: [PATCH] FIX: Poll: critical display issue when results are only shown
 upon vote (#27732)

---
 .../discourse/components/poll-info.gjs        | 24 ++++++--
 .../javascripts/component/poll-info-test.js   | 56 ++++++++++++++++++-
 2 files changed, 73 insertions(+), 7 deletions(-)

diff --git a/plugins/poll/assets/javascripts/discourse/components/poll-info.gjs b/plugins/poll/assets/javascripts/discourse/components/poll-info.gjs
index be23e6191fa..e412ba3dc32 100644
--- a/plugins/poll/assets/javascripts/discourse/components/poll-info.gjs
+++ b/plugins/poll/assets/javascripts/discourse/components/poll-info.gjs
@@ -109,10 +109,18 @@ export default class PollInfoComponent extends Component {
     );
   }
 
+  get resultsOnVoteTitle() {
+    return htmlSafe(I18n.t("poll.results.vote.title"));
+  }
+
   get resultsOnClose() {
     return this.args.results === ON_CLOSE && !this.args.closed;
   }
 
+  get resultsOnCloseTitle() {
+    return htmlSafe(I18n.t("poll.results.close.title"));
+  }
+
   get resultsStaffOnly() {
     return (
       this.args.results === STAFF_ONLY &&
@@ -120,6 +128,10 @@ export default class PollInfoComponent extends Component {
     );
   }
 
+  get resultsStaffOnlyTitle() {
+    return htmlSafe(I18n.t("poll.results.staff.title"));
+  }
+
   get publicTitle() {
     return (
       !this.args.closed &&
@@ -179,21 +191,21 @@ export default class PollInfoComponent extends Component {
             {{/if}}
           {{/if}}
           {{#if this.resultsOnVote}}
-            <li>
+            <li class="results-on-vote">
               {{icon "check"}}
-              <span>{{I18n "poll.results.vote.title"}}</span>
+              <span>{{this.resultsOnVoteTitle}}</span>
             </li>
           {{/if}}
           {{#if this.resultsOnClose}}
-            <li>
+            <li class="results-on-close">
               {{icon "lock"}}
-              <span>{{I18n "poll.results.closed.title"}}</span>
+              <span>{{this.resultsOnCloseTitle}}</span>
             </li>
           {{/if}}
           {{#if this.resultsStaffOnly}}
-            <li>
+            <li class="results-staff-only">
               {{icon "shield-alt"}}
-              <span>{{I18n "poll.results.staff.title"}}</span>
+              <span>{{this.resultsStaffOnlyTitle}}</span>
             </li>
           {{/if}}
           {{#if this.publicTitle}}
diff --git a/plugins/poll/test/javascripts/component/poll-info-test.js b/plugins/poll/test/javascripts/component/poll-info-test.js
index 98d90c2d944..c5be29f492c 100644
--- a/plugins/poll/test/javascripts/component/poll-info-test.js
+++ b/plugins/poll/test/javascripts/component/poll-info-test.js
@@ -14,7 +14,7 @@ const OPTIONS = [
 module("Poll | Component | poll-info", function (hooks) {
   setupRenderingTest(hooks);
 
-  test("multiple poll", async function (assert) {
+  test("public multiple poll with results anytime", async function (assert) {
     this.setProperties({
       isMultiple: true,
       min: 1,
@@ -59,4 +59,58 @@ module("Poll | Component | poll-info", function (hooks) {
       "displays the public label"
     );
   });
+
+  test("public multiple poll with results only shown on vote", async function (assert) {
+    this.setProperties({
+      isMultiple: true,
+      min: 1,
+      max: 2,
+      options: OPTIONS,
+      close: null,
+      closed: false,
+      results: "on_vote",
+      showResults: false,
+      postUserId: 59,
+      isPublic: true,
+      hasVoted: false,
+      voters: [],
+    });
+
+    await render(hbs`<PollInfo
+      @options={{this.options}}
+      @min={{this.min}}
+      @max={{this.max}}
+      @isMultiple={{this.isMultiple}}
+      @close={{this.close}}
+      @closed={{this.closed}}
+      @results={{this.results}}
+      @showResults={{this.showResults}}
+      @postUserId={{this.postUserId}}
+      @isPublic={{this.isPublic}}
+      @hasVoted={{this.hasVoted}}
+      @voters={{this.voters}}
+    />`);
+
+    assert.strictEqual(
+      query(".poll-info_instructions li.multiple-help-text").textContent.trim(),
+      I18n.t("poll.multiple.help.up_to_max_options", {
+        count: this.max,
+      }).replace(/<\/?[^>]+(>|$)/g, ""),
+      "displays the multiple help text"
+    );
+
+    assert.strictEqual(
+      query(
+        ".poll-info_instructions li.results-on-vote span"
+      ).textContent.trim(),
+      I18n.t("poll.results.vote.title").replace(/<\/?[^>]+(>|$)/g, ""),
+      "displays the results on vote label"
+    );
+
+    assert.strictEqual(
+      query(".poll-info_instructions li.is-public").textContent.trim(),
+      I18n.t("poll.public.title").replace(/<\/?[^>]+(>|$)/g, ""),
+      "displays the public label"
+    );
+  });
 });