Stuck on an issue?

Lightrun Answers was designed to reduce the constant googling that comes with debugging 3rd party libraries. It collects links to all the places you might be looking at while hunting down a tough bug.

And, if you’re still stuck at the end, we’re happy to hop on a call to see how we can help out.

Can't retrieve IFrame in {headless: false} mode

See original GitHub issue

Steps to reproduce

Take prepared repository https://github.com/pahan35/puppeteer-stripe-iframe-detection-bug
Install packages npm i
Run npm start

Tell us about your environment:

Puppeteer version: 1.20.0
Platform / OS version: MacOS Mojave 10.14.6
URLs (if applicable): https://stripe-payments-demo.appspot.com
Node.js version: 12.10.0

What steps will reproduce the problem?

const puppeteer = require('puppeteer')
const {Events} = require('puppeteer/lib/Events')

;(async () => {
  const browser = await puppeteer.launch({
    headless: false,
  })

  const page = await browser.newPage()

  const waitForFrame = async name => {
    const frames = new Set()
    return new Promise((resolve, reject) => {
      const wait = setTimeout(() => {
        reject(
          Error(
            `Timeout while waiting for frame "${name}", have: ${JSON.stringify(
              [...frames],
            )}`,
          ),
        )
      }, 10000)

      function checkFrame() {
        const frame = page.frames().find(f => {
          const fname = f.name()
          frames.add(fname)
          return fname.includes(name)
        })
        if (frame) {
          clearTimeout(wait)
          resolve(frame)
        } else {
          page.once(Events.Page.FrameNavigated, checkFrame)
        }
      }

      checkFrame()
    })
  }

  await page.goto('https://stripe-payments-demo.appspot.com')

  try {
    const stripeFrame = await waitForFrame('privateStripeFrame')
    await stripeFrame.waitFor('body')
    console.log('Body found successfully')
  } catch (e) {
    console.error(e)
  }
  process.exit()
})()