fix(layout): enforce per-instance geometry ownership

browser_tests/tests/nodeReplacement.spec.ts

@@ -259,4 +259,43 @@ test.describe('Node replacement', { tag: ['@node', '@ui'] }, () => {
       })
     })
   }
+
+  test(
+    'Replacement keeps its position when enabling Vue Nodes',
+    { tag: ['@vue-nodes'] },
+    async ({ comfyPage }) => {
+      test.slow()
+      await setupNodeReplacement(comfyPage, mockNodeReplacementsSingle)
+      await loadWorkflowAndOpenErrorsTab(
+        comfyPage,
+        'missing/node_replacement_simple'
+      )
+      await comfyPage.settings.setSetting('Comfy.VueNodes.Enabled', false)
+      await comfyPage.nextFrame()
+
+      await getSwapNodesGroup(comfyPage.page)
+        .getByRole('button', { name: /replace node/i })
+        .click()
+
+      const [ksampler] = await comfyPage.nodeOps.getNodeRefsByTitle('KSampler')
+      await ksampler.dragBy({ x: 120, y: 90 })
+      await comfyPage.nextFrame()
+      const draggedTitlePosition = await ksampler.getTitlePosition()
+
+      await comfyPage.menu.topbar.setVueNodesEnabled(true)
+      await comfyPage.vueNodes.waitForNodes()
+
+      const { header } = await comfyPage.vueNodes.getFixtureByTitle('KSampler')
+      await expect
+        .poll(async () => {
+          const box = await header.boundingBox()
+          if (!box) return Number.POSITIVE_INFINITY
+          return Math.max(
+            Math.abs(box.x + box.width / 2 - draggedTitlePosition.x),
+            Math.abs(box.y + box.height / 2 - draggedTitlePosition.y)
+          )
+        })
+        .toBeLessThanOrEqual(2)
+    }
+  )
 })

browser_tests/tests/vueNodes/rerouteGeometry.spec.ts

