Laravel Dusk: Элемент не активен в точке (x, y). Другой элемент получит клик

Question

Я пытаюсь установить флажок с laravel Dusk который содержит другие интерактивные ссылки, такие как Terms of Service а также Privacy Policy

Когда я пытаюсь установить этот флажок в моем тесте, я получаю следующую ошибку

Element is not clickable at point (466, 438). Other element would receive the click: <label class="mt-checkbox mt-checkbox-outline">...</label>

Это то, что я пытаюсь сделать

public function testRegister()
{
    $template = factory(User::class)->make();

    $this->browse(function (Browser $browser) use ($template) {
        $browser
            ->visit(new Register)
            ->type('name', $template->name->full)
            ->type('phone', $template->phone)
            ->type('email', strtoupper($template->email))
            ->type('password', 'dummy-pass')
            ->check('agree')
            ->press('Create Account')
            ->assertRouteIs('dashboard')
            ->assertAuthenticated();
    });

    $this->assertDatabaseHas('users', [
        'email' => $template->email,
    ]);
}

Я пытался развернуть и прокрутить браузер, используя

$browser->maximize();
$browser->driver->executeScript('window.scrollTo(0, 400);');

Помимо использования check метод, который я пытался использовать click метод с кнопкой выбора, а также, как

$browser->click('input#button-selector');

Я не нахожу способ решить эту проблему. Есть ли способ исправить эту проблему? Я что-то пропустил?

Answer 1

Я получил это исправить с помощью outer label селектор вместо названия флажка. Например, для моей проблемы это то, что я сделал с моим тестовым примером.

public function testRegister()
{
    $template = factory(User::class)->make();

    $this->browse(function (Browser $browser) use ($template) {
        $browser
            ->visit(new Register)
            ->type('name', $template->name->full)
            ->type('phone', $template->phone)
            ->type('email', strtoupper($template->email))
            ->type('password', 'dummy-pass')
            ->check('@agree')
            ->press('Create Account')
            ->assertRouteIs('dashboard')
            ->assertAuthenticated();
    });

    $this->assertDatabaseHas('users', [
        'email' => $template->email,
    ]);
}

И по моему Register страница, у меня есть agree селектор зарегистрирован в elements метод следующим образом

public function elements()
{
    return [
        '@agree' => 'label.mt-checkbox',
    ];
}

Это действительно решило мою проблему с помощью внешнего селектора меток флажка. Я надеюсь, что это поможет кому-то в будущем.

Answer 2

В моей ситуации это не сработало, потому что у меня было два модальных окна с одинаковыми элементами.