Add missed css_class to layout templates (#28)

Author: kosdmit

CHANGELOG.md

@@ -1,5 +1,10 @@
 # CHANGELOG FOR CRISPY-BOOTSTRAP4
 
+## TBC
+
+* Fixed ignoring of `css_class` attribute in `accordion.html`, `accordion-group.html` and `tab.html` templates.
+* Bumped the minimum supported version of django-crispy-forms to 2.3.
+
 ## 2024.1 (2024-02-27)
 
 * Enabled custom-control checkbox inputs when `show_form_labels` is False.

crispy_bootstrap4/templates/bootstrap4/accordion-group.html

@@ -1,4 +1,4 @@
-<div class="card mb-2">
+<div class="card mb-2{% if div.css_class %} {{ div.css_class }}{% endif %}">
     <div class="card-header" role="tab">
         <h5 class="mb-0">
             <a data-toggle="collapse" href="#{{ div.css_id }}" aria-expanded="true"

crispy_bootstrap4/templates/bootstrap4/accordion.html

@@ -1,3 +1,3 @@
-<div id="{{ accordion.css_id }}" role="tablist">
+<div{% if accordion.css_class %} class="{{ accordion.css_class }}"{% endif %} id="{{ accordion.css_id }}" role="tablist">
     {{ content }}
 </div>

crispy_bootstrap4/templates/bootstrap4/layout/tab.html

@@ -1,4 +1,4 @@
-<ul{% if tabs.css_id %} id="{{ tabs.css_id }}"{% endif %} class="nav nav-tabs">
+<ul{% if tabs.css_id %} id="{{ tabs.css_id }}"{% endif %} class="nav nav-tabs{% if tabs.css_class %} {{ tabs.css_class }}{% endif %}">
     {{ links }}
 </ul>
 <div class="tab-content card-body">

setup.py

@@ -30,7 +30,7 @@ def get_long_description():
     license="MIT",
     version=VERSION,
     packages=["crispy_bootstrap4"],
-    install_requires=["django-crispy-forms>=2.0", "django>=4.2"],
+    install_requires=["django-crispy-forms>=2.3", "django>=4.2"],
     python_requires=">=3.8",
     include_package_data=True,
     classifiers=[

tests/results/bootstrap4/test_layout_objects/test_tab_and_tab_holder.html

@@ -0,0 +1,33 @@
+<form method="post">
+  <ul class="nav nav-tabs test-tab-holder-class">
+    <li class="nav-item"><a class="nav-link active" href="#custom-name" data-toggle="tab">One</a></li>
+    <li class="nav-item"><a class="nav-link" href="#two" data-toggle="tab">Two</a></li>
+  </ul>
+  <div class="tab-content card-body">
+    <div id="custom-name" class="tab-pane first-tab-class active">
+      <div id="div_id_first_name" class="form-group">
+        <label for="id_first_name" class=" requiredField">first name<span class="asteriskField">*</span> </label>
+        <div>
+          <input type="text" name="first_name" maxlength="5" class="textinput textInput inputtext form-control"
+                 required id="id_first_name">
+        </div>
+      </div>
+    </div>
+    <div id="two" class="tab-pane">
+      <div id="div_id_password1" class="form-group">
+        <label for="id_password1" class=" requiredField">password<span class="asteriskField">*</span> </label>
+        <div>
+          <input type="password" name="password1" maxlength="30" class="passwordinput form-control"
+                 required id="id_password1">
+        </div>
+      </div>
+      <div id="div_id_password2" class="form-group">
+        <label for="id_password2" class=" requiredField">re-enter password<span class="asteriskField">*</span> </label>
+        <div>
+          <input type="password" name="password2" maxlength="30" class="passwordinput form-control"
+                 required id="id_password2">
+        </div>
+      </div>
+    </div>
+  </div>
+</form>

tests/test_layout_objects.py

@@ -247,6 +247,37 @@ def test_accordion_and_accordiongroup(self):
         assert html.count('name="password1"') == 1
         assert html.count('name="password2"') == 1
 
+    def test_accordion_css_class_is_applied(self):
+        classes = "one two three"
+        test_form = SampleForm()
+        test_form.helper = FormHelper()
+        test_form.helper.form_tag = False
+        test_form.helper.layout = Layout(
+            Accordion(
+                AccordionGroup("one", "first_name"),
+                css_class=classes,
+                css_id="super-accordion",
+            )
+        )
+        html = render_crispy_form(test_form)
+
+        assert html.count('<div class="%s" id="super-accordion"' % classes) == 1
+
+    def test_accordion_group_css_class_is_applied(self):
+        classes = "one two three"
+        test_form = SampleForm()
+        test_form.helper = FormHelper()
+        test_form.helper.form_tag = False
+        test_form.helper.layout = Layout(
+            Accordion(
+                AccordionGroup("one", "first_name"),
+                AccordionGroup("two", "password1", "password2", css_class=classes),
+            )
+        )
+        html = render_crispy_form(test_form)
+
+        assert html.count('<div class="card mb-2 %s"' % classes) == 1
+
     def test_accordion_active_false_not_rendered(self):
         test_form = SampleForm()
         test_form.helper = FormHelper()
@@ -302,30 +333,15 @@ def test_tab_and_tab_holder(self):
                     "one",
                     "first_name",
                     css_id="custom-name",
-                    css_class="first-tab-class active",
+                    css_class="first-tab-class",
                 ),
                 Tab("two", "password1", "password2"),
+                css_class="test-tab-holder-class",
             )
         )
-        html = render_crispy_form(test_form)
-
-        assert (
-            html.count(
-                '<ul class="nav nav-tabs"> <li class="nav-item">'
-                '<a class="nav-link active" href="#custom-name" data-toggle="tab">'
-                "One</a></li>"
-            )
-            == 1
+        assert parse_form(test_form) == parse_expected(
+            "bootstrap4/test_layout_objects/test_tab_and_tab_holder.html"
         )
-        assert html.count("tab-pane") == 2
-
-        assert html.count('class="tab-pane first-tab-class active"') == 1
-
-        assert html.count('<div id="custom-name"') == 1
-        assert html.count('<div id="two"') == 1
-        assert html.count('name="first_name"') == 1
-        assert html.count('name="password1"') == 1
-        assert html.count('name="password2"') == 1
 
     def test_tab_helper_reuse(self):
         # this is a proper form, according to the docs.

tox.ini

@@ -13,7 +13,7 @@ wheel_build_env = .pkg
 deps =
     django42: django>=4.2,<5.0
     django50: django>=5.0a1,<5.1
-    crispy2: django-crispy-forms>=2.0
+    crispy2: django-crispy-forms>=2.3
     crispy-latest: https://github.com/django-crispy-forms/django-crispy-forms/archive/main.tar.gz
     -rrequirements/testing.txt
 commands = python -W error::DeprecationWarning -W error::PendingDeprecationWarning -m pytest {posargs}