Skip to content

Fix help text and error IDs for aria-describedby #746

New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Merged
merged 4 commits into from
May 4, 2025
Merged
Show file tree
Hide file tree
Changes from all commits
Commits
File filter

Filter by extension

Filter by extension

Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
4 changes: 1 addition & 3 deletions src/django_bootstrap5/renderers.py
Original file line number Diff line number Diff line change
Expand Up @@ -394,14 +394,12 @@ def get_help_html(self):
"""Return HTML for help text."""
help_text = self.help_text or ""
if help_text:
widget_attrs = self.field.build_widget_attrs(self.widget.attrs)
aria_describedby = widget_attrs.get("aria-describedby")
return render_template_file(
self.field_help_text_template,
context={
"field": self.field,
"help_text": help_text,
"id_help_text": aria_describedby,
"id_help_text": f"{self.field.auto_id}_helptext",
"layout": self.layout,
"show_help": self.show_help,
},
Expand Down
Original file line number Diff line number Diff line change
@@ -1,3 +1,7 @@
{% for text in field_errors %}
<div class="invalid-feedback">{{ text }}</div>
{% endfor %}
{% if field_errors %}
<div id="{{ field.auto_id }}_error">
{% for text in field_errors %}
<div class="invalid-feedback">{{ text }}</div>
{% endfor %}
</div>
{% endif %}
2 changes: 1 addition & 1 deletion tests/test_bootstrap_field.py
Original file line number Diff line number Diff line change
Expand Up @@ -37,7 +37,7 @@ def test_help_text_overridden_aria_describedby(self):
form = SubjectTestForm()
form.fields["subject"].widget.attrs["aria-describedby"] = "my_id"
html = self.render("{% bootstrap_field form.subject %}", {"form": form})
self.assertIn('<div id="my_id" class="form-text">my_help_text</div>', html)
self.assertIn('<div id="id_subject_helptext" class="form-text">my_help_text</div>', html)

def test_placeholder(self):
html = self.render("{% bootstrap_field form.subject %}", {"form": SubjectTestForm()})
Expand Down
4 changes: 4 additions & 0 deletions tests/test_bootstrap_field_input_checkbox.py
Original file line number Diff line number Diff line change
Expand Up @@ -30,16 +30,20 @@ def test_input_type_checkbox_is_invalid(self):
)
if DJANGO_VERSION >= "5":
html = html.replace(' aria-invalid="true"', "")
if DJANGO_VERSION >= "5.2":
html = html.replace(' aria-describedby="id_test_error"', "")
self.assertHTMLEqual(
html,
(
'<div class="django_bootstrap5-err django_bootstrap5-req mb-3">'
'<div class="form-check">'
'<input class="form-check-input is-invalid" id="id_test" name="test" required type="checkbox">'
'<label class="form-check-label" for="id_test">Test</label>'
'<div id="id_test_error">'
'<div class="invalid-feedback">This field is required.</div>'
"</div>"
"</div>"
"</div>"
),
)

Expand Down
8 changes: 8 additions & 0 deletions tests/test_bootstrap_field_input_text.py
Original file line number Diff line number Diff line change
Expand Up @@ -33,6 +33,8 @@ def test_input_type_text(self):
html = self.render("{% bootstrap_field form.test %}", context={"form": form})
if DJANGO_VERSION >= "5":
html = html.replace(' aria-invalid="true"', "")
if DJANGO_VERSION >= "5.2":
html = html.replace(' aria-describedby="id_test_error"', "")

self.assertHTMLEqual(
html,
Expand All @@ -41,8 +43,10 @@ def test_input_type_text(self):
'<label class="form-label" for="id_test">Test</label>'
'<input type="text" name="test"'
' class="form-control is-invalid" placeholder="Test" required id="id_test">'
'<div id="id_test_error">'
'<div class="invalid-feedback">This field is required.</div>'
"</div>"
"</div>"
),
)

Expand Down Expand Up @@ -185,6 +189,8 @@ def test_input_validation_failure(self):
html = self.render('{% bootstrap_field form.test addon_before="foo" %}', context={"form": form})
if DJANGO_VERSION >= "5":
html = html.replace(' aria-invalid="true"', "")
if DJANGO_VERSION >= "5.2":
html = html.replace(' aria-describedby="id_test_error"', "")

self.assertHTMLEqual(
html,
Expand All @@ -195,9 +201,11 @@ def test_input_validation_failure(self):
'<span class="input-group-text">foo</span>'
'<input type="text" name="test" minlength="1" class="form-control'
' is-invalid" placeholder="Test" required id="id_test">'
'<div id="id_test_error">'
'<div class="invalid-feedback">This field is required.</div>'
"</div>"
"</div>"
"</div>"
),
)

Expand Down
5 changes: 1 addition & 4 deletions tests/test_bootstrap_form.py
Original file line number Diff line number Diff line change
Expand Up @@ -38,17 +38,14 @@ def test_exclude(self):
)
if DJANGO_VERSION >= "5":
html = html.replace(' aria-describedby="id_required_text_helptext"', "")
help_text = '<div id="id_required_text_helptext" class="form-text"><i>required_text_help</i>'
else:
help_text = '<div class="form-text"><i>required_text_help</i>'
self.assertHTMLEqual(
html,
(
'<div class="mb-3 django_bootstrap5-req">'
'<label class="form-label" for="id_required_text">Required text</label>'
'<input type="text" name="required_text" class="form-control"'
' placeholder="Required text" required id="id_required_text">'
f"{help_text}"
'<div id="id_required_text_helptext" class="form-text"><i>required_text_help</i>'
"</div>"
),
)
Expand Down
Loading