From 097f13b13f04e38dde888e132d8313d7c097147e Mon Sep 17 00:00:00 2001 From: Stefanos Anagnostou Date: Thu, 17 Oct 2024 16:51:58 +0300 Subject: [PATCH] fix(clerk-js): Add the render query param on the captcha script (#4332) [Core 1 backport] (#4341) Co-authored-by: panteliselef --- .changeset/serious-moose-design.md | 5 +++++ packages/clerk-js/src/utils/captcha/turnstile.ts | 4 +++- 2 files changed, 8 insertions(+), 1 deletion(-) create mode 100644 .changeset/serious-moose-design.md diff --git a/.changeset/serious-moose-design.md b/.changeset/serious-moose-design.md new file mode 100644 index 0000000000..9d29e0cf28 --- /dev/null +++ b/.changeset/serious-moose-design.md @@ -0,0 +1,5 @@ +--- +"@clerk/clerk-js": patch +--- + +Add the `?render=explicit` query parameter to the Turnstile script. diff --git a/packages/clerk-js/src/utils/captcha/turnstile.ts b/packages/clerk-js/src/utils/captcha/turnstile.ts index 33a72a570a..a7e639852e 100644 --- a/packages/clerk-js/src/utils/captcha/turnstile.ts +++ b/packages/clerk-js/src/utils/captcha/turnstile.ts @@ -3,7 +3,9 @@ import type { CaptchaWidgetType } from '@clerk/types'; import { CAPTCHA_ELEMENT_ID, CAPTCHA_INVISIBLE_CLASSNAME } from './constants'; -const CLOUDFLARE_TURNSTILE_ORIGINAL_URL = 'https://challenges.cloudflare.com/turnstile/v0/api.js'; +// We use the explicit render mode to be able to control when the widget is rendered. +// CF docs: https://developers.cloudflare.com/turnstile/get-started/client-side-rendering/#disable-implicit-rendering +const CLOUDFLARE_TURNSTILE_ORIGINAL_URL = 'https://challenges.cloudflare.com/turnstile/v0/api.js?render=explicit'; interface RenderOptions { /**