It can be useful to insert a long pause at certain points to give the browser time to do something. Try this function:
function waitFor(timeToWait) {
return new Promise(resolve => {
setTimeout(() => { resolve(true); }, timeToWait);
});
};
This is how we implement the equivalent of a sleep function using Promises. Using setTimeOut this way, along with a timeout value, simply causes a delay for the given number of milliseconds.
To use this function, simply insert this into the test scenarios:
await waitFor(3000);
A variant on this is to wait for things to fully render in the browser. For example, you might have seen a pause before the Home icon in the upper-left corner fully renders. That pause can cause spurious errors, and this function can wait until that button fully renders itself:
async function waitForBtnGoHome() {
return page.waitForSelector('#btnGoHome');
}
To use it:
await waitForBtnGoHome();
If you don't want to maintain this extra function, it's easy enough to add the waitForSelector call into your test cases instead.