From 4fd99e2d302a0df485d73ea514f3003cfc351b7a Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?Javi=20Mart=C3=ADn?= Date: Wed, 29 Sep 2021 03:07:16 +0200 Subject: [PATCH 01/11] Add proposal name to vote links aria-label This way blind screen reader users will know which proposal they're supporting. In a list of proposals, context might not be clear when a link saying "Support" or "Support this proposal" is announced, but a link saying "Support Create a monthly transport ticket" is less ambiguous. Just like we did with investments in commit de436e33a, we're keeping the title attribute because when visiting a proposal page, the connection between the "Support" link and the proposal is not as clear as it is in the proposals index page, so it might not be clear what you're supporting. --- app/components/proposals/votes_component.html.erb | 3 ++- app/components/proposals/votes_component.rb | 4 ++++ config/locales/en/general.yml | 1 + config/locales/es/general.yml | 1 + spec/components/proposals/votes_component_spec.rb | 1 + 5 files changed, 9 insertions(+), 1 deletion(-) diff --git a/app/components/proposals/votes_component.html.erb b/app/components/proposals/votes_component.html.erb index 3ee2553ba..e6302e481 100644 --- a/app/components/proposals/votes_component.html.erb +++ b/app/components/proposals/votes_component.html.erb @@ -11,7 +11,8 @@ class: "button button-support small expanded", title: t("proposals.proposal.support_title"), method: "post", - remote: true %> + remote: true, + "aria-label": support_aria_label%> <% else %>
<%= t("proposals.proposal.support") %> diff --git a/app/components/proposals/votes_component.rb b/app/components/proposals/votes_component.rb index bae9cf50c..6fbf7d351 100644 --- a/app/components/proposals/votes_component.rb +++ b/app/components/proposals/votes_component.rb @@ -21,6 +21,10 @@ class Proposals::VotesComponent < ApplicationComponent proposal.votable_by?(current_user) end + def support_aria_label + t("proposals.proposal.support_label", proposal: proposal.title) + end + def organization? current_user&.organization? end diff --git a/config/locales/en/general.yml b/config/locales/en/general.yml index c6f99722b..260bd56bd 100644 --- a/config/locales/en/general.yml +++ b/config/locales/en/general.yml @@ -408,6 +408,7 @@ en: other: "%{count} comments" zero: No comments support: Support + support_label: "Support %{proposal}" support_title: Support this proposal supports: one: 1 support diff --git a/config/locales/es/general.yml b/config/locales/es/general.yml index aaae524ca..661f1da17 100644 --- a/config/locales/es/general.yml +++ b/config/locales/es/general.yml @@ -408,6 +408,7 @@ es: one: 1 Comentario other: "%{count} Comentarios" support: Apoyar + support_label: "Apoyar %{proposal}" support_title: Apoyar esta propuesta supports: zero: Sin apoyos diff --git a/spec/components/proposals/votes_component_spec.rb b/spec/components/proposals/votes_component_spec.rb index b4837318d..51b7a769e 100644 --- a/spec/components/proposals/votes_component_spec.rb +++ b/spec/components/proposals/votes_component_spec.rb @@ -21,6 +21,7 @@ describe Proposals::VotesComponent do expect(page).to have_link count: 1 expect(page).to have_link "Support", title: "Support this proposal" + expect(page).to have_link "Support Create a monthly transport ticket" expect(page).not_to have_content "You have already supported this proposal. Share it!" end From 704687dc54c1ec2bc4d7dc653b651bc2a233225b Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?Javi=20Mart=C3=ADn?= Date: Thu, 30 Sep 2021 21:57:01 +0200 Subject: [PATCH 02/11] Add investment name to vote links aria-label Note we're using the `budgets.investments.investment.add_label` and `budgets.ballots.show.remove_label` internationalization keys so they're consistent with the `budgets.investments.investment.add` and `budgets.ballots.show.remove` keys which were already present. We aren't unifying these keys in order to keep existing translations. --- .../investments/ballot_component.html.erb | 6 ++- .../budgets/investments/ballot_component.rb | 8 ++++ config/locales/en/budgets.yml | 2 + config/locales/es/budgets.yml | 2 + .../investments/ballot_component_spec.rb | 47 +++++++++++++++++++ 5 files changed, 63 insertions(+), 2 deletions(-) create mode 100644 spec/components/budgets/investments/ballot_component_spec.rb diff --git a/app/components/budgets/investments/ballot_component.html.erb b/app/components/budgets/investments/ballot_component.html.erb index 4d3868666..3866e5098 100644 --- a/app/components/budgets/investments/ballot_component.html.erb +++ b/app/components/budgets/investments/ballot_component.html.erb @@ -14,7 +14,8 @@ investments_ids: investment_ids), class: "button button-remove-support expanded", method: :delete, - remote: true %> + remote: true, + "aria-label": remove_vote_aria_label %> <% end %>
<% else %> @@ -30,7 +31,8 @@ class: "button button-support expanded", title: t("budgets.investments.investment.support_title"), method: :post, - remote: true %> + remote: true, + "aria-label": vote_aria_label %> <% end %> <% end %> diff --git a/app/components/budgets/investments/ballot_component.rb b/app/components/budgets/investments/ballot_component.rb index 016e7f4f4..016ff1bac 100644 --- a/app/components/budgets/investments/ballot_component.rb +++ b/app/components/budgets/investments/ballot_component.rb @@ -24,6 +24,14 @@ class Budgets::Investments::BallotComponent < ApplicationComponent @reason ||= investment.reason_for_not_being_ballotable_by(current_user, ballot) end + def vote_aria_label + t("budgets.investments.investment.add_label", investment: investment.title) + end + + def remove_vote_aria_label + t("budgets.ballots.show.remove_label", investment: investment.title) + end + def link_to_my_heading link_to(investment.heading.name, budget_investments_path(budget_id: investment.budget_id, diff --git a/config/locales/en/budgets.yml b/config/locales/en/budgets.yml index 6535410f3..4e2fb88bb 100644 --- a/config/locales/en/budgets.yml +++ b/config/locales/en/budgets.yml @@ -23,6 +23,7 @@ en: other: "You can vote up to %{count} projects" no_balloted_group_yet: "You have not voted on this group yet, go vote!" remove: Remove vote + remove_label: "Remove your vote for %{investment}" voted: one: "You have voted one investment." other: "You have voted %{count} investments." @@ -151,6 +152,7 @@ en: wrong_price_format: Only integer numbers investment: add: Vote + add_label: "Vote %{investment}" already_added: You have already added this investment project support_title: Support this project supports: diff --git a/config/locales/es/budgets.yml b/config/locales/es/budgets.yml index 7c4601039..6d892076b 100644 --- a/config/locales/es/budgets.yml +++ b/config/locales/es/budgets.yml @@ -23,6 +23,7 @@ es: other: "Puedes votar hasta %{count} proyectos" no_balloted_group_yet: "Todavía no has votado proyectos de este grupo, ¡vota!" remove: Quitar voto + remove_label: "Quitar tu voto a %{investment}" voted: one: "Has votado un proyecto." other: "Has votado %{count} proyectos." @@ -151,6 +152,7 @@ es: wrong_price_format: Solo puede incluir caracteres numéricos investment: add: Votar + add_label: "Votar %{investment}" already_added: Ya has añadido este proyecto de gasto support_title: Apoyar este proyecto supports: diff --git a/spec/components/budgets/investments/ballot_component_spec.rb b/spec/components/budgets/investments/ballot_component_spec.rb new file mode 100644 index 000000000..0048246c7 --- /dev/null +++ b/spec/components/budgets/investments/ballot_component_spec.rb @@ -0,0 +1,47 @@ +require "rails_helper" + +describe Budgets::Investments::BallotComponent do + describe "vote investment link" do + let(:budget) { create(:budget, :balloting) } + let(:investment) { create(:budget_investment, :selected, title: "New Sports Center", budget: budget) } + let(:component) do + Budgets::Investments::BallotComponent.new( + investment: investment, + investment_ids: [], + ballot: Budget::Ballot.where(budget: budget, user: controller.current_user).first_or_create!, + assigned_heading: nil + ) + end + + it "is shown alongside a 'not allowed' message to unverified users" do + sign_in(create(:user)) + + render_inline component + + expect(page).to have_link "Vote" + expect(page).to have_content "Only verified users can vote on investments; verify your account." + end + + it "is shown to verified users" do + sign_in(create(:user, :level_two)) + + render_inline component + + expect(page).to have_link count: 1 + expect(page).to have_link "Vote", title: "Support this project" + expect(page).to have_link "Vote New Sports Center" + expect(page).not_to have_link "Remove vote" + end + + it "is replaced with a link to remove the vote when the user has already voted" do + sign_in(create(:user, :level_two, ballot_lines: [investment])) + + render_inline component + + expect(page).to have_link count: 1 + expect(page).to have_link "Remove vote" + expect(page).to have_link "Remove your vote for New Sports Center" + expect(page).not_to have_link "Vote" + end + end +end From 413a77bd98859fec76618361e77dea0e771d9bf8 Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?Javi=20Mart=C3=ADn?= Date: Thu, 30 Sep 2021 01:37:06 +0200 Subject: [PATCH 03/11] Add votable name to agree/disagree links aria-label --- .../shared/in_favor_against_component.html.erb | 13 +++++++++++-- app/components/shared/in_favor_against_component.rb | 8 ++++++++ config/locales/en/general.yml | 2 ++ config/locales/es/general.yml | 2 ++ spec/components/debates/votes_component_spec.rb | 2 ++ .../legislation/proposals/votes_component_spec.rb | 2 ++ 6 files changed, 27 insertions(+), 2 deletions(-) diff --git a/app/components/shared/in_favor_against_component.html.erb b/app/components/shared/in_favor_against_component.html.erb index a085c1d46..fcb4564f0 100644 --- a/app/components/shared/in_favor_against_component.html.erb +++ b/app/components/shared/in_favor_against_component.html.erb @@ -2,7 +2,11 @@
<% if current_user %> <%= link_to polymorphic_path(votable, action: :vote, value: "yes"), - class: "like #{voted_classes[:in_favor]}", title: t("votes.agree"), method: "post", remote: true do %> + class: "like #{voted_classes[:in_favor]}", + title: t("votes.agree"), + "aria-label": agree_aria_label, + method: "post", + remote: true do %> <%= t("votes.agree") %> @@ -22,7 +26,12 @@
<% if current_user %> - <%= link_to polymorphic_path(votable, action: :vote, value: "no"), class: "unlike #{voted_classes[:against]}", title: t("votes.disagree"), method: "post", remote: true do %> + <%= link_to polymorphic_path(votable, action: :vote, value: "no"), + class: "unlike #{voted_classes[:against]}", + title: t("votes.disagree"), + "aria-label": disagree_aria_label, + method: "post", + remote: true do %> <%= t("votes.disagree") %> diff --git a/app/components/shared/in_favor_against_component.rb b/app/components/shared/in_favor_against_component.rb index 4d944d14c..8806057c6 100644 --- a/app/components/shared/in_favor_against_component.rb +++ b/app/components/shared/in_favor_against_component.rb @@ -22,4 +22,12 @@ class Shared::InFavorAgainstComponent < ApplicationComponent { in_favor: "", against: "" } end end + + def agree_aria_label + t("votes.agree_label", title: votable.title) + end + + def disagree_aria_label + t("votes.disagree_label", title: votable.title) + end end diff --git a/config/locales/en/general.yml b/config/locales/en/general.yml index 260bd56bd..743800aea 100644 --- a/config/locales/en/general.yml +++ b/config/locales/en/general.yml @@ -847,9 +847,11 @@ en: retired_help_text: Dashboard not available for retired proposals votes: agree: I agree + agree_label: "I agree with %{title}" anonymous: Too many anonymous votes to admit vote %{verify_account}. comment_unauthenticated: You must %{signin} or %{signup} to vote. disagree: I disagree + disagree_label: "I don't agree with %{title}" organizations: Organizations are not permitted to vote supports: Supports verified_only: Only verified users can vote on proposals; %{verify_account}. diff --git a/config/locales/es/general.yml b/config/locales/es/general.yml index 661f1da17..1511b9826 100644 --- a/config/locales/es/general.yml +++ b/config/locales/es/general.yml @@ -847,9 +847,11 @@ es: retired_help_text: Dashboard no disponible para propuestas retiradas votes: agree: Estoy de acuerdo + agree_label: "Estoy de acuerdo con %{title}" anonymous: Demasiados votos anónimos, para poder votar %{verify_account}. comment_unauthenticated: Necesitas %{signin} o %{signup} para poder votar. disagree: No estoy de acuerdo + disagree_label: "No estoy de acuerdo con %{title}" organizations: Las organizaciones no pueden votar. supports: Apoyos verified_only: Las propuestas sólo pueden ser votadas por usuarios verificados, %{verify_account}. diff --git a/spec/components/debates/votes_component_spec.rb b/spec/components/debates/votes_component_spec.rb index 25979df62..af9e1f5f5 100644 --- a/spec/components/debates/votes_component_spec.rb +++ b/spec/components/debates/votes_component_spec.rb @@ -22,7 +22,9 @@ describe Debates::VotesComponent do expect(page).to have_link count: 2 expect(page).to have_link "I agree", title: "I agree" + expect(page).to have_link "I agree with What about the 2030 agenda?" expect(page).to have_link "I disagree", title: "I disagree" + expect(page).to have_link "I don't agree with What about the 2030 agenda?" expect(page).not_to have_content "You must sign in or sign up to continue." end end diff --git a/spec/components/legislation/proposals/votes_component_spec.rb b/spec/components/legislation/proposals/votes_component_spec.rb index e83f2266e..26f7c0638 100644 --- a/spec/components/legislation/proposals/votes_component_spec.rb +++ b/spec/components/legislation/proposals/votes_component_spec.rb @@ -35,7 +35,9 @@ describe Legislation::Proposals::VotesComponent do expect(page).to have_link count: 2 expect(page).to have_link "I agree", title: "I agree" + expect(page).to have_link "I agree with Require wearing masks at home" expect(page).to have_link "I disagree", title: "I disagree" + expect(page).to have_link "I don't agree with Require wearing masks at home" expect(page).not_to have_content "You must sign in or sign up to continue." end end From 88004a5e8a8f541b98ebd1855260ecb2ba92726b Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?Javi=20Mart=C3=ADn?= Date: Wed, 29 Sep 2021 03:41:29 +0200 Subject: [PATCH 04/11] Replace support proposal link with a button As mentioned in commits 5311daadf and bb958daf0, using links combined with JavaScript to generate POST requests to the server has a few issues. --- app/components/proposals/votes_component.html.erb | 11 +++++------ spec/components/proposals/votes_component_spec.rb | 15 +++++++-------- spec/system/management/proposals_spec.rb | 6 +++--- spec/system/votes_spec.rb | 12 ++++++------ 4 files changed, 21 insertions(+), 23 deletions(-) diff --git a/app/components/proposals/votes_component.html.erb b/app/components/proposals/votes_component.html.erb index e6302e481..667a92fb0 100644 --- a/app/components/proposals/votes_component.html.erb +++ b/app/components/proposals/votes_component.html.erb @@ -6,17 +6,16 @@
<%= t("proposals.proposal.already_supported") %>
- <% elsif can_vote? %> - <%= link_to t("proposals.proposal.support"), vote_url, + <% else %> + <%= button_to vote_url, class: "button button-support small expanded", title: t("proposals.proposal.support_title"), method: "post", remote: true, - "aria-label": support_aria_label%> - <% else %> -
+ disabled: !can_vote?, + "aria-label": support_aria_label do %> <%= t("proposals.proposal.support") %> -
+ <% end %> <% end %>
diff --git a/spec/components/proposals/votes_component_spec.rb b/spec/components/proposals/votes_component_spec.rb index 51b7a769e..ef686e625 100644 --- a/spec/components/proposals/votes_component_spec.rb +++ b/spec/components/proposals/votes_component_spec.rb @@ -4,14 +4,13 @@ describe Proposals::VotesComponent do let(:proposal) { create(:proposal, title: "Create a monthly transport ticket") } let(:component) { Proposals::VotesComponent.new(proposal) } - describe "support proposal link" do - it "is shown as plain text to unverified users" do + describe "support proposal button" do + it "is disabled to unverified users" do sign_in(create(:user)) render_inline component - expect(page).to have_content "Support" - expect(page).not_to have_link "Support" + expect(page).to have_button "Support", disabled: true end it "is shown to verified users" do @@ -19,9 +18,9 @@ describe Proposals::VotesComponent do render_inline component - expect(page).to have_link count: 1 - expect(page).to have_link "Support", title: "Support this proposal" - expect(page).to have_link "Support Create a monthly transport ticket" + expect(page).to have_button count: 1 + expect(page).to have_button "Support", title: "Support this proposal" + expect(page).to have_button "Support Create a monthly transport ticket" expect(page).not_to have_content "You have already supported this proposal. Share it!" end @@ -31,7 +30,7 @@ describe Proposals::VotesComponent do render_inline component expect(page).to have_content "You have already supported this proposal. Share it!" - expect(page).not_to have_link "Support" + expect(page).not_to have_button "Support", disabled: :all end end diff --git a/spec/system/management/proposals_spec.rb b/spec/system/management/proposals_spec.rb index 660fa6588..421b2a080 100644 --- a/spec/system/management/proposals_spec.rb +++ b/spec/system/management/proposals_spec.rb @@ -149,7 +149,7 @@ describe "Proposals" do click_link "Support proposals" within(".proposals-list") do - click_link("Support") + click_button "Support" expect(page).to have_content "1 support" expect(page).to have_content "You have already supported this proposal. Share it!" end @@ -164,7 +164,7 @@ describe "Proposals" do within(".proposals-list") { click_link proposal.title } expect(page).to have_content proposal.code - within("#proposal_#{proposal.id}_votes") { click_link("Support") } + within("#proposal_#{proposal.id}_votes") { click_button "Support" } expect(page).to have_content "1 support" expect(page).to have_content "You have already supported this proposal. Share it!" @@ -241,7 +241,7 @@ describe "Proposals" do click_link "Print proposals" within ".proposals-list" do - click_link "Support" + click_button "Support" end expect(page).to have_content "To perform this action you must select a user" diff --git a/spec/system/votes_spec.rb b/spec/system/votes_spec.rb index 3dcfcbbb3..b45d7e6eb 100644 --- a/spec/system/votes_spec.rb +++ b/spec/system/votes_spec.rb @@ -193,10 +193,10 @@ describe "Votes" do visit proposal_path(proposal) within(".supports") do - find(".in-favor a").click - expect(page).to have_content "1 support" + click_button "Support" - expect(page).not_to have_selector ".in-favor a" + expect(page).to have_content "1 support" + expect(page).not_to have_button "Support" end end @@ -215,7 +215,7 @@ describe "Votes" do visit proposal_path(proposal) within(".supports") do - find(".in-favor a").click + click_button "Support" expect(page).to have_content "1 support" expect(page).to have_content "You have already supported this proposal. Share it!" @@ -226,7 +226,7 @@ describe "Votes" do visit proposals_path within("#proposal_#{proposal.id}") do - find(".in-favor a").click + click_button "Support" expect(page).to have_content "1 support" expect(page).to have_content "You have already supported this proposal. Share it!" @@ -238,7 +238,7 @@ describe "Votes" do visit proposals_path within("#proposal_#{proposal.id}") do - find(".in-favor a").click + click_button "Support" expect(page).to have_content "You have already supported this proposal. Share it!" end From 8c1b4d9ea7e863c7711a99a46536baa470b99366 Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?Javi=20Mart=C3=ADn?= Date: Thu, 30 Sep 2021 01:44:56 +0200 Subject: [PATCH 05/11] Replace links to agree/disagree with buttons As mentioned in commits 5311daadf and bb958daf0, using links combined with JavaScript to generate POST requests to the server has a few issues. --- .../in_favor_against_component.html.erb | 60 +++++++----------- .../debates/votes_component_spec.rb | 20 +++--- .../proposals/votes_component_spec.rb | 24 ++++--- spec/support/common_actions/votes.rb | 2 +- spec/system/votes_spec.rb | 62 +++++++++---------- 5 files changed, 74 insertions(+), 94 deletions(-) diff --git a/app/components/shared/in_favor_against_component.html.erb b/app/components/shared/in_favor_against_component.html.erb index fcb4564f0..87c3bc381 100644 --- a/app/components/shared/in_favor_against_component.html.erb +++ b/app/components/shared/in_favor_against_component.html.erb @@ -1,49 +1,33 @@
- <% if current_user %> - <%= link_to polymorphic_path(votable, action: :vote, value: "yes"), - class: "like #{voted_classes[:in_favor]}", - title: t("votes.agree"), - "aria-label": agree_aria_label, - method: "post", - remote: true do %> - - <%= t("votes.agree") %> - - <%= votes_percentage("likes", votable) %> - <% end %> - <% else %> - + <%= button_to polymorphic_path(votable, action: :vote, value: "yes"), + class: "like #{voted_classes[:in_favor]}", + title: t("votes.agree"), + "aria-label": agree_aria_label, + method: "post", + remote: true, + disabled: !current_user do %> + + <%= t("votes.agree") %> + + <%= votes_percentage("likes", votable) %> <% end %>
- <% if current_user %> - <%= link_to polymorphic_path(votable, action: :vote, value: "no"), - class: "unlike #{voted_classes[:against]}", - title: t("votes.disagree"), - "aria-label": disagree_aria_label, - method: "post", - remote: true do %> - - <%= t("votes.disagree") %> - - <%= votes_percentage("dislikes", votable) %> - <% end %> - <% else %> -
- - <%= t("votes.disagree") %> - - <%= votes_percentage("dislikes", votable) %> -
+ <%= button_to polymorphic_path(votable, action: :vote, value: "no"), + class: "unlike #{voted_classes[:against]}", + title: t("votes.disagree"), + "aria-label": disagree_aria_label, + method: "post", + remote: true, + disabled: !current_user do %> + + <%= t("votes.disagree") %> + + <%= votes_percentage("dislikes", votable) %> <% end %>
diff --git a/spec/components/debates/votes_component_spec.rb b/spec/components/debates/votes_component_spec.rb index af9e1f5f5..1eac4c86d 100644 --- a/spec/components/debates/votes_component_spec.rb +++ b/spec/components/debates/votes_component_spec.rb @@ -4,15 +4,13 @@ describe Debates::VotesComponent do let(:debate) { create(:debate, title: "What about the 2030 agenda?") } let(:component) { Debates::VotesComponent.new(debate) } - describe "Agree and disagree links" do - it "is shown as plain text to anonymous users" do + describe "Agree and disagree buttons" do + it "is disabled to anonymous users" do render_inline component - expect(page).to have_content "I agree" - expect(page).to have_content "I disagree" + expect(page).to have_button "I agree", disabled: true + expect(page).to have_button "I disagree", disabled: true expect(page).to have_content "You must sign in or sign up to continue." - expect(page).not_to have_link "I agree" - expect(page).not_to have_link "I disagree" end it "is shown to identified users" do @@ -20,11 +18,11 @@ describe Debates::VotesComponent do render_inline component - expect(page).to have_link count: 2 - expect(page).to have_link "I agree", title: "I agree" - expect(page).to have_link "I agree with What about the 2030 agenda?" - expect(page).to have_link "I disagree", title: "I disagree" - expect(page).to have_link "I don't agree with What about the 2030 agenda?" + expect(page).to have_button count: 2 + expect(page).to have_button "I agree", title: "I agree" + expect(page).to have_button "I agree with What about the 2030 agenda?" + expect(page).to have_button "I disagree", title: "I disagree" + expect(page).to have_button "I don't agree with What about the 2030 agenda?" expect(page).not_to have_content "You must sign in or sign up to continue." end end diff --git a/spec/components/legislation/proposals/votes_component_spec.rb b/spec/components/legislation/proposals/votes_component_spec.rb index 26f7c0638..b4131c52e 100644 --- a/spec/components/legislation/proposals/votes_component_spec.rb +++ b/spec/components/legislation/proposals/votes_component_spec.rb @@ -4,7 +4,7 @@ describe Legislation::Proposals::VotesComponent do let(:proposal) { create(:legislation_proposal, title: "Require wearing masks at home") } let(:component) { Legislation::Proposals::VotesComponent.new(proposal) } - describe "Agree and disagree links" do + describe "Agree and disagree buttons" do it "is not shown when the proposals phase isn't open" do proposal.process.update!( proposals_phase_start_date: 2.days.ago, @@ -14,18 +14,16 @@ describe Legislation::Proposals::VotesComponent do sign_in(create(:user)) render_inline component - expect(page).not_to have_content "I agree" - expect(page).not_to have_content "I disagree" + expect(page).not_to have_button "I agree", disabled: :all + expect(page).not_to have_button "I disagree", disabled: :all end - it "is shown as plain text to anonymous users" do + it "is disabled to anonymous users" do render_inline component - expect(page).to have_content "I agree" - expect(page).to have_content "I disagree" + expect(page).to have_button "I agree", disabled: true + expect(page).to have_button "I disagree", disabled: true expect(page).to have_content "You must sign in or sign up to continue." - expect(page).not_to have_link "I agree" - expect(page).not_to have_link "I disagree" end it "is shown to identified users" do @@ -33,11 +31,11 @@ describe Legislation::Proposals::VotesComponent do render_inline component - expect(page).to have_link count: 2 - expect(page).to have_link "I agree", title: "I agree" - expect(page).to have_link "I agree with Require wearing masks at home" - expect(page).to have_link "I disagree", title: "I disagree" - expect(page).to have_link "I don't agree with Require wearing masks at home" + expect(page).to have_button count: 2 + expect(page).to have_button "I agree", title: "I agree" + expect(page).to have_button "I agree with Require wearing masks at home" + expect(page).to have_button "I disagree", title: "I disagree" + expect(page).to have_button "I don't agree with Require wearing masks at home" expect(page).not_to have_content "You must sign in or sign up to continue." end end diff --git a/spec/support/common_actions/votes.rb b/spec/support/common_actions/votes.rb index 378f7dc67..29d2ea8b6 100644 --- a/spec/support/common_actions/votes.rb +++ b/spec/support/common_actions/votes.rb @@ -12,7 +12,7 @@ module Votes def expect_message_to_many_anonymous_votes expect(page).to have_content "Too many anonymous votes to admit vote" - expect(page).to have_selector(".in-favor a", obscured: true) + expect(page).to have_button "I agree", obscured: true end def expect_message_only_verified_can_vote_proposals diff --git a/spec/system/votes_spec.rb b/spec/system/votes_spec.rb index b45d7e6eb..f5ea56430 100644 --- a/spec/system/votes_spec.rb +++ b/spec/system/votes_spec.rb @@ -19,37 +19,37 @@ describe "Votes" do within("#debates") do within("#debate_#{debate1.id}_votes") do within(".in-favor") do - expect(page).to have_css("a.voted") - expect(page).not_to have_css("a.no-voted") + expect(page).to have_css("button.voted") + expect(page).not_to have_css("button.no-voted") end within(".against") do - expect(page).to have_css("a.no-voted") - expect(page).not_to have_css("a.voted") + expect(page).to have_css("button.no-voted") + expect(page).not_to have_css("button.voted") end end within("#debate_#{debate2.id}_votes") do within(".in-favor") do - expect(page).not_to have_css("a.voted") - expect(page).not_to have_css("a.no-voted") + expect(page).not_to have_css("button.voted") + expect(page).not_to have_css("button.no-voted") end within(".against") do - expect(page).not_to have_css("a.no-voted") - expect(page).not_to have_css("a.voted") + expect(page).not_to have_css("button.no-voted") + expect(page).not_to have_css("button.voted") end end within("#debate_#{debate3.id}_votes") do within(".in-favor") do - expect(page).to have_css("a.no-voted") - expect(page).not_to have_css("a.voted") + expect(page).to have_css("button.no-voted") + expect(page).not_to have_css("button.voted") end within(".against") do - expect(page).to have_css("a.voted") - expect(page).not_to have_css("a.no-voted") + expect(page).to have_css("button.voted") + expect(page).not_to have_css("button.no-voted") end end end @@ -63,37 +63,37 @@ describe "Votes" do within(".in-favor") do expect(page).to have_content "0%" - expect(page).not_to have_css("a.voted") - expect(page).not_to have_css("a.no-voted") + expect(page).not_to have_css("button.voted") + expect(page).not_to have_css("button.no-voted") end within(".against") do expect(page).to have_content "0%" - expect(page).not_to have_css("a.voted") - expect(page).not_to have_css("a.no-voted") + expect(page).not_to have_css("button.voted") + expect(page).not_to have_css("button.no-voted") end end scenario "Update" do visit debate_path(create(:debate)) - find(".in-favor a").click + click_button "I agree" within(".in-favor") do expect(page).to have_content "100%" - expect(page).to have_css("a.voted") + expect(page).to have_css("button.voted") end - find(".against a").click + click_button "I disagree" within(".in-favor") do expect(page).to have_content "0%" - expect(page).to have_css("a.no-voted") + expect(page).to have_css("button.no-voted") end within(".against") do expect(page).to have_content "100%" - expect(page).to have_css("a.voted") + expect(page).to have_css("button.voted") end expect(page).to have_content "1 vote" @@ -102,9 +102,9 @@ describe "Votes" do scenario "Trying to vote multiple times" do visit debate_path(create(:debate)) - find(".in-favor a").click + click_button "I agree" expect(page).to have_content "1 vote" - find(".in-favor a").click + click_button "I agree" expect(page).not_to have_content "2 votes" within(".in-favor") do @@ -127,28 +127,28 @@ describe "Votes" do within(".in-favor") do expect(page).to have_content "50%" - expect(page).to have_css("a.voted") + expect(page).to have_css("button.voted") end within(".against") do expect(page).to have_content "50%" - expect(page).to have_css("a.no-voted") + expect(page).to have_css("button.no-voted") end end scenario "Create from debate show" do visit debate_path(create(:debate)) - find(".in-favor a").click + click_button "I agree" within(".in-favor") do expect(page).to have_content "100%" - expect(page).to have_css("a.voted") + expect(page).to have_css("button.voted") end within(".against") do expect(page).to have_content "0%" - expect(page).to have_css("a.no-voted") + expect(page).to have_css("button.no-voted") end expect(page).to have_content "1 vote" @@ -159,16 +159,16 @@ describe "Votes" do visit debates_path within("#debates") do - find(".in-favor a").click + click_button "I agree" within(".in-favor") do expect(page).to have_content "100%" - expect(page).to have_css("a.voted") + expect(page).to have_css("button.voted") end within(".against") do expect(page).to have_content "0%" - expect(page).to have_css("a.no-voted") + expect(page).to have_css("button.no-voted") end expect(page).to have_content "1 vote" From eecaf5876e5e6b10ca2313bb47ce9cceeb25e385 Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?Javi=20Mart=C3=ADn?= Date: Thu, 13 Jan 2022 19:50:27 +0100 Subject: [PATCH 06/11] Move result percentages out of the voting buttons Having buttons (previously links) with the text "I agree 75%" is confusing; people might believe they're saying they only partially agree with the content. Besides, the results percentages is a different piece of information which shouldn't be related to whether one person agrees/disagrees with the content. This problem might be solved for people using screen readers since we added the aria-label attribute. However, for sighted keyboard users, the percentage was being outlined on focus as part of the button, which might be confusing. --- app/assets/stylesheets/in_favor_against.scss | 33 +++++++++++-------- .../in_favor_against_component.html.erb | 8 ++--- .../debates/votes_component_spec.rb | 14 ++++++++ .../proposals/votes_component_spec.rb | 14 ++++++++ 4 files changed, 51 insertions(+), 18 deletions(-) diff --git a/app/assets/stylesheets/in_favor_against.scss b/app/assets/stylesheets/in_favor_against.scss index 1fb29b0a4..dc8d60127 100644 --- a/app/assets/stylesheets/in_favor_against.scss +++ b/app/assets/stylesheets/in_favor_against.scss @@ -1,5 +1,11 @@ .in-favor-against { - display: inline-block; + + &, + .in-favor, + .against, + form { + display: inline-block; + } .icon-like, .icon-unlike { @@ -41,23 +47,22 @@ .like, .unlike { - line-height: rem-calc(48); vertical-align: super; text-decoration: none; + } - .percentage { - color: $text; - display: inline-block; - font-size: $small-font-size; - line-height: $line-height * 2; - padding-right: $line-height / 2; - vertical-align: top; + .percentage { + color: $text; + display: inline-block; + font-size: $small-font-size; + line-height: $line-height * 2; + padding-right: $line-height / 2; + vertical-align: top; - @include breakpoint(medium) { - display: block; - line-height: $line-height; - padding-right: 0; - } + @include breakpoint(medium) { + display: block; + line-height: $line-height; + padding-right: 0; } } diff --git a/app/components/shared/in_favor_against_component.html.erb b/app/components/shared/in_favor_against_component.html.erb index 87c3bc381..9742fe918 100644 --- a/app/components/shared/in_favor_against_component.html.erb +++ b/app/components/shared/in_favor_against_component.html.erb @@ -1,5 +1,5 @@
-
+
<%= button_to polymorphic_path(votable, action: :vote, value: "yes"), class: "like #{voted_classes[:in_favor]}", title: t("votes.agree"), @@ -10,13 +10,13 @@ <%= t("votes.agree") %> - <%= votes_percentage("likes", votable) %> <% end %> + <%= votes_percentage("likes", votable) %>
-
+
<%= button_to polymorphic_path(votable, action: :vote, value: "no"), class: "unlike #{voted_classes[:against]}", title: t("votes.disagree"), @@ -27,7 +27,7 @@ <%= t("votes.disagree") %> - <%= votes_percentage("dislikes", votable) %> <% end %> + <%= votes_percentage("dislikes", votable) %>
diff --git a/spec/components/debates/votes_component_spec.rb b/spec/components/debates/votes_component_spec.rb index 1eac4c86d..f21ef797d 100644 --- a/spec/components/debates/votes_component_spec.rb +++ b/spec/components/debates/votes_component_spec.rb @@ -25,5 +25,19 @@ describe Debates::VotesComponent do expect(page).to have_button "I don't agree with What about the 2030 agenda?" expect(page).not_to have_content "You must sign in or sign up to continue." end + + it "does not include result percentages" do + create(:vote, votable: debate) + sign_in(create(:user)) + + render_inline component + + expect(page).to have_button count: 2 + expect(page).to have_button "I agree" + expect(page).to have_button "I disagree" + expect(page).not_to have_button text: "%" + expect(page).not_to have_button text: "100" + expect(page).not_to have_button text: "0" + end end end diff --git a/spec/components/legislation/proposals/votes_component_spec.rb b/spec/components/legislation/proposals/votes_component_spec.rb index b4131c52e..b832fc51f 100644 --- a/spec/components/legislation/proposals/votes_component_spec.rb +++ b/spec/components/legislation/proposals/votes_component_spec.rb @@ -38,5 +38,19 @@ describe Legislation::Proposals::VotesComponent do expect(page).to have_button "I don't agree with Require wearing masks at home" expect(page).not_to have_content "You must sign in or sign up to continue." end + + it "does not include result percentages" do + create(:vote, votable: proposal) + sign_in(create(:user)) + + render_inline component + + expect(page).to have_button count: 2 + expect(page).to have_button "I agree" + expect(page).to have_button "I disagree" + expect(page).not_to have_button text: "%" + expect(page).not_to have_button text: "100" + expect(page).not_to have_button text: "0" + end end end From d347da8a333f7f3536d3f5551daf65946c01cd9f Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?Javi=20Mart=C3=ADn?= Date: Thu, 13 Jan 2022 19:50:50 +0100 Subject: [PATCH 07/11] Use has-fa-icon in agree/disagree buttons This way we can simplify the code in the views a little bit. --- app/assets/stylesheets/in_favor_against.scss | 39 ++++++++----------- .../in_favor_against_component.html.erb | 8 +--- 2 files changed, 18 insertions(+), 29 deletions(-) diff --git a/app/assets/stylesheets/in_favor_against.scss b/app/assets/stylesheets/in_favor_against.scss index dc8d60127..a91841f85 100644 --- a/app/assets/stylesheets/in_favor_against.scss +++ b/app/assets/stylesheets/in_favor_against.scss @@ -7,8 +7,7 @@ display: inline-block; } - .icon-like, - .icon-unlike { + button { background: #fff; border: 2px solid; border-radius: rem-calc(3); @@ -16,7 +15,7 @@ display: inline-block; font-size: rem-calc(30); line-height: rem-calc(30); - padding: rem-calc(3) rem-calc(6); + padding: rem-calc(3) rem-calc(6) rem-calc(6); position: relative; &:hover, @@ -27,7 +26,8 @@ } } - .icon-like { + .in-favor button { + @include has-fa-icon(thumbs-up, solid); &:hover, &:active { @@ -36,7 +36,8 @@ } } - .icon-unlike { + .against button { + @include has-fa-icon(thumbs-down, solid); &:hover, &:active { @@ -67,29 +68,21 @@ } .voted { + color: #fff; + } - .icon-like, - .icon-unlike { - color: #fff; - } + .in-favor .voted { + background: $like; + border: 2px solid $like; + } - .icon-like { - background: $like; - border: 2px solid $like; - } - - .icon-unlike { - background: $unlike; - border: 2px solid $unlike; - } + .against .voted { + background: $unlike; + border: 2px solid $unlike; } .no-voted { - - .icon-like, - .icon-unlike { - opacity: 0.3; - } + opacity: 0.3; } .against { diff --git a/app/components/shared/in_favor_against_component.html.erb b/app/components/shared/in_favor_against_component.html.erb index 9742fe918..df44bac62 100644 --- a/app/components/shared/in_favor_against_component.html.erb +++ b/app/components/shared/in_favor_against_component.html.erb @@ -7,9 +7,7 @@ method: "post", remote: true, disabled: !current_user do %> - - <%= t("votes.agree") %> - + <%= t("votes.agree") %> <% end %> <%= votes_percentage("likes", votable) %>
@@ -24,9 +22,7 @@ method: "post", remote: true, disabled: !current_user do %> - - <%= t("votes.disagree") %> - + <%= t("votes.disagree") %> <% end %> <%= votes_percentage("dislikes", votable) %>
From f970ddcb86b139756ad02b91973f1389024b79bb Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?Javi=20Mart=C3=ADn?= Date: Thu, 13 Jan 2022 19:51:28 +0100 Subject: [PATCH 08/11] Fix agree/disagree alignment in medium screens Using the `flex-with-gap` mixin we avoid the left margin in the second element when the screen space isn't wide enough to show both buttons. Setting the margins with CSS also allows as to simplify the view and makes it easier to customize styles. --- app/assets/stylesheets/in_favor_against.scss | 13 +++++-------- .../shared/in_favor_against_component.html.erb | 2 -- 2 files changed, 5 insertions(+), 10 deletions(-) diff --git a/app/assets/stylesheets/in_favor_against.scss b/app/assets/stylesheets/in_favor_against.scss index a91841f85..71b80bc5f 100644 --- a/app/assets/stylesheets/in_favor_against.scss +++ b/app/assets/stylesheets/in_favor_against.scss @@ -1,4 +1,9 @@ .in-favor-against { + @include flex-with-gap($line-height / 4); + + @include breakpoint(medium) { + @include flex-with-gap($line-height * 3 / 4); + } &, .in-favor, @@ -84,12 +89,4 @@ .no-voted { opacity: 0.3; } - - .against { - margin-left: $line-height / 4; - } - - .divider { - margin: 0 rem-calc(6); - } } diff --git a/app/components/shared/in_favor_against_component.html.erb b/app/components/shared/in_favor_against_component.html.erb index df44bac62..3b52938bc 100644 --- a/app/components/shared/in_favor_against_component.html.erb +++ b/app/components/shared/in_favor_against_component.html.erb @@ -12,8 +12,6 @@ <%= votes_percentage("likes", votable) %>
- -
<%= button_to polymorphic_path(votable, action: :vote, value: "no"), class: "unlike #{voted_classes[:against]}", From 7a25c61ae6a0fff47638bfcba13beb71b4c134b9 Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?Javi=20Mart=C3=ADn?= Date: Thu, 30 Sep 2021 22:07:14 +0200 Subject: [PATCH 09/11] Use buttons to vote in the final voting As mentioned in commits 5311daadf and bb958daf0, using links combined with JavaScript to generate POST requests to the server has a few issues. We're also improving the keyboard access. Previously, the links were focusable and clickable with the keyboard. Now we're disabling the buttons when voting isn't allowed. Since these elements can no longer be focused, we're adding an element with `tabindex="0"` so the "participation not allowed" message is shown, like we do in most places. Note we're slightly changing one test because now when hovering over the button on Chrome, the "participation not allowed" text isn't shown; it's only shown when hovering on the parts of the `div.ballot` element outside the button. Since we're already rewriting the behavior of the "participation not allowed" text in a different pull request, we aren't going to fix this behavior. --- .../investments/ballot_component.html.erb | 59 ++++++++++--------- .../investments/ballot_component_spec.rb | 22 +++---- spec/support/common_actions/budgets.rb | 6 +- spec/system/budget_polls/voter_spec.rb | 10 ++-- spec/system/budgets/ballots_spec.rb | 30 +++++----- 5 files changed, 66 insertions(+), 61 deletions(-) diff --git a/app/components/budgets/investments/ballot_component.html.erb b/app/components/budgets/investments/ballot_component.html.erb index 3866e5098..21683337c 100644 --- a/app/components/budgets/investments/ballot_component.html.erb +++ b/app/components/budgets/investments/ballot_component.html.erb @@ -8,14 +8,15 @@ <%= investment.formatted_price %>

<% if investment.should_show_ballots? %> - <%= link_to t("budgets.ballots.show.remove"), - budget_ballot_line_path(id: investment.id, - budget_id: investment.budget_id, - investments_ids: investment_ids), - class: "button button-remove-support expanded", - method: :delete, - remote: true, - "aria-label": remove_vote_aria_label %> + <%= button_to budget_ballot_line_path(id: investment.id, + budget_id: investment.budget_id, + investments_ids: investment_ids), + class: "button button-remove-support expanded", + method: :delete, + remote: true, + "aria-label": remove_vote_aria_label do %> + <%= t("budgets.ballots.show.remove") %> + <% end %> <% end %>
<% else %> @@ -24,30 +25,34 @@ <%= investment.formatted_price %>

<% if investment.should_show_ballots? %> - <%= link_to t("budgets.investments.investment.add"), - budget_ballot_lines_path(investment_id: investment.id, - budget_id: investment.budget_id, - investments_ids: investment_ids), - class: "button button-support expanded", - title: t("budgets.investments.investment.support_title"), - method: :post, - remote: true, - "aria-label": vote_aria_label %> + <%= button_to budget_ballot_lines_path(investment_id: investment.id, + budget_id: investment.budget_id, + investments_ids: investment_ids), + class: "button button-support expanded", + title: t("budgets.investments.investment.support_title"), + method: :post, + remote: true, + disabled: reason.present?, + "aria-label": vote_aria_label do %> + <%= t("budgets.investments.investment.add") %> + <% end %> <% end %> <% end %> <% if reason.present? && !voted? %> - diff --git a/spec/components/budgets/investments/ballot_component_spec.rb b/spec/components/budgets/investments/ballot_component_spec.rb index 0048246c7..00aee0304 100644 --- a/spec/components/budgets/investments/ballot_component_spec.rb +++ b/spec/components/budgets/investments/ballot_component_spec.rb @@ -1,7 +1,7 @@ require "rails_helper" describe Budgets::Investments::BallotComponent do - describe "vote investment link" do + describe "vote investment button" do let(:budget) { create(:budget, :balloting) } let(:investment) { create(:budget_investment, :selected, title: "New Sports Center", budget: budget) } let(:component) do @@ -18,7 +18,7 @@ describe Budgets::Investments::BallotComponent do render_inline component - expect(page).to have_link "Vote" + expect(page).to have_button "Vote", disabled: true expect(page).to have_content "Only verified users can vote on investments; verify your account." end @@ -27,21 +27,21 @@ describe Budgets::Investments::BallotComponent do render_inline component - expect(page).to have_link count: 1 - expect(page).to have_link "Vote", title: "Support this project" - expect(page).to have_link "Vote New Sports Center" - expect(page).not_to have_link "Remove vote" + expect(page).to have_button count: 1 + expect(page).to have_button "Vote", title: "Support this project" + expect(page).to have_button "Vote New Sports Center" + expect(page).not_to have_button "Remove vote", disabled: :all end - it "is replaced with a link to remove the vote when the user has already voted" do + it "is replaced with a button to remove the vote when the user has already voted" do sign_in(create(:user, :level_two, ballot_lines: [investment])) render_inline component - expect(page).to have_link count: 1 - expect(page).to have_link "Remove vote" - expect(page).to have_link "Remove your vote for New Sports Center" - expect(page).not_to have_link "Vote" + expect(page).to have_button count: 1 + expect(page).to have_button "Remove vote" + expect(page).to have_button "Remove your vote for New Sports Center" + expect(page).not_to have_button "Vote", disabled: :all end end end diff --git a/spec/support/common_actions/budgets.rb b/spec/support/common_actions/budgets.rb index baf7b058c..f36e143c3 100644 --- a/spec/support/common_actions/budgets.rb +++ b/spec/support/common_actions/budgets.rb @@ -1,17 +1,17 @@ module Budgets def expect_message_organizations_cannot_vote expect(page).to have_content "Organization" - expect(page).to have_selector(".in-favor a", obscured: true) + expect(page).to have_button "Vote", disabled: true, obscured: true end def hover_over_ballot scroll_to find("div.ballot"), align: :bottom - find("div.ballot").hover + first("div.ballot p").hover end def add_to_ballot(investment_title) within(".budget-investment", text: investment_title) do - find(".add a").click + click_button "Vote" expect(page).to have_content "Remove" end end diff --git a/spec/system/budget_polls/voter_spec.rb b/spec/system/budget_polls/voter_spec.rb index 243fe1b10..66b457c27 100644 --- a/spec/system/budget_polls/voter_spec.rb +++ b/spec/system/budget_polls/voter_spec.rb @@ -81,11 +81,11 @@ describe "BudgetPolls", :with_frozen_time do login_as(user) visit budget_investment_path(budget, investment) - find("div.ballot").hover + first("div.ballot p").hover within("#budget_investment_#{investment.id}") do expect(page).to have_content "You have already participated offline" - expect(page).to have_css(".add a", obscured: true) + expect(page).to have_button "Vote", disabled: true, obscured: true end end end @@ -96,7 +96,7 @@ describe "BudgetPolls", :with_frozen_time do visit budget_investment_path(budget, investment) within("#budget_investment_#{investment.id}") do - find(".add a").click + click_button "Vote" expect(page).to have_content "Remove" end end @@ -106,7 +106,7 @@ describe "BudgetPolls", :with_frozen_time do visit budget_investment_path(budget, investment) within("#budget_investment_#{investment.id}") do - find(".add a").click + click_button "Vote" expect(page).to have_content "Remove" end @@ -123,7 +123,7 @@ describe "BudgetPolls", :with_frozen_time do visit budget_investment_path(budget, investment) within("#budget_investment_#{investment.id}") do - find(".add a").click + click_button "Vote" expect(page).to have_content "Remove" end diff --git a/spec/system/budgets/ballots_spec.rb b/spec/system/budgets/ballots_spec.rb index 8a253b613..e95075a5e 100644 --- a/spec/system/budgets/ballots_spec.rb +++ b/spec/system/budgets/ballots_spec.rb @@ -147,7 +147,7 @@ describe "Ballots" do end within("#budget_investment_#{investment.id}") do - find(".remove a").click + click_button "Remove vote" end expect(page).to have_css("#total_amount", text: "€0") @@ -283,8 +283,8 @@ describe "Ballots" do visit budget_investments_path(budget, heading_id: california.id) within(".budget-investment", text: "Early ShakeAlert") do - find(".remove a").click - expect(page).to have_link "Vote" + click_button "Remove vote" + expect(page).to have_button "Vote" end visit budget_investments_path(budget, heading_id: new_york.id) @@ -449,7 +449,7 @@ describe "Ballots" do hover_over_ballot expect(page).to have_content "You must sign in or sign up to continue." - expect(page).to have_selector(".in-favor a", obscured: true) + expect(page).to have_button "Vote", disabled: true, obscured: true end end @@ -515,7 +515,7 @@ describe "Ballots" do hover_over_ballot expect(page).to have_content("already voted a different heading") - expect(page).to have_selector(".in-favor a", obscured: true) + expect(page).to have_button "Vote", disabled: true, obscured: true end end @@ -531,7 +531,7 @@ describe "Ballots" do hover_over_ballot expect(page).to have_content("You have already assigned the available budget") - expect(page).to have_selector(".in-favor a", obscured: true) + expect(page).to have_button "Vote", disabled: true, obscured: true end end @@ -546,7 +546,7 @@ describe "Ballots" do hover_over_ballot expect(page).not_to have_content("You have already assigned the available budget") - expect(page).to have_selector(".in-favor a", obscured: false) + expect(page).to have_button "Vote", obscured: false end add_to_ballot("Build replicants") @@ -555,7 +555,7 @@ describe "Ballots" do hover_over_ballot expect(page).to have_content("You have already assigned the available budget") - expect(page).to have_selector(".in-favor a", obscured: true) + expect(page).to have_button "Vote", disabled: true, obscured: true end end @@ -571,7 +571,7 @@ describe "Ballots" do hover_over_ballot expect(page).to have_content("You have already assigned the available budget") - expect(page).to have_selector(".in-favor a", obscured: true) + expect(page).to have_button "Vote", disabled: true, obscured: true end within("#budget_investment_#{bi1.id}") do @@ -583,7 +583,7 @@ describe "Ballots" do hover_over_ballot expect(page).not_to have_content("You have already assigned the available budget") - expect(page).to have_selector(".in-favor a", obscured: false) + expect(page).to have_button "Vote", obscured: false end end @@ -599,7 +599,7 @@ describe "Ballots" do hover_over_ballot expect(page).to have_content("You have already assigned the available budget") - expect(page).to have_selector(".in-favor a", obscured: true) + expect(page).to have_button "Vote", disabled: true, obscured: true end within("#budget_investment_#{bi1.id}_sidebar") do @@ -612,7 +612,7 @@ describe "Ballots" do hover_over_ballot expect(page).not_to have_content("You have already assigned the available budget") - expect(page).to have_selector(".in-favor a", obscured: false) + expect(page).to have_button "Vote", obscured: false end end @@ -623,7 +623,7 @@ describe "Ballots" do login_as user visit budget_investments_path(budget, heading_id: new_york) - expect(page).to have_css(".in-favor a") + expect(page).to have_button "Vote" in_browser(:admin) do login_as admin_user @@ -639,7 +639,7 @@ describe "Ballots" do end within("#budget_investment_#{investment1.id}") do - find(".in-favor a").click + click_button "Vote" expect(page).not_to have_content "Remove" expect(page).not_to have_selector(".participation-not-allowed") @@ -647,7 +647,7 @@ describe "Ballots" do hover_over_ballot expect(page).to have_selector(".participation-not-allowed") - expect(page).to have_selector(".in-favor a", obscured: true) + expect(page).to have_button "Vote", disabled: true, obscured: true end end From ba0d21b4692e6af57f95e370cda05cfe46bb432e Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?Javi=20Mart=C3=ADn?= Date: Thu, 30 Sep 2021 22:56:21 +0200 Subject: [PATCH 10/11] Use buttons to agree/disagree with comments As mentioned in commits 5311daadf and bb958daf0, using links combined with JavaScript to generate POST requests to the server has a few issues. --- app/assets/stylesheets/layout.scss | 15 ++++++----- .../comments/votes_component.html.erb | 26 +++++++------------ spec/system/budgets/ballots_spec.rb | 8 +++--- .../comments/budget_investments_spec.rb | 10 +++---- spec/system/comments/debates_spec.rb | 12 ++++----- .../comments/legislation_annotations_spec.rb | 10 +++---- .../comments/legislation_questions_spec.rb | 10 +++---- spec/system/comments/polls_spec.rb | 10 +++---- spec/system/comments/proposals_spec.rb | 10 +++---- spec/system/comments/topics_spec.rb | 20 +++++++------- 10 files changed, 63 insertions(+), 68 deletions(-) diff --git a/app/assets/stylesheets/layout.scss b/app/assets/stylesheets/layout.scss index 489f10ea4..2b8b8cc85 100644 --- a/app/assets/stylesheets/layout.scss +++ b/app/assets/stylesheets/layout.scss @@ -1887,7 +1887,7 @@ table { display: inline-block; } - form { + .comment-form form { margin-top: $line-height / 2; } } @@ -2004,17 +2004,18 @@ table { .comment-votes { - a, + button, + form { + display: inline-block; + } + .icon-like, .icon-unlike { color: $text-light; - display: inline-block; - vertical-align: top; } - a:hover { - color: $text-medium; - text-decoration: none; + button:hover { + cursor: pointer; .icon-like { color: $like; diff --git a/app/components/comments/votes_component.html.erb b/app/components/comments/votes_component.html.erb index a3714a63f..584e014b8 100644 --- a/app/components/comments/votes_component.html.erb +++ b/app/components/comments/votes_component.html.erb @@ -3,14 +3,11 @@  |  - <% if can?(:vote, comment) %> - <%= link_to vote_comment_path(comment, value: "yes"), - method: "post", remote: true, title: t("votes.agree") do %> - - <%= t("votes.agree") %> - - <% end %> - <% else %> + <%= button_to vote_comment_path(comment, value: "yes"), + method: "post", + remote: true, + title: t("votes.agree"), + disabled: !can?(:vote, comment) do %> <%= t("votes.agree") %> @@ -19,14 +16,11 @@ - <% if can?(:vote, comment) %> - <%= link_to vote_comment_path(comment, value: "no"), - method: "post", remote: true, title: t("votes.disagree") do %> - - <%= t("votes.disagree") %> - - <% end %> - <% else %> + <%= button_to vote_comment_path(comment, value: "no"), + method: "post", + remote: true, + title: t("votes.disagree"), + disabled: !can?(:vote, comment) do %> <%= t("votes.disagree") %> diff --git a/spec/system/budgets/ballots_spec.rb b/spec/system/budgets/ballots_spec.rb index e95075a5e..233137729 100644 --- a/spec/system/budgets/ballots_spec.rb +++ b/spec/system/budgets/ballots_spec.rb @@ -177,7 +177,7 @@ describe "Ballots" do end within(".budget-investment", text: "More bridges") do - click_link "Remove vote" + click_button "Remove vote" end within("#sidebar") do @@ -464,7 +464,7 @@ describe "Ballots" do hover_over_ballot expect(page).to have_content "Only verified users can vote on investments" - expect(page).to have_selector(".in-favor a", obscured: true) + expect(page).to have_button "Vote", disabled: true, obscured: true end end @@ -575,8 +575,8 @@ describe "Ballots" do end within("#budget_investment_#{bi1.id}") do - find(".remove a").click - expect(page).to have_css ".add a" + click_button "Remove vote" + expect(page).to have_button "Vote" end within("#budget_investment_#{bi2.id}") do diff --git a/spec/system/comments/budget_investments_spec.rb b/spec/system/comments/budget_investments_spec.rb index 33bd1b94d..961ddc4af 100644 --- a/spec/system/comments/budget_investments_spec.rb +++ b/spec/system/comments/budget_investments_spec.rb @@ -525,7 +525,7 @@ describe "Commenting Budget::Investments" do visit budget_investment_path(budget, investment) within("#comment_#{comment.id}_votes") do - find(".in_favor a").click + click_button "I agree" within(".in_favor") do expect(page).to have_content "1" @@ -543,13 +543,13 @@ describe "Commenting Budget::Investments" do visit budget_investment_path(budget, investment) within("#comment_#{comment.id}_votes") do - find(".in_favor a").click + click_button "I agree" within(".in_favor") do expect(page).to have_content "1" end - find(".against a").click + click_button "I disagree" within(".in_favor") do expect(page).to have_content "0" @@ -567,13 +567,13 @@ describe "Commenting Budget::Investments" do visit budget_investment_path(budget, investment) within("#comment_#{comment.id}_votes") do - find(".in_favor a").click + click_button "I agree" within(".in_favor") do expect(page).to have_content "1" end - find(".in_favor a").click + click_button "I agree" within(".in_favor") do expect(page).to have_content "1" diff --git a/spec/system/comments/debates_spec.rb b/spec/system/comments/debates_spec.rb index 57cca11d7..eb37f8667 100644 --- a/spec/system/comments/debates_spec.rb +++ b/spec/system/comments/debates_spec.rb @@ -331,7 +331,7 @@ describe "Commenting debates" do fill_in "Leave your comment", with: "Probably if government approves." click_button "Publish reply" - expect(page).not_to have_selector("form") + expect(page).not_to have_css ".comment-form" within ".comment" do expect(page).to have_content "Probably if government approves." @@ -574,7 +574,7 @@ describe "Commenting debates" do visit debate_path(debate) within("#comment_#{comment.id}_votes") do - find(".in_favor a").click + click_button "I agree" within(".in_favor") do expect(page).to have_content "1" @@ -592,13 +592,13 @@ describe "Commenting debates" do visit debate_path(debate) within("#comment_#{comment.id}_votes") do - find(".in_favor a").click + click_button "I agree" within(".in_favor") do expect(page).to have_content "1" end - find(".against a").click + click_button "I disagree" within(".in_favor") do expect(page).to have_content "0" @@ -616,12 +616,12 @@ describe "Commenting debates" do visit debate_path(debate) within("#comment_#{comment.id}_votes") do - find(".in_favor a").click + click_button "I agree" within(".in_favor") do expect(page).to have_content "1" end - find(".in_favor a").click + click_button "I agree" within(".in_favor") do expect(page).not_to have_content "2" expect(page).to have_content "1" diff --git a/spec/system/comments/legislation_annotations_spec.rb b/spec/system/comments/legislation_annotations_spec.rb index d4f591af5..e8428dfd5 100644 --- a/spec/system/comments/legislation_annotations_spec.rb +++ b/spec/system/comments/legislation_annotations_spec.rb @@ -541,7 +541,7 @@ describe "Commenting legislation questions" do annotation) within("#comment_#{comment.id}_votes") do - find(".in_favor a").click + click_button "I agree" within(".in_favor") do expect(page).to have_content "1" @@ -561,13 +561,13 @@ describe "Commenting legislation questions" do annotation) within("#comment_#{comment.id}_votes") do - find(".in_favor a").click + click_button "I agree" within(".in_favor") do expect(page).to have_content "1" end - find(".against a").click + click_button "I disagree" within(".in_favor") do expect(page).to have_content "0" @@ -587,12 +587,12 @@ describe "Commenting legislation questions" do annotation) within("#comment_#{comment.id}_votes") do - find(".in_favor a").click + click_button "I agree" within(".in_favor") do expect(page).to have_content "1" end - find(".in_favor a").click + click_button "I agree" within(".in_favor") do expect(page).not_to have_content "2" expect(page).to have_content "1" diff --git a/spec/system/comments/legislation_questions_spec.rb b/spec/system/comments/legislation_questions_spec.rb index 745b94acd..f2ec32324 100644 --- a/spec/system/comments/legislation_questions_spec.rb +++ b/spec/system/comments/legislation_questions_spec.rb @@ -491,7 +491,7 @@ describe "Commenting legislation questions" do visit legislation_process_question_path(question.process, question) within("#comment_#{comment.id}_votes") do - find(".in_favor a").click + click_button "I agree" within(".in_favor") do expect(page).to have_content "1" @@ -509,13 +509,13 @@ describe "Commenting legislation questions" do visit legislation_process_question_path(question.process, question) within("#comment_#{comment.id}_votes") do - find(".in_favor a").click + click_button "I agree" within(".in_favor") do expect(page).to have_content "1" end - find(".against a").click + click_button "I disagree" within(".in_favor") do expect(page).to have_content "0" @@ -533,12 +533,12 @@ describe "Commenting legislation questions" do visit legislation_process_question_path(question.process, question) within("#comment_#{comment.id}_votes") do - find(".in_favor a").click + click_button "I agree" within(".in_favor") do expect(page).to have_content "1" end - find(".in_favor a").click + click_button "I agree" within(".in_favor") do expect(page).not_to have_content "2" expect(page).to have_content "1" diff --git a/spec/system/comments/polls_spec.rb b/spec/system/comments/polls_spec.rb index 0a81d6881..7ef8ed6be 100644 --- a/spec/system/comments/polls_spec.rb +++ b/spec/system/comments/polls_spec.rb @@ -469,7 +469,7 @@ describe "Commenting polls" do visit poll_path(poll) within("#comment_#{comment.id}_votes") do - find(".in_favor a").click + click_button "I agree" within(".in_favor") do expect(page).to have_content "1" @@ -487,13 +487,13 @@ describe "Commenting polls" do visit poll_path(poll) within("#comment_#{comment.id}_votes") do - find(".in_favor a").click + click_button "I agree" within(".in_favor") do expect(page).to have_content "1" end - find(".against a").click + click_button "I disagree" within(".in_favor") do expect(page).to have_content "0" @@ -511,13 +511,13 @@ describe "Commenting polls" do visit poll_path(poll) within("#comment_#{comment.id}_votes") do - find(".in_favor a").click + click_button "I agree" within(".in_favor") do expect(page).to have_content "1" end - find(".in_favor a").click + click_button "I agree" within(".in_favor") do expect(page).to have_content "1" diff --git a/spec/system/comments/proposals_spec.rb b/spec/system/comments/proposals_spec.rb index 5b1b8e43e..e00093c51 100644 --- a/spec/system/comments/proposals_spec.rb +++ b/spec/system/comments/proposals_spec.rb @@ -457,7 +457,7 @@ describe "Commenting proposals" do visit proposal_path(proposal) within("#comment_#{comment.id}_votes") do - find(".in_favor a").click + click_button "I agree" within(".in_favor") do expect(page).to have_content "1" @@ -475,13 +475,13 @@ describe "Commenting proposals" do visit proposal_path(proposal) within("#comment_#{comment.id}_votes") do - find(".in_favor a").click + click_button "I agree" within(".in_favor") do expect(page).to have_content "1" end - find(".against a").click + click_button "I disagree" within(".in_favor") do expect(page).to have_content "0" @@ -499,13 +499,13 @@ describe "Commenting proposals" do visit proposal_path(proposal) within("#comment_#{comment.id}_votes") do - find(".in_favor a").click + click_button "I agree" within(".in_favor") do expect(page).to have_content "1" end - find(".in_favor a").click + click_button "I agree" within(".in_favor") do expect(page).to have_content "1" diff --git a/spec/system/comments/topics_spec.rb b/spec/system/comments/topics_spec.rb index 87059ea02..cda1dc8ae 100644 --- a/spec/system/comments/topics_spec.rb +++ b/spec/system/comments/topics_spec.rb @@ -507,7 +507,7 @@ describe "Commenting topics from proposals" do visit community_topic_path(proposal.community, topic) within("#comment_#{comment.id}_votes") do - find(".in_favor a").click + click_button "I agree" within(".in_favor") do expect(page).to have_content "1" @@ -525,13 +525,13 @@ describe "Commenting topics from proposals" do visit community_topic_path(proposal.community, topic) within("#comment_#{comment.id}_votes") do - find(".in_favor a").click + click_button "I agree" within(".in_favor") do expect(page).to have_content "1" end - find(".against a").click + click_button "I disagree" within(".in_favor") do expect(page).to have_content "0" @@ -549,13 +549,13 @@ describe "Commenting topics from proposals" do visit community_topic_path(proposal.community, topic) within("#comment_#{comment.id}_votes") do - find(".in_favor a").click + click_button "I agree" within(".in_favor") do expect(page).to have_content "1" end - find(".in_favor a").click + click_button "I agree" within(".in_favor") do expect(page).to have_content "1" @@ -1018,7 +1018,7 @@ describe "Commenting topics from budget investments" do visit community_topic_path(investment.community, topic) within("#comment_#{comment.id}_votes") do - find(".in_favor a").click + click_button "I agree" within(".in_favor") do expect(page).to have_content "1" @@ -1036,13 +1036,13 @@ describe "Commenting topics from budget investments" do visit community_topic_path(investment.community, topic) within("#comment_#{comment.id}_votes") do - find(".in_favor a").click + click_button "I agree" within(".in_favor") do expect(page).to have_content "1" end - find(".against a").click + click_button "I disagree" within(".in_favor") do expect(page).to have_content "0" @@ -1060,13 +1060,13 @@ describe "Commenting topics from budget investments" do visit community_topic_path(investment.community, topic) within("#comment_#{comment.id}_votes") do - find(".in_favor a").click + click_button "I agree" within(".in_favor") do expect(page).to have_content "1" end - find(".in_favor a").click + click_button "I agree" within(".in_favor") do expect(page).to have_content "1" From aa2c551411130689a2e48320e8d3bb0a46d38ac6 Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?Javi=20Mart=C3=ADn?= Date: Mon, 7 Feb 2022 15:02:28 +0100 Subject: [PATCH 11/11] Use has-fa-icon in agree/disagree comment buttons Note we're using the in-favor HTML class instead of the in_favor class so we're consistent with our conventions for HTML classes and because we use the in-favor class in similar places. Also note the styles of the legislation process annotations/comments buttons is now similar to the styles in the other sections. Previously, the colors didn't have enough contrast and there was a very strange margin between the "thumbs up" icon and the number of people agreeing (that margin wasn't present between the "thumbs down" icon and the number of people disagreeing). --- app/assets/stylesheets/layout.scss | 22 +++++++++++------ .../stylesheets/legislation_process.scss | 16 ------------- .../comments/votes_component.html.erb | 10 +++----- .../comments/budget_investments_spec.rb | 12 +++++----- spec/system/comments/debates_spec.rb | 12 +++++----- .../comments/legislation_annotations_spec.rb | 12 +++++----- .../comments/legislation_questions_spec.rb | 12 +++++----- spec/system/comments/polls_spec.rb | 12 +++++----- spec/system/comments/proposals_spec.rb | 12 +++++----- spec/system/comments/topics_spec.rb | 24 +++++++++---------- 10 files changed, 66 insertions(+), 78 deletions(-) diff --git a/app/assets/stylesheets/layout.scss b/app/assets/stylesheets/layout.scss index 2b8b8cc85..d26617846 100644 --- a/app/assets/stylesheets/layout.scss +++ b/app/assets/stylesheets/layout.scss @@ -2006,22 +2006,30 @@ table { button, form { + color: $text-light; display: inline-block; } - .icon-like, - .icon-unlike { - color: $text-light; + button { + font-size: $base-font-size; + + &:hover { + cursor: pointer; + } } - button:hover { - cursor: pointer; + .in-favor button { + @include has-fa-icon(thumbs-up, solid); - .icon-like { + &:hover { color: $like; } + } - .icon-unlike { + .against button { + @include has-fa-icon(thumbs-down, solid); + + &:hover { color: $unlike; } } diff --git a/app/assets/stylesheets/legislation_process.scss b/app/assets/stylesheets/legislation_process.scss index a52e6c362..11f781a1c 100644 --- a/app/assets/stylesheets/legislation_process.scss +++ b/app/assets/stylesheets/legislation_process.scss @@ -746,22 +746,6 @@ content: "|"; } } - - .icon-like, - .icon-unlike { - cursor: pointer; - color: #c7c7c7; - - &:hover, - &:active, - &:focus { - color: #838383; - } - } - - .icon-like { - margin-right: rem-calc(4); - } } } } diff --git a/app/components/comments/votes_component.html.erb b/app/components/comments/votes_component.html.erb index 584e014b8..61f6b2cb0 100644 --- a/app/components/comments/votes_component.html.erb +++ b/app/components/comments/votes_component.html.erb @@ -2,15 +2,13 @@ <%= t("comments.comment.votes", count: comment.total_votes) %>  |  - + <%= button_to vote_comment_path(comment, value: "yes"), method: "post", remote: true, title: t("votes.agree"), disabled: !can?(:vote, comment) do %> - - <%= t("votes.agree") %> - + <%= t("votes.agree") %> <% end %> <%= comment.total_likes %> @@ -21,9 +19,7 @@ remote: true, title: t("votes.disagree"), disabled: !can?(:vote, comment) do %> - - <%= t("votes.disagree") %> - + <%= t("votes.disagree") %> <% end %> <%= comment.total_dislikes %> diff --git a/spec/system/comments/budget_investments_spec.rb b/spec/system/comments/budget_investments_spec.rb index 961ddc4af..c8df55a93 100644 --- a/spec/system/comments/budget_investments_spec.rb +++ b/spec/system/comments/budget_investments_spec.rb @@ -509,7 +509,7 @@ describe "Commenting Budget::Investments" do visit budget_investment_path(budget, investment) within("#comment_#{comment.id}_votes") do - within(".in_favor") do + within(".in-favor") do expect(page).to have_content "1" end @@ -527,7 +527,7 @@ describe "Commenting Budget::Investments" do within("#comment_#{comment.id}_votes") do click_button "I agree" - within(".in_favor") do + within(".in-favor") do expect(page).to have_content "1" end @@ -545,13 +545,13 @@ describe "Commenting Budget::Investments" do within("#comment_#{comment.id}_votes") do click_button "I agree" - within(".in_favor") do + within(".in-favor") do expect(page).to have_content "1" end click_button "I disagree" - within(".in_favor") do + within(".in-favor") do expect(page).to have_content "0" end @@ -569,13 +569,13 @@ describe "Commenting Budget::Investments" do within("#comment_#{comment.id}_votes") do click_button "I agree" - within(".in_favor") do + within(".in-favor") do expect(page).to have_content "1" end click_button "I agree" - within(".in_favor") do + within(".in-favor") do expect(page).to have_content "1" end diff --git a/spec/system/comments/debates_spec.rb b/spec/system/comments/debates_spec.rb index eb37f8667..d1021bd00 100644 --- a/spec/system/comments/debates_spec.rb +++ b/spec/system/comments/debates_spec.rb @@ -558,7 +558,7 @@ describe "Commenting debates" do visit debate_path(debate) within("#comment_#{comment.id}_votes") do - within(".in_favor") do + within(".in-favor") do expect(page).to have_content "1" end @@ -576,7 +576,7 @@ describe "Commenting debates" do within("#comment_#{comment.id}_votes") do click_button "I agree" - within(".in_favor") do + within(".in-favor") do expect(page).to have_content "1" end @@ -594,13 +594,13 @@ describe "Commenting debates" do within("#comment_#{comment.id}_votes") do click_button "I agree" - within(".in_favor") do + within(".in-favor") do expect(page).to have_content "1" end click_button "I disagree" - within(".in_favor") do + within(".in-favor") do expect(page).to have_content "0" end @@ -617,12 +617,12 @@ describe "Commenting debates" do within("#comment_#{comment.id}_votes") do click_button "I agree" - within(".in_favor") do + within(".in-favor") do expect(page).to have_content "1" end click_button "I agree" - within(".in_favor") do + within(".in-favor") do expect(page).not_to have_content "2" expect(page).to have_content "1" end diff --git a/spec/system/comments/legislation_annotations_spec.rb b/spec/system/comments/legislation_annotations_spec.rb index e8428dfd5..18b669f1f 100644 --- a/spec/system/comments/legislation_annotations_spec.rb +++ b/spec/system/comments/legislation_annotations_spec.rb @@ -523,7 +523,7 @@ describe "Commenting legislation questions" do annotation) within("#comment_#{comment.id}_votes") do - within(".in_favor") do + within(".in-favor") do expect(page).to have_content "1" end @@ -543,7 +543,7 @@ describe "Commenting legislation questions" do within("#comment_#{comment.id}_votes") do click_button "I agree" - within(".in_favor") do + within(".in-favor") do expect(page).to have_content "1" end @@ -563,13 +563,13 @@ describe "Commenting legislation questions" do within("#comment_#{comment.id}_votes") do click_button "I agree" - within(".in_favor") do + within(".in-favor") do expect(page).to have_content "1" end click_button "I disagree" - within(".in_favor") do + within(".in-favor") do expect(page).to have_content "0" end @@ -588,12 +588,12 @@ describe "Commenting legislation questions" do within("#comment_#{comment.id}_votes") do click_button "I agree" - within(".in_favor") do + within(".in-favor") do expect(page).to have_content "1" end click_button "I agree" - within(".in_favor") do + within(".in-favor") do expect(page).not_to have_content "2" expect(page).to have_content "1" end diff --git a/spec/system/comments/legislation_questions_spec.rb b/spec/system/comments/legislation_questions_spec.rb index f2ec32324..a00f030f3 100644 --- a/spec/system/comments/legislation_questions_spec.rb +++ b/spec/system/comments/legislation_questions_spec.rb @@ -475,7 +475,7 @@ describe "Commenting legislation questions" do visit legislation_process_question_path(question.process, question) within("#comment_#{comment.id}_votes") do - within(".in_favor") do + within(".in-favor") do expect(page).to have_content "1" end @@ -493,7 +493,7 @@ describe "Commenting legislation questions" do within("#comment_#{comment.id}_votes") do click_button "I agree" - within(".in_favor") do + within(".in-favor") do expect(page).to have_content "1" end @@ -511,13 +511,13 @@ describe "Commenting legislation questions" do within("#comment_#{comment.id}_votes") do click_button "I agree" - within(".in_favor") do + within(".in-favor") do expect(page).to have_content "1" end click_button "I disagree" - within(".in_favor") do + within(".in-favor") do expect(page).to have_content "0" end @@ -534,12 +534,12 @@ describe "Commenting legislation questions" do within("#comment_#{comment.id}_votes") do click_button "I agree" - within(".in_favor") do + within(".in-favor") do expect(page).to have_content "1" end click_button "I agree" - within(".in_favor") do + within(".in-favor") do expect(page).not_to have_content "2" expect(page).to have_content "1" end diff --git a/spec/system/comments/polls_spec.rb b/spec/system/comments/polls_spec.rb index 7ef8ed6be..105c2b91f 100644 --- a/spec/system/comments/polls_spec.rb +++ b/spec/system/comments/polls_spec.rb @@ -453,7 +453,7 @@ describe "Commenting polls" do visit poll_path(poll) within("#comment_#{comment.id}_votes") do - within(".in_favor") do + within(".in-favor") do expect(page).to have_content "1" end @@ -471,7 +471,7 @@ describe "Commenting polls" do within("#comment_#{comment.id}_votes") do click_button "I agree" - within(".in_favor") do + within(".in-favor") do expect(page).to have_content "1" end @@ -489,13 +489,13 @@ describe "Commenting polls" do within("#comment_#{comment.id}_votes") do click_button "I agree" - within(".in_favor") do + within(".in-favor") do expect(page).to have_content "1" end click_button "I disagree" - within(".in_favor") do + within(".in-favor") do expect(page).to have_content "0" end @@ -513,13 +513,13 @@ describe "Commenting polls" do within("#comment_#{comment.id}_votes") do click_button "I agree" - within(".in_favor") do + within(".in-favor") do expect(page).to have_content "1" end click_button "I agree" - within(".in_favor") do + within(".in-favor") do expect(page).to have_content "1" end diff --git a/spec/system/comments/proposals_spec.rb b/spec/system/comments/proposals_spec.rb index e00093c51..8b6f86fa8 100644 --- a/spec/system/comments/proposals_spec.rb +++ b/spec/system/comments/proposals_spec.rb @@ -441,7 +441,7 @@ describe "Commenting proposals" do visit proposal_path(proposal) within("#comment_#{comment.id}_votes") do - within(".in_favor") do + within(".in-favor") do expect(page).to have_content "1" end @@ -459,7 +459,7 @@ describe "Commenting proposals" do within("#comment_#{comment.id}_votes") do click_button "I agree" - within(".in_favor") do + within(".in-favor") do expect(page).to have_content "1" end @@ -477,13 +477,13 @@ describe "Commenting proposals" do within("#comment_#{comment.id}_votes") do click_button "I agree" - within(".in_favor") do + within(".in-favor") do expect(page).to have_content "1" end click_button "I disagree" - within(".in_favor") do + within(".in-favor") do expect(page).to have_content "0" end @@ -501,13 +501,13 @@ describe "Commenting proposals" do within("#comment_#{comment.id}_votes") do click_button "I agree" - within(".in_favor") do + within(".in-favor") do expect(page).to have_content "1" end click_button "I agree" - within(".in_favor") do + within(".in-favor") do expect(page).to have_content "1" end diff --git a/spec/system/comments/topics_spec.rb b/spec/system/comments/topics_spec.rb index cda1dc8ae..caa5957cb 100644 --- a/spec/system/comments/topics_spec.rb +++ b/spec/system/comments/topics_spec.rb @@ -491,7 +491,7 @@ describe "Commenting topics from proposals" do visit community_topic_path(proposal.community, topic) within("#comment_#{comment.id}_votes") do - within(".in_favor") do + within(".in-favor") do expect(page).to have_content "1" end @@ -509,7 +509,7 @@ describe "Commenting topics from proposals" do within("#comment_#{comment.id}_votes") do click_button "I agree" - within(".in_favor") do + within(".in-favor") do expect(page).to have_content "1" end @@ -527,13 +527,13 @@ describe "Commenting topics from proposals" do within("#comment_#{comment.id}_votes") do click_button "I agree" - within(".in_favor") do + within(".in-favor") do expect(page).to have_content "1" end click_button "I disagree" - within(".in_favor") do + within(".in-favor") do expect(page).to have_content "0" end @@ -551,13 +551,13 @@ describe "Commenting topics from proposals" do within("#comment_#{comment.id}_votes") do click_button "I agree" - within(".in_favor") do + within(".in-favor") do expect(page).to have_content "1" end click_button "I agree" - within(".in_favor") do + within(".in-favor") do expect(page).to have_content "1" end @@ -1002,7 +1002,7 @@ describe "Commenting topics from budget investments" do visit community_topic_path(investment.community, topic) within("#comment_#{comment.id}_votes") do - within(".in_favor") do + within(".in-favor") do expect(page).to have_content "1" end @@ -1020,7 +1020,7 @@ describe "Commenting topics from budget investments" do within("#comment_#{comment.id}_votes") do click_button "I agree" - within(".in_favor") do + within(".in-favor") do expect(page).to have_content "1" end @@ -1038,13 +1038,13 @@ describe "Commenting topics from budget investments" do within("#comment_#{comment.id}_votes") do click_button "I agree" - within(".in_favor") do + within(".in-favor") do expect(page).to have_content "1" end click_button "I disagree" - within(".in_favor") do + within(".in-favor") do expect(page).to have_content "0" end @@ -1062,13 +1062,13 @@ describe "Commenting topics from budget investments" do within("#comment_#{comment.id}_votes") do click_button "I agree" - within(".in_favor") do + within(".in-favor") do expect(page).to have_content "1" end click_button "I agree" - within(".in_favor") do + within(".in-favor") do expect(page).to have_content "1" end