Use a button to delete comments

As mentioned in commit 5311daadf, there are several reasons to use
buttons in these situations. And, as mentioned in the previous commits,
using buttons instead of links for actions requiring confirmation will
help us test for accessibility issues.

app/assets/stylesheets/layout.scss

@@ -1543,8 +1543,13 @@ table {
     }
   }
 
+  .delete-comment-form {
+    display: inline;
+  }
+
   .delete-comment {
     @include has-fa-icon(trash-alt, regular);
+    cursor: pointer;
 
     &:not(:hover):not(:active) {
       color: $delete;

app/views/comments/_actions.html.erb

@@ -5,10 +5,10 @@
 <% if can?(:hide, comment) || can?(:hide, comment.user) %>
   <% if comment.author == current_user %>
     <span class="divider">&nbsp;&bull;&nbsp;</span>
-    <%= link_to t("comments.actions.delete"),
-                hide_comment_path(comment),
-                method: :put, remote: true, class: "delete-comment",
-                data: { confirm: t("comments.actions.confirm_delete") } %>
+    <%= button_to t("comments.actions.delete"),
+                  hide_comment_path(comment),
+                  method: :put, remote: true, class: "delete-comment", form_class: "delete-comment-form",
+                  data: { confirm: t("comments.actions.confirm_delete") } %>
   <% else %>
     <%= render Shared::ModerationActionsComponent.new(comment) %>
   <% end %>

spec/system/comments_spec.rb

@@ -336,16 +336,16 @@ describe "Comments" do
       visit polymorphic_path(resource)
 
       accept_confirm("Are you sure? This action will delete this comment. You can't undo this action.") do
-        within(".comment-body", text: "This was a mistake") { click_link "Delete comment" }
+        within(".comment-body", text: "This was a mistake") { click_button "Delete comment" }
       end
 
       expect(page).not_to have_content "This was a mistake"
-      expect(page).not_to have_link "Delete comment"
+      expect(page).not_to have_button "Delete comment"
 
       refresh
 
       expect(page).not_to have_content "This was a mistake"
-      expect(page).not_to have_link "Delete comment"
+      expect(page).not_to have_button "Delete comment"
 
       logout
       login_as(admin)
@@ -363,7 +363,7 @@ describe "Comments" do
       visit polymorphic_path(resource)
 
       accept_confirm("Are you sure? This action will delete this comment. You can't undo this action.") do
-        within(".comment-body", text: "Wrong comment") { click_link "Delete comment" }
+        within(".comment-body", text: "Wrong comment") { click_button "Delete comment" }
       end
 
       within "#comments > .comment-list > li", text: "Right reply" do