Blank hcaptcha with CF7

[ThomasKujawa]

As you can see, there is an empty hcaptcha block on my page.

The form cannot be submitted.

What could be the reason for this?

I have already adjusted the content security policy.

[e271828-]

@ThomasKujawa do you have a demo URL? And which browser / ver? Only thing I can think of offhand is perhaps CSS on the parent site interfering, although that is very rare.

[ThomasKujawa]

Please check our productive site https://www.fachkraeftesicherer.de/erstgespraech-betriebsberatung/

However, I had to disable hcaptcha. But I have created a test post with the shortcode. Does it help?

https://www.fachkraeftesicherer.de/hcaptcha-test/

[ThomasKujawa]

do you have a demo URL? And which browser / ver? Only thing I can think of offhand is perhaps CSS on the parent site interfering, although that is very rare.

@e271828-

Chrome - CSP supplemented with connect-src https://newassets.hcaptcha.com and script-src https://js.hcaptcha.com

[e271828-]

@ThomasKujawa OK, looks like that box and logo are actually something you've created. This is what confused me originally. The JS SDK does not appear to be loaded at all, so it's going to be an issue at the WP plugin level. CC @kagg-design

[kagg-design]

https://www.fachkraeftesicherer.de/hcaptcha-test/ does not exist anymore. I see that the hCaptcha plugin is deactivated.

Blank hCaptcha appears during page loads as a placeholder and should be replaced later by the actual Captcha widget. It may not be replaced if you have JS errors in the console. Such errors block the execution of JS completely.

I hope this helps.

If you want to know the reason why it happens with your site, I have to see a live development version of your site with hCaptcha activated.

[moonzlo]

