Laravel Используя Dusk </button> is not clickable at point ошибка

mstdmstd · 9 Мар 2018

Всем привет,

В Laravel 5.5.35 делаю тесты:

PHP:

$this->browse(function ($first, $second) {
$first->loginAs(User::find(5))
->visit('/admin/dashboard#/admin/user_chat_run/1')
->waitFor('.chat-composer',2);


$second->loginAs(User::find(6))
->visit('/admin/dashboard#/admin/user_chat_run/1')
->waitFor('.chat-composer',2)
->type('#new_user_chat_new_message', 'Hey Taylor') // input / textarea where text would be entered
->press('Send'); // Send - text of button ?
// ->press('#btn_new_message_send'); // btn_new_message_send - id of button ?

$first->waitForText('Hey Taylor')
->assertSee('Jeffrey Way');
});

И получаю ошибку в консоле :

Код:

1) Tests\Browser\ExampleTest::testBasicExample
Facebook\WebDriver\Exception\UnknownServerException: unknown error: Element <button id="btn_new_message_send" name="btn_new_message_send" class="btn btn-primary">...</button> is not clickable at point (702, 517). Other element would receive the click: <div class="phpdebugbar-header phpdebugbar-mini-design">...</div>
(Session info: headless chrome=64.0.3282.186)
(Driver info: chromedriver=2.33.506092 (733a02544d189eeb751fe0d7ddca79a0ee28cce4),platform=Linux 4.13.0-36-generic x86_64)

Как раз с указанием на строку

PHP:

->press('Send');

И кнопка есть
https://imgur.com/a/ZQ65p

Что-то не настроено с браузером по умолчанию ?

Спасибо!

флоппик · 9 Мар 2018

Попробуй прочесть текст ошибки до конца.

mstdmstd · 9 Мар 2018

Читал Полностью сообщение :

Код:

$ php artisan dusk
PHPUnit 6.5.7 by Sebastian Bergmann and contributors.

E                                                                   1 / 1 (100%)

Time: 4.68 seconds, Memory: 16.00MB

There was 1 error:

1) Tests\Browser\ExampleTest::testBasicExample
Facebook\WebDriver\Exception\UnknownServerException: unknown error: Element <button id="btn_new_message_send" name="btn_new_message_send" class="btn btn-primary">...</button> is not clickable at point (702, 517)
. Other element would receive the click: <div class="phpdebugbar-header phpdebugbar-mini-design">...</div>
 (Session info: headless chrome=64.0.3282.186)
 (Driver info: chromedriver=2.33.506092 (733a02544d189eeb751fe0d7ddca79a0ee28cce4),platform=Linux 4.13.0-36-generic x86_64)

/mnt/_work_sdb8/wwwroot/lar/tasks/vendor/facebook/webdriver/lib/Exception/WebDriverException.php:114
/mnt/_work_sdb8/wwwroot/lar/tasks/vendor/facebook/webdriver/lib/Remote/HttpCommandExecutor.php:320
/mnt/_work_sdb8/wwwroot/lar/tasks/vendor/facebook/webdriver/lib/Remote/RemoteWebDriver.php:535
/mnt/_work_sdb8/wwwroot/lar/tasks/vendor/facebook/webdriver/lib/Remote/RemoteExecuteMethod.php:40
/mnt/_work_sdb8/wwwroot/lar/tasks/vendor/facebook/webdriver/lib/Remote/RemoteWebElement.php:81
/mnt/_work_sdb8/wwwroot/lar/tasks/vendor/laravel/dusk/src/Concerns/InteractsWithElements.php:304
/mnt/_work_sdb8/wwwroot/lar/tasks/tests/Browser/ExampleTest.php:37
/mnt/_work_sdb8/wwwroot/lar/tasks/vendor/laravel/dusk/src/Concerns/ProvidesBrowser.php:67
/mnt/_work_sdb8/wwwroot/lar/tasks/tests/Browser/ExampleTest.php:41

ERRORS!
Tests: 1, Assertions: 0, Errors: 1.

Ключа в чем проблема и как это исправить не нашел ...
не подскажите?

fixxxer · 9 Мар 2018

Могу предположить, что кнопка изначально disabled, и активируется javascript-ом после заполнения полей. На этот случай в драйверах есть конструкции вида waitUntil(elementToBeClickable(...)), как конкретно это сделать - надо смотреть документацию по используемому драйверу. В крайнем случае можно тупо воткнуть костыль типа wait(0.1).

Второй вариант - сверстано через зад и кнопка действительно не кликабельна по указанным в тексте ошибки координатам (скажем, из-за zIndex).

mstdmstd · 9 Мар 2018

