Add missed css_class to layout templates (#10)

CHANGELOG.md

@@ -1,5 +1,9 @@
 # CHANGELOG FOR CRISPY-BOOTSTRAP3
 
+## TBC
+
+* Fixed ignoring of `css_class` attribute in `accordion.html`, `accordion-group.html` and `tab.html` templates.
+
 ## 2024.1
 
 * Updated supported versions:

crispy_bootstrap3/templates/bootstrap3/accordion-group.html

@@ -1,4 +1,4 @@
-<div class="panel panel-default">
+<div class="panel panel-default{% if div.css_class %} {{ div.css_class }}{% endif %}">
     <div class="panel-heading">
         <h4 class="panel-title">
             <a class="accordion-toggle" data-toggle="collapse" data-parent="#{{ div.data_parent }}" href="#{{ div.css_id }}">{{ div.name }}</a>

crispy_bootstrap3/templates/bootstrap3/accordion.html

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

crispy_bootstrap3/templates/bootstrap3/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 panel-body">

tests/test_layout_objects.py

@@ -210,6 +210,10 @@ def test_inline_radios(self):
         html = render_crispy_form(test_form)
         assert html.count('radio-inline"') == 2
 
+    @pytest.mark.xfail(
+        __version__ < "2.3",
+        reason="Issue #1395 - AccordionGroup gets unexpected css_class 'active'",
+    )
     def test_accordion_and_accordiongroup(self):
         test_form = SampleForm()
         test_form.helper = FormHelper()
@@ -230,6 +234,44 @@ 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="panel-group %s" id="super-accordion"' % classes)
+            == 1
+        )
+
+    @pytest.mark.xfail(
+        __version__ < "2.3",
+        reason="Issue #1395 - AccordionGroup gets unexpected css_class 'active'",
+    )
+    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", css_class=classes),
+                AccordionGroup("two", "password1", "password2"),
+            )
+        )
+        html = render_crispy_form(test_form)
+
+        assert html.count('<div class="panel panel-default %s"' % classes) == 1
+
     def test_accordion_active_false_not_rendered(self):
         test_form = SampleForm()
         test_form.helper = FormHelper()
@@ -288,13 +330,14 @@ def test_tab_and_tab_holder(self):
                     css_class="first-tab-class active",
                 ),
                 Tab("two", "password1", "password2"),
+                css_class="custom-class",
             )
         )
         html = render_crispy_form(test_form)
 
         assert (
             html.count(
-                '<ul class="nav nav-tabs"> <li class="tab-pane active">'
+                '<ul class="nav nav-tabs custom-class"> <li class="tab-pane active">'
                 '<a href="#custom-name" data-toggle="tab">One</a></li>'
             )
             == 1