@prosopo/procaptcha-frictionless 2.13.14 → 2.13.16

package/src/ProcaptchaFrictionless.tsx

@@ -35,6 +35,7 @@ import {
 	type RetryCoords,
 	consumeRetryMountProps,
 	handleSessionInvalidated,
+	normaliseRetryCoords,
 } from "./sessionInvalidatedRecovery.js";
 
 // Each session uses exactly one solver — chosen by the /frictionless response.
@@ -105,6 +106,16 @@ export const ProcaptchaFrictionless = ({
 	// After we've retried once, a second NO_SESSION_FOUND falls back to the
 	// inner widget's own `frictionlessState.restart()` path.
 	const sessionInvalidatedFiredRef = useRef(false);
+	// Bumped on every mount so the replacement widget gets a fresh React
+	// `key`. Without it a re-render for the same captcha type reconciles onto
+	// the existing element, and the inner widget keeps the manager it built on
+	// first mount — still closed over the sessionId we've just replaced.
+	const mountCountRef = useRef(0);
+	// Set when the next mount must open its challenge without waiting for a
+	// checkbox click. Held in a ref rather than passed down through `start()`
+	// because `providerRetry` re-invokes `start` with no arguments, which would
+	// otherwise drop the flag on the first provider retry.
+	const nextMountAutoStartRef = useRef(false);
 
 	useEffect(() => {
 		if (!config.language) return;
@@ -215,6 +226,19 @@ export const ProcaptchaFrictionless = ({
 			void start();
 		};
 
+		// The user pressed reload on the challenge. The provider consumed this
+		// session when it issued the challenge, so there is no way to ask it
+		// for another one — mint a new session by re-running frictionless and
+		// re-mount the widget with `autoStart`, which is what makes a new
+		// challenge appear instead of the modal simply closing. Not one-shot:
+		// the user may keep asking for a different challenge.
+		const onReload = (x?: number, y?: number) => {
+			pendingRetryCoordsRef.current = normaliseRetryCoords(x, y);
+			nextMountAutoStartRef.current = true;
+			resetState(0);
+			void start();
+		};
+
 		// Consume any pending retry coords now — the resumed widget owns them
 		// for exactly one auto-fired `manager.start(x, y)`. Cleared so a
 		// subsequent escalation/re-render doesn't accidentally re-inject.
@@ -222,14 +246,22 @@ export const ProcaptchaFrictionless = ({
 		// over pending retry coords when both are present, because escalation
 		// is the current transition and the pending retry belongs to a prior
 		// widget instance that never got to consume them.
+		const forcedAutoStart = nextMountAutoStartRef.current;
+		nextMountAutoStartRef.current = false;
 		const { autoStart: resumedAutoStart, startCoords: retryStartCoords } =
-			consumeRetryMountProps(pendingRetryCoordsRef, autoStart);
+			consumeRetryMountProps(
+				pendingRetryCoordsRef,
+				autoStart || forcedAutoStart,
+			);
 		const startCoords = escalationCoords ?? retryStartCoords;
+		mountCountRef.current += 1;
+		const mountKey = mountCountRef.current;
 
 		if (captchaType === CaptchaType.image) {
 			const Procaptcha = await ProcaptchaLoader();
 			setComponentToRender(
 				<Procaptcha
+					key={mountKey}
 					config={config}
 					callbacks={callbacks}
 					frictionlessState={frictionlessState}
@@ -237,12 +269,14 @@ export const ProcaptchaFrictionless = ({
 					autoStart={resumedAutoStart}
 					startCoords={startCoords}
 					onSessionInvalidated={onSessionInvalidated}
+					onReload={onReload}
 				/>,
 			);
 		} else if (captchaType === CaptchaType.puzzle) {
 			const ProcaptchaPuzzle = await ProcaptchaPuzzleLoader();
 			setComponentToRender(
 				<ProcaptchaPuzzle
+					key={mountKey}
 					config={config}
 					callbacks={callbacks}
 					frictionlessState={frictionlessState}
@@ -256,6 +290,7 @@ export const ProcaptchaFrictionless = ({
 			const ProcaptchaPow = await ProcaptchaPowLoader();
 			setComponentToRender(
 				<ProcaptchaPow
+					key={mountKey}
 					config={config}
 					callbacks={callbacks}
 					frictionlessState={frictionlessState}

package/src/sessionInvalidatedRecovery.ts

@@ -26,13 +26,10 @@ export type RetryCoords = { x: number; y: number };
 export type MutableRef<T> = { current: T };
 
 /**
- * Semantics of the outer recovery handler. Returns whether the caller
- * should proceed to re-run the frictionless flow (`start()`), and mutates
- * the passed refs to record the one-shot fire + pending coords.
+ * The checkbox click position a re-mounted widget should start from, or
+ * `null` when there isn't a real one to carry over.
  *
- * - Second calls are ignored (one-shot per outer widget lifetime) so a
- *   persistently broken session doesn't loop.
- * - Coords are recorded only for a real trusted checkbox click. A partial
+ * - Coords are kept only for a real trusted checkbox click. A partial
  *   pair (only x or only y numeric) is treated as "no coords" so we
  *   never accidentally embed `NaN` into the solution salt.
  * - `(0, 0)` is treated as "no coords" too — that's what the widgets
@@ -42,6 +39,23 @@ export type MutableRef<T> = { current: T };
  *   is identical; we discard the pair here so future readers can tell
  *   the two apart.
  */
+export const normaliseRetryCoords = (
+	x: number | undefined,
+	y: number | undefined,
+): RetryCoords | null => {
+	if (typeof x !== "number" || typeof y !== "number") return null;
+	if (x === 0 && y === 0) return null;
+	return { x, y };
+};
+
+/**
+ * Semantics of the outer recovery handler. Returns whether the caller
+ * should proceed to re-run the frictionless flow (`start()`), and mutates
+ * the passed refs to record the one-shot fire + pending coords.
+ *
+ * Second calls are ignored (one-shot per outer widget lifetime) so a
+ * persistently broken session doesn't loop.
+ */
 export const handleSessionInvalidated = (
 	x: number | undefined,
 	y: number | undefined,
@@ -50,9 +64,7 @@ export const handleSessionInvalidated = (
 ): { shouldRestart: boolean } => {
 	if (firedRef.current) return { shouldRestart: false };
 	firedRef.current = true;
-	const bothNumeric = typeof x === "number" && typeof y === "number";
-	const isRealClick = bothNumeric && (x !== 0 || y !== 0);
-	pendingCoordsRef.current = isRealClick ? { x, y } : null;
+	pendingCoordsRef.current = normaliseRetryCoords(x, y);
 	return { shouldRestart: true };
 };
 

package/src/tests/sessionInvalidatedRecovery.test.ts

@@ -18,6 +18,7 @@ import {
 	type RetryCoords,
 	consumeRetryMountProps,
 	handleSessionInvalidated,
+	normaliseRetryCoords,
 } from "../sessionInvalidatedRecovery.js";
 
 const ref = <T>(initial: T): MutableRef<T> => ({ current: initial });
@@ -127,3 +128,26 @@ describe("consumeRetryMountProps", () => {
 		expect(mount).toEqual({ autoStart: false, startCoords: undefined });
 	});
 });
+
+describe("normaliseRetryCoords", () => {
+	it("keeps a real click", () => {
+		expect(normaliseRetryCoords(120, 340)).toEqual({ x: 120, y: 340 });
+	});
+
+	it("keeps a click that sits on one axis", () => {
+		expect(normaliseRetryCoords(0, 340)).toEqual({ x: 0, y: 340 });
+	});
+
+	it("drops (0, 0) — the autoStart / untrusted-event default, not a click", () => {
+		expect(normaliseRetryCoords(0, 0)).toBeNull();
+	});
+
+	it("drops a half-pair rather than letting NaN reach the salt", () => {
+		expect(normaliseRetryCoords(120, undefined)).toBeNull();
+		expect(normaliseRetryCoords(undefined, 340)).toBeNull();
+	});
+
+	it("drops a missing pair", () => {
+		expect(normaliseRetryCoords(undefined, undefined)).toBeNull();
+	});
+});