[TwigComponent][LiveComponent] Fix DataModelPropsSubscriber for embedded components

Author: sneakyvv

src/LiveComponent/tests/Fixtures/Component/InputComponent.php

@@ -0,0 +1,22 @@
+<?php
+
+/*
+ * This file is part of the Symfony package.
+ *
+ * (c) Fabien Potencier <fabien@symfony.com>
+ *
+ * For the full copyright and license information, please view the LICENSE
+ * file that was distributed with this source code.
+ */
+
+namespace Symfony\UX\LiveComponent\Tests\Fixtures\Component;
+
+use Symfony\UX\TwigComponent\Attribute\AsTwigComponent;
+
+/**
+ * @author Bart Vanderstukken <bart.vanderstukken@gmail.com>
+ */
+#[AsTwigComponent('input_component')]
+final class InputComponent
+{
+}

src/LiveComponent/tests/Fixtures/Component/ParentComponentDataModel.php

@@ -0,0 +1,24 @@
+<?php
+
+/*
+ * This file is part of the Symfony package.
+ *
+ * (c) Fabien Potencier <fabien@symfony.com>
+ *
+ * For the full copyright and license information, please view the LICENSE
+ * file that was distributed with this source code.
+ */
+
+namespace Symfony\UX\LiveComponent\Tests\Fixtures\Component;
+
+use Symfony\UX\LiveComponent\Attribute\AsLiveComponent;
+use Symfony\UX\LiveComponent\DefaultActionTrait;
+
+/**
+ * @author Bart Vanderstukken <bart.vanderstukken@gmail.com>
+ */
+#[AsLiveComponent('parent_component_data_model')]
+final class ParentComponentDataModel
+{
+    use DefaultActionTrait;
+}

src/LiveComponent/tests/Fixtures/Component/ParentComponentDataModel2.php

@@ -0,0 +1,27 @@
+<?php
+
+/*
+ * This file is part of the Symfony package.
+ *
+ * (c) Fabien Potencier <fabien@symfony.com>
+ *
+ * For the full copyright and license information, please view the LICENSE
+ * file that was distributed with this source code.
+ */
+
+namespace Symfony\UX\LiveComponent\Tests\Fixtures\Component;
+
+use Symfony\UX\LiveComponent\Attribute\AsLiveComponent;
+use Symfony\UX\LiveComponent\Attribute\LiveProp;
+use Symfony\UX\LiveComponent\DefaultActionTrait;
+
+/**
+ * @author Bart Vanderstukken <bart.vanderstukken@gmail.com>
+ */
+#[AsLiveComponent('parent_component_data_model_2')]
+final class ParentComponentDataModel2
+{
+    use DefaultActionTrait;
+
+    #[LiveProp(writable: true)] public string $content;
+}

src/LiveComponent/tests/Fixtures/templates/components/input_component.html.twig

@@ -0,0 +1 @@
+<input{{ attributes }} />

src/LiveComponent/tests/Fixtures/templates/components/parent_component_data_model.html.twig

@@ -0,0 +1,2 @@
+{% component parent_component_data_model_2 with { content: 'default content on mount' } %}
+{% endcomponent %}

src/LiveComponent/tests/Fixtures/templates/components/parent_component_data_model_2.html.twig

@@ -0,0 +1,2 @@
+{{ component('textarea_component', { dataModel: 'content' }) }}
+{% component input_component with { dataModel: 'content' } %}{% endcomponent %}

src/LiveComponent/tests/Integration/EventListener/DataModelPropsSubscriberTest.php

@@ -13,18 +13,16 @@
 
 use Symfony\Bundle\FrameworkBundle\Test\KernelTestCase;
 use Symfony\Component\HttpFoundation\Request;
