How to test elements in a repeater?

[JHWelch]

I am trying to make sure the first element I feed into my form address repeater is marked primary. When I run the following test

$page = Livewire::test(Create::class)
    ->assertFormExists('form')
    ->assertFormSet([
        'business_addresses' => [[
            'is_primary_address' => true,
        ]]
    ]);

When I set that data in my mount(), I am getting

Failed asserting that two arrays are equal.
--- Expected
+++ Actual
@@ @@
 Array (
-    0 => Array (...)
+    'f5204905-4fa5-4842-bd77-2c4874917587' => Array (...)
 )

because of the UUID indexes that are added.

Is there a built in way to assert items in a repeater?

[danharrin]

Good question. I don't have an answer. What can we add to the core to help this? Maybe submit a PR

[Roboroads]

Because with uuid's it's not confusing? :P

Or, the keys don't change - and expect that:

on mount (selector, value):

repeater.index0 "A"
repeater.index1 "B"
repeater.index2 "C"
repeater.index3 "D"

After moving 0 between 1 and 2:

repeater.index1 "B"
repeater.index0 "A"
repeater.index2 "C"
repeater.index3 "D"

I mean, that is what I expect when moving in the same "session". After saving, the keys get reset to chronological order with the new order:

repeater.index0 "B"
repeater.index1 "A"
repeater.index2 "C"
repeater.index3 "D"

Just spitting ideas here, feel free to tell me why things won't work x)

[JHWelch]

Yeah personally I think I would expect the array keys to reset when things are reordered, but I understand why that might be more difficult in how to maintain the state.

However as long as the keys are UUIDs, I both of the solution paths that are coming to mind are not particularly intuitive

Feels like you'd either need a assertRepeaterSet or some sort of object that you'd use with the assertFormSet

$page = Livewire::test(Create::class)
    ->assertRepeaterSet('business_addresses', [[
          'is_primary_address' => true,
      ]]);

$page = Livewire::test(Create::class)
    ->assertFormSet([
        'business_addresses' => new RepeaterValues([[
            'is_primary_address' => true,
        ]])
    ]);

[danharrin]

I think some dedicated testing helper that doesn't use the array keys is the best solution

[Roboroads]

I guess that's good. Does that also work for Dusk?

[danharrin]

We don't handle dusk helpers at the moment anyway

[Roboroads]

We are using this overridden repeater component for now, which works for unit and dusk testing.

<?php

namespace App\Filament\CustomComponents;

use Closure;
use Filament\Forms\Components\Field;
use Filament\Forms\Components\Repeater;
use function Filament\Forms\array_move_after;
use function Filament\Forms\array_move_before;

class SequencedRepeater extends Repeater
{
    protected const REPEATER_SET_KEY = 'repeater-set-';

    public function defaultItems(int|Closure $count): static
    {
        $this->default(function (SequencedRepeater $component) use ($count): array {
            $items = [];

            $count = $component->evaluate($count);

            if (!$count) {
                return $items;
            }

            foreach (range(1, $count) as $index) {
                $items[SequencedRepeater::REPEATER_SET_KEY.($index - 1)] = [];
            }

            return $items;
        });

        return $this;
    }

