{"record":{"id":"d66c1ecabff80dd5","repo":"remotion-dev/remotion","slug":"context-not-initalized","errorCode":null,"errorMessage":"Context not initalized","messagePattern":"Context not initalized","errorType":"exception","errorClass":null,"httpStatus":null,"severity":"error","filePath":"packages/studio/src/helpers/client-id.tsx","lineNumber":35,"sourceCode":"\ntype Context = {\n\tpreviewServerState: PreviewServerConnectionState;\n\tconfigFileChangeRevision: number;\n\trestartRequired: boolean;\n\tsubscribeToEvent: (\n\t\ttype: EventSourceEvent['type'],\n\t\tlistener: (event: EventSourceEvent) => void,\n\t) => () => void;\n};\n\nexport const StudioServerConnectionCtx = React.createContext<Context>({\n\tpreviewServerState: {\n\t\ttype: 'init',\n\t},\n\tconfigFileChangeRevision: 0,\n\trestartRequired: false,\n\tsubscribeToEvent: () => {\n\t\tthrow new Error('Context not initalized');\n\t},\n});\n\ntype Listeners = {\n\ttype: string;\n\tlistener: (event: EventSourceEvent) => void;\n}[];\n\nexport const PreviewServerConnection: React.FC<{\n\treadonly children: React.ReactNode;\n}> = ({children}) => {\n\tconst listeners = useRef<Listeners>([]);\n\tconst latestUndoRedoEvent = useRef<\n\t\tExtract<EventSourceEvent, {type: 'undo-redo-stack-changed'}> | undefined\n\t>(undefined);\n\n\tconst subscribeToEvent = useCallback(\n\t\t(","sourceCodeStart":17,"sourceCodeEnd":53,"githubUrl":"https://github.com/remotion-dev/remotion/blob/46a3a6bf13ca367376ff18bbb06dae2e87e0d068/packages/studio/src/helpers/client-id.tsx#L17-L53","documentation":"The Studio's shared context React context has a default value whose subscribeToEvent is a stub that throws. Any consumer calling subscribeToEvent before the real provider has mounted gets this error, signaling the context was never initialized.","triggerScenarios":"Calling subscribeToEvent on the context value before the provider wrapping the Studio app renders — e.g. a component consuming the context outside the provider, or event subscription attempted during initial 'init' state.","commonSituations":"Code hooks running before StudioClientProvider mounts; tests rendering a component without the provider; race between server event wiring and app bootstrap.","solutions":["Ensure the component using subscribeToEvent is rendered inside the Studio context provider.","Defer subscription until after the provider/context is mounted (e.g. in useEffect after app init).","In tests, wrap the component in the required provider.","Guard usage with a check for the init state before subscribing."],"exampleFix":"// before\nconst {subscribeToEvent} = useContext(StudioContext);\nsubscribeToEvent(handler);\n// after\nuseEffect(() => {\n  const {subscribeToEvent} = contextRef.current;\n  return subscribeToEvent(handler);\n}, []);","handlingStrategy":"validation","validationCode":"if (!contextInitialized) throw new Error('Subscribe only after Studio provider mounts');","typeGuard":"const isReady = (ctx: {previewServerState: {type: string}}) => ctx.previewServerState.type !== 'init';","tryCatchPattern":"try {\n  subscribeToEvent(handler);\n} catch (err) {\n  if (err.message.includes('Context not initalized')) {\n    // defer until provider mounts, e.g. retry in useEffect\n  }\n}","preventionTips":["Only consume the context inside the provider tree","Subscribe in effects, not during render/module init","Wrap test renders in the required Studio provider"],"tags":["react-context","initialization","studio"],"backgroundTag":"invalid-state-transition","analyzedSha":"46a3a6bf13ca367376ff18bbb06dae2e87e0d068","analyzedAt":"2026-09-18T00:12:20.256Z","contentChangedAt":"2026-09-18T00:12:20.256Z","schemaVersion":2},"datasetVersion":"2026-09-23T08:17:48.524Z"}