Cypress recaptcha command

commands.js

Cypress.Commands.add("clickRecaptcha", () => {
  cy.window().then(win => {
    win.document
      .querySelector("iframe[src*='recaptcha']")
      .contentDocument.getElementById("recaptcha-token")
      .click();
  });
});

Of course it won't work. Because this is real Captcha, you can't expect to be allowed to pass real Captcha with any automated software. This is for Captcha in developer mode only. It is for e2e tests and not for "solving" captcha's........

cy.get ('iframe')
.first ()
.its ('0.contentDocument.body')
.should ('not.be.undefined')
.and ('not.be.empty')
.then (cy. wrap)
.find ('# recaptcha-anchor')
.should ('be.visible')
.click ();
`
Em seu package.json:

 {
    "ng-recaptcha": "^7.0.1"
  },

I combined this command with the instructions given by Google:

https://developers.google.com/recaptcha/docs/faq#id-like-to-run-automated-tests-with-recaptcha.-what-should-i-do

Also make sure you have this in your cypress.json file, otherwise iFrames cannot be accessed:

`"chromeWebSecurity": false`

cy.get ('iframe')
.first ()
.its ('0.contentDocument.body')
.should ('not.be.undefined')
.and ('not.be.empty')
.then (cy. wrap)
.find ('# recaptcha-anchor')
.should ('be.visible')
.click ();
`
Em seu package.json:

 {
    "ng-recaptcha": "^7.0.1"
  },

I combined this command with the instructions given by Google:

https://developers.google.com/recaptcha/docs/faq#id-like-to-run-automated-tests-with-recaptcha.-what-should-i-do

Also make sure you have this in your cypress.json file, otherwise iFrames cannot be accessed:

`"chromeWebSecurity": false`

Hi, I wonder what is the purpose of the contentDocument ? Also on my end seems to not work even if we used both google recommendation and the solution you provided.

Hi,
Could you please explain step by step how should we store site key and secret key described here: https://developers.google.com/recaptcha/docs/faq#id-like-to-run-automated-tests-with-recaptcha.-what-should-i-do ?

Site key is stored on both frontend and backend, secret key is stored on a backend only. Usually this is done via environment variables. For frontend — while building it, for backend — they are passed by something like kubernetes at the application start

Site key is stored on both frontend and backend, secret key is stored on a backend only. Usually this is done via environment variables. For frontend — while building it, for backend — they are passed by something like kubernetes at the application start

Spasibo!

Spasibo!

Всегда пожалуйста! 🙂

How can I bypass or automate this kind of Captcha Verification using cypress

I've already said — this is for TESTMODE captcha ONLY!

You must have recaptcha configured for test mode: https://developers.google.com/recaptcha/docs/faq#id-like-to-run-automated-tests-with-recaptcha.-what-should-i-do

Hello @Dema,
I have read the article, but I don't understand where exactly I should store the sitekey and secretKey in cypress!
in the cypress.json or where?

i use this command:
Cypress.Commands.add('solveGoogleReCAPTCHA', () => { // Wait until the iframe (Google reCAPTCHA) is totally loaded cy.wait(500); cy.get('#recaptcha *> iframe') .then($iframe => { const $body = $iframe.contents().find('body'); cy.wrap($body) .find('.recaptcha-checkbox-border') .should('be.visible') .click(); }); });

the verification is displayed with the pictures but I don't want to see it displayed.

This does not work for this type of captcha

Any solution for that? Please

Why are you guys keep asking how to pass automation blocking software using automation software? It is meant to not to be passed like that by design and byt its solely purpose

1. For reCAPTCHA v2, use the following test key:
   const globalSettings: RecaptchaSettings = {siteKey: '6LeIxAcTAAAAAJcZVRqyHh71UMIEGNQ_MXjiZKhI'};

2. In cypress.config.ts file set chromeWebSecurity: false

3. Click recaptcha:

 cy.get('iframe[src*=recaptcha]')
      .its('0.contentDocument')
      .should(d => d.getElementById('recaptcha-token').click())

Here's my take (reCAPTCHA v2), which doesn't require waiting:

cy.get('iframe[src*=recaptcha]')
        .its('0.contentDocument')
        .should(d => d.getElementById('recaptcha-token').click())

This is interesting. I was able to get it to work as well as the following code here:

        cy.get('iframe[src*=recaptcha]').then(($iframe) => {
            const iframeDocument = $iframe.contents();
            const recaptchaToken = iframeDocument.find('#recaptcha-token');
            recaptchaToken.click();
        });

However, the next day after a few tests it would not work and was not able to find the #recaptcha-token or the .its() would fail. This is what my team was seeing while reviewing a PR I'd created. I had set up the chromewebsecurity to false and was using the correct test keys provided by Google.

I ended up spending the entire day troubleshooting and trying to figure out what was happening. After a lot of frustrations, I hard reloaded and emptied the cache and now both versions of the click work!!! I have no clue why or what is going on frankly.