vendredi 7 août 2020

Laravel Dusk - NoSuchElementException: no such element: Unable to locate element

I'm trying to test my login form with dusk. On the frontend I use vue component. When I try to access the email input and to set value, I receive the error:

1) Tests\Browser\LoginTest::testExample
Facebook\WebDriver\Exception\NoSuchElementException: no such element: Unable to locate element: {"method":"css selector","selector":"body [dusk="login-email"]"}
  (Session info: headless chrome=84.0.4147.105)

Login form:

<form @submit.prevent="submitForm" class="q-mt-lg">
        <div class="col q-mb-md">
          <q-input
            v-model="formData.email"
            outlined
            type="email"
            dusk="login-email"
            class="col"
            data-email
            label="Email"
            ref="email"
            stack-label
            :rules="[ val => validateEmail(val) || 'Please enter a valid email address']"
            lazy-rules />
        </div>
        <div class="col q-mb-md">
          <q-input
            v-model="formData.password"
            type="password"
            dusk="login-password"
            outlined
            class="col"
            label="Password"
            ref="password"
            stack-label
            :rules="[ val => val.length >= 8 || 'Password must be at least 8 characters']"
            lazy-rules />
        </div>
        <div class="row">
            <q-btn
            type="submit"
            dusk="login-btn"
            name="login"
            class="login"
            color="primary"
            label="Login" />
        </div>
    </form>

My test:

<?php

namespace Tests\Browser;

use Illuminate\Foundation\Testing\DatabaseMigrations;
use Laravel\Dusk\Browser;
use Tests\DuskTestCase;
use App\User;

class LoginTest extends DuskTestCase
{
    /**
     * A Dusk test example.
     *
     * @return void
     */
    public function testExample()
    {
        $this->browse(function ($browser) {
            $browser->visit('/login')
                    ->type('@login-email', 'test@test.com')
                    ->type('@login-password', '12345678')
                    ->press('@login-btn')
                    ->assertPathIs('/');
        });
    }
}

My project works on http://localhost:3002

In .env file - APP_URL=http://localhost

In DuskTestCase.php

protected function driver()
    {
        $options = (new ChromeOptions)->addArguments([
            '--disable-gpu',
            '--headless',
            '--window-size=1920,1080',
            '--no-sandbox'
        ]);

        return RemoteWebDriver::create(
            'http://localhost:9515', DesiredCapabilities::chrome()->setCapability(
                ChromeOptions::CAPABILITY, $options
            )
        );
    }

If I change the APP_URL to http://localhost:3002 the error is the same. Can you help me with this issue? Thanks!

Aucun commentaire:

Enregistrer un commentaire