量角器: 点击按钮后如何等待页面完成?

在测试规范中,我需要单击网页上的一个按钮,然后等待新页面完全加载。

emailEl.sendKeys('jack');
passwordEl.sendKeys('123pwd');


btnLoginEl.click();


// ...Here need to wait for page complete... How?


ptor.waitForAngular();
expect(ptor.getCurrentUrl()).toEqual(url + 'abc#/efg');
166972 次浏览

你不用等了。量角器会自动等待角度准备好,然后在控制流中执行下一步。

取决于你想做什么,你可以尝试:

browser.waitForAngular();

或者

btnLoginEl.click().then(function() {
// do some stuff
});

解决这个承诺。如果你能在 beforeEach中这样做会更好。

注意: 我注意到 Expect ()在比较之前会等待内部的承诺(即 getCurrentUrl)得到解决。

我只是看了一下源代码-量角器只在少数情况下等待角度(比如当调用 element.all或设置/获取位置时)。

因此,量角器不会等到每次命令后 Angular 稳定下来。

而且,在我的测试中,有时候我会在角度消化周期和点击事件之间进行一场比赛,所以有时候我必须这样做:

elm.click();
browser.driver.sleep(1000);
browser.waitForAngular();

使用 sleep 等待执行进入 AngularJS 上下文(由 click事件触发)。

我通常只是向控制流添加一些内容,比如:

it('should navigate to the logfile page when attempting ' +
'to access the user login page, after logging in', function() {
userLoginPage.login(true);
userLoginPage.get();
logfilePage.expectLogfilePage();
});

LogfilePage:

function login() {
element(by.buttonText('Login')).click();


// Adding this to the control flow will ensure the resulting page is loaded before moving on
browser.getLocationAbsUrl();
}

在这种情况下,您可以使用:

页面对象:

    waitForURLContain(urlExpected: string, timeout: number) {
try {
const condition = browser.ExpectedConditions;
browser.wait(condition.urlContains(urlExpected), timeout);
} catch (e) {
console.error('URL not contain text.', e);
};
}

页面测试:

page.waitForURLContain('abc#/efg', 30000);
browser.waitForAngular();


btnLoginEl.click().then(function() { Do Something });

来履行诺言。

用这个,我觉得更好

   *isAngularSite(false);*
browser.get(crmUrl);




login.username.sendKeys(username);
login.password.sendKeys(password);
login.submit.click();


*isAngularSite(true);*

要使用 isAngularSite 的这个设置,应该把它放在 protractor.con.js 中:

        global.isAngularSite = function(flag) {
browser.ignoreSynchronization = !flag;
};

对于量角器,您可以使用以下方法

var EC = protractor.ExpectedConditions;
// Wait for new page url to contain newPageName
browser.wait(EC.urlContains('newPageName'), 10000);

所以你的代码看起来就像,

emailEl.sendKeys('jack');
passwordEl.sendKeys('123pwd');


btnLoginEl.click();


var EC = protractor.ExpectedConditions;
// Wait for new page url to contain efg
ptor.wait(EC.urlContains('efg'), 10000);


expect(ptor.getCurrentUrl()).toEqual(url + 'abc#/efg');

注意: 这可能并不意味着新页面已经完成加载,DOM 已经准备好了。后面的‘ Expect ()’语句将确保 Protracer 等待 DOM 可用以进行测试。

参考资料: 量角器预期条件

你可以这么做

emailEl.sendKeys('jack');
passwordEl.sendKeys('123pwd');


btnLoginEl.click().then(function(){
browser.wait(5000);
});

要等到点击本身完成(即解决承诺) ,使用 await关键字

it('test case 1', async () => {
await login.submit.click();
})

这将停止命令队列,直到单击(sendKeys、 sleep 或任何其他命令)结束

如果你是幸运的,你在有角度的页面,是建立良好的,没有微观和宏观任务等待然后量角器应该等待自己,直到页面准备就绪。但是有时候你需要自己处理等待,例如当通过一个非角度的页面登录时(阅读 如何找出页面是否有待完成的任务,以及如何处理非角度页面)

在手动处理等待的情况下,browser.wait是可行的方法。只需要向它传递一个函数,该函数有一个要等待的条件。例如,等待直到页面上没有加载动画

let $animation = $$('.loading');


await browser.wait(
async () => (await animation.count()) === 0, // function; if returns true it stops waiting; can wait for anything in the world if you get creative with it
5000, // timeout
`message on timeout`
);


确保使用 await