Транспортир: тестовое состояние загрузки

Question

Я настраиваю транспортир для нашего веб-приложения, и все работает отлично, за исключением одного: когда кто-то нажимает кнопку «Войти», а HTTP-запрос запущен, кнопка должна иметь класс " загрузка». Тем не менее, когда я пытаюсь проверить это, транспортир ждет завершения HTTP-запроса до того, как он запустит ожидание, которое затем завершится неудачей, потому что класс загрузки снова удален.

Как я могу утверждать, что класс загрузки добавлен?

describe('Authorization', function() { 
    it('the site loads',() => { 
     browser.get('/'); 

     expect(browser.getCurrentUrl()).toBe('http://localhost:8000/#/login'); 

     element(by.model('vm.credentials.username')).sendKeys('username'); 
     element(by.model('vm.credentials.password')).sendKeys('password'); 

     element(by.css('#sign-in')).click(); 

     expect(element(by.css('#sign-in')).getAttribute('class')).toMatch(/\bloading\b/); 
    }); 
}); 

Answer 1

Думаю, я нашел решение.

Функция element() ожидает, что угловой параметр будет установлен, но browser.driver.findElement() - нет. Таким образом, изменяя утверждение строку

expect(browser.driver.findElement(by.css('#sign-in')).getAttribute('class')).toMatch(/\bloading\b/); 

испытания в настоящее время проходят

Answer 2

В соответствии с вашей проблемой, транспортир выполняет операцию ожидания и функцию click(). Транспортир является асинхронным и быстрым, поэтому он выполняет все, что может, а затем ждет возврата обещания/обратного вызова. Попробуйте дождаться первого щелчка, а затем попытайтесь утвердить класс. Вот как вы можете это сделать -

element(by.css('#sign-in')).click().then(function(){ 
    expect(element(by.css('#sign-in')).getAttribute('class')).toMatch(/\bloading\b/); 
}); 

Кроме того, если запрос HTTP блокирует ваше исполнение, то попробуйте подождать элемент, который будет отображаться. Если элемент отображается, то он не хуже вашего элемента.

browser.wait(protractor.ExpectedConditions.visibilityOf($('.loading')), 10000) 
.then(function(){ 
    expect(true).toBe(true); 
}); 

Надеюсь, что это поможет.