Method waitForElementByCss

test/lib/browsers/playwright.ts:526–563

(selector: string, opts: number | ElementByCssOpts = {})

  }

  waitForElementByCss(selector: string, opts: number | ElementByCssOpts = {}) {
    const {
      timeout = 10_000,
      waitUntil = 'load', // TODO: we should get rid of this and fix the tests that implicitly rely on it
      // Selected elements may be in a completed boundary that React hasn't revealed yet.
      // We almost always want to wait for the reveal.
      // This matches Playwright's default behavior.
      // We don't care about visibility of metadata tags.
      // Can hopefully be dropped if https://github.com/microsoft/playwright/pull/37265 is accepted
      state = selector.startsWith('base') ||
      selector.startsWith('link') ||
      selector.startsWith('meta') ||
      selector.startsWith('script') ||
      selector.startsWith('source') ||
      selector.startsWith('style') ||
      selector.startsWith('title')
        ? 'attached'
        : 'visible',
    } = typeof opts === 'number' ? { timeout: opts } : opts

    return this.startChain(async () => {
      const el = await page.waitForSelector(selector, {
        timeout,
        state,
      })
      if (waitUntil !== false) {
        // it seems selenium waits longer and tests rely on this behavior
        // so we wait for the load event fire before returning
        await page.waitForLoadState(waitUntil)
      }
      return this.wrapElement(
        // Playwright has `null` as a possible return type in case `state` is `detached`,
        // but we don't allow passing that here, so we can assume it's non-null
        el!,
        selector
      )
    })
  }

  waitForCondition(snippet: string, timeout?: number) {
    return this.startOrPreserveChain(async () => {