ReCAPTCHA placeholder element must be an element or id

[daywong1119]

I got the error when inflating the view by code below:

     <div className="form-group" id="captcha-holder">
        <Recaptcha sitekey="xxx" render="explicit" verifyCallback={this.onCaptchaVerify}/>
    </div>

recaptcha__en.js:286 Uncaught Error: ReCAPTCHA placeholder element must be an element or id

[MrHash]

Several people have this problem it seems. Any advice?

[marudhupandiyang]

Try adding onloadCallback to Recaptcha. Something similar to below

<div className="form-group" id="captcha-holder">
    <Recaptcha sitekey="xxx" render="explicit" verifyCallback={this.onCaptchaVerify} onloadCallback={this.onloadCallback}/>
</div>

[wil93]

I solved it by adding render="explicit" and onloadCallback={console.log.bind(this, "recaptcha loaded")}

I don't know why those two things (especially the onload thing) are required, but this check may be the cause of them being required:

react-recaptcha/src/index.js

Line 105 in 53768e2

if (this.props.render === 'explicit' && this.props.onloadCallback) {

[Daniel1971]

Thanks a lot, wil93.

[chris-allnutt]

#186 doesn't fix this issue. The issue doesn't present itself on hard reloads, only soft reloads when the data is already cached.

Currently using v2.3.5

[JZebra]

I'm also having this issue in v2.3.11, but only in certain parts of my app.