Skip to content

Commit

Permalink
minor #2517 [LiveComponent] Add Documentation for testing with LiveCo…
Browse files Browse the repository at this point in the history
…llectionType (yalit)

This PR was squashed before being merged into the 2.x branch.

Discussion
----------

[LiveComponent] Add Documentation for testing with LiveCollectionType

| Q             | A
| ------------- | ---
| Bug fix?      | no
| New feature?  | no
| Issues        | Fix #2512
| License       | MIT

As mentioned in the #2512, I had trouble testing the submission of a form containing a LiveCollectionType field due to lack of proper guidance in the documentation. Hence this pull request to propose an addendum in the documentation linked to that capability

Commits
-------

fd208f8 [LiveComponent] Add Documentation for testing with LiveCollectionType
  • Loading branch information
smnandre committed Feb 7, 2025
2 parents df6d50b + fd208f8 commit 8fdcd69
Showing 1 changed file with 51 additions and 0 deletions.
51 changes: 51 additions & 0 deletions src/LiveComponent/doc/index.rst
Original file line number Diff line number Diff line change
Expand Up @@ -3722,6 +3722,9 @@ Test Helper

The test helper was added in LiveComponents 2.11.

Interact With Live-Components
~~~~~~~~~~~~~~~~~~~~~~~~~~~~~

For testing, you can use the ``InteractsWithLiveComponents`` trait which
uses Symfony's test client to render and make requests to your components::

Expand Down Expand Up @@ -3808,6 +3811,54 @@ uses Symfony's test client to render and make requests to your components::
The ``InteractsWithLiveComponents`` trait can only be used in tests that extend
``Symfony\Bundle\FrameworkBundle\Test\KernelTestCase``.

Test LiveCollectionType
~~~~~~~~~~~~~~~~~~~~~~~

To test the submission of a form within a Live Component (with the above ``submitForm`` helper) containing a ``LiveCollectionType``, you first need to programmatically add the desired number of entries to the form, replicating the action of clicking the "Add" button.

So, if the following are the forms used::

use Symfony\UX\LiveComponent\Form\Type\LiveCollectionType;

// Parent FormType used in the Live Component
class LiveCollectionFormType extends AbstractType
{
public function buildForm(FormBuilderInterface $builder, array $options): void
{
$builder->add('children', LiveCollectionType::class, [
'entry_type' => ChildFormType::class,
])
;
}
}

// Child Form Type used for each entry in the collection
class ChildFormType extends AbstractType
{
public function buildForm(FormBuilderInterface $builder, array $options): void
{
$builder
->add('name', TextType::class)
->add('age', IntegerType::class)
;
}
}

Use the addCollectionItem method from the LiveCollectionTrait to dynamically add entries to the children field of the form before submitting it::

// Call the addCollectionItem method as many times as needed, specifying the name of the collection field.
$component->call('addCollectionItem', ['name' => 'children']);
$component->call('addCollectionItem', ['name' => 'children']);
//... can be called as many times as you need entries in your 'children' field

// ... then submit the form by providing data for all the fields in the ChildFormType for each added entry:
$component->submitForm([ 'live_collection_form' => [
'children' => [
['name' => 'childName1', 'age' => 10],
['name' => 'childName2', 'age' => 15],
]
]]);

Backward Compatibility promise
------------------------------

Expand Down

0 comments on commit 8fdcd69

Please sign in to comment.