[LiveComponent] Live component will not render depending on Twig invocation syntax

Question

[LiveComponent] Live component will not render depending on Twig invocation syntax

melbings opened this issue 4 months ago · comments

Stefan Melbinger commented 4 months ago

Environment

Ubuntu/Pop!_OS
PHP 8.3 inside Docker
Symfony 6.4
symfony/ux-twig-component v2.16.0
symfony/ux-live-component v2.16.0

Situation

My problem appears to be related to earlier (closed) tickets:

April 2023: [TwigComponent] New HTML syntax marked as embedded in all cases - fails for live components #810
October 2023: Unable to find custom template for UX components with twig:component syntax #1205
February 2024: [LiveComponent] Getting "Cannot find a template matching "a67ec1ad40dd8f6b6934cb852ed6d2f9". Cache may be corrupt."... all the time #1493

It may well, however, be related to my particular configuration and I'm very happy for any feedback and ideas on this. I can also try to further reduce the problem if you like.

Twig configuration (config/packages/twig.yaml)

twig:
    debug: false
    auto_reload: false
    form_themes:
        - 'Cockpit/FormLayout.html.twig'
    strict_variables: false
    exception_controller: null
    paths:
        '%kernel.project_dir%/templates/Cockpit': Cockpit
        '%kernel.project_dir%/templates/Frontend': Frontend
        '%kernel.project_dir%/templates/Phoenix': Phoenix
        '%kernel.project_dir%/templates/SSO': SSO
    default_path: '%kernel.project_dir%/templates'
    file_name_pattern: '*.twig'

when@dev:
    twig:
        auto_reload: true
        debug: true
        strict_variables: true

when@test:
    twig:
        strict_variables: true

Twig component configurations (config/packages/twig_component.yaml)

twig_component:
    anonymous_template_directory: 'Components/'
    defaults:
        # Namespace & directory for components
        App\Twig\Components\: 'Components/'

Live components routing (config/routes/ux_live_component.yaml)

live_component:
    resource: '@LiveComponentBundle/config/routes.php'
    prefix: '/_components'

Services configuration (config/services.yaml)

(...)
services:
    App\Twig\Components\:
      resource: '../src/Twig/Components/*'
(...)

Live component PHP class (src/Twig/Components/Cockpit/MatchingScheduleForm.php)

<?php

declare(strict_types=1);

namespace App\Twig\Components\Cockpit;

use Symfony\UX\LiveComponent\Attribute\AsLiveComponent;
use Symfony\UX\LiveComponent\DefaultActionTrait;

#[AsLiveComponent]
class MatchingScheduleForm
{
    use DefaultActionTrait;
}

Live component Twig template (templates/Components/Cockpit/MatchingScheduleForm.html.twig)

<div {{ attributes }}>
    Hello
</div>

Twig template that tries to render the component (templates/Cockpit/Admin/Configuration/Configuration.html.twig)

