Explicitly handle component classes with a bool class attribute and a form_class with a BooleanField so the frontend context variable is correct.

Author: adamghill

django_unicorn/components/unicorn_view.py

@@ -9,6 +9,7 @@
 from django.core.cache import caches
 from django.core.exceptions import ImproperlyConfigured
 from django.db.models import Model
+from django.forms.widgets import CheckboxInput
 from django.http import HttpRequest
 from django.utils.decorators import classonlymethod
 from django.views.generic.base import TemplateView
@@ -400,6 +401,12 @@ def get_frontend_context_variables(self) -> str:
                         cleaned_value = form.cleaned_data[key]
                         value = field.widget.format_value(cleaned_value)
 
+                        if isinstance(field.widget, CheckboxInput) and isinstance(
+                            cleaned_value, bool
+                        ):
+                            # Handle booleans for checkboxes explicitly because `format_value` returns `None` in this case
+                            value = cleaned_value
+
                         # Don't update the frontend variable if the only change is
                         # stripping off the whitespace from the field value
                         # https://docs.djangoproject.com/en/stable/ref/forms/fields/#django.forms.CharField.strip

tests/components/test_component.py

@@ -5,6 +5,7 @@
 
 from django_unicorn.components import UnicornView
 from django_unicorn.serializer import InvalidFieldNameError
+from tests.views.fake_components import FakeValidationComponent
 
 
 class ExampleComponent(UnicornView):
@@ -236,3 +237,19 @@ class Meta:
     component = TestComponent(component_id="asdf1234", component_name="hello-world")
     assert "name" not in component.get_frontend_context_variables()
     assert "name" not in component.get_context_data()
+
+
+def test_get_frontend_context_variables_form_with_boolean_field(component):
+    """
+    Form classes with BooleanField and CheckboxInput widget set the bool values to `None`
+    without an explicit fix.
+    """
+
+    component = FakeValidationComponent(
+        component_id="asdf1234", component_name="example"
+    )
+
+    frontend_context_variables = component.get_frontend_context_variables()
+    frontend_context_variables_dict = orjson.loads(frontend_context_variables)
+
+    assert frontend_context_variables_dict.get("permanent")

tests/views/fake_components.py

@@ -61,6 +61,7 @@ class FakeValidationForm(forms.Form):
     text = forms.CharField(min_length=3, max_length=10)
     date_time = forms.DateTimeField()
     number = forms.IntegerField()
+    permanent = forms.BooleanField()
 
 
 class FakeValidationComponent(UnicornView):
@@ -70,6 +71,7 @@ class FakeValidationComponent(UnicornView):
     text = "hello"
     number = ""
     date_time = datetime(2020, 9, 13, 17, 45, 14)
+    permanent = True
 
     def set_text_no_validation(self):
         self.text = "no validation"