Требовать помощи в идентификации элемента в testcafe

Я новичок в автоматизации тестирования и программирования. Я использую testcafe в одном из своих проектов для автоматизации функционального тестирования.

На одной из веб-страниц есть поле, которое принимает только числовые значения и выдает сообщение об ошибке, если вводятся какие-либо буквенно-цифровые значения.

В рамках проверки мне нужно записать это сообщение об ошибке.

Проблема, с которой я столкнулся, заключается в том, что я не могу определить, какой элемент находится в DOM.

Например, для этого можно использовать имя пользователя Gmail и сообщение об ошибке, которое мы получаем, когда пытаемся ввести недопустимое сообщение пользователя.

Так выглядит DOM для поля

<div class="flex-content space-100 space-large-reset ">
<label for="uid">Unique ID Number</label>
<input type="password" id="uid" maxlength="9" value="123js" class="abyss-textinput abyss-form-invalid">
<div class="abyss-error-message">Please enter a valid Unique ID Number.</div></div>

Value = "123js" - это неправильное значение, которое я ввел, что привело к появлению сообщения об ошибке, упомянутого в следующей строке.

Заранее спасибо.


person user3389310    schedule 03.09.2018    source источник
comment
Обычно полезно дать немного больше контекста. Как выглядит тест, как выглядит целевая DOM   -  person Iain_b    schedule 03.09.2018
comment
Добавлены подробности, посмотрите пожалуйста.   -  person user3389310    schedule 03.09.2018


Ответы (3)


Во-первых, признаюсь, я не авторитет в тест-кафе, просто учусь сам.

При этом у меня есть утверждения, которые работают следующим образом:

await t.expect(Selector('h2').withText('Some text').exists).ok();

В вашем случае, если нет идентификатора / класса, который вы можете использовать для сужения поиска, он может быть довольно неэффективным (в вашем приложении, вероятно, много div / промежутков). Не могли бы вы предоставить некоторую информацию о домене, используемом для отображения ошибок?

person Iain_b    schedule 03.09.2018

Как сказал @Iain_b, вы можете использовать Selector и утверждение ok () проверить наличие сообщения об ошибке. Для выберите тег ошибки <div>. Однако элемент может быть вставлен в дерево DOM после сбоя проверки или находиться там с момента загрузки страницы и просто стать видимым после сбоя проверки.

Итак, для первого случая вы должны использовать что-то вроде:

await t.expect(Selector('#uid + .abyss-error-message').withText('Please enter a valid Unique ID Number').exists).notOk();

await t.typeText('#uid', '@$dfgh');

await t.expect(Selector('#uid + .abyss-error-message').withText('Please enter a valid Unique ID Number').exists).notOk();

а для второго:

await t.expect(Selector('#uid + .abyss-error-message').withText('Please enter a valid Unique ID Number').visible).notOk();

await t.typeText('#uid', '@$dfgh');

await t.expect(Selector('#uid + .abyss-error-message').withText('Please enter a valid Unique ID Number').visible).notOk();
person Andrey Belym    schedule 04.09.2018
comment
Спасибо за ответ. Я пробовал делать оба способа, но получил ReferenceError: Selector не определен - person user3389310; 04.09.2018
comment
Я снова заглянул в свой код ... он выдавал сообщение об ошибке «Селектор не определен», потому что я не импортировал селектор. Я добавил импорт {Selector, t} из testcafe; code и снова выполнили код. Сообщение об ошибке по-прежнему невозможно определить. - person user3389310; 04.09.2018

Спасибо за помощь, ребята..

Мне удалось найти элемент, используя указанное ниже условие

Selector ('.abyss-error-message').withText('Please enter a valid UID')
person user3389310    schedule 08.09.2018