Skip to content

Syntax parsing issue in blade view components #53380

@sgurukrupa

Description

@sgurukrupa

Laravel Version

11.30

PHP Version

8.3.11

Database Driver & Version

No response

Description

When we reference a blade view component (let's say, child.blade.php) from within another blade view component (parent.blade.php), we sometimes need to pass on the attributes of the parent to the child like so:

<x-child {{ $attributes->merge(["class" => "text-white"]) }}>Hello World</x-child>.

The above syntax is flagged off as an error by the Blade engine. But in reality there's no error in the syntax. This fact can be verified by replacing the <x-child> tag with a standard HTML tag like e.g., <p> like so:

<p {{ $attributes->merge(["class" => "text-white"]) }}>Hello World</p>.

The above syntax is not flagged as an error and the Blade engine renders it. There's a workaround for getting Blade to render the usage of x-child tag as shown previously, though. The work around is to replace the double quotes with single quotes like so:

<x-child {{ $attributes->merge(['class' => 'text-white']) }}>Hello World</x-child>.

Blade happily accepts the above syntax and renders the x-child tag.

Steps To Reproduce

  1. Create a new Laravel App: laravel new app
  2. Create two new blade components (views only):

php artisan make:component --view parent

php artisan make:component --view child

  1. In the welcome.blade.php view replace the <body> tag's content with an instance of the x-parent tag:

<x-parent></x-parent>

  1. In the parent.blade.php view, create an instance of the x-child tag:
<div>
    <x-child {{ $attributes->merge(["class" => "text-white"]) }}>Hello World</x-child>
</div>
  1. In the child.blade.php view, put the following code:
<div>
     <p {{ $attributes }}>{{ $slot }}</p>
</div>
  1. Run php artisan serve and open the app's URL in a browser.

Result expected:
We must be able to see the text: "Hello World" in the browser.

Result observed:
ParseError
Unclosed '[' does not match ')'

Please see Github repo for a demo.

Metadata

Metadata

Assignees

No one assigned

    Type

    No type

    Projects

    No projects

    Milestone

    No milestone

    Relationships

    None yet

    Development

    No branches or pull requests

    Issue actions