[Twig][Live] ensure null values can be used as component attributes

Author: kbond

src/LiveComponent/tests/Integration/LiveComponentHydratorTest.php

@@ -274,7 +274,7 @@ public function testCanDehydrateAndHydrateComponentsWithAttributes(): void
         $factory = self::getContainer()->get('ux.twig_component.component_factory');
 
         /** @var ComponentWithAttributes $component */
-        $component = $factory->create('with_attributes', $attributes = ['class' => 'foo']);
+        $component = $factory->create('with_attributes', $attributes = ['class' => 'foo', 'value' => null]);
 
         $this->assertSame($attributes, $component->attributes->all());
 

src/TwigComponent/src/HasAttributesTrait.php

@@ -45,8 +45,8 @@ public function mountAttributes(array $data): array
         }
 
         foreach ($data as $key => $value) {
-            if (!is_scalar($value)) {
-                throw new \LogicException(sprintf('Unable to use "%s" (%s) as an attribute. Attributes must be scalar. If you meant to mount this value on your component, make sure this is a writable property.', $key, get_debug_type($value)));
+            if (!is_scalar($value) && null !== $value) {
+                throw new \LogicException(sprintf('Unable to use "%s" (%s) as an attribute. Attributes must be scalar or null. If you meant to mount this value on your component, make sure this is a writable property.', $key, get_debug_type($value)));
             }
         }
 

src/TwigComponent/tests/Fixture/templates/template_a.html.twig

@@ -1,3 +1,3 @@
 {{ component('component_a', { propA: 'prop a value', propB: 'prop b value' }) }}
-{{ component('with_attributes', { prop: 'prop value 1', class: 'bar', style: 'color:red;' }) }}
+{{ component('with_attributes', { prop: 'prop value 1', class: 'bar', style: 'color:red;', value: null }) }}
 {{ component('with_attributes', { prop: 'prop value 2', attributes: { class: 'baz' }, type: 'submit', style: 'color:red;' }) }}

src/TwigComponent/tests/Integration/ComponentExtensionTest.php

@@ -60,7 +60,7 @@ public function testCanRenderComponentWithAttributes(): void
         $output = self::getContainer()->get(Environment::class)->render('template_a.html.twig');
 
         $this->assertStringContainsString('Component Content (prop value 1)', $output);
-        $this->assertStringContainsString('<button class="foo bar" type="button" style="color:red;">', $output);
+        $this->assertStringContainsString('<button class="foo bar" type="button" style="color:red;" value="">', $output);
         $this->assertStringContainsString('Component Content (prop value 2)', $output);
         $this->assertStringContainsString('<button class="foo baz" type="submit" style="color:red;">', $output);
     }