I caught exactly the same problem in Elementor and the essentials theme Version: 3.0.4, the form is in a pop-up window, when I call it, I get the following in the console: elementor-common {handle: 'elementor-common', src: 'https://asiacont.ru/wp-content/plugins/elementor/assets/css/common.min.css', deps: Array(1), ver: '3.8.1', args: 'all', …} essentials.js:2068 elementor-post-3240 {handle: 'elementor-post-3240', src: 'https://asiacont.ru/wp-content/uploads/elementor/css/post-3240.css?ver=1669751120', deps: Array(1), ver: null, args: 'all', …} essentials.js:2074 elementor-common {handle: 'elementor-common', src: 'https://asiacont.ru/wp-content/plugins/elementor/assets/js/common.min.js', deps: Array(10), ver: '3.8.1', args: null, …} essentials.js:2074 elementor-app-loader {handle: 'elementor-app-loader', src: 'https://asiacont.ru/wp-content/plugins/elementor/assets/js/app-loader.min.js', deps: Array(1), ver: '3.8.1', args: null, …} VM77:3 Uncaught TypeError: Cannot read properties of undefined (reading '__') at 2365 (<anonymous>:3:95715) at __webpack_require__ (<anonymous>:3:148374) at 47729 (<anonymous>:3:79433) at __webpack_require__ (<anonymous>:3:148374) at 36614 (<anonymous>:3:83199) at __webpack_require__ (<anonymous>:3:148374) at <anonymous>:3:149205 at <anonymous>:3:152106 at <anonymous>:3:152110 at b (jquery.min.js?ver=3.6.1:2:866) 2365 @ VM77:3 __webpack_require__ @ VM77:3 47729 @ VM77:3 __webpack_require__ @ VM77:3 36614 @ VM77:3 __webpack_require__ @ VM77:3 (анонимная) @ VM77:3 (анонимная) @ VM77:3 (анонимная) @ VM77:3 b @ jquery.min.js?ver=3.6.1:2 globalEval @ jquery.min.js?ver=3.6.1:2 text script @ jquery.min.js?ver=3.6.1:2 (анонимная) @ jquery.min.js?ver=3.6.1:2 l @ jquery.min.js?ver=3.6.1:2 (анонимная) @ jquery.min.js?ver=3.6.1:2 Объект load (асинхронный) send @ jquery.min.js?ver=3.6.1:2 ajax @ jquery.min.js?ver=3.6.1:2 s.ajax.s.ajax @ jquery-migrate.min.js?ver=3.3.2:2 jQuery.cachedScript @ essentials.js:1668 (анонимная) @ essentials.js:2082 W @ essentials.js:2072 (анонимная) @ essentials.js:2186 Объект setTimeout (асинхронный) o @ essentials.js:2181 (анонимная) @ essentials.js:2114 c @ jquery.min.js?ver=3.6.1:2 fireWith @ jquery.min.js?ver=3.6.1:2 l @ jquery.min.js?ver=3.6.1:2 (анонимная) @ jquery.min.js?ver=3.6.1:2 Объект load (асинхронный) send @ jquery.min.js?ver=3.6.1:2 ajax @ jquery.min.js?ver=3.6.1:2 s.ajax.s.ajax @ jquery-migrate.min.js?ver=3.3.2:2 onContentReady @ essentials.js:2107 (анонимная) @ essentials.js:355 e @ jquery.min.js?ver=3.6.1:2 t @ jquery.min.js?ver=3.6.1:2 Объект setTimeout (асинхронный) (анонимная) @ jquery.min.js?ver=3.6.1:2 c @ jquery.min.js?ver=3.6.1:2 fireWith @ jquery.min.js?ver=3.6.1:2 fire @ jquery.min.js?ver=3.6.1:2 c @ jquery.min.js?ver=3.6.1:2 fireWith @ jquery.min.js?ver=3.6.1:2 (анонимная) @ jquery.min.js?ver=3.6.1:2 c @ jquery.min.js?ver=3.6.1:2 fireWith @ jquery.min.js?ver=3.6.1:2 s.<computed> @ jquery.min.js?ver=3.6.1:2 (анонимная) @ essentials.js:355 Объект setTimeout (асинхронный) _open @ essentials.js:355 open @ essentials.js:355 (анонимная) @ essentials.js:355 Объект setTimeout (асинхронный) _init @ essentials.js:355 r.Jconfirm @ essentials.js:355 r.jconfirm @ essentials.js:355 s.alert @ essentials.js:355 d @ essentials.js:2087 (анонимная) @ essentials.js:2374 dispatch @ jquery.min.js?ver=3.6.1:2 y.handle @ jquery.min.js?ver=3.6.1:2 VM78:2 Uncaught ReferenceError: $e is not defined at 78402 (<anonymous>:2:47153) at __webpack_require__ (<anonymous>:2:85911) at 2584 (<anonymous>:2:47539) at __webpack_require__ (<anonymous>:2:85911) at 34261 (<anonymous>:2:50606) at __webpack_require__ (<anonymous>:2:85911) at <anonymous>:2:86518 at <anonymous>:2:87174 at <anonymous>:2:87178 at b (jquery.min.js?ver=3.6.1:2:866)

I killed several hours on unsuccessful attempts to fix it, in the end I spat and put another one

[e271828-]

@moonzlo could you put up a repro page that shows this somewhere?

[gpenglase]

Yep, this is happening across multiple sites for me too... If you click where the square should be, then the hcapcha decides to load the box.

But this is just one of a few issues I have found with the latest/recent versions... a) this and previous plugin updates didin't force a cache refresh on automated plugin update, so we have had to login to each site and do this manually to get the forms working again

b) on one site where a Russian anti-catptcha bot was actually promoted by spammers (which they called XEvil 6.0) , hcaptcha has failed to stop much of the spam that has come through since then, at a rate of a spam message every 26-29 minutes, despite HCaptcha settings of "challenge always" and "difficult". If it hadn't been for the auto-spam identification and blocking by both the onsite form DB plugin and auto-blokcing by Sendgrid, our clients would have been inundated with constant spam from that site. Google's Recaptcha has stopped it all of that spam, however interestingly either the same Russian spammers or others, are now submitting 2 messages a day - seems to be manual submissions.

We use Contact 7, OceanWp and Elementor across all of our WP sites. Might be their issues but basically we're had to junk hcaptcha and go back to Google Recatptcha v3 in soms cases (didn't want to but can't spend the time troubleshooting).

I know Contact 7 latest update has added P tags around fields and this has caused issues. Broke some of my forms and hcaptcha refused to work with it, so i've rolled back to 5.6.4 to avoid all the problems.

[kagg-design]

@ThomasKujawa @moonzlo @gpenglase I cannot reproduce it. I need access to the page with the problem.

[kagg-design]

Closed as non-reproducible.