From a101608ebeb9750881dc23ce4a7a7233c2a883f7 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Javi=20Mart=C3=ADn?= <javim@elretirao.net>
Date: Tue, 5 Mar 2024 00:36:12 +0100
Subject: [PATCH] Fix invalid HTML in comment votes

We forgot to change the `span` tag when we replaced links with buttons
in commit ba0d21b46.
---
 app/assets/stylesheets/layout.scss               | 5 +++++
 app/components/comments/votes_component.html.erb | 8 ++++----
 spec/components/comments/votes_component_spec.rb | 8 ++++++++
 3 files changed, 17 insertions(+), 4 deletions(-)

diff --git a/app/assets/stylesheets/layout.scss b/app/assets/stylesheets/layout.scss
index bbe7d56b2..26957cbba 100644
--- a/app/assets/stylesheets/layout.scss
+++ b/app/assets/stylesheets/layout.scss
@@ -1720,6 +1720,11 @@ table {
     }
   }
 
+  .in-favor,
+  .against {
+    display: inline;
+  }
+
   .in-favor button {
     @include like-unlike-icon(thumbs-up, $like);
   }
diff --git a/app/components/comments/votes_component.html.erb b/app/components/comments/votes_component.html.erb
index 8ef3a8293..75215e984 100644
--- a/app/components/comments/votes_component.html.erb
+++ b/app/components/comments/votes_component.html.erb
@@ -2,17 +2,17 @@
   <%= t("comments.comment.votes", count: comment.total_votes) %>
   &nbsp;|&nbsp;
 
-  <span class="in-favor">
+  <div class="in-favor">
     <%= render Shared::VoteButtonComponent.new(comment,
                                                value: "yes",
                                                title: t("votes.agree")) %>
     <%= comment.total_likes %>
-  </span>
+  </div>
 
-  <span class="against">
+  <div class="against">
     <%= render Shared::VoteButtonComponent.new(comment,
                                                value: "no",
                                                title: t("votes.disagree")) %>
     <%= comment.total_dislikes %>
-  </span>
+  </div>
 </div>
diff --git a/spec/components/comments/votes_component_spec.rb b/spec/components/comments/votes_component_spec.rb
index 59708d71a..5c373b051 100644
--- a/spec/components/comments/votes_component_spec.rb
+++ b/spec/components/comments/votes_component_spec.rb
@@ -5,6 +5,14 @@ describe Comments::VotesComponent do
   let(:comment) { create(:comment, user: user) }
   let(:component) { Comments::VotesComponent.new(comment) }
 
+  it "generates valid HTML" do
+    render_inline component
+
+    expect(page).not_to have_css "span form"
+    expect(page).to have_css "div.in-favor > form"
+    expect(page).to have_css "div.against > form"
+  end
+
   describe "aria-pressed and method attributes" do
     it "have expected values when the in-favor button is pressed" do
       comment.vote_by(voter: user, vote: "yes")