Bug: TypeError: Cannot read properties of undefined (reading '0')

[marcteyssier]

Hi,

I am using symfony/ux-live-component 2.17.0. I found a bug when I use an array LiveProp in a sub component. I have the error TypeError: Cannot read properties of undefined (reading '0') .

If I call child component in my template is Ok, but if I call the parent component in my template I have the error.

To reproduce : Component Index.php

<?php
namespace App\Component;

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

#[AsLiveComponent]
final class Index
{
    use DefaultActionTrait;
}

Component Index.html.twig

<div{{ attributes }}>
    <twig:Child/>
</div>

Component Child.php

<?php
namespace App\Component;

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

#[AsLiveComponent]
final class Child
{
    use DefaultActionTrait;

    #[LiveProp(writable: true)]
    public array $list = [];

    public function mount() {
        $this->list[] = ['comment' => 'test'];
    }
}

Component Child.html.twig

<div{{ attributes }}>
    <input data-model="list[0].comment"/>
</div>

The fully error is: TypeError: Cannot read properties of undefined (reading '0') at parseDeepData (live_controller.js:400:44) at getDeepData (live_controller.js:389:44) at ValueStore.get (live_controller.js:430:16) at ValueStore.has (live_controller.js:433:21) at live_controller.js:2707:38 at NodeList.forEach () at SetValueOntoModelFieldsPlugin.synchronizeValueOfModelFields (live_controller.js:2689:60) at SetValueOntoModelFieldsPlugin.attachToComponent (live_controller.js:2683:14) at Component.addPlugin (live_controller.js:1931:16) at live_controller.js:3109:28

Regards Marc