    protected function setUp(): void
    {
        Field::setUp();

        $this->defaultItems(1);

        $this->afterStateHydrated(function (SequencedRepeater $component, ?array $state): void {
            $items = [];

            foreach ($state ?? [] as $index => $itemData) {
                $items[SequencedRepeater::REPEATER_SET_KEY.$index] = $itemData;
            }

            $component->state($items);
        });

        $this->registerListeners([
            'repeater::createItem' => [
                function (SequencedRepeater $component, string $statePath): void {
                    if ($statePath !== $component->getStatePath()) {
                        return;
                    }

                    $livewire = $component->getLivewire();
                    $repeaterState = data_get($livewire, $statePath, []);
                    $repeaterKeys = array_keys($repeaterState);
                    $repeaterIndexes = array_map(fn($repKey) => (int) str_replace(SequencedRepeater::REPEATER_SET_KEY, '', $repKey), $repeaterKeys);
                    $newUuid = SequencedRepeater::REPEATER_SET_KEY.(max($repeaterIndexes ?: [-1]) + 1);
                    data_set($livewire, "{$statePath}.{$newUuid}", []);

                    $component->getChildComponentContainers()[$newUuid]->fill();

                    $component->collapsed(false, shouldMakeComponentCollapsible: false);
                },
            ],
            'repeater::deleteItem' => [
                function (SequencedRepeater $component, string $statePath, string $uuidToDelete): void {
                    if ($statePath !== $component->getStatePath()) {
                        return;
                    }

                    $items = $component->getState();

                    unset($items[$uuidToDelete]);

                    $livewire = $component->getLivewire();
                    data_set($livewire, $statePath, $items);
                },
            ],
            'repeater::cloneItem' => [
                function (SequencedRepeater $component, string $statePath, string $uuidToDuplicate): void {
                    if ($statePath !== $component->getStatePath()) {
                        return;
                    }

                    $livewire = $component->getLivewire();
                    $repeaterState = data_get($livewire, $statePath, []);
                    $repeaterKeys = array_keys($repeaterState);
                    $repeaterIndexes = array_map(fn($repKey) => (int) str_replace(SequencedRepeater::REPEATER_SET_KEY, '', $repKey), $repeaterKeys);
                    $newUuid = SequencedRepeater::REPEATER_SET_KEY.(max($repeaterIndexes ?: [-1]) + 1);

                    data_set(
                        $livewire,
                        "{$statePath}.{$newUuid}",
                        data_get($livewire, "{$statePath}.{$uuidToDuplicate}"),
                    );

                    $component->collapsed(false, shouldMakeComponentCollapsible: false);
                },
            ],
            'repeater::moveItemDown' => [
                function (SequencedRepeater $component, string $statePath, string $uuidToMoveDown): void {
                    if ($component->isItemMovementDisabled()) {
                        return;
                    }

                    if ($statePath !== $component->getStatePath()) {
                        return;
                    }

                    $items = array_move_after($component->getState(), $uuidToMoveDown);

                    $livewire = $component->getLivewire();
                    data_set($livewire, $statePath, $items);
                },
            ],
            'repeater::moveItemUp' => [
                function (SequencedRepeater $component, string $statePath, string $uuidToMoveUp): void {
                    if ($component->isItemMovementDisabled()) {
                        return;
                    }

                    if ($statePath !== $component->getStatePath()) {
                        return;
                    }

                    $items = array_move_before($component->getState(), $uuidToMoveUp);

                    $livewire = $component->getLivewire();
                    data_set($livewire, $statePath, $items);
                },
            ],
            'repeater::moveItems' => [
                function (SequencedRepeater $component, string $statePath, array $uuids): void {
                    if ($component->isItemMovementDisabled()) {
                        return;
                    }

                    if ($statePath !== $component->getStatePath()) {
                        return;
                    }

                    $items = array_merge(array_flip($uuids), $component->getState());

                    $livewire = $component->getLivewire();
                    data_set($livewire, $statePath, $items);
                },
            ],
        ]);

        $this->createItemButtonLabel(static function (SequencedRepeater $component) {
            return __('forms::components.repeater.buttons.create_item.label', [
                'label' => lcfirst($component->getLabel()),
            ]);
        });

        $this->mutateDehydratedStateUsing(static function (?array $state): array {
            return array_values($state ?? []);
        });
    }
}

[greenleafmedia]

For those bumping into this from Google, there looks to now be a Fake command that helps with this: https://filamentphp.com/docs/3.x/forms/fields/repeater#testing-repeaters

[JHWelch]

Amazing! Thanks for the update.