Skip to content

Commit 2bcb4dd

Browse files
lcreidlcreid
committed
Test for aria-labelledby
More and fixed tests
1 parent 54094b7 commit 2bcb4dd

8 files changed

Lines changed: 56 additions & 78 deletions

‎test/bootstrap_checkbox_test.rb‎

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -195,11 +195,11 @@ class BootstrapCheckboxTest < ActionView::TestCase
195195
<form accept-charset="UTF-8" action="/users" class="new_user" id="new_user" method="post">
196196
<div class="form-check mb-3">
197197
<input #{autocomplete_attr} name="user[terms]" type="hidden" value="0" />
198-
<input class="form-check-input is-invalid" id="user_terms" name="user[terms]" type="checkbox" value="1" />
198+
<input class="form-check-input is-invalid" id="user_terms" aria-labelledby="user_terms_feedback" name="user[terms]" type="checkbox" value="1" />
199199
<label class="form-check-label" for="user_terms">
200200
I agree to the terms
201201
</label>
202-
<div class="invalid-feedback">You must accept the terms.</div>
202+
<div class="invalid-feedback" id="user_terms_feedback">You must accept the terms.</div>
203203
</div>
204204
</form>
205205
HTML

‎test/bootstrap_fields_for_test.rb‎

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -41,7 +41,7 @@ class BootstrapFieldsForTest < ActionView::TestCase
4141
<form accept-charset="UTF-8" action="/users" class="new_user" id="new_user" method="post">
4242
<div class="mb-3">
4343
<label class="form-label required" for="address_city">City</label>
44-
<input class="form-control is-invalid" id="address_city" name="address[city]" type="text" required="required" />
44+
<input class="form-control is-invalid" id="address_city" aria-labelledby="address_city_feedback" name="address[city]" type="text" required="required" />
4545
<!-- No `<div class="invalid-feedback">can't be blank</div>` -->
4646
</div>
4747
</form>

‎test/bootstrap_fields_test.rb‎

Lines changed: 4 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -93,8 +93,8 @@ class BootstrapFieldsTest < ActionView::TestCase
9393
<form accept-charset="UTF-8" action="/users" class="new_user" enctype="multipart/form-data" id="new_user" method="post">
9494
<div class="mb-3">
9595
<label class="form-label" for="user_misc">Misc</label>
96-
<input class="form-control is-invalid" id="user_misc" name="user[misc]" type="file"/>
97-
<div class="invalid-feedback">error for test</div>
96+
<input class="form-control is-invalid" id="user_misc" aria-labelledby="user_misc_feedback" name="user[misc]" type="file"/>
97+
<div class="invalid-feedback" id="user_misc_feedback">error for test</div>
9898
</div>
9999
</form>
100100
HTML
@@ -108,8 +108,8 @@ class BootstrapFieldsTest < ActionView::TestCase
108108
<form accept-charset="UTF-8" action="/users" class="new_address" id="new_address" method="post">
109109
<div class="mb-3">
110110
<label class="form-label required" for="address_user_id">User</label>
111-
<input class="form-control is-invalid" id="address_user_id" name="address[user_id]" required="required" type="text"/>
112-
<div class="invalid-feedback">must exist</div>
111+
<input class="form-control is-invalid" id="address_user_id" aria-labelledby="address_user_id_feedback" name="address[user_id]" required="required" type="text"/>
112+
<div class="invalid-feedback" id="address_user_id_feedback">must exist</div>
113113
</div>
114114
</form>
115115
HTML

‎test/bootstrap_form_group_test.rb‎

Lines changed: 10 additions & 32 deletions
Original file line numberDiff line numberDiff line change
@@ -187,9 +187,9 @@ class BootstrapFormGroupTest < ActionView::TestCase
187187
<label class="form-label required" for="user_email">Email</label>
188188
<div class="input-group">
189189
<span class="input-group-text">$</span>
190-
<input required="required" class="form-control is-invalid" id="user_email" name="user[email]" type="text" />
190+
<input required="required" class="form-control is-invalid" id="user_email" aria-labelledby="user_email_feedback" name="user[email]" type="text" />
191191
<span class="input-group-text">.00</span>
192-
<div class="invalid-feedback">can't be blank, is too short (minimum is 5 characters)</span>
192+
<div class="invalid-feedback" id="user_email_feedback">can't be blank, is too short (minimum is 5 characters)</span>
193193
</div>
194194
</div>
195195
</form>
@@ -434,28 +434,6 @@ class BootstrapFormGroupTest < ActionView::TestCase
434434
assert_equivalent_html expected, output
435435
end
436436

