Missed reCaptcha after wrong form submit vs webform module

The problem is with the ajax, but i found a workaround for this.

Drupal.behaviors.recapcha_ajax_behaviour = {
    attach: function(context, settings) {
      $('.webform-client-form', context).once('webform_ajax', function () {
        if (typeof grecaptcha != "undefined") {
          var captchas = document.getElementsByClassName('g-recaptcha');
          for (var i=0;i<captchas.length;i++) {
            var site_key = captchas[i].getAttribute('data-sitekey');
            grecaptcha.render(captchas[i], { 'sitekey' : site_key});
          }
        }
	    });
    }
  }

@Xrobak: Please provide steps to reproduce this problem.

@cslevy: Please provide your changes as a patch.

I also have this problem with a node that has recaptcha attached. I added #ajax on submit button (form is in a reveal modal) so each time the user hits submit an there are validation errors, the recaptcha is not rebuild. Being inactive, user cannot save the node.

I tried the code above for node, with some changes. I don't know for sure if this is the right way. What I did is to check if the elements with data-sitekey attribute are empty or not. If so, I reset the captcha.

I didn't add a patch, I am not sure this is the right approach...

  /**
   * Recaptcha bug fix with ajax rendring form.
   */
  Drupal.behaviors.recapcha_ajax_behaviour = {
    attach: function(context, settings) {
      if (typeof grecaptcha != "undefined") {
        var captchas = document.getElementsByClassName('g-recaptcha');
        for (var i = 0; i < captchas.length; i++) {
          var site_key = captchas[i].getAttribute('data-sitekey');
          if (!$(captchas[i]).html()) {
            grecaptcha.render(captchas[i], { 'sitekey' : site_key});
          }
        }
      }
    }
  }

@Liam Morland
Actually these aren't changes in any module. Simply add this behaviour in your own javascript (from theme or custom module)

Should this JavaScript be included as part of the Drupal recaptcha module?

Because I do not have steps to reproduce the problem, I do not understand clearly what is going wrong.

@Liam Morland

The problem is that if you add ajax submit on the forms were you have captcha, the captcha will not work after first ajax submit (e.g. you submit, but you forget to fill a required field. The form is rebuild with ajax, but the recaptcha will not appear anymore. Only after refresh)

I haven't done much with ajax forms, so I am not very familiar with implementing them in Drupal. Does this mean that the Drupal recaptcha module has a bug or is it that the documentation should inform those who create such forms to add JS like in the above comments?

I'm confirm bug with Webform module

On my websites I use reCaptcha alot, so I'm interested in testing of this module
I've tried reCaptcha + Webform + Webform Ajax modules and for me it is impossible to repeat this issue. Do you use "Webform Ajax" module to get Ajax functionality for Webform?
While unsuccessful form submission (missed required field), sometimes you can fill out form and successfully submit reCaptcha, but forget to fill required field or use wrong format. When "Missed required field" message is shown and usually reCaptcha field will disappear, but when required field becomes filled and form is resubmitted, submission becomes successful even without showing and submitting reCaptcha.
Please give detailed steps, so issue can be repeated.

@keha3912: If the bug is in Webform, then this issue needs to be moved to the Webform queue. What happens of you use the math CAPTCHA? If Math CAPTCHA works properly, then the bug is probably in reCAPTCHA. Does it work properly with reCAPTCHA 7.x-1.x?

Closing because of inactivity.

It's not a bug in webform and it is consistently reproducible - the reason for it is because recaptcha works via populating a div with an iframe via an onload. When you're using webform_ajax you get the div back, but there's no onload call - hence the need to re-render the captcha box. I fail to see how this is the fault of webform_ajax though?

Sounds like #2493183: Ajax support / Use behaviors

Yes absolutely, that looks to be the exact same issue. Thank you.

Pobster

I know this is old, but if anyone needs this. I can confirm the javascript in #3 fixes the issue. I tried to add it to the Custom Javascript in the Webform, and it didn't work. But when I load the Javascript through the libraries.yml file, it fixes the error.

Fix from #3 also works for me