PestPHP browser test (playwright)

[edwinheij]

Someone ever tried to do a browser test?
I started with a simple 'global search', but something is not going well. This is my test:

 visit(route('your route with the powergrid'))
        ->type('[wire\:model\.live\.debounce\.700ms="search"]', $dbRecord1->title)
        ->assertDontSee($dbRecord2->title)

But the filter isn't triggered.
Anyone having thoughts on this?

The short installation for PestPHP Browser testing can be found here: https://pestphp.com/docs/pest-v4-is-here-now-with-browser-testing#content-pest-v4-is-here-now-with-browser-testing

composer require pestphp/pest-plugin-browser --dev
 
npm install playwright@latest
npx playwright install

[dansysanalyst]

Hi @edwinheij,

I added an example in the PowerGrid Demo repository for Browser Testing.

//tests/Browser/FilterFieldTest.php

$searchField = '[wire\:model\.live\.debounce\.700ms="search"]';

it('can filter by existing record')
    ->visit('/examples/actions-from-view')
    ->assertSee('Arkansas Possum Pie')
    ->fill($searchField, 'Bacalhau')
    ->assertDontSee('Arkansas Possum Pie')
    ->assertSee('Bacalhau com natas');

I have used Higher Order Testing as a personal code styling preference, but It might be relevant that I've raised the timeout, and I did not include withoutVite() in the Browser Tests, only in Feature tests.

//Pest.php

pest()->browser()->timeout(20000);

pest()->extend(TestCase::class)->in('Browser');

pest()->extend(TestCase::class)
    ->beforeEach(function () {
        $this->withoutVite();
    })
    ->in('Feature');

[dansysanalyst]

Coming to think, Vite can also be restored in a single test container.

//Pest.php

pest()
    ->in('Feature')
    ->beforeEach(fn () => $this->withoutVite());

//Feature/SomeTest.php

it('can filter by existing record')
    ->withVite() // 👈
    ->visit('/my-route')
    ->assertSee('Something cool');