437-
test 'upgrade doc for form_group renders the "error" class and message correctly when object is invalid' do
438-
@user.email = nil
439-
assert @user.invalid?
440-
441-
output = @builder.form_group :email do
442-
html = '<p class="form-control-plaintext">Bar</p>'.html_safe
443-
unless @user.errors[:email].empty?
444-
html << tag.div(@user.errors[:email].join(", "), class: "invalid-feedback",
445-
style: "display: block;")
446-
end
447-
html
448-
end
449-
450-
expected = <<~HTML
451-
<div class="mb-3">
452-
<p class="form-control-plaintext">Bar</p>
453-
<div class="invalid-feedback" style="display: block;">can't be blank, is too short (minimum is 5 characters)</div>
454-
</div>
455-
HTML
456-
assert_equivalent_html expected, output
457-
end
458-
459437
test "upgrade doc for form_group renders check box correctly when object is invalid" do
460438
@user.errors.add(:misc, "Must select one.")
461439

@@ -471,17 +449,17 @@ class BootstrapFormGroupTest < ActionView::TestCase
471449
<form accept-charset="UTF-8" action="/users" class="new_user" id="new_user" method="post">
472450
<div class="mb-3">
473451
<div class="form-check">
474-
<input class="form-check-input is-invalid" id="user_misc_primary_school" name="user[misc]" type="radio" value="primary school"/>
452+
<input class="form-check-input is-invalid" id="user_misc_primary_school" aria-labelledby="user_misc_feedback" name="user[misc]" type="radio" value="primary school"/>
475453
<label class="form-check-label" for="user_misc_primary_school">Primary school</label>
476454
</div>
477455
<div class="form-check">
478-
<input class="form-check-input is-invalid" id="user_misc_high_school" name="user[misc]" type="radio" value="high school"/>
456+
<input class="form-check-input is-invalid" id="user_misc_high_school" aria-labelledby="user_misc_feedback" name="user[misc]" type="radio" value="high school"/>
479457
<label class="form-check-label" for="user_misc_high_school">High school</label>
480458
</div>
481459
<div class="form-check">
482-
<input class="form-check-input is-invalid" id="user_misc_university" name="user[misc]" type="radio" value="university"/>
460+
<input class="form-check-input is-invalid" id="user_misc_university" aria-labelledby="user_misc_feedback" name="user[misc]" type="radio" value="university"/>
483461
<label class="form-check-label" for="user_misc_university">University</label>
484-
<div class="invalid-feedback">Must select one.</div>
462+
<div class="invalid-feedback" id="user_misc_feedback">Must select one.</div>
485463
</div>
486464
</div>
487465
</form>
@@ -509,9 +487,9 @@ class BootstrapFormGroupTest < ActionView::TestCase
509487
<label class="form-label required" for="user_email">Email</label>
510488
</div>
511489
<div class="field_with_errors">
512-
<input required="required" class="form-control is-invalid" id="user_email" name="user[email]" type="email" />
490+
<input required="required" class="form-control is-invalid" id="user_email" aria-labelledby="user_email_feedback" name="user[email]" type="email" />
513491
</div>
514-
<div class="invalid-feedback">can't be blank, is too short (minimum is 5 characters)</div>
492+
<div class="invalid-feedback" id="user_email_feedback">can't be blank, is too short (minimum is 5 characters)</div>
515493
</div>
516494
HTML
517495
output = @builder.email_field(:email, wrapper_class: "none-margin")
@@ -530,8 +508,8 @@ class BootstrapFormGroupTest < ActionView::TestCase
530508
<form accept-charset="UTF-8" action="/users" class="new_user" id="new_user" method="post">
531509
<div class="none-margin">
532510
<label class="form-label required" for="user_email">Email</label>
533-
<input required="required" class="form-control is-invalid" id="user_email" name="user[email]" type="text" />
534-
<div class="invalid-feedback">can't be blank, is too short (minimum is 5 characters)</div>
511+
<input required="required" class="form-control is-invalid" id="user_email" aria-labelledby="user_email_feedback" name="user[email]" type="text" />
512+
<div class="invalid-feedback" id="user_email_feedback">can't be blank, is too short (minimum is 5 characters)</div>
535513
<small class="form-text text-muted">This is required</small>
536514
</div>
537515
</form>