disabled/readonly/zindex/display в коде не испрользуется
Это вложенный vuejs 2.5 компонент с кодом :

HTML:

<div v-if="status_of_chat=='A'">

<fieldset>
<legend><h4>Send message/Upload file:</h4></legend>

<div class="input_with_btn_at_right chat-composer">
<textarea placeholder="Start typing your message..." v-model="user_chat_new_message" class="form-control" id="new_user_chat_new_message" name="new_user_chat_new_message" rows="3"
></textarea>
<button id="btn_new_message_send" name="btn_new_message_send" class="btn btn-primary" @click="sendNewMessage">Send</button>
</div>

Может ли проблема быть из-за условия в 1ом диве ?
Для чата с id # 1(этот код в урле) это условие выполняется.
При выполнении этого теста генерируется 2 принтскрина и на первом введенным текст отображается (whisper при вводе текста другим юзером).
То есть страница с указанным чатом открывается нормально.

mstdmstd · 9 Мар 2018

А вообще Dusk с vuejs 2 дружат ? Или там какие-то нюансы ?

fixxxer · 9 Мар 2018

Ну значит второй вариант.
Посмотри, что у тебя по координатам at point (702, 517)

mstdmstd · 9 Мар 2018

Спасибо за наводку,

Похоже мешала панель с отладкой и установив

Код:

APP_DEBUG=false

кнопка кликается

1) Но при просмотре принтскринов обращает внимание что принтскрины 800*600 что значительно меньше
моего монитора Это где-то настраивается ?

2) Строки в базу добавляются Как лучше тестировать ? Отдельную бд для тестирования?
Это где такая настройка ?

флоппик · 9 Мар 2018

Там большими буквами по белому написано было:

Other element would receive the click: <div class="phpdebugbar-header phpdebugbar-mini-design">...</div>

fixxxer · 9 Мар 2018

mstdmstd написал(а):
Но при просмотре принтскринов обращает внимание что принтскрины 800*600 что значительно меньше
моего монитора Это где-то настраивается ?

Где-то настраивается.

mstdmstd написал(а):
Как лучше тестировать ?

На CI-сервере.

mstdmstd · 10 Мар 2018

Спасибо за помощь но еще оне все получается В небольшом коде проверки

PHP:

$this->browse(function (Browser $browser) {
$browser->resize(1920, 1080); // Width and Height
$new_document_category= 'new document category created at ' . time();
$browser->loginAs(User::find(5))
->visit('/admin/dashboard#/admin/document_categories/edit/new')
->type('#name', $new_document_category) // Поле заполняется ->type , но НЕ заполняется если ->value
->select('#type', 'D')
->value('#document_category_content', $new_document_category .' content lorem...')
->click('.editor_button_submit')
->assertTitleContains('Tasks/Chats/Events')
->assertPathIs('/admin/dashboard#/admin/document_categories');
});
return;

1) Не работает если для поля '#name' написать ->value. Просветите разницу между “->value” и “->type”
Я полагал что “->value” это что-то вроде значения поля по умолчанию и оно должно быть заполнено при открытии формы. Но видимо нет ?

2) Это Vuejs 2.5 прилдожение с настройкой рутов:

Код:

const routes = [
{
path: '/',
...
{path: '/admin/document_categories', component: DocumentCategoriesIndex, name: 'documentCategoriesIndex'},
{path: '/admin/document_categories/edit/:id', component: DocumentCategoryEdit, name: 'editDocumentCategory'},
...
]

const router = new VueRouter( {
mode: 'hash', // default
routes
})

И при открытии формы для создания открывается урл :
http://local-tasks.com/admin/dashboard#/admin/document_categories/edit/new

И при сохранении переходит на
http://local-tasks.com/admin/dashboard#/admin/document_categories

И на последний assertPathIs получаю ошибку :

Код:

Tests\Browser\ExampleTest::testBasicExample
Failed asserting that '/admin/dashboard' matches PCRE pattern "/^\/admin\/dashboard#\/admin\/document_categories$/u".

Почему и как ее исправить ?

3) При выполнении команды
php artisan dusk
выполняются все тесты в tests/Browser/ подкаталоге
А как запустить один или несколь ко тестов(но не все) ?

Спасибо !

Laravel Используя Dusk </button> is not clickable at point ошибка

mstdmstd

Новичок

флоппик

promotor fidei

mstdmstd

Новичок

fixxxer

К.О.

mstdmstd

Новичок

mstdmstd

Новичок

fixxxer

К.О.

mstdmstd

Новичок

флоппик

promotor fidei

fixxxer

К.О.

mstdmstd

Новичок