"Uncaught Error: reCAPTCHA has already been rendered in this element" in StrictMode

[srghma]

import Recaptcha from 'react-recaptcha'

// throws "Uncaught Error: reCAPTCHA has already been rendered in this element" in StrictMode
//
// because in StrictMode all components are rendered twice

// Uncaught Error: reCAPTCHA has already been rendered in this element
// at recaptcha__en.js:303:80
// at t.value (react-recaptcha.js:1:1)
// at t.value (react-recaptcha.js:1:1)
// at invokeLayoutEffectMountInDEV (react-dom.development.js:25133:1)
// at invokeEffectsInDev (react-dom.development.js:27351:1)
// at commitDoubleInvokeEffectsInDEV (react-dom.development.js:27327:1)
// at flushPassiveEffectsImpl (react-dom.development.js:27056:1)
// at flushPassiveEffects (react-dom.development.js:26984:1)
// at commitRootImpl (react-dom.development.js:26935:1)
// at commitRoot (react-dom.development.js:26682:1)

// even this doesnt help
// const MemoizedRecaptcha = React.memo(Recaptcha, function (oldProps, newProps) {
//   const output = oldProps.sitekey === newProps.sitekey
//   console.log({ oldProps, newProps, output })
//   return output
// })

<Recaptcha
  sitekey={recaptchaSiteKey}
  render='explicit'
/>