‎test/bootstrap_form_test.rb‎

Lines changed: 16 additions & 16 deletions
Original file line numberDiff line numberDiff line change
@@ -458,8 +458,8 @@ def warn(message, ...)
458458
expected = <<~HTML
459459
<form accept-charset="UTF-8" action="/users" class="new_user" id="new_user" method="post">
460460
<div class="mb-3">
461-
<label class="form-label required text-danger" for="user_email">Email can't be blank, is too short (minimum is 5 characters)</label>
462-
<input required="required" class="form-control is-invalid" id="user_email" name="user[email]" type="text" />
461+
<label class="form-label required text-danger" for="user_email" id="user_email_feedback">Email can't be blank, is too short (minimum is 5 characters)</label>
462+
<input required="required" class="form-control is-invalid" id="user_email" aria-labelledby="user_email_feedback" name="user[email]" type="text" />
463463
</div>
464464
</form>
465465
HTML
@@ -473,9 +473,9 @@ def warn(message, ...)
473473
expected = <<~HTML
474474
<form accept-charset="UTF-8" action="/users" class="new_user" id="new_user" method="post">
475475
<div class="mb-3">
476-
<label class="form-label required text-danger" for="user_email">Email can't be blank, is too short (minimum is 5 characters)</label>
477-
<input required="required" class="form-control is-invalid" id="user_email" name="user[email]" type="text" />
478-
<div class="invalid-feedback">can't be blank, is too short (minimum is 5 characters)</span>
476+
<label class="form-label required text-danger" for="user_email" id="user_email_feedback">Email can't be blank, is too short (minimum is 5 characters)</label>
477+
<input required="required" class="form-control is-invalid" id="user_email" aria-labelledby="user_email_feedback" name="user[email]" type="text" />
478+
<div class="invalid-feedback" id="user_email_feedback">can't be blank, is too short (minimum is 5 characters)</span>
479479
</div>
480480
</form>
481481
HTML
@@ -491,9 +491,9 @@ def warn(message, ...)
491491
expected = <<~HTML
492492
<form accept-charset="UTF-8" action="/users" class="new_user" id="new_user" method="post">
493493
<div class="mb-3">
494-
<label class="form-label required text-danger" for="user_email">Your e-mail address can't be blank, is too short (minimum is 5 characters)</label>
495-
<input required="required" class="form-control is-invalid" id="user_email" name="user[email]" type="text" />
496-
<div class="invalid-feedback">can't be blank, is too short (minimum is 5 characters)</div>
494+
<label class="form-label required text-danger" for="user_email"id="user_email_feedback">Your e-mail address can't be blank, is too short (minimum is 5 characters)</label>
495+
<input required="required" class="form-control is-invalid" id="user_email" aria-labelledby="user_email_feedback" name="user[email]" type="text" />
496+
<div class="invalid-feedback" id="user_email_feedback">can't be blank, is too short (minimum is 5 characters)</div>
497497
</div>
498498
</form>
499499
HTML
@@ -624,7 +624,7 @@ def warn(message, ...)
624624
assert @user.invalid?
625625

