Change help text id naming to support django 5.0 aria-describedby att…

…ribute
ckrybus · Dec 6, 2023 · 3ef6d4b · 3ef6d4b
1 parent 0f3bc78
commit 3ef6d4b
Show file tree

Hide file tree

Showing 10 changed files with 11 additions and 9 deletions.
diff --git a/HISTORY.rst b/HISTORY.rst
@@ -9,6 +9,8 @@ Unreleased
 * Add support for Django 5.0
 * Drop support for Django 3.2, 4.0 and 4.1
 * Add support for django-crispy-forms 2.1
+* BREAKING CHANGE: help text id attribute is now differently named:
+  ``hint_{{ field.auto_id }}`` -> ``{{ field.auto_id }}_helptext``
 
 
 0.10.0 (2023-07-03)

diff --git a/crispy_bulma/templates/bulma/layout/help_text.html b/crispy_bulma/templates/bulma/layout/help_text.html
@@ -1,3 +1,3 @@
 {% if field.help_text %}
-  <p id="hint_{{ field.auto_id }}" class="help">{{ field.help_text|safe }}</p>
+  <p id="{{ field.auto_id }}_helptext" class="help">{{ field.help_text|safe }}</p>
 {% endif %}
diff --git a/tests/results/help_text_escape.html b/tests/results/help_text_escape.html
@@ -4,6 +4,6 @@
   <div class="control">
     <input aria-describedby="id_email_helptext" type="email" name="email" maxlength="320" class="input" id="id_email" required>
   </div>
-  <p class="help" id="hint_id_email">Insert your <b>email</b></p>
+  <p class="help" id="id_email_helptext">Insert your <b>email</b></p>
 </div>
 </form>
diff --git a/tests/results/help_text_escape__lt50.html b/tests/results/help_text_escape__lt50.html
@@ -4,6 +4,6 @@
   <div class="control">
     <input type="email" name="email" maxlength="320" class="input" id="id_email" required>
   </div>
-  <p class="help" id="hint_id_email">Insert your <b>email</b></p>
+  <p class="help" id="id_email_helptext">Insert your <b>email</b></p>
 </div>
 </form>
diff --git a/tests/results/test_email_field.html b/tests/results/test_email_field.html
@@ -4,6 +4,6 @@
   <div class="control">
     <input aria-describedby="id_email_helptext" type="email" name="email" maxlength="30" class="input" id="id_email" required>
   </div>
-  <p class="help" id="hint_id_email">Insert your email</p>
+  <p class="help" id="id_email_helptext">Insert your email</p>
 </div>
 </form>
diff --git a/tests/results/test_email_field__lt50.html b/tests/results/test_email_field__lt50.html
@@ -4,6 +4,6 @@
   <div class="control">
     <input type="email" name="email" maxlength="30" class="input" id="id_email" required>
   </div>
-  <p class="help" id="hint_id_email">Insert your email</p>
+  <p class="help" id="id_email_helptext">Insert your email</p>
 </div>
 </form>
diff --git a/tests/results/test_form_group.html b/tests/results/test_form_group.html
@@ -8,7 +8,7 @@
     <div class="control">
       <input aria-describedby="id_text_input_helptext" class="input" id="id_text_input" name="text_input" required type="text">
     </div>
-    <p class="help" id="hint_id_text_input">
+    <p class="help" id="id_text_input_helptext">
       help on a text_input
     </p>
   </div>

diff --git a/tests/results/test_form_group__lt50.html b/tests/results/test_form_group__lt50.html
@@ -8,7 +8,7 @@
     <div class="control">
       <input class="input" id="id_text_input" name="text_input" required type="text">
     </div>
-    <p class="help" id="hint_id_text_input">
+    <p class="help" id="id_text_input_helptext">
       help on a text_input
     </p>
   </div>

diff --git a/tests/results/test_form_group_horizontal.html b/tests/results/test_form_group_horizontal.html
@@ -12,7 +12,7 @@
         <div class="control">
           <input aria-describedby="id_text_input_helptext" class="input" id="id_text_input" name="text_input" required type="text">
         </div>
-        <p class="help" id="hint_id_text_input">
+        <p class="help" id="id_text_input_helptext">
           help on a text_input
         </p>
       </div>

diff --git a/tests/results/test_form_group_horizontal__lt50.html b/tests/results/test_form_group_horizontal__lt50.html
@@ -12,7 +12,7 @@
         <div class="control">
           <input class="input" id="id_text_input" name="text_input" required type="text">
         </div>
-        <p class="help" id="hint_id_text_input">
+        <p class="help" id="id_text_input_helptext">
           help on a text_input
         </p>
       </div>