Anguar 7 использовал NGRX и проблему с тестом e2e с протектором - PullRequest
0 голосов
/ 04 апреля 2019

У меня есть проблемы с моим приложением ..

office.components.html

<div class="form-group" [class.text-danger]="form.name?.invalid && (form.name?.dirty || form.name?.touched)">
   <label for="name">OFFICE</label>
   <input name="name" type="text" class="form-control input-lg" value="" formControlName="name"
     [class.border-danger]="form.name?.invalid && (form.name?.dirty || form.name?.touched)" required />
   <div *ngIf="form.name?.errors && (form.name?.dirty || form.name?.touched)">
     <div [hidden]="!form.name?.errors.required">Office required</div>
     <div [hidden]="!form.name?.errors.minlength">Office is too short</div>
     <div [hidden]="!form.name?.errors.maxlength">Office is too long</div>
   </div>
 </div>

office.components.ts

officeForm = this.formBuilder.group({
    name: ['', [Validators.required, Validators.minLength(3), Validators.maxLength(250)]],
});


ngOnInit() {
    this.store.dispatch(new FetchOffice());
    this.officeSubscription = this.store.select('office').subscribe((officeState: OfficeState) => {
        this.officeForm.patchValue(officeState);
    });
}

office.e2e-spec.ts

it('check error message for required input', () => {
    const formNameElement = element(by.name('name'));
    formNameElement.clear();
    formNameElement.sendKeys(protractor.Key.TAB);
    const formNameElementParent = formNameElement.element(by.xpath('..'));
    const formNameElementError = formNameElementParent.element(by.xpath('div/div[1]'));
    expect(formNameElementError.getText()).toEqual('Office required');
});

ошибка Сбой: элемент не найден с помощью локатора: By (xpath, div / div [1])

но приведенный ниже тест работает

it('check error message for required input', () => {
    const formNameElement = element(by.name('name'));
    formNameElement.clear();
    formNameElement.sendKeys('1');
    formNameElement.sendKeys(protractor.Key.TAB);
    const formNameElementParent = formNameElement.element(by.xpath('..'));
    const formNameElementError = formNameElementParent.element(by.xpath('div/div[2]'));
    expect(formNameElementError.getText()).toEqual('Office is too short');
});

когда я удаляю

this.officeForm.patchValue(officeState);

все тестовые работы

Ответы [ 2 ]

0 голосов
/ 05 апреля 2019

Я нашел решение.Мне пришлось заменить:

formNameElement.clear();
formNameElement.sendKeys(protractor.Key.TAB);

на

formNameElement.clear();
formNameElement.sendKeys('1');
formNameElement.sendKeys(protractor.Key.BACK_SPACE);
formNameElement.sendKeys(protractor.Key.TAB);
0 голосов
/ 04 апреля 2019

При объединении в цепочку локаторов xpath вам необходимо добавить префикс к локатору с синтаксисом ./ или .//. Это указывает на то, что вы хотите найти элемент, относящийся к тому, на который вы цепляетесь.

Похоже, что весь ваш код можно упростить, используя оси xpath для идентификации этих относительных элементов.

Например, вместо вас оригинал

const formNameElement = element(by.name('name'));
const formNameElementParent = formNameElement.element(by.xpath('..'));
const formNameElementError = formNameElementParent.element(by.xpath('div/div[2]'));

Вы можете достичь того же, используя родительские оси (обновлено с помощью следующего брата)

const formNameElement = element(by.name('name'));
const formNameElementError = element(by.xpath('//[@name="name]/following-sibling::div[1]'));
...