Wrap all view.dispatch in setTimeout (#21590)

GitOrigin-RevId: a78e314683642e173c61b0bef95b30f5b96c82b5

services/web/frontend/js/features/source-editor/hooks/use-codemirror-scope.ts

@@ -376,6 +376,7 @@ function useCodeMirrorScope(view: EditorView) {
     if (docName) {
       docNameRef.current = docName
 
+      window.setTimeout(() => {
         view.dispatch(
           setDocName(docNameRef.current),
           setLanguage(
@@ -384,65 +385,84 @@ function useCodeMirrorScope(view: EditorView) {
             settingsRef.current.syntaxValidation
           )
         )
+      })
     }
   }, [view, docName])
 
   useEffect(() => {
     visualRef.current.visual = showVisual
+    window.setTimeout(() => {
       view.dispatch(setVisual(visualRef.current))
       view.dispatch({
         effects: EditorView.scrollIntoView(view.state.selection.main.head),
       })
       // clear performance measures and marks when switching between Source and Rich Text
       window.dispatchEvent(new Event('editor:visual-switch'))
+    })
   }, [view, showVisual])
 
   useEffect(() => {
     visualRef.current.previewByPath = previewByPath
+    window.setTimeout(() => {
       view.dispatch(setVisual(visualRef.current))
+    })
   }, [view, previewByPath])
 
   useEffect(() => {
     editableRef.current = permissions.write
+    window.setTimeout(() => {
       view.dispatch(setEditable(editableRef.current)) // the editor needs to be locked when there's a problem saving data
+    })
   }, [view, permissions.write])
 
   useEffect(() => {
     phrasesRef.current = phrases
+    window.setTimeout(() => {
       view.dispatch(setPhrases(phrases))
+    })
   }, [view, phrases])
 
   // listen to editor settings updates
   useEffect(() => {
     settingsRef.current.autoPairDelimiters = autoPairDelimiters
+    window.setTimeout(() => {
       view.dispatch(setAutoPair(autoPairDelimiters))
+    })
   }, [view, autoPairDelimiters])
 
   useEffect(() => {
     settingsRef.current.autoComplete = autoComplete
+    window.setTimeout(() => {
       view.dispatch(
         setAutoComplete({
           enabled: autoComplete,
           projectFeatures: projectFeaturesRef.current,
         })
       )
+    })
   }, [view, autoComplete])
 
   useEffect(() => {
     settingsRef.current.mode = mode
     setKeybindings(mode).then(spec => {
+      window.setTimeout(() => {
         view.dispatch(spec)
       })
+    })
   }, [view, mode])
 
   useEffect(() => {
     settingsRef.current.syntaxValidation = syntaxValidation
+    window.setTimeout(() => {
       view.dispatch(setSyntaxValidation(syntaxValidation))
+    })
   }, [view, syntaxValidation])
 
   useEffect(() => {
     settingsRef.current.mathPreview = mathPreview
+    window.setTimeout(() => {
       view.dispatch(setMathPreview(mathPreview))
+    })
   }, [view, mathPreview])
 
   const emitSyncToPdf = useScopeEventEmitter('cursor:editor:syncToPdf')
@@ -511,10 +531,9 @@ function useCodeMirrorScope(view: EditorView) {
 
   // enable/disable the compile log linter as appropriate
   useEffect(() => {
-    // dispatch in a timeout, so the dispatch isn't in the same cycle as the edit which caused it
     window.setTimeout(() => {
       view.dispatch(showCompileLogDiagnostics(enableCompileLogLinter))
-    }, 0)
+    })
   }, [view, enableCompileLogLinter])
 
   // set the compile log annotations when they change
@@ -522,7 +541,6 @@ function useCodeMirrorScope(view: EditorView) {
     if (currentDoc && logEntryAnnotations) {
       const annotations = logEntryAnnotations[currentDoc.doc_id]
 
-      // dispatch in a timeout, so the dispatch isn't in the same cycle as the edit which caused it
       window.setTimeout(() => {
         view.dispatch(
           setAnnotations(view.state, annotations || []),
@@ -563,7 +581,9 @@ function useCodeMirrorScope(view: EditorView) {
 
   const handleRemoveLearnedWords = useCallback(
     (event: CustomEvent<string>) => {
+      window.setTimeout(() => {
         view.dispatch(removeLearnedWord(spellCheckLanguage, event.detail))
+      })
     },
     [spellCheckLanguage, view]
   )
@@ -571,7 +591,9 @@ function useCodeMirrorScope(view: EditorView) {
   useEventListener('learnedWords:remove', handleRemoveLearnedWords)
 
   const handleResetLearnedWords = useCallback(() => {
+    window.setTimeout(() => {
       view.dispatch(resetLearnedWords())
+    })
   }, [view])
 
   useEventListener('learnedWords:reset', handleResetLearnedWords)
@@ -584,7 +606,9 @@ function useCodeMirrorScope(view: EditorView) {
   )
 
   useEffect(() => {
+    window.setTimeout(() => {
       view.dispatch(reviewPanelToggled())
+    })
   }, [reviewPanelOpen, miniReviewPanelVisible, view])
 }