Как проверить несколько сообщений об ошибках на странице, имеющей один и тот же локатор? - PullRequest
Новая
       20

Как проверить несколько сообщений об ошибках на странице, имеющей один и тот же локатор?

0 голосов
/ 26 марта 2019

Для приложения, разработанного в angularjs, я проверяю сообщение проверки на странице. Но все сообщения имеют одинаковый идентификатор. Итак, как мы можем проверить каждое сообщение на странице. Я использую селен, транспортир с C #. 

<div _ngcontent-c3="" class="form-row" xpath="1">
    <div _ngcontent-c3="" class="form-group col-md-4">
        <label _ngcontent-c3="" for="firstName">First Name</label>
        <span _ngcontent-c3="" style="color:red;"> *</span>
        <input _ngcontent-c3="" class="form-control ng-untouched ng-pristine ng-invalid" formcontrolname="firstName" placeholder="First Name" type="text">
        <!---->
        <div _ngcontent-c3="" style="color: red;font-weight: bold">
            <!---->
            <div _ngcontent-c3="">First Name is required</div>
        </div>
    </div>
    <div _ngcontent-c3="" class="form-group col-md-4">
        <label _ngcontent-c3="" for="lastName">Last Name</label>
        <span _ngcontent-c3="" style="color:red;"> *</span>
        <input _ngcontent-c3="" class="form-control ng-untouched ng-pristine ng-invalid" formcontrolname="lastName" placeholder="Last Name" type="text">
        <!---->
        <div _ngcontent-c3="" style="color: red;font-weight: bold">
            <!---->
            <div _ngcontent-c3="">Last Name is required</div>
        </div>
    </div>
    <div _ngcontent-c3="" class="form-group col-md-4">
        <label _ngcontent-c3="" for="lastName">Date of Birth</label>
        <input _ngcontent-c3="" bsdatepicker="" class="form-control ng-untouched ng-pristine ng-valid" formcontrolname="dob" placeholder="Date of Birth" type="text">
    </div>
</div>

Ответы [ 4 ]

1 голос
/ 26 марта 2019

Самый надежный способ найти эти элементы - это проверить текстовое содержимое тега и использовать для этого некоторую форму xpath axes .Оси позволяют вам легче находить элементы, относящиеся к другому элементу.

Используя транспортир с xpath, вы можете использовать: 

element(by.xpath('//input[@class="form-control ng-untouched ng-pristine ng-invalid"]/following::div[text()="First Name is required"]'));

element(by.xpath('//input[@class="form-control ng-untouched ng-pristine ng-invalid"]/parent::div//div[text()="First Name is required"]'));

Обновление с другим подходом без использования осей: 

element(by.xpath('//div[@style="color: red;font-weight: bold"]/div[text()="First Name is required"]'));
0 голосов
/ 26 марта 2019

Я бы получил сообщение проверки относительно каждого INPUT. 

//input[@formcontrolname='firstName']//following::div[1]/div
^ starts with the firstName INPUT
                                     ^ finds the first DIV that follows
                                                        ^ and finds the child DIV

Это находит DIV, который содержит сообщение «Имя необходимо», поэтому вы можете утверждать, что эти две строки равны.

Подобный локатор для второго сообщения, единственное, что меняется, это formcontrolname. 

//input[@formcontrolname='lastName']//following::div[1]/div
0 голосов
/ 26 марта 2019

В вашей ситуации единственное решение, которое может сработать, это: 

const firstNameError = element(by.cssContainingText('div', 'First Name is required'));
const lastNameError = element(by.cssContainingText('div', 'Last Name is required'));

// Here some code to act empty inputs

expect(firstNameError.isPresent()).toBeTruthy();
expect(lastNameError.isPresent()).toBeTruthy();

Но, честно говоря, я не рекомендовал бы использовать cssContainedText (). По своему опыту могу сказать, что он недостаточно стабилен для безопасного использования.

0 голосов
/ 26 марта 2019

Когда вы делаете запрос с тем же идентификатором, он возвращает вам массив вместо уникального элемента (один объект).Затем вы можете выбрать один элемент, например, myArray [0], myArray [1] и т. Д., И проверить ваши сообщения.

...