Playwrightで複数いずれかの条件待ちたいとき

Playwrightで外部のサービスを扱ったり、表示されるページが一定で無い場合など、「AかBいずれかの条件が整ってたら次に進めたい」というようなことがまれにある。

このような場合はPromise.anyを使うと解消できる。

await Promise.any([
  page.waitForSelector('.some-element'),
  page.waitForSelector('#some-another-element')
  page.waitForTimeout(500)
])

それぞれPromiseではあるので、Promise.anyでいずれかが達成すればOKとすれば良い。

これでまず目的は達成できた。

ただ、テストは成功するが失敗した方のwaitForXXXについてエラーログには出てしまう

=========================== logs ===========================
waiting for locator('.some-element') to be visible
============================================================

エラーを潰したいとき

もしエラーが気になるなら、waitForFunctionなどで独自に実装するしかない

await page.waitForFunction(async () => {
  if (document.querySelector('.some-element')) {
    return true
  }
  if (document.querySelector('#some-another-element')) {
    return true
  }
  return false
})

ちなみにpuppeteerであればAbortControllerがwaitForSelectorなどで利用できるらしいのだが、残念ながらPlaywrightにはまだ実装されていない。