From 0cdb11a4450ec9f1abc38649fc6b0072da51e4ed Mon Sep 17 00:00:00 2001 From: Cursor Agent Date: Sat, 14 Feb 2026 15:05:21 +0000 Subject: [PATCH] fix: prevent empty selector error in SurveyLoadingAnimation - Add type guard for isWelcomeCardEnabled to ensure it's a boolean - Add validation before querySelectorAll to prevent empty selector errors - Add guard in checkMediaLoaded callback for defensive programming Fixes FORMBRICKS-K3 --- .../components/survey-loading-animation.tsx | 18 +++++++++++++++++- 1 file changed, 17 insertions(+), 1 deletion(-) diff --git a/apps/web/modules/survey/link/components/survey-loading-animation.tsx b/apps/web/modules/survey/link/components/survey-loading-animation.tsx index fc1fdef18f..ff1594cff4 100644 --- a/apps/web/modules/survey/link/components/survey-loading-animation.tsx +++ b/apps/web/modules/survey/link/components/survey-loading-animation.tsx @@ -20,10 +20,20 @@ export const SurveyLoadingAnimation = ({ const [isMediaLoaded, setIsMediaLoaded] = useState(false); // Tracks if all media are fully loaded const [isSurveyPackageLoaded, setIsSurveyPackageLoaded] = useState(false); // Tracks if the survey package has been loaded into the DOM const isReadyToTransition = isMediaLoaded && minTimePassed && isBackgroundLoaded; - const cardId = isWelcomeCardEnabled ? `questionCard--1` : `questionCard-0`; + // Ensure cardId is always a valid string by explicitly checking for boolean type + const cardId = + typeof isWelcomeCardEnabled === "boolean" && isWelcomeCardEnabled + ? `questionCard--1` + : `questionCard-0`; // Function to check if all media elements (images and iframes) within the survey card are loaded const checkMediaLoaded = useCallback(() => { + // Guard against empty cardId + if (!cardId) { + setIsMediaLoaded(true); + return; + } + const cardElement = document.getElementById(cardId); const images = cardElement ? Array.from(cardElement.getElementsByTagName("img")) : []; @@ -37,6 +47,12 @@ export const SurveyLoadingAnimation = ({ useEffect(() => { if (!isSurveyPackageLoaded) return; + // Guard against empty cardId to prevent "'' is not a valid selector" error + if (!cardId) { + setIsMediaLoaded(true); + return; + } + checkMediaLoaded(); const mediaElements = document.querySelectorAll(`#${cardId} img, #${cardId} iframe`);