[backport core/1.41] fix: Prevent corruption of workflow data due to checkState during graph loading (#9531)

src/scripts/app.ts

@@ -9,6 +9,7 @@ import { layoutStore } from '@/renderer/core/layout/store/layoutStore'
 import { flushScheduledSlotLayoutSync } from '@/renderer/extensions/vueNodes/composables/useSlotElementTracking'
 
 import { st, t } from '@/i18n'
+import { ChangeTracker } from '@/scripts/changeTracker'
 import type { IContextMenuValue } from '@/lib/litegraph/src/interfaces'
 import {
   LGraph,
@@ -1306,136 +1307,143 @@ export class ComfyApp {
       }
     }
 
+    ChangeTracker.isLoadingGraph = true
     try {
-      // @ts-expect-error Discrepancies between zod and litegraph - in progress
-      this.rootGraph.configure(graphData)
-
-      // Save original renderer version before scaling (it gets modified during scaling)
-      const originalMainGraphRenderer =
-        this.rootGraph.extra.workflowRendererVersion
-
-      // Scale main graph
-      ensureCorrectLayoutScale(originalMainGraphRenderer)
-
-      // Scale all subgraphs that were loaded with the workflow
-      // Use original main graph renderer as fallback (not the modified one)
-      for (const subgraph of this.rootGraph.subgraphs.values()) {
-        ensureCorrectLayoutScale(
-          subgraph.extra.workflowRendererVersion || originalMainGraphRenderer,
-          subgraph
-        )
-      }
+      try {
+        // @ts-expect-error Discrepancies between zod and litegraph - in progress
+        this.rootGraph.configure(graphData)
 
-      if (canvasVisible) fitView()
-    } catch (error) {
-      useDialogService().showErrorDialog(error, {
-        title: t('errorDialog.loadWorkflowTitle'),
-        reportType: 'loadWorkflowError'
-      })
-      console.error(error)
-      return
-    }
-    forEachNode(this.rootGraph, (node) => {
-      const size = node.computeSize()
-      size[0] = Math.max(node.size[0], size[0])
-      size[1] = Math.max(node.size[1], size[1])
-      node.setSize(size)
-      if (node.widgets) {
-        // If you break something in the backend and want to patch workflows in the frontend
-        // This is the place to do this
-        for (let widget of node.widgets) {
-          if (node.type == 'KSampler' || node.type == 'KSamplerAdvanced') {
-            if (widget.name == 'sampler_name') {
-              if (
-                typeof widget.value === 'string' &&
-                widget.value.startsWith('sample_')
-              ) {
-                widget.value = widget.value.slice(7)
-              }
-            }
-          }
-          if (
-            node.type == 'KSampler' ||
-            node.type == 'KSamplerAdvanced' ||
-            node.type == 'PrimitiveNode'
-          ) {
-            if (widget.name == 'control_after_generate') {
-              if (widget.value === true) {
-                widget.value = 'randomize'
-              } else if (widget.value === false) {
-                widget.value = 'fixed'
+        // Save original renderer version before scaling (it gets modified during scaling)
+        const originalMainGraphRenderer =
+          this.rootGraph.extra.workflowRendererVersion
+
+        // Scale main graph
+        ensureCorrectLayoutScale(originalMainGraphRenderer)
+
+        // Scale all subgraphs that were loaded with the workflow
+        // Use original main graph renderer as fallback (not the modified one)
+        for (const subgraph of this.rootGraph.subgraphs.values()) {
+          ensureCorrectLayoutScale(
+            subgraph.extra.workflowRendererVersion || originalMainGraphRenderer,
+            subgraph
+          )
+        }
+
+        if (canvasVisible) fitView()
+      } catch (error) {
+        useDialogService().showErrorDialog(error, {
+          title: t('errorDialog.loadWorkflowTitle'),
+          reportType: 'loadWorkflowError'
+        })
+        console.error(error)
+        return
+      }
+      forEachNode(this.rootGraph, (node) => {
+        const size = node.computeSize()
+        size[0] = Math.max(node.size[0], size[0])
+        size[1] = Math.max(node.size[1], size[1])
+        node.setSize(size)
+        if (node.widgets) {
+          // If you break something in the backend and want to patch workflows in the frontend
+          // This is the place to do this
+          for (let widget of node.widgets) {
+            if (node.type == 'KSampler' || node.type == 'KSamplerAdvanced') {
+              if (widget.name == 'sampler_name') {
+                if (
+                  typeof widget.value === 'string' &&
+                  widget.value.startsWith('sample_')
+                ) {
+                  widget.value = widget.value.slice(7)
+                }
               }
             }
-          }
-          if (widget.type == 'combo') {
-            const values = widget.options.values as
-              | (string | number | boolean)[]
-              | undefined
             if (
-              values &&
-              values.length > 0 &&
-              (widget.value == null ||
-                (reset_invalid_values &&
-                  !values.includes(widget.value as string | number | boolean)))
+              node.type == 'KSampler' ||
+              node.type == 'KSamplerAdvanced' ||
+              node.type == 'PrimitiveNode'
             ) {
-              widget.value = values[0]
+              if (widget.name == 'control_after_generate') {
+                if (widget.value === true) {
+                  widget.value = 'randomize'
+                } else if (widget.value === false) {
+                  widget.value = 'fixed'
+                }
+              }
+            }
+            if (widget.type == 'combo') {
+              const values = widget.options.values as
+                | (string | number | boolean)[]
+                | undefined
+              if (
+                values &&
+                values.length > 0 &&
+                (widget.value == null ||
+                  (reset_invalid_values &&
+                    !values.includes(
+                      widget.value as string | number | boolean
+                    )))
+              ) {
+                widget.value = values[0]
+              }
             }
           }
         }
-      }
-
-      useExtensionService().invokeExtensions('loadedGraphNode', node)
-    })
 
-    await useExtensionService().invokeExtensionsAsync(
-      'afterConfigureGraph',
-      missingNodeTypes
-    )
+        useExtensionService().invokeExtensions('loadedGraphNode', node)
+      })
 
-    const telemetryPayload = {
-      missing_node_count: missingNodeTypes.length,
-      missing_node_types: missingNodeTypes.map((node) =>
-        typeof node === 'string' ? node : node.type
-      ),
-      open_source: openSource ?? 'unknown'
-    }
-    useTelemetry()?.trackWorkflowOpened(telemetryPayload)
-    useTelemetry()?.trackWorkflowImported(telemetryPayload)
-    await useWorkflowService().afterLoadNewGraph(
-      workflow,
-      this.rootGraph.serialize() as unknown as ComfyWorkflowJSON
-    )
+      await useExtensionService().invokeExtensionsAsync(
+        'afterConfigureGraph',
+        missingNodeTypes
+      )
 
-    // If the canvas was not visible and we're a fresh load, resize the canvas and fit the view
-    // This fixes switching from app mode to a new graph mode workflow (e.g. load template)
-    if (!canvasVisible && (!workflow || typeof workflow === 'string')) {
-      this.canvas.resize()
-      requestAnimationFrame(() => fitView())
-    }
+      const telemetryPayload = {
+        missing_node_count: missingNodeTypes.length,
+        missing_node_types: missingNodeTypes.map((node) =>
+          typeof node === 'string' ? node : node.type
+        ),
+        open_source: openSource ?? 'unknown'
+      }
+      useTelemetry()?.trackWorkflowOpened(telemetryPayload)
+      useTelemetry()?.trackWorkflowImported(telemetryPayload)
+      await useWorkflowService().afterLoadNewGraph(
+        workflow,
+        this.rootGraph.serialize() as unknown as ComfyWorkflowJSON
+      )
 
-    // Store pending warnings on the workflow for deferred display
-    const activeWf = useWorkspaceStore().workflow.activeWorkflow
-    if (activeWf) {
-      const warnings: PendingWarnings = {}
-      if (missingNodeTypes.length && showMissingNodesDialog) {
-        warnings.missingNodeTypes = missingNodeTypes
+      // If the canvas was not visible and we're a fresh load, resize the canvas and fit the view
+      // This fixes switching from app mode to a new graph mode workflow (e.g. load template)
+      if (!canvasVisible && (!workflow || typeof workflow === 'string')) {
+        this.canvas.resize()
+        requestAnimationFrame(() => fitView())
       }
-      if (missingModels.length && showMissingModelsDialog) {
-        const paths = await api.getFolderPaths()
-        warnings.missingModels = { missingModels: missingModels, paths }
+
+      // Store pending warnings on the workflow for deferred display
+      const activeWf = useWorkspaceStore().workflow.activeWorkflow
+      if (activeWf) {
+        const warnings: PendingWarnings = {}
+        if (missingNodeTypes.length && showMissingNodesDialog) {
+          warnings.missingNodeTypes = missingNodeTypes
+        }
+        if (missingModels.length && showMissingModelsDialog) {
+          const paths = await api.getFolderPaths()
+          warnings.missingModels = { missingModels: missingModels, paths }
+        }
+        if (warnings.missingNodeTypes || warnings.missingModels) {
+          activeWf.pendingWarnings = warnings
+        }
       }
-      if (warnings.missingNodeTypes || warnings.missingModels) {
-        activeWf.pendingWarnings = warnings
+
+      if (!deferWarnings) {
+        useWorkflowService().showPendingWarnings()
       }
-    }
 
-    if (!deferWarnings) {
-      useWorkflowService().showPendingWarnings()
+      requestAnimationFrame(() => {
+        this.canvas.setDirty(true, true)
+      })
+    } finally {
+      ChangeTracker.isLoadingGraph = false
     }
-
-    requestAnimationFrame(() => {
-      this.canvas.setDirty(true, true)
-    })
   }
 
   async graphToPrompt(graph = this.rootGraph) {

src/scripts/changeTracker.ts

@@ -28,6 +28,14 @@ logger.setLevel('info')
 
 export class ChangeTracker {
   static MAX_HISTORY = 50
+  /**
+   * Guard flag to prevent checkState from running during loadGraphData.
+   * Between rootGraph.configure() and afterLoadNewGraph(), the rootGraph
+   * contains the NEW workflow's data while activeWorkflow still points to
+   * the OLD workflow. Any checkState call in that window would serialize
+   * the wrong graph into the old workflow's activeState, corrupting it.
+   */
+  static isLoadingGraph = false
   /**
    * The active state of the workflow.
    */
@@ -131,7 +139,7 @@ export class ChangeTracker {
   }
 
   checkState() {
-    if (!app.graph || this.changeCount) return
+    if (!app.graph || this.changeCount || ChangeTracker.isLoadingGraph) return
     const currentState = clone(app.rootGraph.serialize()) as ComfyWorkflowJSON
     if (!this.activeState) {
       this.activeState = currentState

src/stores/appModeStore.ts

@@ -9,6 +9,7 @@ import { useCanvasStore } from '@/renderer/core/canvas/canvasStore'
 import { useWorkflowStore } from '@/platform/workflow/management/stores/workflowStore'
 import { useSidebarTabStore } from '@/stores/workspace/sidebarTabStore'
 import { app } from '@/scripts/app'
+import { ChangeTracker } from '@/scripts/changeTracker'
 import { resolveNode } from '@/utils/litegraphUtil'
 
 export const useAppModeStore = defineStore('appMode', () => {
@@ -77,7 +78,7 @@ export const useAppModeStore = defineStore('appMode', () => {
         ? { inputs: selectedInputs, outputs: selectedOutputs }
         : null,
     (data) => {
-      if (!data) return
+      if (!data || ChangeTracker.isLoadingGraph) return
       const graph = app.rootGraph
       if (!graph) return
       const extra = (graph.extra ??= {})