626626
expected = <<~HTML
627-
<div class="invalid-feedback">Email can't be blank, Email is too short (minimum is 5 characters)</div>
627+
<div class="invalid-feedback" id="user_email_feedback">Email can't be blank, Email is too short (minimum is 5 characters)</div>
628628
HTML
629629
assert_equivalent_html expected, @builder.errors_on(:email)
630630
end
@@ -717,8 +717,8 @@ def warn(message, ...)
717717
<form accept-charset="UTF-8" action="/users" class="new_user" id="new_user" method="post">
718718
<div class="mb-3">
719719
<label class="form-label required" for="user_email">Email</label>
720-
<input required="required" class="form-control is-invalid" id="user_email" name="user[email]" type="text" />
721-
<div class="invalid-feedback">can't be blank, is too short (minimum is 5 characters)</div>
720+
<input required="required" class="form-control is-invalid" id="user_email" aria-labelledby="user_email_feedback" name="user[email]" type="text" />
721+
<div class="invalid-feedback" id="user_email_feedback">can't be blank, is too short (minimum is 5 characters)</div>
722722
<small class="form-text text-muted">This is required</small>
723723
</div>
724724
</form>
@@ -741,9 +741,9 @@ def warn(message, ...)
741741
<label class="form-label required" for="user_email">Email</label>
742742
</div>
743743
<div class="field_with_errors">
744-
<input required="required" class="form-control is-invalid" id="user_email" name="user[email]" type="text" />
744+
<input required="required" class="form-control is-invalid" id="user_email" aria-labelledby="user_email_feedback" name="user[email]" type="text" />
745745
</div>
746-
<div class="invalid-feedback">can't be blank, is too short (minimum is 5 characters)</div>
746+
<div class="invalid-feedback" id="user_email_feedback">can't be blank, is too short (minimum is 5 characters)</div>
747747
<small class="form-text text-muted">This is required</small>
748748
</div>
749749
</form>
@@ -763,7 +763,7 @@ def warn(message, ...)
763763
<form accept-charset="UTF-8" action="/users" class="new_user" id="new_user" method="post">
764764
<div class="mb-3">
765765
<label class="form-label required" for="user_email">Email</label>
766-
<input required="required" class="form-control is-invalid" id="user_email" name="user[email]" type="text" />
766+
<input required="required" class="form-control is-invalid" id="user_email" aria-labelledby="user_email_feedback" name="user[email]" type="text" />
767767
<small class="form-text text-muted">This is required</small>
768768
</div>
769769
</form>
@@ -807,7 +807,7 @@ def warn(message, ...)
807807
@user.email = nil
808808
assert @user.invalid?
809809

810-
expected = '<div class="invalid-feedback">can\'t be blank, is too short (minimum is 5 characters)</div>'
810+
expected = '<div class="invalid-feedback" id="user_email_feedback">can\'t be blank, is too short (minimum is 5 characters)</div>'
811811

812812
assert_equivalent_html expected, @builder.errors_on(:email, hide_attribute_name: true)
813813
end
@@ -816,7 +816,7 @@ def warn(message, ...)
816816
@user.email = nil
817817
assert @user.invalid?
818818

819-
expected = '<div class="custom-error-class">Email can\'t be blank, Email is too short (minimum is 5 characters)</div>'
819+
expected = '<div class="custom-error-class" id="user_email_feedback">Email can\'t be blank, Email is too short (minimum is 5 characters)</div>'
820820

821821
assert_equivalent_html expected, @builder.errors_on(:email, custom_class: "custom-error-class")
822822
end

‎test/bootstrap_radio_button_test.rb‎

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -35,11 +35,11 @@ class BootstrapRadioButtonTest < ActionView::TestCase
3535
expected = <<~HTML
3636
<form accept-charset="UTF-8" action="/users" class="new_user" id="new_user" method="post">
3737
<div class="form-check">
38-
<input class="form-check-input is-invalid" id="user_misc_1" name="user[misc]" type="radio" value="1" />
38+
<input class="form-check-input is-invalid" id="user_misc_1" aria-labelledby="user_misc_feedback" name="user[misc]" type="radio" value="1" />
3939
<label class="form-check-label" for="user_misc_1">
4040
This is a radio button
4141
</label>
42-
<div class="invalid-feedback">error for test</div>
42+
<div class="invalid-feedback" id="user_misc_feedback">error for test</div>
4343
</div>
4444
</form>
4545
HTML

0 commit comments

Comments
 (0)