v.2.4.3

.gitignore

@@ -37,3 +37,5 @@ supabase/volumes/*
 !supabase/volumes/db/
 supabase/volumes/db/data
 !supabase/volumes/api/
+
+coverage/

package.json

@@ -82,7 +82,7 @@
     "typedoc": "^0.28.13",
     "typedoc-plugin-markdown": "^4.9.0",
     "use-deep-compare-effect": "^1.8.1",
-    "uuid": "^11.0.5",
+    "uuid": "^14.0.0",
     "vega": "^6.2.0",
     "vega-lite": "^5.23.0",
     "vite": "^7.3.2",
@@ -113,6 +113,7 @@
     "eslint-plugin-react-hooks": "^5.2.0",
     "globals": "^16.4.0",
     "husky": "^9.1.7",
+    "jsdom": "^29.1.1",
     "lint-staged": "^16.1.6",
     "typescript": "^5.9.2",
     "vitest": "^3.2.4",

public/global.json

@@ -49,10 +49,11 @@
     "test-device-restriction",
     "test-library",
     "test-likert-matrix",
-    "test-parser-errors",
-    "test-randomization",
-    "test-skip-logic",
-    "test-step-logic"
+    "test-parser-errors",
+    "test-randomization",
+    "test-component-timeout",
+    "test-skip-logic",
+    "test-step-logic"
   ],
   "configs": {
     "tutorial": {
@@ -210,13 +211,17 @@
       "path": "test-parser-errors/config.json",
       "test": true
     },
-    "test-randomization": {
-      "path": "test-randomization/config.json",
-      "test": true
-    },
-    "test-skip-logic": {
-      "path": "test-skip-logic/config.json",
-      "test": true
+    "test-randomization": {
+      "path": "test-randomization/config.json",
+      "test": true
+    },
+    "test-component-timeout": {
+      "path": "test-component-timeout/config.json",
+      "test": true
+    },
+    "test-skip-logic": {
+      "path": "test-skip-logic/config.json",
+      "test": true
     },
     "test-step-logic": {
       "path": "test-step-logic/config.json",
@@ -239,4 +244,4 @@
       "test": true
     }
   }
-}
+}

public/libraries/calvi/config.json

@@ -5,7 +5,7 @@
   "reference": "Lily W. Ge, Yuan Cui, and Matthew Kay. 2023. CALVI: Critical Thinking Assessment for Literacy in Visualizations. In Proceedings of the 2023 CHI Conference on Human Factors in Computing Systems (CHI '23). Association for Computing Machinery, New York, NY, USA, Article 815, 1-18.",
   "components": {
     "N1": {
-      "description": "Audio test",
+      "description": "Visitors at Movie Theaters in 2001",
       "type": "image",
       "path": "libraries/calvi/assets/questions/normal/N1.jpg",
       "nextButtonLocation": "sidebar",

public/libraries/mic-check/config.json

@@ -8,6 +8,7 @@
       "path": "libraries/mic-check/assets/AudioTest.tsx",
       "nextButtonLocation": "belowStimulus",
       "nextButtonText": "Continue",
+      "recordAudio": true,
       "response": [
         {
           "id": "audioTest",

public/libraries/screen-recording/config.json

@@ -8,14 +8,16 @@
       "path": "libraries/screen-recording/assets/ScreenRecording.tsx",
       "nextButtonLocation": "belowStimulus",
       "nextButtonText": "Continue",
-      "recordAudio": false,
-      "response": [{
-        "hidden": true,
-        "type": "reactive",
-        "id": "screenRecordingPermission",
-        "prompt": "Screen recording enabled"
-      }]
+      "recordScreen": true,
+      "response": [
+        {
+          "hidden": true,
+          "type": "reactive",
+          "id": "screenRecordingPermission",
+          "prompt": "Screen recording enabled"
+        }
+      ]
     }
   },
   "sequences": {}
-}
+}

public/test-component-timeout/config.json

@@ -0,0 +1,58 @@
+{
+  "$schema": "https://raw.githubusercontent.com/revisit-studies/study/v2.4.2/src/parser/StudyConfigSchema.json",
+  "studyMetadata": {
+    "title": "Component Timeout Auto-Advance Test",
+    "version": "pilot",
+    "authors": [
+      "The reVISit Team"
+    ],
+    "date": "2026-05-14",
+    "description": "A test study for component-level auto-advance timeouts.",
+    "organizations": [
+      "The reVISit Team"
+    ]
+  },
+  "uiConfig": {
+    "contactEmail": "contact@revisit.dev",
+    "logoPath": "revisitAssets/revisitLogoSquare.svg",
+    "withProgressBar": true,
+    "autoDownloadStudy": false,
+    "withSidebar": true,
+    "studyEndMsg": "Timeout auto-advance test complete."
+  },
+  "baseComponents": {
+    "timed-question": {
+      "type": "questionnaire",
+      "instruction": "Do not answer this question. It should automatically advance.",
+      "response": [
+        {
+          "id": "timeout-response",
+          "prompt": "Optional answer",
+          "location": "belowStimulus",
+          "type": "shortText",
+          "required": false
+        }
+      ],
+      "nextButtonAutoAdvanceTime": 2500,
+      "nextButtonAutoAdvanceWarningTime": 1500,
+      "nextButtonAutoAdvanceWarningMessage": "Custom timeout warning: advancing in {seconds} {unit} without saving this component."
+    }
+  },
+  "components": {
+    "introduction": {
+      "type": "questionnaire",
+      "instruction": "Press next to begin the timeout auto-advance test.",
+      "response": []
+    },
+    "timeout-question": {
+      "baseComponent": "timed-question"
+    }
+  },
+  "sequence": {
+    "order": "fixed",
+    "components": [
+      "introduction",
+      "timeout-question"
+    ]
+  }
+}

src/GlobalConfigParser.tsx

@@ -28,37 +28,72 @@ async function fetchGlobalConfigArray() {
   return parseGlobalConfig(configs);
 }
 
-export function GlobalConfigParser() {
-  const [globalConfig, setGlobalConfig] = useState<Nullable<GlobalConfig>>(null);
+function HomeRoute({ globalConfig }: { globalConfig: GlobalConfig }) {
   const [studyConfigs, setStudyConfigs] = useState<Record<string, ParsedConfig<StudyConfig> | null>>({});
 
   useEffect(() => {
-    async function fetchData() {
-      if (globalConfig) {
-        setStudyConfigs(await fetchStudyConfigs(globalConfig));
+    let cancelled = false;
+
+    async function fetchData(currentGlobalConfig: GlobalConfig) {
+      const configs = await fetchStudyConfigs(currentGlobalConfig);
+      if (!cancelled) {
+        setStudyConfigs(configs);
       }
     }
-    fetchData();
+
+    fetchData(globalConfig);
+
+    return () => {
+      cancelled = true;
+    };
   }, [globalConfig]);
 
+  return (
+    <>
+      <PageTitle title="ReVISit | Home" />
+      <AppShell
+        padding="md"
+        header={{ height: 70 }}
+      >
+        <AppHeader studyIds={globalConfig.configsList} />
+        <ConfigSwitcher
+          globalConfig={globalConfig}
+          studyConfigs={studyConfigs}
+        />
+      </AppShell>
+    </>
+  );
+}
+
+export function GlobalConfigParser() {
+  const [globalConfig, setGlobalConfig] = useState<Nullable<GlobalConfig>>(null);
+
   useEffect(() => {
-    if (globalConfig) return;
+    if (globalConfig) {
+      return undefined;
+    }
 
     fetchGlobalConfigArray().then((gc) => {
       setGlobalConfig(gc);
     });
+
+    return undefined;
   }, [globalConfig]);
 
   // Initialize storage engine
   const { storageEngine, setStorageEngine } = useStorageEngine();
   useEffect(() => {
-    if (storageEngine !== undefined) return;
+    if (storageEngine !== undefined) {
+      return undefined;
+    }
 
     async function fn() {
       const _storageEngine = await initializeStorageEngine();
       setStorageEngine(_storageEngine);
     }
     fn();
+
+    return undefined;
   }, [setStorageEngine, storageEngine]);
 
   const analysisProtectedCallback = async (studyId: string) => {
@@ -76,21 +111,7 @@ export function GlobalConfigParser() {
           <Routes>
             <Route
               path="/"
-              element={(
-                <>
-                  <PageTitle title="ReVISit | Home" />
-                  <AppShell
-                    padding="md"
-                    header={{ height: 70 }}
-                  >
-                    <AppHeader studyIds={globalConfig.configsList} />
-                    <ConfigSwitcher
-                      globalConfig={globalConfig}
-                      studyConfigs={studyConfigs}
-                    />
-                  </AppShell>
-                </>
-              )}
+              element={<HomeRoute globalConfig={globalConfig} />}
             />
             <Route
               path="/:studyId/*"

src/analysis/individualStudy/replay/AllTasksTimeline.tsx

@@ -119,6 +119,7 @@ export function AllTasksTimeline({
       const isCorrect = componentAnswersAreCorrect(answer.answer, answer.correctAnswer, resolvedComponent?.response);
       const hasCorrect = !!((resolvedComponent && resolvedComponent.correctAnswer) || answer.correctAnswer.length > 0);
       const hasAudio = resolvedComponent?.recordAudio ?? studyConfig?.uiConfig?.recordAudio ?? false;
+      const hasScreenRecording = resolvedComponent?.recordScreen ?? studyConfig?.uiConfig?.recordScreen ?? false;
 
       return {
         line: <SingleTaskLabelLines key={name} labelHeight={currentHeight * LABEL_GAP} height={maxHeight} xScale={scale} scaleStart={scaleStart} />,
@@ -147,7 +148,7 @@ export function AllTasksTimeline({
             )}
           >
             <g>
-              <SingleTask incomplete={answer.startTime === 0} isCorrect={isCorrect} hasCorrect={hasCorrect} hasAudio={hasAudio} key={name} labelHeight={currentHeight * LABEL_GAP} height={maxHeight} name={name} xScale={scale} scaleStart={scaleStart} scaleEnd={scaleEnd} trialOrder={answer.trialOrder} participantId={participantData.participantId} studyId={studyId} condition={conditionParam} />
+              <SingleTask incomplete={answer.startTime === 0} isCorrect={isCorrect} hasCorrect={hasCorrect} hasAudio={hasAudio} hasScreenRecording={hasScreenRecording} key={name} labelHeight={currentHeight * LABEL_GAP} height={maxHeight} name={name} xScale={scale} scaleStart={scaleStart} scaleEnd={scaleEnd} trialOrder={answer.trialOrder} participantId={participantData.participantId} studyId={studyId} condition={conditionParam} />
             </g>
           </Tooltip>),
       };

src/analysis/individualStudy/replay/SingleTask.tsx

@@ -4,7 +4,7 @@ import * as d3 from 'd3';
 
 import { useResizeObserver } from '@mantine/hooks';
 import {
-  IconCheck, IconMicrophone, IconProgress, IconX,
+  IconCheck, IconDeviceDesktop, IconMicrophone, IconProgress, IconX,
 } from '@tabler/icons-react';
 import { useNavigateToTrial } from '../../../utils/useNavigateToTrial';
 
@@ -24,6 +24,7 @@ export function SingleTask({
   isCorrect,
   hasCorrect,
   hasAudio,
+  hasScreenRecording,
   scaleStart,
   scaleEnd,
   incomplete,
@@ -39,6 +40,7 @@ export function SingleTask({
   isCorrect: boolean,
   hasCorrect: boolean,
   hasAudio: boolean,
+  hasScreenRecording: boolean,
   scaleStart: number,
   scaleEnd: number,
   incomplete: boolean,
@@ -52,7 +54,7 @@ export function SingleTask({
   const [ref, { width: labelWidth }] = useResizeObserver();
 
   const navigateToTrial = useNavigateToTrial();
-  const iconCount = (incomplete || hasCorrect ? 1 : 0) + (hasAudio ? 1 : 0);
+  const iconCount = (incomplete || hasCorrect ? 1 : 0) + (hasAudio ? 1 : 0) + (hasScreenRecording ? 1 : 0);
   const iconsWidth = iconCount * (ICON_SIZE + ICON_GAP);
 
   return (
@@ -93,6 +95,12 @@ export function SingleTask({
             <Text lineClamp={1} ref={ref} mx={0} style={{ width: 'fit-content', fontWeight: 600 }} size="12px">
               {name}
             </Text>
+            {hasScreenRecording && (
+              <IconDeviceDesktop
+                color="orange"
+                size="14"
+              />
+            )}
             {hasAudio && (
               <IconMicrophone
                 color="orange"

src/analysis/individualStudy/summary/utils.test.ts

@@ -99,12 +99,6 @@ function createMockAnswer(overrides: {
     incorrectAnswers: {},
     startTime: overrides.startTime,
     endTime: overrides.endTime,
-    provenanceGraph: {
-      sidebar: undefined,
-      aboveStimulus: undefined,
-      belowStimulus: undefined,
-      stimulus: undefined,
-    },
     windowEvents: [],
     timedOut: false,
     helpButtonClickedCount: 0,

src/analysis/individualStudy/thinkAloud/ThinkAloudAnalysis.tsx

@@ -121,7 +121,6 @@ export function ThinkAloudAnalysis({ visibleParticipants, storageEngine } : { vi
     if (!participantId && visibleParticipants.length > 0) {
       setSearchParams((params) => {
         params.set('participantId', visibleParticipants[0].participantId);
-        params.delete('currentTrial');
         return params;
       });
     }