Rendering a component inside a parent component via blocks and html syntax

[celinederoland]

Hello,

I think I face an issue when embedding a component into a block inside an other one using combination of {% block %} and HTML syntax. (while it works using twig:block and HTML ; and it works using {% block %} and {% component %})
My version is symfony/ux-twig-component: 2.21, symfony:5.4, symfony/twig-bundle:6.3, twig/twig: 3.3.7, symfony: 6.4.13, php 8.2

How to reproduce :

<twig:MyEmbedder>

    <twig:block name="demo">
        <twig:MyEmbed/>  {# It Works ==> renders "<h1>Hello embedded</h1>" #}
        {% component MyEmbed %}{% endcomponent %} {# It Works ==> renders "<h1>Hello embedded</h1>" #}
    </twig:block>

</twig:MyEmbedder>

<twig:MyEmbedder>

    {% block demo %}
        <twig:MyEmbed/>  {# It DOES NOT Work ==> renders "<twig:MyEmbed/>" #}
        {% component MyEmbed %}{% endcomponent %} {# It Works ==> renders "<h1>Hello embedded</h1>" #}
    {% endblock %}

</twig:MyEmbedder>

{# MyEmbedder.html.twig #}  
<div class="embedder">
    <h1>Parent</h1>
    {% block demo %}{% endblock %}
</div>

{# MyEmbed.html.twig #}  
<h1>Hello embedded</h1>

Thank's in advance for having a look at this problem.
Best regards,
CDR

[smnandre]

When using the HTML syntax, you need to be consistent, so indeed

<twig:MyEmbedder>

    {% block demo %}
        <twig:MyEmbed/>  {# It DOES NOT Work ==> renders "<twig:MyEmbed/>" #}
        {% component MyEmbed %}{% endcomponent %} {# It Works ==> renders "<h1>Hello embedded</h1>" #}
    {% endblock %}

</twig:MyEmbedder>

This should be written

<twig:MyEmbedder>

   <twig:block name="demo">
        <twig:MyEmbed/>  {# It DOES NOT Work ==> renders "<twig:MyEmbed/>" #}
        {% component MyEmbed %}{% endcomponent %} {# It Works ==> renders "<h1>Hello embedded</h1>" #}
    </twig:block>

</twig:MyEmbedder>

Not sure if this will be enough but it's a required step at least :)