Add aria-pressed to in comments votes component

In order to the users using screen readers know whether the button is pressed
or not.
This commit is contained in:
taitus
2023-05-29 11:21:03 +02:00
parent 10cfa0e59f
commit 5009bf6c37
4 changed files with 71 additions and 3 deletions

View File

@@ -0,0 +1,53 @@
require "rails_helper"
describe Comments::VotesComponent do
let(:user) { create(:user) }
let(:comment) { create(:comment, user: user) }
let(:component) { Comments::VotesComponent.new(comment) }
describe "aria-pressed attribute" do
it "is true when the in-favor button is pressed" do
comment.vote_by(voter: user, vote: "yes")
sign_in(user)
render_inline component
page.find(".in-favor") do |in_favor_block|
expect(in_favor_block).to have_css "button[aria-pressed='true']"
end
page.find(".against") do |against_block|
expect(against_block).to have_css "button[aria-pressed='false']"
end
end
it "is true when the against button is pressed" do
comment.vote_by(voter: user, vote: "no")
sign_in(user)
render_inline component
page.find(".in-favor") do |in_favor_block|
expect(in_favor_block).to have_css "button[aria-pressed='false']"
end
page.find(".against") do |against_block|
expect(against_block).to have_css "button[aria-pressed='true']"
end
end
it "is false when neither the 'in-favor' button nor the 'against' button are pressed" do
sign_in(user)
render_inline component
page.find(".in-favor") do |in_favor_block|
expect(in_favor_block).to have_css "button[aria-pressed='false']"
end
page.find(".against") do |against_block|
expect(against_block).to have_css "button[aria-pressed='false']"
end
end
end
end