Laravel 8 Dusk: testing login using Jetstream and Inertia JS is not working

Question

I am working on a Laravel 8 project. I have noticed that a couple of things have changed in the Laravel 8 including authentication. I am using Jetstream and Intertia JS for authentication and admin panel. I am now having trouble writing Browser test using Dusk for login. It seems to be that the login is not working in the test even though it is actually working.

This is my test

function test userCanLogin()
{
   $this->browse(function (Browser $browser) {
            $admin = User::factory()->create();//I make sure that the password is Test.1234 and I can login on the browser.
  
            $browser->visit('/login')->type('email', $admin->email)
                ->type('password', 'Test.1234')
                ->press('Login')
                ->assertAuthenticatedAs($admin);
        });
}

When I run the test, I am getting the following error.

The currently authenticated user is not who was expected.
Failed asserting that two arrays are identical.
--- Expected
+++ Actual
@@ @@
-Array &0 (
-    'id' => 1
-    'className' => 'App\Models\User'
-)
+Array &0 ()

What is wrong with my code and how can I fix it?

Answer 1

I'm not 100% sure but I think by default Dusk waits for a page refresh before doing asserts. Since Inertia is loading via JS you need to either explicitly pause() or waitFor() some element that would indicate that the page has been loaded. (See Dusk docs on waiting)

There's also this library that adds events to Inertia.js that you can listen for in Dusk