@@ -3,11 +3,12 @@ import { toRerouteId } from '@/types/rerouteId'
 
 test.describe('Native reroute geometry', { tag: '@vue-nodes' }, () => {
   test('survives subgraph navigation', async ({ comfyPage }) => {
+    const REROUTE_ID = toRerouteId(1)
     await comfyPage.workflow.loadWorkflow(
       'reroute/single-native-reroute-default-workflow'
     )
     await comfyPage.canvasOps.expectRootReroutePositions({
-      [toRerouteId(1)]: { x: 372.67, y: 415.33 }
+      [REROUTE_ID]: { x: 372.67, y: 415.33 }
     })
 
     const ksampler = await comfyPage.nodeOps.getNodeRefById('3')
@@ -18,7 +19,7 @@ test.describe('Native reroute geometry', { tag: '@vue-nodes' }, () => {
     await comfyPage.subgraph.exitViaBreadcrumb()
 
     await comfyPage.canvasOps.expectRootReroutePositions({
-      [toRerouteId(1)]: { x: 372.67, y: 415.33 }
+      [REROUTE_ID]: { x: 372.67, y: 415.33 }
     })
   })
 })

src/AGENTS.md

@@ -4,6 +4,11 @@
 
 - User-friendly and actionable messages
 - Proper error propagation
+- Expected recoverable failures in mutation, lifecycle, workflow-loading, and
+  deserialization paths must preserve established result or sentinel contracts
+  and log enough context for diagnosis instead of throwing. Throws remain
+  appropriate for programmer errors, unrecoverable invariant violations, and
+  invalid input at trust boundaries when safe recovery is unavailable.
 
 ## Security
 

src/components/rightSidePanel/RightSidePanel.test.ts

@@ -0,0 +1,44 @@
+import { render } from '@testing-library/vue'
+import { createTestingPinia } from '@pinia/testing'
+import { describe, expect, it, vi } from 'vitest'
+import { createI18n } from 'vue-i18n'
+
+import { useRightSidePanelStore } from '@/stores/workspace/rightSidePanelStore'
+
+import RightSidePanel from './RightSidePanel.vue'
+
+vi.mock('@/composables/graph/useGraphHierarchy', () => ({
+  useGraphHierarchy: () => ({ findParentGroup: vi.fn() })
+}))
+
+const i18n = createI18n({
+  legacy: false,
+  locale: 'en',
+  messages: { en: {} }
+})
+
+describe('RightSidePanel', () => {
+  it('cancels a queued fallback when unmounted', async () => {
+    const pinia = createTestingPinia({
+      createSpy: vi.fn,
+      initialState: { rightSidePanel: { activeTab: 'info' } }
+    })
+    const { unmount } = render(RightSidePanel, {
+      global: {
+        plugins: [pinia, i18n],
+        stubs: {
+          EditableText: true,
+          Tab: true,
+          TabList: true,
+          Button: true
+        }
+      }
+    })
+    const rightSidePanelStore = useRightSidePanelStore()
+
+    unmount()
+    await Promise.resolve()
+
+    expect(rightSidePanelStore.openPanel).not.toHaveBeenCalled()
+  })
+})

src/components/rightSidePanel/RightSidePanel.vue

@@ -223,14 +223,25 @@ const tabs = computed<RightSidePanelTabList>(() => {
   return list
 })
 
-// Use global state for activeTab and ensure it's valid
-watchEffect(() => {
-  if (
-    !tabs.value.some((tab) => tab.value === activeTab.value) &&
-    !(activeTab.value === 'subgraph' && isSingleSubgraphNode.value)
-  ) {
-    rightSidePanelStore.openPanel(tabs.value[0].value)
-  }
+function isActiveTabAvailable() {
+  return (
+    tabs.value.some((tab) => tab.value === activeTab.value) ||
+    (activeTab.value === 'subgraph' && isSingleSubgraphNode.value)
+  )
+}
+
+// Use global state for activeTab and ensure it's valid. Deferred scans
+// (e.g. pasted-node missing-model detection) can restore the active tab
+// within the same tick, so re-check before falling back.
+watchEffect((onCleanup) => {
+  if (isActiveTabAvailable()) return
+  let cancelled = false
+  onCleanup(() => (cancelled = true))
+  queueMicrotask(() => {
+    if (!cancelled && !isActiveTabAvailable()) {
+      rightSidePanelStore.openPanel(tabs.value[0].value)
+    }
+  })
 })
 
 function resolveTitle() {

src/components/rightSidePanel/errors/ErrorGroupList.vue

@@ -326,6 +326,7 @@ import { cn } from '@comfyorg/tailwind-utils'
 
 import { useCopyToClipboard } from '@/composables/useCopyToClipboard'
 import { useFocusNode } from '@/composables/canvas/useFocusNode'
+import type { LGraphNode } from '@/lib/litegraph/src/litegraph'
 import { useTelemetry } from '@/platform/telemetry'
 import { useRightSidePanelStore } from '@/stores/workspace/rightSidePanelStore'
 import { useManagerState } from '@/workbench/extensions/manager/composables/useManagerState'
@@ -353,6 +354,7 @@ import type { ErrorGroup } from './types'
 import { isExecutionItemListGroup } from './executionItemList'
 import { selectionEmphasisClass } from './selectionEmphasis'
 import { useNodeReplacement } from '@/platform/nodeReplacement/useNodeReplacement'
+import { transferNodeLayoutRegistration } from '@/renderer/core/layout/operations/graphLayoutRegistration'
 
 interface ExecutionItemListEntry {
   key: string
@@ -372,7 +374,23 @@ const { shouldShowManagerButtons, shouldShowInstallButton, openManager } =
 const { missingNodePacks } = useMissingNodes()
 const { isInstalling: isInstallingAll, installAllPacks: installAll } =
   usePackInstall(() => missingNodePacks.value)
-const { replaceGroup, replaceAllGroups } = useNodeReplacement()
+
+function transferReplacementLayout(
+  node: LGraphNode,
+  replacement: LGraphNode
+): void {
+  const result = transferNodeLayoutRegistration(node, replacement)
+  if (result === 'applied') return
+  console.error('Failed to transfer node layout registration', {
+    graphId: node.graph?.rootGraph.id,
+    nodeId: replacement.id,
+    result
+  })
+}
+
+const { replaceGroup, replaceAllGroups } = useNodeReplacement(
+  transferReplacementLayout
+)
 
 const searchQuery = ref('')
 const expandedExecutionItemDetailKeys = ref(new Set<string>())

src/lib/litegraph/src/LGraph.serialise.test.ts

@@ -1,6 +1,6 @@
 import { createTestingPinia } from '@pinia/testing'
 import { setActivePinia } from 'pinia'
-import { beforeEach, describe } from 'vitest'
+import { beforeEach, describe, onTestFinished } from 'vitest'
 
 import {
   LGraph,
@@ -30,11 +30,15 @@ describe('LGraph Serialisation', () => {
     expect(minimalGraph.groups[0].title).toEqual(groupTitle)
 
     const serialised = JSON.stringify(minimalGraph.serialize())
+    minimalGraph.clear()
     const deserialised = JSON.parse(serialised) as ISerialisedGraph
 
     const copied = new LGraph(deserialised)
+    onTestFinished(() => copied.clear())
     expect(copied.nodes.length).toBe(1)
+    expect(copied.nodes[0].title).toEqual(nodeTitle)
     expect(copied.groups.length).toBe(1)
+    expect(copied.groups[0].title).toEqual(groupTitle)
   })
 
   test('registers connected links after a JSON round trip', ({ expect }) => {
@@ -48,6 +52,7 @@ describe('LGraph Serialisation', () => {
 
     LiteGraph.registerNodeType('test/connected', ConnectedNode)
     const graph = new LGraph()
+    onTestFinished(() => graph.clear())
     const source = LiteGraph.createNode('test/connected', 'Source')!
     const target = LiteGraph.createNode('test/connected', 'Target')!
     graph.add(source)
@@ -65,6 +70,7 @@ describe('LGraph Serialisation', () => {
     graph.clear()
 
     const copied = new LGraph(JSON.parse(serialised) as ISerialisedGraph)
+    onTestFinished(() => copied.clear())
     const copiedLink = useLinkStore().getInputSlotLink(
       copied.rootGraph.id,
       expectedLink.targetNodeId,