Puppeteer-extra: Solving Recaptcha in Frame not working

[Alfagun74]

Im trying to solve an 9 Tile image recaptcha in an iframe by using:
for (const frame of page.mainFrame().childFrames()) { await frame.solveRecaptchas(); }
but it throws this error:
(node:17336) UnhandledPromiseRejectionWarning: TypeError: frame.solveRecaptchas is not a function

Versions Used:

"puppeteer": "^5.4.1",
"puppeteer-extra": "^3.1.15",
"puppeteer-extra-plugin-recaptcha": "^3.2.0",

[berstend]

@Alfagun74 can you share more code, specifically your require/import statements.

[Alfagun74]

sure @berstend :

const puppeteer = require('puppeteer-extra')
const StealthPlugin = require('puppeteer-extra-plugin-stealth')
const RecaptchaPlugin = require('puppeteer-extra-plugin-recaptcha')
puppeteer.use(StealthPlugin());
puppeteer.use(RecaptchaPlugin({
    provider: {
        id: '2captcha',
        token: 'abcdefgh',
    },
    visualFeedback: true,
}));

await page.goto(href);
await page.waitForTimeout(10000);
for (const frame of page.mainFrame().childFrames()) {
    await frame.solveRecaptchas();
}
await Promise.all([
    await page.waitForNavigation({timeout: 0}),
    await page.click("#recaptcha-verify-button")
]);

[berstend]

@Alfagun74 Interesting, does the regular page.solveRecaptchas() work in your setup or does it throw as well?

[Alfagun74]

@berstend it returns{captchas = [], solutions = [], solved = [], error = null}in this case

[Alfagun74]

@berstend the more-info label is still present, do you still need more info on this?

[alezzigo]

I I have got this issue, I think you find check display style of parent's captcha.
Good luck

[berstend]

@Alfagun74 I cannot reproduce your issue (using [email protected]).

Can you make a small self-contained example that shows this issue (including package.json, etc)?

Also your node version would be interesting in that context.

[berstend]

e.g. this works without issues:

const puppeteer = require("puppeteer-extra")

const RecaptchaPlugin = require("puppeteer-extra-plugin-recaptcha")
puppeteer.use(
  RecaptchaPlugin({
    provider: {
      id: "2captcha",
      token: "XXXXXXX", // REPLACE THIS WITH YOUR OWN 2CAPTCHA API KEY ⚡
    },
  })
)

puppeteer.launch({ headless: true }).then(async (browser) => {
  const page = await browser.newPage()
  await page.goto("https://www.google.com/recaptcha/api2/demo")

  console.log("Hi there")

  for (const frame of page.mainFrame().childFrames()) {
    console.log("foo", frame.solveRecaptchas())
  }

  await browser.close()
})

node recaptcha.js
Hi there
foo Promise { <pending> }
foo Promise { <pending> }



md5-cf148a6b73f8e73ba1a9f2919f3bcc81



node --version
v15.0.1

[Alfagun74]

Okay @berstend now i see the problem:

I wanted to avoid that the browser starts with an about:blank page so i used:
const page = (await browser.pages())[0];
(see https://github.com/puppeteer/puppeteer/issues/2040#issuecomment-366295221)

when i use await browser.newPage() it works fine

[berstend]

Ah yeah, that makes sense: The recaptcha plugin hasn't patched those pages/frames yet (it hooks into newPage).

If possible browser.newPage should be used (the about:blank thing has no negative effects), the only reason not to do that is probably when you're attaching to an existing browser session.

This came up before, here's a workaround: https://github.com/berstend/puppeteer-extra/issues/353#issuecomment-714521257

[Alfagun74]

thanks a lot ❤