Incorrect call of JavaScript resource parameter

Resolved birgitrothaus
(@birgitrothaus)

11 months ago
In a shop where I use the plugin to display two reCAPTCHAs on the ‘My Account’ page (one for logging in and one for registering), I received the following error message in the developer console:
```
reCAPTCHA render error: Error: reCAPTCHA has already been rendered in this element, line 45 in rcfwc.js
```
The problem appears to be multifaceted. Firstly, the api.js file is enqueued as follows:
```
wp_enqueue_script( 'recaptcha', 'https://www.google.com/recaptcha/api.js?explicit&hl=' . get_locale(), array(), null, array('strategy' => 'defer'));
```
According to the documentation, the parameter needs to be set up like this if you want to explicitly render the widgets (the code above is missing the render key):
```
'https://www.google.com/recaptcha/api.js?render=explicit'
```
This most likely ensures that the default is used (onload), which will render all .g-recaptcha elements automatically.

So, if you have an existing wp object on a page and integrate reCAPTCHA, this will result in the reCAPTCHA being rendered twice: once by Google and once by the plugin’s JavaScript.

In my case, the wp object and the wp.data object are also defined on the ‘My Account’ page. This means that the check for wp and wp.data returns true, and the code within the if block is executed.

Adding the missing render key to the api.js URL appears to solve the issue at checkout, but not on the ‘My Account’ page. If wp and wp.data are not present, no reCAPTCHA is displayed on the ‘My Account’ page at all. If they are present, only the first one is displayed.

So the api.js call, like the handling of several recpactchas, probably needs to be adapted.

Viewing 2 replies - 1 through 2 (of 2 total)

Plugin Author Elliot Sowersby
(@elliotvs)

9 months, 4 weeks ago

Hi,

Thanks, this error message should be fixed in the latest update.
Thread Starter birgitrothaus
(@birgitrothaus)

9 months, 2 weeks ago
Hi,

First of all, thanks for your message.

But the error seems to persist:
```
reCAPTCHA render error: Error: reCAPTCHA has already been rendered in this element
    at recaptcha__de_ch.js:110:453
    at renderRecaptcha (rcfwc.js?x41567&ver=1.0:26:48)
    at waitForRecaptcha (rcfwc.js?x41567&ver=1.0:53:13)
```
I see that you changed the URL to ‘https://www.google.com/recaptcha/api.js‘ which results in the reCAPTCHAS being rendered onload because that’s the default.

In my case the wp and wp.data objects are available on the my account page, so your code in the rcfwc.js file starting from line 16 gets executed.

So the CAPTCHAS render onload, AND then they get rendered again in your code, which most likely leads to the error message.

I think the problem boils down to that ( wp && wp.data ) is not an efficient way to check if the current page is using the Woo Checkout Block, as the implementation of the WooCommerce Minicart Block on the page also makes these objects available (in my case, I use the minicart on almost every page, including the my account page).

Let me know if I’m completely off track or if you understand what I mean.
- This reply was modified 9 months, 2 weeks ago by birgitrothaus.

Viewing 2 replies - 1 through 2 (of 2 total)

The topic ‘Incorrect call of JavaScript resource parameter’ is closed to new replies.