+use Symfony\UX\LiveComponent\Tests\LiveComponentTestHelper;
 use Symfony\UX\TwigComponent\ComponentRenderer;
 
 final class DataModelPropsSubscriberTest extends KernelTestCase
 {
+    use LiveComponentTestHelper;
+
     public function testDataModelPropsAreSharedToChild(): void
     {
-        // work around so that a session is available so CSRF doesn't fail
-        $session = self::getContainer()->get('session.factory')->createSession();
-        $request = Request::create('/');
-        $request->setSession($session);
-        $requestStack = self::getContainer()->get('request_stack');
-        $requestStack->push($request);
+        $this->fakeSession();
 
         /** @var ComponentRenderer $renderer */
         $renderer = self::getContainer()->get('ux.twig_component.component_renderer');
@@ -42,4 +40,33 @@ public function testDataModelPropsAreSharedToChild(): void
         $this->assertStringContainsString('<textarea data-model="content:value">Hello data-model!</textarea>', $html);
         $this->assertStringContainsString('<textarea data-model="content2:value">Value for second child</textarea>', $html);
     }
+
+    public function testDataModelPropsAreAvailableInEmbeddedComponents(): void
+    {
+        $this->fakeSession();
+
+        $templateName = 'components/parent_component_data_model.html.twig';
+        $obscuredName = '684c45bf85d3461dbe587407892e59d8';
+        $this->addTemplateMap($obscuredName, $templateName);
+
+        /** @var ComponentRenderer $renderer */
+        $renderer = self::getContainer()->get('ux.twig_component.component_renderer');
+
+        $html = $renderer->createAndRender('parent_component_data_model', [
+            'attributes' => ['data-live-id' => 'dummy-live-id'],
+        ]);
+
+        $this->assertStringContainsString('<textarea data-model="content">default content on mount</textarea>', $html);
+        $this->assertStringContainsString('<input data-model="content" value="default content on mount" />', $html);
+    }
+
+    private function fakeSession(): void
+    {
+        // work around so that a session is available so CSRF doesn't fail
+        $session = self::getContainer()->get('session.factory')->createSession();
+        $request = Request::create('/');
+        $request->setSession($session);
+        $requestStack = self::getContainer()->get('request_stack');
+        $requestStack->push($request);
+    }
 }

src/TwigComponent/src/ComponentRenderer.php

@@ -93,17 +93,18 @@ public function embeddedContext(string $name, array $props, array $context, stri
 
         $this->componentStack->push($mounted);
 
-        try {
-            $embeddedContext = $this->preRender($mounted, $context)->getVariables();
-
-            if (!isset($embeddedContext['outerBlocks'])) {
-                $embeddedContext['outerBlocks'] = new BlockStack();
-            }
+        $embeddedContext = $this->preRender($mounted, $context)->getVariables();
 
-            return $embeddedContext;
-        } finally {
-            $this->componentStack->pop();
+        if (!isset($embeddedContext['outerBlocks'])) {
+            $embeddedContext['outerBlocks'] = new BlockStack();
         }
+
+        return $embeddedContext;
+    }
+
+    public function finishEmbeddedComponentRender(): void
+    {
+        $this->componentStack->pop();
     }
 
     private function preRender(MountedComponent $mounted, array $context = []): PreRenderEvent

src/TwigComponent/src/Twig/ComponentExtension.php

@@ -80,6 +80,15 @@ public function embeddedContext(string $name, array $props, array $context, stri
         }
     }
 
+    public function finishEmbeddedComponentRender(): void
+    {
+        try {
+            $this->container->get(ComponentRenderer::class)->finishEmbeddedComponentRender();
+        } catch (\Throwable $e) {
+            $this->throwRuntimeError($name, $e);
+        }
+    }
+
     private function throwRuntimeError(string $name, \Throwable $e): void
     {
         if (!($e instanceof \Exception)) {

src/TwigComponent/src/Twig/ComponentNode.php

@@ -85,6 +85,12 @@ public function compile(Compiler $compiler): void
         $compiler->raw('->display($embeddedContext, $embeddedBlocks);');
         $compiler->raw("\n");
 
+        $compiler->write('$this->extensions[')
+            ->string(ComponentExtension::class)
+            ->raw(']->finishEmbeddedComponentRender()')
+            ->raw(";\n")
+        ;
+
         $compiler
             ->outdent()
             ->write('}')