<html>
<body>
    {# Option 1: Self-closing style #}
    <twig:Cockpit:MatchingScheduleForm/> {# Works! #}

    {# Option 2: Twig expression style #}
    {{ component('Cockpit:MatchingScheduleForm') }} {# Works! #}
</body>
</html>

Problem

The above setup works. I do get errors when I use different component embed syntaxes, though:

<html>
<body>
    {# Option 3: Opening and closing tag #}
    <twig:Cockpit:MatchingScheduleForm></twig:Cockpit:MatchingScheduleForm>
    {# Error: Error rendering "Cockpit:MatchingScheduleForm" component: Cannot find a match for template "Admin/Configuration/Configuration.html.twig". Cache may be corrupt. #}

    {# Option 4: Component tag syntax #}
    {% component 'Cockpit:MatchingScheduleForm' %}{% endcomponent %}
    {# Error: Error rendering "Cockpit:MatchingScheduleForm" component: Cannot find a match for template "Admin/Configuration/Configuration.html.twig". Cache may be corrupt. #}
</body>
</html>

Using these syntaxes results in the following Twig RuntimeError...

Twig\Error\RuntimeError (/srv/ml/vendor/twig/twig/src/Error/RuntimeError.php:20) {
  -lineno: 3
  -name: "@Cockpit/Admin/Configuration/Configuration.html.twig"
  -rawMessage: "Error rendering "Cockpit:MatchingScheduleForm" component: Cannot find a match for template "Admin/Configuration/Configuration.html.twig". Cache may be corrupt."
  -sourcePath: "/srv/ml/templates/Cockpit/Admin/Configuration/Configuration.html.twig"
  -sourceCode: """
    <html>
    <body>
    {% component 'Cockpit:MatchingScheduleForm' %}{% endcomponent %} {# error #}
    </body>
    </html>
    """
}

... and the following RuntimeException:

RuntimeException
Cannot find a match for template "Admin/Configuration/Configuration.html.twig". Cache may be corrupt.

Trying to fix it

rm -rf var/cache/ does not get rid of the error.

Details

Twig RuntimeError stacktrace

Twig\Error\RuntimeError:
Error rendering "Cockpit:MatchingScheduleForm" component: Cannot find a match for template "Admin/Configuration/Configuration.html.twig". Cache may be corrupt.
at templates/Cockpit/Admin/Configuration/Configuration.html.twig:3

at Symfony\UX\TwigComponent\Twig\ComponentExtension->throwRuntimeError('Cockpit:MatchingScheduleForm', object(RuntimeException))

(vendor/symfony/ux-twig-component/src/Twig/ComponentExtension.php:80)

at Symfony\UX\TwigComponent\Twig\ComponentExtension->startEmbeddedComponentRender('Cockpit:MatchingScheduleForm', array(), array('client' => object(Client), 'configurationForm' => object(FormView), 'placeholders' => array(object(Placeholder), object(Placeholder), object(Placeholder), object(Placeholder), object(Placeholder), object(Placeholder), object(Placeholder), object(Placeholder), object(Placeholder)), 'program' => object(Program), 'showConfigurations' => false, 'app' => object(AppVariable), 'global' => array('accessibleClients' => array(array('code' => object(ClientCode), 'name' => 'xyz', 'officialDomain' => 'http://xyz.localhost'), array('code' => object(ClientCode), 'name' => 'xyz', 'officialDomain' => 'http://xyz.localhost'), array('code' => object(ClientCode), 'name' => 'xyz', 'officialDomain' => 'http://xyz.localhost')), 'currentCalendarWeek' => object(CalendarWeek), 'release' => 'local', 'settings' => object(CockpitSettings))), 'Admin/Configuration/Configuration.html.twig', 944708181)

(var/cache/dev/twig/b0/b07221026fe44f7acedce0b9da94300b.php:51)

at __TwigTemplate_e7a7b0325ec24a14e1887aca70b34379->doDisplay(array('client' => object(Client), 'configurationForm' => object(FormView), 'placeholders' => array(object(Placeholder), object(Placeholder), object(Placeholder), object(Placeholder), object(Placeholder), object(Placeholder), object(Placeholder), object(Placeholder), object(Placeholder)), 'program' => object(Program), 'showConfigurations' => false, 'app' => object(AppVariable), 'global' => array('accessibleClients' => array(array('code' => object(ClientCode), 'name' => 'xyz', 'officialDomain' => 'http://xyz.localhost'), array('code' => object(ClientCode), 'name' => 'xyz', 'officialDomain' => 'http://xyz.localhost'), array('code' => object(ClientCode), 'name' => 'xyz', 'officialDomain' => 'http://xyz.localhost')), 'currentCalendarWeek' => object(CalendarWeek), 'release' => 'local', 'settings' => object(CockpitSettings))), array())

(vendor/twig/twig/src/Template.php:394)

at Twig\Template->displayWithErrorHandling(array('client' => object(Client), 'configurationForm' => object(FormView), 'placeholders' => array(object(Placeholder), object(Placeholder), object(Placeholder), object(Placeholder), object(Placeholder), object(Placeholder), object(Placeholder), object(Placeholder), object(Placeholder)), 'program' => object(Program), 'showConfigurations' => false, 'app' => object(AppVariable), 'global' => array('accessibleClients' => array(array('code' => object(ClientCode), 'name' => 'xyz', 'officialDomain' => 'http://xyz.localhost'), array('code' => object(ClientCode), 'name' => 'xyz', 'officialDomain' => 'http://xyz.localhost'), array('code' => object(ClientCode), 'name' => 'xyz', 'officialDomain' => 'http://xyz.localhost')), 'currentCalendarWeek' => object(CalendarWeek), 'release' => 'local', 'settings' => object(CockpitSettings))), array())

(vendor/twig/twig/src/Template.php:367)

at Twig\Template->display(array('client' => object(Client), 'configurationForm' => object(FormView), 'placeholders' => array(object(Placeholder), object(Placeholder), object(Placeholder), object(Placeholder), object(Placeholder), object(Placeholder), object(Placeholder), object(Placeholder), object(Placeholder)), 'program' => object(Program), 'showConfigurations' => false))

(vendor/twig/twig/src/Template.php:379)

at Twig\Template->render(array('client' => object(Client), 'configurationForm' => object(FormView), 'placeholders' => array(object(Placeholder), object(Placeholder), object(Placeholder), object(Placeholder), object(Placeholder), object(Placeholder), object(Placeholder), object(Placeholder), object(Placeholder)), 'program' => object(Program), 'showConfigurations' => false))

(vendor/twig/twig/src/TemplateWrapper.php:38)

at Twig\TemplateWrapper->render(array('client' => object(Client), 'configurationForm' => object(FormView), 'placeholders' => array(object(Placeholder), object(Placeholder), object(Placeholder), object(Placeholder), object(Placeholder), object(Placeholder), object(Placeholder), object(Placeholder), object(Placeholder)), 'program' => object(Program), 'showConfigurations' => false))

(vendor/twig/twig/src/Environment.php:280)

at Twig\Environment->render('@Cockpit/Admin/Configuration/Configuration.html.twig', array('client' => object(Client), 'configurationForm' => object(FormView), 'placeholders' => array(object(Placeholder), object(Placeholder), object(Placeholder), object(Placeholder), object(Placeholder), object(Placeholder), object(Placeholder), object(Placeholder), object(Placeholder)), 'program' => object(Program), 'showConfigurations' => false))

(vendor/symfony/framework-bundle/Controller/AbstractController.php:448)

at Symfony\Bundle\FrameworkBundle\Controller\AbstractController->doRenderView('@Cockpit/Admin/Configuration/Configuration.html.twig', null, array('client' => object(Client), 'configurationForm' => object(FormView), 'placeholders' => array(object(Placeholder), object(Placeholder), object(Placeholder), object(Placeholder), object(Placeholder), object(Placeholder), object(Placeholder), object(Placeholder), object(Placeholder)), 'program' => object(Program), 'showConfigurations' => false), 'render')

(vendor/symfony/framework-bundle/Controller/AbstractController.php:453)

at Symfony\Bundle\FrameworkBundle\Controller\AbstractController->doRender('@Cockpit/Admin/Configuration/Configuration.html.twig', null, array('client' => object(Client), 'configurationForm' => object(Form), 'placeholders' => array(object(Placeholder), object(Placeholder), object(Placeholder), object(Placeholder), object(Placeholder), object(Placeholder), object(Placeholder), object(Placeholder), object(Placeholder)), 'program' => object(Program), 'showConfigurations' => false), null, 'render')

(vendor/symfony/framework-bundle/Controller/AbstractController.php:253)

at Symfony\Bundle\FrameworkBundle\Controller\AbstractController->render('@Cockpit/Admin/Configuration/Configuration.html.twig', array('client' => object(Client), 'configurationForm' => object(Form), 'placeholders' => array(object(Placeholder), object(Placeholder), object(Placeholder), object(Placeholder), object(Placeholder), object(Placeholder), object(Placeholder), object(Placeholder), object(Placeholder)), 'program' => object(Program), 'showConfigurations' => false), null)

(src/Controller/Traits/CspAllowedHostTrait.php:31)

at App\Cockpit\Controller\Admin\Configuration\ConfigurationController->renderWithCspAllowedHost('@Cockpit/Admin/Configuration/Configuration.html.twig', array('client' => object(Client), 'configurationForm' => object(Form), 'placeholders' => array(object(Placeholder), object(Placeholder), object(Placeholder), object(Placeholder), object(Placeholder), object(Placeholder), object(Placeholder), object(Placeholder), object(Placeholder)), 'program' => object(Program), 'showConfigurations' => false), null, ''unsafe-eval'')

(src/Cockpit/Controller/Admin/Configuration/ConfigurationController.php:131)

at App\Cockpit\Controller\Admin\Configuration\ConfigurationController->newConfiguration(object(Program), object(Request))

(vendor/symfony/http-kernel/HttpKernel.php:181)

at Symfony\Component\HttpKernel\HttpKernel->handleRaw(object(Request), 1)

(vendor/symfony/http-kernel/HttpKernel.php:76)

at Symfony\Component\HttpKernel\HttpKernel->handle(object(Request), 1, true)

(vendor/symfony/http-kernel/Kernel.php:197)

at Symfony\Component\HttpKernel\Kernel->handle(object(Request))

(vendor/symfony/runtime/Runner/Symfony/HttpKernelRunner.php:35)

at Symfony\Component\Runtime\Runner\Symfony\HttpKernelRunner->run()

(vendor/autoload_runtime.php:29)

at require_once('/srv/ml/vendor/autoload_runtime.php')

(public/index.php:7)

RuntimeException stacktrace

RuntimeException:
Cannot find a match for template "Admin/Configuration/Configuration.html.twig". Cache may be corrupt.
at vendor/symfony/ux-live-component/src/Twig/TemplateMap.php:42

at Symfony\UX\LiveComponent\Twig\TemplateMap->obscuredName('Admin/Configuration/Configuration.html.twig')

(vendor/symfony/ux-live-component/src/Util/LiveControllerAttributesCreator.php:85)

at Symfony\UX\LiveComponent\Util\LiveControllerAttributesCreator->attributesForRendering(object(MountedComponent), object(ComponentMetadata), false)

(vendor/symfony/ux-live-component/src/EventListener/AddLiveAttributesSubscriber.php:102)

at Symfony\UX\LiveComponent\EventListener\AddLiveAttributesSubscriber->getLiveAttributes(object(MountedComponent), object(ComponentMetadata))

(vendor/symfony/ux-live-component/src/EventListener/AddLiveAttributesSubscriber.php:51)

at Symfony\UX\LiveComponent\EventListener\AddLiveAttributesSubscriber->onPreRender(object(PreRenderEvent), 'Symfony\UX\TwigComponent\Event\PreRenderEvent', object(TraceableEventDispatcher))

(vendor/symfony/event-dispatcher/Debug/WrappedListener.php:116)

at Symfony\Component\EventDispatcher\Debug\WrappedListener->__invoke(object(PreRenderEvent), 'Symfony\UX\TwigComponent\Event\PreRenderEvent', object(TraceableEventDispatcher))

(vendor/symfony/event-dispatcher/EventDispatcher.php:220)

at Symfony\Component\EventDispatcher\EventDispatcher->callListeners(array(object(WrappedListener), object(WrappedListener), object(WrappedListener)), 'Symfony\UX\TwigComponent\Event\PreRenderEvent', object(PreRenderEvent))

(vendor/symfony/event-dispatcher/EventDispatcher.php:56)

at Symfony\Component\EventDispatcher\EventDispatcher->dispatch(object(PreRenderEvent), 'Symfony\UX\TwigComponent\Event\PreRenderEvent')

(vendor/symfony/event-dispatcher/Debug/TraceableEventDispatcher.php:139)

at Symfony\Component\EventDispatcher\Debug\TraceableEventDispatcher->dispatch(object(PreRenderEvent))

(vendor/symfony/ux-twig-component/src/ComponentRenderer.php:141)

at Symfony\UX\TwigComponent\ComponentRenderer->preRender(object(MountedComponent), array('client' => object(Client), 'configurationForm' => object(FormView), 'placeholders' => array(object(Placeholder), object(Placeholder), object(Placeholder), object(Placeholder), object(Placeholder), object(Placeholder), object(Placeholder), object(Placeholder), object(Placeholder)), 'program' => object(Program), 'showConfigurations' => false, 'app' => object(AppVariable), 'global' => array('accessibleClients' => array(array('code' => object(ClientCode), 'name' => 'xyz', 'officialDomain' => 'http://xyz.localhost'), array('code' => object(ClientCode), 'name' => 'xyz', 'officialDomain' => 'http://xyz.localhost'), array('code' => object(ClientCode), 'name' => 'xyz', 'officialDomain' => 'http://xyz.localhost')), 'currentCalendarWeek' => object(CalendarWeek), 'release' => 'local', 'settings' => object(CockpitSettings)), '__embedded' => true))

(vendor/symfony/ux-twig-component/src/ComponentRenderer.php:98)

at Symfony\UX\TwigComponent\ComponentRenderer->startEmbeddedComponentRender('Cockpit:MatchingScheduleForm', array(), array('client' => object(Client), 'configurationForm' => object(FormView), 'placeholders' => array(object(Placeholder), object(Placeholder), object(Placeholder), object(Placeholder), object(Placeholder), object(Placeholder), object(Placeholder), object(Placeholder), object(Placeholder)), 'program' => object(Program), 'showConfigurations' => false, 'app' => object(AppVariable), 'global' => array('accessibleClients' => array(array('code' => object(ClientCode), 'name' => 'xyz', 'officialDomain' => 'http://xyz.localhost'), array('code' => object(ClientCode), 'name' => 'xyz', 'officialDomain' => 'http://xyz.localhost'), array('code' => object(ClientCode), 'name' => 'xyz', 'officialDomain' => 'http://xyz.localhost')), 'currentCalendarWeek' => object(CalendarWeek), 'release' => 'local', 'settings' => object(CockpitSettings)), '__embedded' => true), 'Admin/Configuration/Configuration.html.twig', 944708181)

(vendor/symfony/ux-twig-component/src/Twig/ComponentExtension.php:78)

at Symfony\UX\TwigComponent\Twig\ComponentExtension->startEmbeddedComponentRender('Cockpit:MatchingScheduleForm', array(), array('client' => object(Client), 'configurationForm' => object(FormView), 'placeholders' => array(object(Placeholder), object(Placeholder), object(Placeholder), object(Placeholder), object(Placeholder), object(Placeholder), object(Placeholder), object(Placeholder), object(Placeholder)), 'program' => object(Program), 'showConfigurations' => false, 'app' => object(AppVariable), 'global' => array('accessibleClients' => array(array('code' => object(ClientCode), 'name' => 'xyz', 'officialDomain' => 'http://xyz.localhost'), array('code' => object(ClientCode), 'name' => 'xyz', 'officialDomain' => 'http://xyz.localhost'), array('code' => object(ClientCode), 'name' => 'xyz', 'officialDomain' => 'http://xyz.localhost')), 'currentCalendarWeek' => object(CalendarWeek), 'release' => 'local', 'settings' => object(CockpitSettings))), 'Admin/Configuration/Configuration.html.twig', 944708181)

(var/cache/dev/twig/b0/b07221026fe44f7acedce0b9da94300b.php:51)

at __TwigTemplate_e7a7b0325ec24a14e1887aca70b34379->doDisplay(array('client' => object(Client), 'configurationForm' => object(FormView), 'placeholders' => array(object(Placeholder), object(Placeholder), object(Placeholder), object(Placeholder), object(Placeholder), object(Placeholder), object(Placeholder), object(Placeholder), object(Placeholder)), 'program' => object(Program), 'showConfigurations' => false, 'app' => object(AppVariable), 'global' => array('accessibleClients' => array(array('code' => object(ClientCode), 'name' => 'xyz', 'officialDomain' => 'http://xyz.localhost'), array('code' => object(ClientCode), 'name' => 'xyz', 'officialDomain' => 'http://xyz.localhost'), array('code' => object(ClientCode), 'name' => 'xyz', 'officialDomain' => 'http://xyz.localhost')), 'currentCalendarWeek' => object(CalendarWeek), 'release' => 'local', 'settings' => object(CockpitSettings))), array())

(vendor/twig/twig/src/Template.php:394)

at Twig\Template->displayWithErrorHandling(array('client' => object(Client), 'configurationForm' => object(FormView), 'placeholders' => array(object(Placeholder), object(Placeholder), object(Placeholder), object(Placeholder), object(Placeholder), object(Placeholder), object(Placeholder), object(Placeholder), object(Placeholder)), 'program' => object(Program), 'showConfigurations' => false, 'app' => object(AppVariable), 'global' => array('accessibleClients' => array(array('code' => object(ClientCode), 'name' => 'xyz', 'officialDomain' => 'http://xyz.localhost'), array('code' => object(ClientCode), 'name' => 'xyz', 'officialDomain' => 'http://xyz.localhost'), array('code' => object(ClientCode), 'name' => 'xyz', 'officialDomain' => 'http://xyz.localhost')), 'currentCalendarWeek' => object(CalendarWeek), 'release' => 'local', 'settings' => object(CockpitSettings))), array())

(vendor/twig/twig/src/Template.php:367)

at Twig\Template->display(array('client' => object(Client), 'configurationForm' => object(FormView), 'placeholders' => array(object(Placeholder), object(Placeholder), object(Placeholder), object(Placeholder), object(Placeholder), object(Placeholder), object(Placeholder), object(Placeholder), object(Placeholder)), 'program' => object(Program), 'showConfigurations' => false))

(vendor/twig/twig/src/Template.php:379)

at Twig\Template->render(array('client' => object(Client), 'configurationForm' => object(FormView), 'placeholders' => array(object(Placeholder), object(Placeholder), object(Placeholder), object(Placeholder), object(Placeholder), object(Placeholder), object(Placeholder), object(Placeholder), object(Placeholder)), 'program' => object(Program), 'showConfigurations' => false))

(vendor/twig/twig/src/TemplateWrapper.php:38)

at Twig\TemplateWrapper->render(array('client' => object(Client), 'configurationForm' => object(FormView), 'placeholders' => array(object(Placeholder), object(Placeholder), object(Placeholder), object(Placeholder), object(Placeholder), object(Placeholder), object(Placeholder), object(Placeholder), object(Placeholder)), 'program' => object(Program), 'showConfigurations' => false))

(vendor/twig/twig/src/Environment.php:280)

at Twig\Environment->render('@Cockpit/Admin/Configuration/Configuration.html.twig', array('client' => object(Client), 'configurationForm' => object(FormView), 'placeholders' => array(object(Placeholder), object(Placeholder), object(Placeholder), object(Placeholder), object(Placeholder), object(Placeholder), object(Placeholder), object(Placeholder), object(Placeholder)), 'program' => object(Program), 'showConfigurations' => false))

(vendor/symfony/framework-bundle/Controller/AbstractController.php:448)

at Symfony\Bundle\FrameworkBundle\Controller\AbstractController->doRenderView('@Cockpit/Admin/Configuration/Configuration.html.twig', null, array('client' => object(Client), 'configurationForm' => object(FormView), 'placeholders' => array(object(Placeholder), object(Placeholder), object(Placeholder), object(Placeholder), object(Placeholder), object(Placeholder), object(Placeholder), object(Placeholder), object(Placeholder)), 'program' => object(Program), 'showConfigurations' => false), 'render')

(vendor/symfony/framework-bundle/Controller/AbstractController.php:453)

at Symfony\Bundle\FrameworkBundle\Controller\AbstractController->doRender('@Cockpit/Admin/Configuration/Configuration.html.twig', null, array('client' => object(Client), 'configurationForm' => object(Form), 'placeholders' => array(object(Placeholder), object(Placeholder), object(Placeholder), object(Placeholder), object(Placeholder), object(Placeholder), object(Placeholder), object(Placeholder), object(Placeholder)), 'program' => object(Program), 'showConfigurations' => false), null, 'render')

(vendor/symfony/framework-bundle/Controller/AbstractController.php:253)

at Symfony\Bundle\FrameworkBundle\Controller\AbstractController->render('@Cockpit/Admin/Configuration/Configuration.html.twig', array('client' => object(Client), 'configurationForm' => object(Form), 'placeholders' => array(object(Placeholder), object(Placeholder), object(Placeholder), object(Placeholder), object(Placeholder), object(Placeholder), object(Placeholder), object(Placeholder), object(Placeholder)), 'program' => object(Program), 'showConfigurations' => false), null)

(src/Controller/Traits/CspAllowedHostTrait.php:31)

at App\Cockpit\Controller\Admin\Configuration\ConfigurationController->renderWithCspAllowedHost('@Cockpit/Admin/Configuration/Configuration.html.twig', array('client' => object(Client), 'configurationForm' => object(Form), 'placeholders' => array(object(Placeholder), object(Placeholder), object(Placeholder), object(Placeholder), object(Placeholder), object(Placeholder), object(Placeholder), object(Placeholder), object(Placeholder)), 'program' => object(Program), 'showConfigurations' => false), null, ''unsafe-eval'')

(src/Cockpit/Controller/Admin/Configuration/ConfigurationController.php:131)

at App\Cockpit\Controller\Admin\Configuration\ConfigurationController->newConfiguration(object(Program), object(Request))

(vendor/symfony/http-kernel/HttpKernel.php:181)

at Symfony\Component\HttpKernel\HttpKernel->handleRaw(object(Request), 1)

(vendor/symfony/http-kernel/HttpKernel.php:76)

at Symfony\Component\HttpKernel\HttpKernel->handle(object(Request), 1, true)

(vendor/symfony/http-kernel/Kernel.php:197)

at Symfony\Component\HttpKernel\Kernel->handle(object(Request))

(vendor/symfony/runtime/Runner/Symfony/HttpKernelRunner.php:35)

at Symfony\Component\Runtime\Runner\Symfony\HttpKernelRunner->run()

(vendor/autoload_runtime.php:29)

at require_once('/srv/ml/vendor/autoload_runtime.php')

(public/index.php:7)

Simon André · Answer 1 · Fri Apr 19 2024 04:15:10 GMT+0800 (China Standard Time)

Do you have any custom Twig config / namespaces ? I see a "@" prefix in your exception ?

Stefan Melbinger · Answer 2 · Fri Apr 19 2024 04:17:57 GMT+0800 (China Standard Time)

Thank you, I missed that part. Yes, I do.

Posting here and updating the original message 😊

Twig configuration (config/packages/twig.yaml)

twig:
    debug: false
    auto_reload: false
    form_themes:
        - 'Cockpit/FormLayout.html.twig'
    strict_variables: false
    exception_controller: null
    paths:
        '%kernel.project_dir%/templates/Cockpit': Cockpit
        '%kernel.project_dir%/templates/Frontend': Frontend
        '%kernel.project_dir%/templates/Phoenix': Phoenix
        '%kernel.project_dir%/templates/SSO': SSO
    default_path: '%kernel.project_dir%/templates'
    file_name_pattern: '*.twig'

when@dev:
    twig:
        auto_reload: true
        debug: true
        strict_variables: true

when@test:
    twig:
        strict_variables: true

Simon André · Answer 3 · Fri Apr 19 2024 04:21:33 GMT+0800 (China Standard Time)

Just to be sure it's related... the place were you're doing

->render('@Cockpit/admin/...'

could you try with

->render('templates/Cockpit/...'

Stefan Melbinger · Answer 4 · Fri Apr 19 2024 04:27:21 GMT+0800 (China Standard Time)

Gotcha. Unfortunately, I get the same error after trying that.

Simon André · Answer 5 · Fri Apr 19 2024 04:41:34 GMT+0800 (China Standard Time)

You're showing "embed syntax" with no content.. IRL do you want to pass content ?

Does your component template contain a content block ?

Stefan Melbinger · Answer 6 · Fri Apr 19 2024 04:51:16 GMT+0800 (China Standard Time)

That's why I was originally switching to the open/close tag syntax, you're right - to put content inbetween the tags (if that's what you mean).

However, the error stays no matter whether I actually put anything in between the tags or not. All code I shared above is actual code that produces the error.

Simon André · Answer 7 · Fri Apr 19 2024 04:52:46 GMT+0800 (China Standard Time)

Yes and i think I understand why ... but what i'm less sure is if that would happen with embed blocks

Stefan Melbinger · Answer 8 · Fri Apr 19 2024 04:54:31 GMT+0800 (China Standard Time)

Happy to try out anything you suggest.

Stefan Melbinger · Answer 9 · Fri Apr 19 2024 04:56:44 GMT+0800 (China Standard Time)

Or can you think of a workaround / a syntax that works for me to pass HTML to the component via a block?

Simon André · Answer 10 · Fri Apr 19 2024 04:57:42 GMT+0800 (China Standard Time)

But when you put something as you said, you do have a block "content" in your MatchingScheduleForm template ?

Stefan Melbinger · Answer 11 · Fri Apr 19 2024 05:01:07 GMT+0800 (China Standard Time)

Yes, I tried to use a "content" block within the component template originally. Still got me an error.

However, the current error is really shown when using only...

<div {{ attributes }}>
    Hello
</div>

... for the component template and...

<html>
<body>
    {# Option 3: Opening and closing tag #}
    <twig:Cockpit:MatchingScheduleForm></twig:Cockpit:MatchingScheduleForm>
    {# Error: Error rendering "Cockpit:MatchingScheduleForm" component: Cannot find a match for template "Admin/Configuration/Configuration.html.twig". Cache may be corrupt. #}

    {# Option 4: Component tag syntax #}
    {% component 'Cockpit:MatchingScheduleForm' %}{% endcomponent %}
    {# Error: Error rendering "Cockpit:MatchingScheduleForm" component: Cannot find a match for template "Admin/Configuration/Configuration.html.twig". Cache may be corrupt. #}
</body>
</html>

... for the calling template. (I tried to minimize the situation as much as possible, that's why I'm not passing any HTML to the component anymore.)

Simon André · Answer 12 · Fri Apr 19 2024 05:09:19 GMT+0800 (China Standard Time)

Yes I understood, but those syntaxes are not used IRL, as the embed syntax only goal is to... embed something :)

So what i'm trying to see is if, with your configuration, things can work or not

Stefan Melbinger · Answer 13 · Fri Apr 19 2024 05:11:59 GMT+0800 (China Standard Time)

Which one is the "embed syntax"? Sorry, I made up some syntax names along the way, so I'm confused now. 😁

Anyway - let me know whatever I can try to further clarify for you.

Simon André · Answer 14 · Fri Apr 19 2024 15:38:59 GMT+0800 (China Standard Time)

Sorry your options 3 & 4, if you pass content in it, you need a block « content » on your component template.

None of them work then, that’s right ?

Stefan Melbinger · Answer 15 · Fri Apr 19 2024 16:51:35 GMT+0800 (China Standard Time)

None of them work, correct:

{#
   Error rendering "Cockpit:MatchingScheduleForm" component:
   Cannot find a match for template "Admin/Configuration/Configuration.html.twig".
   Cache may be corrupt.
#}
<twig:Cockpit:MatchingScheduleForm>
</twig:Cockpit:MatchingScheduleForm>

{#
   Error rendering "Cockpit:MatchingScheduleForm" component:
   Cannot find a match for template "Admin/Configuration/Configuration.html.twig".
   Cache may be corrupt.
#}
<twig:Cockpit:MatchingScheduleForm>
    <div>Congratulations! You've won a free puppy!</div>
</twig:Cockpit:MatchingScheduleForm>

{#
   Error rendering "Cockpit:MatchingScheduleForm" component:
   Cannot find a match for template "Admin/Configuration/Configuration.html.twig".
   Cache may be corrupt.
#}
{% component 'Cockpit:MatchingScheduleForm' %}
{% endcomponent %}

{#
   Error rendering "Cockpit:MatchingScheduleForm" component:
   Cannot find a match for template "Admin/Configuration/Configuration.html.twig".
   Cache may be corrupt.
#}
{% component 'Cockpit:MatchingScheduleForm' %}
    {% block content %}<div>Congratulations! You've won a free puppy!</div>{% endblock %}
{% endcomponent %}

Simon André · Answer 16 · Fri Apr 19 2024 17:45:57 GMT+0800 (China Standard Time)

Ok thank you. I’ll look next week (cannot before sorry) I see what to change

Stefan Melbinger · Answer 17 · Fri Apr 19 2024 21:21:18 GMT+0800 (China Standard Time)

@smnandre thank you very much 😊

Matheo D. · Answer 18 · Sat Apr 20 2024 01:01:20 GMT+0800 (China Standard Time)

I think I know why it's not working.

So in your twig.yaml you have the following:

twig:
    paths:
        '%kernel.project_dir%/templates/Cockpit': Cockpit
        '%kernel.project_dir%/templates/Frontend': Frontend
        '%kernel.project_dir%/templates/Phoenix': Phoenix
        '%kernel.project_dir%/templates/SSO': SSO
    default_path: '%kernel.project_dir%/templates'
    file_name_pattern: '*.twig'

So when you write the following:

<twig:Cockpit:MatchingScheduleForm>
</twig:Cockpit:MatchingScheduleForm>

Twig gonna loop over each of your paths and try to find a components/ folder at each path, then a Cockpit directory, then a file MatchingSheduleForm.html.twig.
So the result will look like this:
templates/Cockpit/Components/Cockpit/MatchingSheduleForm.html.twig
But here your component template is located here:
templates/Components/Cockpit/MatchingScheduleForm.html.twig

tell me if this help

Stefan Melbinger · Answer 19 · Sat Apr 20 2024 02:46:48 GMT+0800 (China Standard Time)

@WebMamba thank you for the suggestion.

I made a copy of my component Twig file in the folder you suggested (red file):

Unfortunately, the same error remains:

Simon André · Answer 20 · Sat Apr 20 2024 03:01:24 GMT+0800 (China Standard Time)

It is due to our TemplateNameParser partially, and from the templateMap not using the absolute path, I think. But this may need some BC breaks

Simon André · Answer 21 · Wed Apr 24 2024 05:29:47 GMT+0800 (China Standard Time)

Hi @melbings

i reproduce easily what cause the bug.. (calling template with namespace)

Could you confirm me that your component have no problem (even in your config with namespaces and so) when they are called from a template with no namespace ?

If you render "foo.html.twig" from a controller, with this inside the template

<twig:Cockpit:MatchingScheduleForm>
    <div>Congratulations! You've won a free puppy!</div>
</twig:Cockpit:MatchingScheduleForm>

This is working right ?

Simon André · Answer 22 · Wed Apr 24 2024 05:30:42 GMT+0800 (China Standard Time)

And the first render is always working, it's only after an action/event/re-render that you have the exception ?

Simon André · Answer 23 · Wed Apr 24 2024 06:05:18 GMT+0800 (China Standard Time)

@melbings could you check #1772 and tell me if that fixes all for you ?

(i'd advice a composer cc plus a very old school rm -rf var/cache to be safe 😅 )

Stefan Melbinger · Answer 24 · Wed Apr 24 2024 20:56:12 GMT+0800 (China Standard Time)

@melbings could you check #1772 and tell me if that fixes all for you ?

You're my hero. Yes, all of the variants we discussed above work after applying the changes in #1772. Outstanding!

Simon André · Answer 25 · Thu Apr 25 2024 06:42:52 GMT+0800 (China Standard Time)

I'm sorry @melbings i made a little mistake... could you check with the new version i pushed on #1772 ? 😢

Let's hope this won't break the fix 😅

Stefan Melbinger · Answer 26 · Thu Apr 25 2024 15:12:16 GMT+0800 (China Standard Time)

I'm sorry @melbings i made a little mistake... could you check with the new version i pushed on #1772 ? 😢

Let's hope this won't break the fix 😅

Still works like a charm.

Simon André · Answer 27 · Thu Apr 25 2024 15:17:10 GMT+0800 (China Standard Time)

Great!! You make my day \o/