Fast Fail in Playwright Specs

Published on

Been using Playwright for a while now. I still miss some aspects of Cypress which was my go-to end to end testing tool in the past, but Playwright has been a good tool! I highly recommend it!

I can tell it’s failed but I still have to wait…

We have a couple of specs that end up being a pretty long chain of steps in a process, and at the end there are many small reasons the final submission can go wrong that don’t tend to be very catchable along the way. This isn’t a problem per se, some integration tests are just going to be this way, but this sort of spec gets a little tedious when factoring in multiple browsers, retrys, various iterations of the spec to account for alternative workflows or edges, and all that gets amplified even more if you need to include things like test.slow()!

If you get to the end of the test, and have to wait and wait for a “yay all good” but there is a clear, “not good” message you can find immediately instead it, feels a little silly to wait for the default timeout to happen before failing.

OR()

It’s not covered in most guides I have seen that Playwright has a conditional selector that enables a fail fast scenario. Caveats: Conditional branches in a test are something to be utilized with caution. This seems like it could definitely be abused.

or -> fail.


await page.getByRole("button", { name: "Submit Survey" }).click();

// if some incomplete survey data there's a modal with more info & btn, 
// if that is detected can exit early / fail fast instead of playwright
// doing its long default waiting for a element we know will never appear

const incompleteBtnLocator = page.getByRole("button", { name: "Go to incomplete section" });
const successMsgLocator = page.getByText("Survey successfully submitted.");

await expect(successMsgLocator.or(incompleteBtnLocator)).toBeAttached();
if (await incompleteBtnLocator.isVisible()) {
  test.fail();
}

await page.waitForURL("**/survey/complete*", { waitUntil: "domcontentloaded" });

Fast fail benefits

Real world difference on this particular test suite finishing in 4 min on pass and taking 12 min for a fail case. But, with this fail fast approach, failures also finish closer to 4 min. Shorten that feedback loop, lower those CI costs. Win win.