Playright loop while condition is met in addition to that keep clicking on refresh button every 10 seconds until locator found

Question

I am waiting for a text within a locator that only displays itself after a few minutes but the page won't reload on its own to show it - we have a standard refresh button that needs to be clicked occasionally. There are 3 stages of the text that dynamically change. Stage 1 = 'Pending', Stage 2 = 'Running', Stage 3 = 'Completed'. Of course, if the text turns into 'Failed', it should fail the whole test. Any ideas?

Answer 1

Using expect.toPass() to retry until it pass:

test('Expect completed', async ({ page }) => {
  await expect(async () => {
    await page.getByRole('button', { name: 'refresh' }).click()
    await expect(page.getByText('Completed')).toBeVisible()
  }).toPass({ intervals: [30_000, 60_000, 90_000, 120_000] })
  // Retries every half minute for 2 minutes
})

EDIT: A second approach that sets the timeout of the test to 15 minutes and retrying every 10 second using a promise with timeout:

test("Expect completed 2", async ({ page }) => {
  test.setTimeout(15 * 60 * 1_000); // 15 minutes
  while (await page.getByText("Completed").isHidden()) {
    await Promise.all([
      page.getByRole("heading", { name: "refresh" }).click(),
      new Promise((resolve) => setTimeout(resolve, 10_000)),
    ]);
  }
  // If test exits the loop, it will pass. If not it will fail cause of the test timeout
});