Support drop events on chrome

.github/workflows/release-version-bump.yaml

@@ -30,7 +30,6 @@ concurrency:
 
 jobs:
   bump-version:
-    if: github.repository == 'Comfy-Org/ComfyUI_frontend'
     runs-on: ubuntu-latest
     permissions:
       contents: write

.github/workflows/weekly-docs-check.yaml

@@ -18,7 +18,6 @@ concurrency:
 
 jobs:
   docs-check:
-    if: github.repository == 'Comfy-Org/ComfyUI_frontend'
     runs-on: ubuntu-latest
     timeout-minutes: 45
     steps:

CODEOWNERS

@@ -51,9 +51,6 @@
 # Manager
 /src/workbench/extensions/manager/                @viva-jinyi @christian-byrne @ltdrdata
 
-# Model-to-node mappings (cloud team)
-/src/platform/assets/mappings/                    @deepme987
-
 # LLM Instructions (blank on purpose)
 .claude/
 .cursor/

apps/website/.gitignore

@@ -1,2 +0,0 @@
-dist/
-.astro/

apps/website/astro.config.ts

@@ -1,24 +0,0 @@
-import { defineConfig } from 'astro/config'
-import vue from '@astrojs/vue'
-import tailwindcss from '@tailwindcss/vite'
-
-export default defineConfig({
-  site: 'https://comfy.org',
-  output: 'static',
-  integrations: [vue()],
-  vite: {
-    plugins: [tailwindcss()]
-  },
-  build: {
-    assetsPrefix: process.env.VERCEL_URL
-      ? `https://${process.env.VERCEL_URL}`
-      : undefined
-  },
-  i18n: {
-    locales: ['en', 'zh-CN'],
-    defaultLocale: 'en',
-    routing: {
-      prefixDefaultLocale: false
-    }
-  }
-})

apps/website/package.json

@@ -1,80 +0,0 @@
-{
-  "name": "@comfyorg/website",
-  "version": "0.0.1",
-  "private": true,
-  "type": "module",
-  "scripts": {
-    "dev": "astro dev",
-    "build": "astro build",
-    "preview": "astro preview"
-  },
-  "dependencies": {
-    "@comfyorg/design-system": "workspace:*",
-    "@vercel/analytics": "catalog:",
-    "vue": "catalog:"
-  },
-  "devDependencies": {
-    "@astrojs/vue": "catalog:",
-    "@tailwindcss/vite": "catalog:",
-    "astro": "catalog:",
-    "tailwindcss": "catalog:",
-    "typescript": "catalog:"
-  },
-  "nx": {
-    "tags": [
-      "scope:website",
-      "type:app"
-    ],
-    "targets": {
-      "dev": {
-        "executor": "nx:run-commands",
-        "continuous": true,
-        "options": {
-          "cwd": "apps/website",
-          "command": "astro dev"
-        }
-      },
-      "serve": {
-        "executor": "nx:run-commands",
-        "continuous": true,
-        "options": {
-          "cwd": "apps/website",
-          "command": "astro dev"
-        }
-      },
-      "build": {
-        "executor": "nx:run-commands",
-        "cache": true,
-        "dependsOn": [
-          "^build"
-        ],
-        "options": {
-          "cwd": "apps/website",
-          "command": "astro build"
-        },
-        "outputs": [
-          "{projectRoot}/dist"
-        ]
-      },
-      "preview": {
-        "executor": "nx:run-commands",
-        "continuous": true,
-        "dependsOn": [
-          "build"
-        ],
-        "options": {
-          "cwd": "apps/website",
-          "command": "astro preview"
-        }
-      },
-      "typecheck": {
-        "executor": "nx:run-commands",
-        "cache": true,
-        "options": {
-          "cwd": "apps/website",
-          "command": "astro check"
-        }
-      }
-    }
-  }
-}

apps/website/src/env.d.ts

@@ -1 +0,0 @@
-/// <reference types="astro/client" />

apps/website/src/styles/global.css

@@ -1,2 +0,0 @@
-@import 'tailwindcss';
-@import '@comfyorg/design-system/css/base.css';

apps/website/tsconfig.json

@@ -1,9 +0,0 @@
-{
-  "extends": "astro/tsconfigs/strict",
-  "compilerOptions": {
-    "paths": {
-      "@/*": ["./src/*"]
-    }
-  },
-  "include": ["src/**/*", "astro.config.mjs"]
-}

browser_tests/assets/subgraphs/test-values-input-subgraph.json

@@ -1,407 +0,0 @@
-{
-  "id": "0cc04f4c-d744-462d-8638-4e5f5e3947e7",
-  "revision": 0,
-  "last_node_id": 19,
-  "last_link_id": 24,
-  "nodes": [
-    {
-      "id": 14,
-      "type": "CLIPLoader",
-      "pos": [143.16716182216328, 290.16372862874033],
-      "size": [270, 117.3125],
-      "flags": {},
-      "order": 0,
-      "mode": 0,
-      "inputs": [],
-      "outputs": [
-        {
-          "name": "CLIP",
-          "type": "CLIP",
-          "links": [21]
-        }
-      ],
-      "properties": {
-        "Node name for S&R": "CLIPLoader"
-      },
-      "widgets_values": [null, "stable_diffusion", "default"]
-    },
-    {
-      "id": 18,
-      "type": "PreviewImage",
-      "pos": [1305.1455526601603, 472.17095792625025],
-      "size": [225, 48],
-      "flags": {},
-      "order": 4,
-      "mode": 0,
-      "inputs": [
-        {
-          "name": "images",
-          "type": "IMAGE",
-          "link": 24
-        }
-      ],
-      "outputs": [],
-      "properties": {
-        "Node name for S&R": "PreviewImage"
-      },
-      "widgets_values": []
-    },
-    {
-      "id": 19,
-      "type": "314bbb9f-f1cc-456c-b14f-2ba92bd4a597",
-      "pos": [794.198171390827, 452.45433419677147],
-      "size": [225, 172],
-      "flags": {},
-      "order": 3,
-      "mode": 0,
-      "inputs": [
-        {
-          "label": "renamed_clip",
-          "name": "clip",
-          "type": "CLIP",
-          "link": 21
-        },
-        {
-          "label": "renamed_seed",
-          "name": "seed",
-          "type": "INT",
-          "widget": {
-            "name": "seed"
-          },
-          "link": 22
-        },
-        {
-          "label": "renamed_vae",
-          "name": "vae",
-          "type": "VAE",
-          "link": 23
-        }
-      ],
-      "outputs": [
-        {
-          "name": "IMAGE",
-          "type": "IMAGE",
-          "links": [24]
-        }
-      ],
-      "title": "Input Test Subgraph",
-      "properties": {
-        "proxyWidgets": [
-          ["12", "seed"],
-          ["15", "text"]
-        ]
-      },
-      "widgets_values": []
-    },
-    {
-      "id": 13,
-      "type": "PrimitiveInt",
-      "pos": [155.04048166054417, 773.3816055422594],
-      "size": [270, 82],
-      "flags": {},
-      "order": 1,
-      "mode": 0,
-      "inputs": [],
-      "outputs": [
-        {
-          "name": "INT",
-          "type": "INT",
-          "links": [22]
-        }
-      ],
-      "title": "Seed Int",
-      "properties": {
-        "Node name for S&R": "PrimitiveInt"
-      },
-      "widgets_values": [0, "randomize"]
-    },
-    {
-      "id": 17,
-      "type": "VAELoader",
-      "pos": [163.6043676075426, 543.9624492717659],
-      "size": [270, 82.65625],
-      "flags": {},
-      "order": 2,
-      "mode": 0,
-      "inputs": [],
-      "outputs": [
-        {
-          "name": "VAE",
-          "type": "VAE",
-          "links": [23]
-        }
-      ],
-      "properties": {
-        "Node name for S&R": "VAELoader"
-      },
-      "widgets_values": ["pixel_space"]
-    }
-  ],
-  "links": [
-    [21, 14, 0, 19, 0, "CLIP"],
-    [22, 13, 0, 19, 1, "INT"],
-    [23, 17, 0, 19, 2, "VAE"],
-    [24, 19, 0, 18, 0, "IMAGE"]
-  ],
-  "groups": [],
-  "definitions": {
-    "subgraphs": [
-      {
-        "id": "314bbb9f-f1cc-456c-b14f-2ba92bd4a597",
-        "version": 1,
-        "state": {
-          "lastGroupId": 0,
-          "lastNodeId": 19,
-          "lastLinkId": 24,
-          "lastRerouteId": 0
-        },
-        "revision": 0,
-        "config": {},
-        "name": "Input Test Subgraph",
-        "inputNode": {
-          "id": -10,
-          "bounding": [
-            358.8694807105848, 439.23932667242485, 123.14453125,
-            99.99999999999994
-          ]
-        },
-        "outputNode": {
-          "id": -20,
-          "bounding": [1408.5510580294986, 463.2512895126797, 120, 60]
-        },
-        "inputs": [
-          {
-            "id": "cfaad2dc-7758-412c-a4ac-dc2e6d37b28c",
-            "name": "clip",
-            "type": "CLIP",
-            "linkIds": [16],
-            "localized_name": "clip",
-            "label": "renamed_clip",
-            "pos": [462.0140119605848, 459.23932667242485]
-          },
-          {
-            "id": "2e4600ea-e1b1-42ca-b43a-e066fd080774",
-            "name": "seed",
-            "type": "INT",
-            "linkIds": [15],
-            "localized_name": "seed",
-            "label": "renamed_seed",
-            "pos": [462.0140119605848, 479.23932667242485]
-          },
-          {
-            "id": "86ed2da7-db02-454a-9362-70a3fa3e91bf",
-            "name": "vae",
-            "type": "VAE",
-            "linkIds": [19],
-            "localized_name": "vae",
-            "label": "renamed_vae",
-            "pos": [462.0140119605848, 499.23932667242485]
-          }
-        ],
-        "outputs": [
-          {
-            "id": "8670d1a7-0d44-4688-b7dd-d4b423f1aee0",
-            "name": "IMAGE",
-            "type": "IMAGE",
-            "linkIds": [20],
-            "localized_name": "IMAGE",
-            "pos": [1428.5510580294986, 483.2512895126797]
-          }
-        ],
-        "widgets": [],
-        "nodes": [
-          {
-            "id": 12,
-            "type": "KSampler",
-            "pos": [769.2424728654022, 512.726159169824],
-            "size": [270, 262],
-            "flags": {},
-            "order": 0,
-            "mode": 0,
-            "inputs": [
-              {
-                "localized_name": "model",
-                "name": "model",
-                "type": "MODEL",
-                "link": null
-              },
-              {
-                "localized_name": "positive",
-                "name": "positive",
-                "type": "CONDITIONING",
-                "link": 17
-              },
-              {
-                "localized_name": "negative",
-                "name": "negative",
-                "type": "CONDITIONING",
-                "link": null
-              },
-              {
-                "localized_name": "latent_image",
-                "name": "latent_image",
-                "type": "LATENT",
-                "link": null
-              },
-              {
-                "localized_name": "seed",
-                "name": "seed",
-                "type": "INT",
-                "widget": {
-                  "name": "seed"
-                },
-                "link": 15
-              }
-            ],
-            "outputs": [
-              {
-                "localized_name": "LATENT",
-                "name": "LATENT",
-                "type": "LATENT",
-                "links": [18]
-              }
-            ],
-            "properties": {
-              "Node name for S&R": "KSampler"
-            },
-            "widgets_values": [0, "randomize", 20, 8, "euler", "simple", 1]
-          },
-          {
-            "id": 16,
-            "type": "VAEDecode",
-            "pos": [1208.5510580294986, 469.21581253470083],
-            "size": [140, 46],
-            "flags": {},
-            "order": 2,
-            "mode": 0,
-            "inputs": [
-              {
-                "localized_name": "samples",
-                "name": "samples",
-                "type": "LATENT",
-                "link": 18
-              },
-              {
-                "localized_name": "vae",
-                "name": "vae",
-                "type": "VAE",
-                "link": 19
-              }
-            ],
-            "outputs": [
-              {
-                "localized_name": "IMAGE",
-                "name": "IMAGE",
-                "type": "IMAGE",
-                "links": [20]
-              }
-            ],
-            "properties": {
-              "Node name for S&R": "VAEDecode"
-            },
-            "widgets_values": []
-          },
-          {
-            "id": 15,
-            "type": "CLIPTextEncode",
-            "pos": [681.4596332342014, 243.17567172890932],
-            "size": [400, 200],
-            "flags": {},
-            "order": 1,
-            "mode": 0,
-            "inputs": [
-              {
-                "localized_name": "clip",
-                "name": "clip",
-                "type": "CLIP",
-                "link": 16
-              },
-              {
-                "label": "renamed_from_sidepanel",
-                "localized_name": "text",
-                "name": "text",
-                "type": "STRING",
-                "widget": {
-                  "name": "text"
-                },
-                "link": null
-              }
-            ],
-            "outputs": [
-              {
-                "localized_name": "CONDITIONING",
-                "name": "CONDITIONING",
-                "type": "CONDITIONING",
-                "links": [17]
-              }
-            ],
-            "properties": {
-              "Node name for S&R": "CLIPTextEncode"
-            },
-            "widgets_values": [""]
-          }
-        ],
-        "groups": [],
-        "links": [
-          {
-            "id": 17,
-            "origin_id": 15,
-            "origin_slot": 0,
-            "target_id": 12,
-            "target_slot": 1,
-            "type": "CONDITIONING"
-          },
-          {
-            "id": 18,
-            "origin_id": 12,
-            "origin_slot": 0,
-            "target_id": 16,
-            "target_slot": 0,
-            "type": "LATENT"
-          },
-          {
-            "id": 16,
-            "origin_id": -10,
-            "origin_slot": 0,
-            "target_id": 15,
-            "target_slot": 0,
-            "type": "CLIP"
-          },
-          {
-            "id": 15,
-            "origin_id": -10,
-            "origin_slot": 1,
-            "target_id": 12,
-            "target_slot": 4,
-            "type": "INT"
-          },
-          {
-            "id": 19,
-            "origin_id": -10,
-            "origin_slot": 2,
-            "target_id": 16,
-            "target_slot": 1,
-            "type": "VAE"
-          },
-          {
-            "id": 20,
-            "origin_id": 16,
-            "origin_slot": 0,
-            "target_id": -20,
-            "target_slot": 0,
-            "type": "IMAGE"
-          }
-        ],
-        "extra": {}
-      }
-    ]
-  },
-  "config": {},
-  "extra": {
-    "ds": {
-      "scale": 0.6727925600199565,
-      "offset": [446.69747171876463, 99.95078257277316]
-    }
-  },
-  "version": 0.4
-}

browser_tests/fixtures/helpers/CanvasHelper.ts

@@ -91,12 +91,6 @@ export class CanvasHelper {
     await this.page.mouse.move(10, 10)
   }
 
-  async isReadOnly(): Promise<boolean> {
-    return this.page.evaluate(() => {
-      return window.app!.canvas.state.readOnly
-    })
-  }
-
   async getScale(): Promise<number> {
     return this.page.evaluate(() => {
       return window.app!.canvas.ds.scale

browser_tests/fixtures/selectors.ts

@@ -28,15 +28,10 @@ export const TestIds = {
     settingsTabAbout: 'settings-tab-about',
     confirm: 'confirm-dialog',
     errorOverlay: 'error-overlay',
-    errorOverlaySeeErrors: 'error-overlay-see-errors',
     runtimeErrorPanel: 'runtime-error-panel',
     missingNodeCard: 'missing-node-card',
-    errorCardFindOnGithub: 'error-card-find-on-github',
-    errorCardCopy: 'error-card-copy',
     about: 'about-panel',
-    whatsNewSection: 'whats-new-section',
-    missingNodePacksGroup: 'error-group-missing-node',
-    missingModelsGroup: 'error-group-missing-model'
+    whatsNewSection: 'whats-new-section'
   },
   keybindings: {
     presetMenu: 'keybinding-preset-menu'
@@ -81,10 +76,6 @@ export const TestIds = {
   },
   user: {
     currentUserIndicator: 'current-user-indicator'
-  },
-  errors: {
-    imageLoadError: 'error-loading-image',
-    videoLoadError: 'error-loading-video'
   }
 } as const
 
@@ -110,4 +101,3 @@ export type TestIdValue =
       (id: string) => string
     >
   | (typeof TestIds.user)[keyof typeof TestIds.user]
-  | (typeof TestIds.errors)[keyof typeof TestIds.errors]

browser_tests/helpers/subgraphTestUtils.ts

@@ -1,5 +1,3 @@
-import type { Page } from '@playwright/test'
-
 import type { LGraph, Subgraph } from '../../src/lib/litegraph/src/litegraph'
 import { isSubgraph } from '../../src/utils/typeGuardUtil'
 
@@ -16,30 +14,3 @@ export function assertSubgraph(
     )
   }
 }
-
-/**
- * Returns the widget-input slot Y position and the node title height
- * for the promoted "text" input on the SubgraphNode.
- *
- * The slot Y should be at the widget row, not the header. A value near
- * zero or negative indicates the slot is positioned at the header (the bug).
- */
-export function getTextSlotPosition(page: Page, nodeId: string) {
-  return page.evaluate((id) => {
-    const node = window.app!.canvas.graph!.getNodeById(id)
-    if (!node) return null
-
-    const titleHeight = window.LiteGraph!.NODE_TITLE_HEIGHT
-
-    for (const input of node.inputs) {
-      if (!input.widget || input.type !== 'STRING') continue
-      return {
-        hasPos: !!input.pos,
-        posY: input.pos?.[1] ?? null,
-        widgetName: input.widget.name,
-        titleHeight
-      }
-    }
-    return null
-  }, nodeId)
-}

browser_tests/tests/colorPalette.spec.ts

@@ -38,13 +38,16 @@ const customColorPalettes = {
         CLEAR_BACKGROUND_COLOR: '#222222',
         NODE_TITLE_COLOR: 'rgba(255,255,255,.75)',
         NODE_SELECTED_TITLE_COLOR: '#FFF',
+        NODE_TEXT_SIZE: 14,
         NODE_TEXT_COLOR: '#b8b8b8',
+        NODE_SUBTEXT_SIZE: 12,
         NODE_DEFAULT_COLOR: 'rgba(0,0,0,.8)',
         NODE_DEFAULT_BGCOLOR: 'rgba(22,22,22,.8)',
         NODE_DEFAULT_BOXCOLOR: 'rgba(255,255,255,.75)',
         NODE_DEFAULT_SHAPE: 'box',
         NODE_BOX_OUTLINE_COLOR: '#236692',
         DEFAULT_SHADOW_COLOR: 'rgba(0,0,0,0)',
+        DEFAULT_GROUP_FONT: 24,
         WIDGET_BGCOLOR: '#242424',
         WIDGET_OUTLINE_COLOR: '#333',
         WIDGET_TEXT_COLOR: '#a3a3a8',
@@ -99,13 +102,16 @@ const customColorPalettes = {
         CLEAR_BACKGROUND_COLOR: '#000',
         NODE_TITLE_COLOR: 'rgba(255,255,255,.75)',
         NODE_SELECTED_TITLE_COLOR: '#FFF',
+        NODE_TEXT_SIZE: 14,
         NODE_TEXT_COLOR: '#b8b8b8',
+        NODE_SUBTEXT_SIZE: 12,
         NODE_DEFAULT_COLOR: 'rgba(0,0,0,.8)',
         NODE_DEFAULT_BGCOLOR: 'rgba(22,22,22,.8)',
         NODE_DEFAULT_BOXCOLOR: 'rgba(255,255,255,.75)',
         NODE_DEFAULT_SHAPE: 'box',
         NODE_BOX_OUTLINE_COLOR: '#236692',
         DEFAULT_SHADOW_COLOR: 'rgba(0,0,0,0)',
+        DEFAULT_GROUP_FONT: 24,
         WIDGET_BGCOLOR: '#242424',
         WIDGET_OUTLINE_COLOR: '#333',
         WIDGET_TEXT_COLOR: '#a3a3a8',

browser_tests/tests/defaultKeybindings.spec.ts

@@ -1,318 +0,0 @@
-import { expect } from '@playwright/test'
-
-import type { ComfyPage } from '../fixtures/ComfyPage'
-import { comfyPageFixture as test } from '../fixtures/ComfyPage'
-
-async function pressKeyAndExpectRequest(
-  comfyPage: ComfyPage,
-  key: string,
-  urlPattern: string,
-  method: string = 'POST'
-) {
-  const requestPromise = comfyPage.page.waitForRequest(
-    (req) => req.url().includes(urlPattern) && req.method() === method,
-    { timeout: 5000 }
-  )
-  await comfyPage.page.keyboard.press(key)
-  return requestPromise
-}
-
-test.describe('Default Keybindings', { tag: '@keyboard' }, () => {
-  test.describe('Sidebar Toggle Shortcuts', () => {
-    test.beforeEach(async ({ comfyPage }) => {
-      await comfyPage.settings.setSetting('Comfy.UseNewMenu', 'Top')
-      await comfyPage.canvas.click({ position: { x: 400, y: 400 } })
-      await comfyPage.nextFrame()
-    })
-
-    const sidebarTabs = [
-      { key: 'KeyW', tabId: 'workflows', label: 'workflows' },
-      { key: 'KeyN', tabId: 'node-library', label: 'node library' },
-      { key: 'KeyM', tabId: 'model-library', label: 'model library' },
-      { key: 'KeyA', tabId: 'assets', label: 'assets' }
-    ] as const
-
-    for (const { key, tabId, label } of sidebarTabs) {
-      test(`'${key}' toggles ${label} sidebar`, async ({ comfyPage }) => {
-        const selectedButton = comfyPage.page.locator(
-          `.${tabId}-tab-button.side-bar-button-selected`
-        )
-
-        await expect(selectedButton).not.toBeVisible()
-
-        await comfyPage.canvas.press(key)
-        await comfyPage.nextFrame()
-        await expect(selectedButton).toBeVisible()
-
-        await comfyPage.canvas.press(key)
-        await comfyPage.nextFrame()
-        await expect(selectedButton).not.toBeVisible()
-      })
-    }
-  })
-
-  test.describe('Canvas View Controls', () => {
-    test("'Alt+=' zooms in", async ({ comfyPage }) => {
-      const initialScale = await comfyPage.canvasOps.getScale()
-
-      await comfyPage.canvas.press('Alt+Equal')
-      await comfyPage.nextFrame()
-
-      const newScale = await comfyPage.canvasOps.getScale()
-      expect(newScale).toBeGreaterThan(initialScale)
-    })
-
-    test("'Alt+-' zooms out", async ({ comfyPage }) => {
-      const initialScale = await comfyPage.canvasOps.getScale()
-
-      await comfyPage.canvas.press('Alt+Minus')
-      await comfyPage.nextFrame()
-
-      const newScale = await comfyPage.canvasOps.getScale()
-      expect(newScale).toBeLessThan(initialScale)
-    })
-
-    test("'.' fits view to nodes", async ({ comfyPage }) => {
-      // Set scale very small so fit-view will zoom back to fit nodes
-      await comfyPage.canvasOps.setScale(0.1)
-      const scaleBefore = await comfyPage.canvasOps.getScale()
-      expect(scaleBefore).toBeCloseTo(0.1, 1)
-
-      // Click canvas to ensure focus is within graph-canvas-container
-      await comfyPage.canvas.click({ position: { x: 400, y: 400 } })
-      await comfyPage.nextFrame()
-
-      await comfyPage.canvas.press('Period')
-      await comfyPage.nextFrame()
-
-      const scaleAfter = await comfyPage.canvasOps.getScale()
-      expect(scaleAfter).toBeGreaterThan(scaleBefore)
-    })
-
-    test("'h' locks canvas", async ({ comfyPage }) => {
-      expect(await comfyPage.canvasOps.isReadOnly()).toBe(false)
-
-      await comfyPage.canvas.press('KeyH')
-      await comfyPage.nextFrame()
-
-      expect(await comfyPage.canvasOps.isReadOnly()).toBe(true)
-    })
-
-    test("'v' unlocks canvas", async ({ comfyPage }) => {
-      // Lock first
-      await comfyPage.command.executeCommand('Comfy.Canvas.Lock')
-      await comfyPage.nextFrame()
-      expect(await comfyPage.canvasOps.isReadOnly()).toBe(true)
-
-      await comfyPage.canvas.press('KeyV')
-      await comfyPage.nextFrame()
-
-      expect(await comfyPage.canvasOps.isReadOnly()).toBe(false)
-    })
-  })
-
-  test.describe('Node State Toggles', () => {
-    test("'Alt+c' collapses and expands selected nodes", async ({
-      comfyPage
-    }) => {
-      const nodes = await comfyPage.nodeOps.getNodeRefsByType('CLIPTextEncode')
-      expect(nodes.length).toBeGreaterThan(0)
-      const node = nodes[0]
-
-      await node.click('title')
-      await comfyPage.nextFrame()
-
-      expect(await node.isCollapsed()).toBe(false)
-
-      await comfyPage.canvas.press('Alt+KeyC')
-      await comfyPage.nextFrame()
-      expect(await node.isCollapsed()).toBe(true)
-
-      await comfyPage.canvas.press('Alt+KeyC')
-      await comfyPage.nextFrame()
-      expect(await node.isCollapsed()).toBe(false)
-    })
-
-    test("'Ctrl+m' mutes and unmutes selected nodes", async ({ comfyPage }) => {
-      const nodes = await comfyPage.nodeOps.getNodeRefsByType('CLIPTextEncode')
-      expect(nodes.length).toBeGreaterThan(0)
-      const node = nodes[0]
-
-      await node.click('title')
-      await comfyPage.nextFrame()
-
-      // Normal mode is ALWAYS (0)
-      const getMode = () =>
-        comfyPage.page.evaluate((nodeId) => {
-          return window.app!.canvas.graph!.getNodeById(nodeId)!.mode
-        }, node.id)
-
-      expect(await getMode()).toBe(0)
-
-      await comfyPage.canvas.press('Control+KeyM')
-      await comfyPage.nextFrame()
-      // NEVER (2) = muted
-      expect(await getMode()).toBe(2)
-
-      await comfyPage.canvas.press('Control+KeyM')
-      await comfyPage.nextFrame()
-      expect(await getMode()).toBe(0)
-    })
-  })
-
-  test.describe('Mode and Panel Toggles', () => {
-    test("'Alt+m' toggles app mode", async ({ comfyPage }) => {
-      await comfyPage.settings.setSetting('Comfy.UseNewMenu', 'Top')
-
-      // Set up linearData so app mode has something to show
-      await comfyPage.appMode.enterAppModeWithInputs([])
-      await expect(comfyPage.appMode.linearWidgets).toBeVisible()
-
-      // Toggle off with Alt+m
-      await comfyPage.page.keyboard.press('Alt+KeyM')
-      await comfyPage.nextFrame()
-      await expect(comfyPage.appMode.linearWidgets).not.toBeVisible()
-
-      // Toggle on again
-      await comfyPage.page.keyboard.press('Alt+KeyM')
-      await comfyPage.nextFrame()
-      await expect(comfyPage.appMode.linearWidgets).toBeVisible()
-    })
-
-    test("'Alt+Shift+m' toggles minimap", async ({ comfyPage }) => {
-      await comfyPage.settings.setSetting('Comfy.UseNewMenu', 'Top')
-      await comfyPage.settings.setSetting('Comfy.Minimap.Visible', true)
-      await comfyPage.settings.setSetting('Comfy.Graph.CanvasMenu', true)
-      await comfyPage.workflow.loadWorkflow('default')
-
-      const minimap = comfyPage.page.locator('.litegraph-minimap')
-      await expect(minimap).toBeVisible()
-
-      await comfyPage.page.keyboard.press('Alt+Shift+KeyM')
-      await comfyPage.nextFrame()
-      await expect(minimap).not.toBeVisible()
-
-      await comfyPage.page.keyboard.press('Alt+Shift+KeyM')
-      await comfyPage.nextFrame()
-      await expect(minimap).toBeVisible()
-    })
-
-    test("'Ctrl+`' toggles terminal/logs panel", async ({ comfyPage }) => {
-      await comfyPage.settings.setSetting('Comfy.UseNewMenu', 'Top')
-
-      await expect(comfyPage.bottomPanel.root).not.toBeVisible()
-
-      await comfyPage.page.keyboard.press('Control+Backquote')
-      await comfyPage.nextFrame()
-      await expect(comfyPage.bottomPanel.root).toBeVisible()
-
-      await comfyPage.page.keyboard.press('Control+Backquote')
-      await comfyPage.nextFrame()
-      await expect(comfyPage.bottomPanel.root).not.toBeVisible()
-    })
-  })
-
-  test.describe('Queue and Execution', () => {
-    test("'Ctrl+Enter' queues prompt", async ({ comfyPage }) => {
-      const request = await pressKeyAndExpectRequest(
-        comfyPage,
-        'Control+Enter',
-        '/prompt',
-        'POST'
-      )
-      expect(request.url()).toContain('/prompt')
-    })
-
-    test("'Ctrl+Shift+Enter' queues prompt to front", async ({ comfyPage }) => {
-      const request = await pressKeyAndExpectRequest(
-        comfyPage,
-        'Control+Shift+Enter',
-        '/prompt',
-        'POST'
-      )
-      const body = request.postDataJSON()
-      expect(body.front).toBe(true)
-    })
-
-    test("'Ctrl+Alt+Enter' interrupts execution", async ({ comfyPage }) => {
-      const request = await pressKeyAndExpectRequest(
-        comfyPage,
-        'Control+Alt+Enter',
-        '/interrupt',
-        'POST'
-      )
-      expect(request.url()).toContain('/interrupt')
-    })
-  })
-
-  test.describe('File Operations', () => {
-    test("'Ctrl+s' triggers save workflow", async ({ comfyPage }) => {
-      // On a new unsaved workflow, Ctrl+s triggers Save As dialog.
-      // The dialog appearing proves the keybinding was intercepted by the app.
-      await comfyPage.page.keyboard.press('Control+s')
-      await comfyPage.nextFrame()
-
-      // The Save As dialog should appear (p-dialog overlay)
-      const dialogOverlay = comfyPage.page.locator('.p-dialog-mask')
-      await expect(dialogOverlay).toBeVisible({ timeout: 3000 })
-
-      // Dismiss the dialog
-      await comfyPage.page.keyboard.press('Escape')
-      await comfyPage.nextFrame()
-    })
-
-    test("'Ctrl+o' triggers open workflow", async ({ comfyPage }) => {
-      // Ctrl+o calls app.ui.loadFile() which clicks a hidden file input.
-      // Detect the file input click via an event listener.
-      await comfyPage.page.evaluate(() => {
-        window.TestCommand = false
-        const fileInputs =
-          document.querySelectorAll<HTMLInputElement>('input[type="file"]')
-        for (const input of fileInputs) {
-          input.addEventListener('click', () => {
-            window.TestCommand = true
-          })
-        }
-      })
-
-      await comfyPage.page.keyboard.press('Control+o')
-      await comfyPage.nextFrame()
-
-      expect(await comfyPage.page.evaluate(() => window.TestCommand)).toBe(true)
-    })
-  })
-
-  test.describe('Graph Operations', () => {
-    test("'Ctrl+Shift+e' converts selection to subgraph", async ({
-      comfyPage
-    }) => {
-      const initialCount = await comfyPage.nodeOps.getGraphNodesCount()
-      expect(initialCount).toBeGreaterThan(1)
-
-      // Select all nodes
-      await comfyPage.canvas.press('Control+a')
-      await comfyPage.nextFrame()
-
-      await comfyPage.page.keyboard.press('Control+Shift+KeyE')
-      await comfyPage.nextFrame()
-
-      // After conversion, node count should decrease
-      // (multiple nodes replaced by single subgraph node)
-      await expect
-        .poll(() => comfyPage.nodeOps.getGraphNodesCount(), {
-          timeout: 5000
-        })
-        .toBeLessThan(initialCount)
-    })
-
-    test("'r' refreshes node definitions", async ({ comfyPage }) => {
-      const request = await pressKeyAndExpectRequest(
-        comfyPage,
-        'KeyR',
-        '/object_info',
-        'GET'
-      )
-      expect(request.url()).toContain('/object_info')
-    })
-  })
-})

browser_tests/tests/dialog.spec.ts

@@ -28,7 +28,7 @@ test.describe('Missing nodes in Error Overlay', { tag: '@ui' }, () => {
     )
     await expect(errorOverlay).toBeVisible()
 
-    const missingNodesTitle = errorOverlay.getByText(/Missing Node Packs/)
+    const missingNodesTitle = comfyPage.page.getByText(/Missing Node Packs/)
     await expect(missingNodesTitle).toBeVisible()
   })
 
@@ -42,13 +42,11 @@ test.describe('Missing nodes in Error Overlay', { tag: '@ui' }, () => {
     )
     await expect(errorOverlay).toBeVisible()
 
-    const missingNodesTitle = errorOverlay.getByText(/Missing Node Packs/)
+    const missingNodesTitle = comfyPage.page.getByText(/Missing Node Packs/)
     await expect(missingNodesTitle).toBeVisible()
 
     // Click "See Errors" to open the errors tab and verify subgraph node content
-    await errorOverlay
-      .getByTestId(TestIds.dialogs.errorOverlaySeeErrors)
-      .click()
+    await errorOverlay.getByRole('button', { name: 'See Errors' }).click()
     await expect(errorOverlay).not.toBeVisible()
 
     const missingNodeCard = comfyPage.page.getByTestId(
@@ -77,9 +75,7 @@ test.describe('Missing nodes in Error Overlay', { tag: '@ui' }, () => {
     await expect(errorOverlay).toBeVisible()
 
     // Click "See Errors" to open the right side panel errors tab
-    await errorOverlay
-      .getByTestId(TestIds.dialogs.errorOverlaySeeErrors)
-      .click()
+    await errorOverlay.getByRole('button', { name: 'See Errors' }).click()
     await expect(errorOverlay).not.toBeVisible()
 
     // Verify MissingNodeCard is rendered in the errors tab
@@ -169,19 +165,17 @@ test.describe('Error actions in Errors Tab', { tag: '@ui' }, () => {
       TestIds.dialogs.errorOverlay
     )
     await expect(errorOverlay).toBeVisible()
-    await errorOverlay
-      .getByTestId(TestIds.dialogs.errorOverlaySeeErrors)
-      .click()
+    await errorOverlay.getByRole('button', { name: 'See Errors' }).click()
     await expect(errorOverlay).not.toBeVisible()
 
     // Verify Find on GitHub button is present in the error card
-    const findOnGithubButton = comfyPage.page.getByTestId(
-      TestIds.dialogs.errorCardFindOnGithub
-    )
+    const findOnGithubButton = comfyPage.page.getByRole('button', {
+      name: 'Find on GitHub'
+    })
     await expect(findOnGithubButton).toBeVisible()
 
     // Verify Copy button is present in the error card
-    const copyButton = comfyPage.page.getByTestId(TestIds.dialogs.errorCardCopy)
+    const copyButton = comfyPage.page.getByRole('button', { name: 'Copy' })
     await expect(copyButton).toBeVisible()
   })
 })
@@ -210,7 +204,7 @@ test.describe('Missing models in Error Tab', () => {
     )
     await expect(errorOverlay).toBeVisible()
 
-    const missingModelsTitle = errorOverlay.getByText(/Missing Models/)
+    const missingModelsTitle = comfyPage.page.getByText(/Missing Models/)
     await expect(missingModelsTitle).toBeVisible()
   })
 
@@ -226,7 +220,7 @@ test.describe('Missing models in Error Tab', () => {
     )
     await expect(errorOverlay).toBeVisible()
 
-    const missingModelsTitle = errorOverlay.getByText(/Missing Models/)
+    const missingModelsTitle = comfyPage.page.getByText(/Missing Models/)
     await expect(missingModelsTitle).toBeVisible()
   })
 
@@ -237,10 +231,13 @@ test.describe('Missing models in Error Tab', () => {
       'missing/model_metadata_widget_mismatch'
     )
 
-    await expect(
-      comfyPage.page.getByTestId(TestIds.dialogs.errorOverlay)
-    ).not.toBeVisible()
-    await expect(comfyPage.page.getByText(/Missing Models/)).not.toBeVisible()
+    const missingModelsTitle = comfyPage.page.getByText(/Missing Models/)
+    await expect(missingModelsTitle).not.toBeVisible()
+
+    const errorOverlay = comfyPage.page.getByTestId(
+      TestIds.dialogs.errorOverlay
+    )
+    await expect(errorOverlay).not.toBeVisible()
   })
 
   // Flaky test after parallelization

browser_tests/tests/interaction.spec.ts

@@ -764,13 +764,13 @@ test.describe('Load workflow', { tag: '@screenshot' }, () => {
     )
   })
 
-  const generateUniqueFilename = (extension = '') =>
-    `${Date.now().toString(36)}-${Math.random().toString(36).slice(2, 8)}${extension}`
-
   test.describe('Restore all open workflows on reload', () => {
     let workflowA: string
     let workflowB: string
 
+    const generateUniqueFilename = (extension = '') =>
+      `${Date.now().toString(36)}-${Math.random().toString(36).slice(2, 8)}${extension}`
+
     test.beforeEach(async ({ comfyPage }) => {
       await comfyPage.settings.setSetting('Comfy.UseNewMenu', 'Top')
 
@@ -829,82 +829,6 @@ test.describe('Load workflow', { tag: '@screenshot' }, () => {
     })
   })
 
-  test.describe('Restore workflow tabs after browser restart', () => {
-    let workflowA: string
-    let workflowB: string
-
-    test.beforeEach(async ({ comfyPage }) => {
-      await comfyPage.settings.setSetting('Comfy.UseNewMenu', 'Top')
-
-      workflowA = generateUniqueFilename()
-      await comfyPage.menu.topbar.saveWorkflow(workflowA)
-      workflowB = generateUniqueFilename()
-      await comfyPage.menu.topbar.triggerTopbarCommand(['New'])
-      await comfyPage.menu.topbar.saveWorkflow(workflowB)
-
-      // Wait for localStorage fallback pointers to be written
-      await comfyPage.page.waitForFunction(() => {
-        for (let i = 0; i < window.localStorage.length; i++) {
-          const key = window.localStorage.key(i)
-          if (key?.startsWith('Comfy.Workflow.LastOpenPaths:')) {
-            return true
-          }
-        }
-        return false
-      })
-
-      // Simulate browser restart: clear sessionStorage (lost on close)
-      // but keep localStorage (survives browser restart)
-      await comfyPage.page.evaluate(() => {
-        sessionStorage.clear()
-      })
-      await comfyPage.setup({ clearStorage: false })
-    })
-
-    test('Restores topbar workflow tabs after browser restart', async ({
-      comfyPage
-    }) => {
-      await comfyPage.settings.setSetting(
-        'Comfy.Workflow.WorkflowTabsPosition',
-        'Topbar'
-      )
-      // Wait for both restored tabs to render (localStorage fallback is async)
-      await expect(
-        comfyPage.page.locator('.workflow-tabs .workflow-label', {
-          hasText: workflowA
-        })
-      ).toBeVisible()
-
-      const tabs = await comfyPage.menu.topbar.getTabNames()
-      const activeWorkflowName = await comfyPage.menu.topbar.getActiveTabName()
-
-      expect(tabs).toEqual(expect.arrayContaining([workflowA, workflowB]))
-      expect(tabs.indexOf(workflowA)).toBeLessThan(tabs.indexOf(workflowB))
-      expect(activeWorkflowName).toEqual(workflowB)
-    })
-
-    test('Restores sidebar workflows after browser restart', async ({
-      comfyPage
-    }) => {
-      await comfyPage.settings.setSetting(
-        'Comfy.Workflow.WorkflowTabsPosition',
-        'Sidebar'
-      )
-      await comfyPage.menu.workflowsTab.open()
-      const openWorkflows =
-        await comfyPage.menu.workflowsTab.getOpenedWorkflowNames()
-      const activeWorkflowName =
-        await comfyPage.menu.workflowsTab.getActiveWorkflowName()
-      expect(openWorkflows).toEqual(
-        expect.arrayContaining([workflowA, workflowB])
-      )
-      expect(openWorkflows.indexOf(workflowA)).toBeLessThan(
-        openWorkflows.indexOf(workflowB)
-      )
-      expect(activeWorkflowName).toEqual(workflowB)
-    })
-  })
-
   test('Auto fit view after loading workflow', async ({ comfyPage }) => {
     await comfyPage.settings.setSetting(
       'Comfy.EnableWorkflowViewRestore',

browser_tests/tests/subgraph-promoted-slot-position.spec.ts

@@ -1,86 +0,0 @@
-import { expect } from '@playwright/test'
-
-import { comfyPageFixture as test } from '../fixtures/ComfyPage'
-import { getTextSlotPosition } from '../helpers/subgraphTestUtils'
-
-test.describe(
-  'Subgraph promoted widget-input slot position',
-  { tag: '@subgraph' },
-  () => {
-    test('Promoted text widget slot is positioned at widget row, not header', async ({
-      comfyPage
-    }) => {
-      await comfyPage.workflow.loadWorkflow(
-        'subgraphs/subgraph-with-promoted-text-widget'
-      )
-
-      // Render a few frames so arrange() runs
-      await comfyPage.nextFrame()
-      await comfyPage.nextFrame()
-
-      const result = await getTextSlotPosition(comfyPage.page, '11')
-      expect(result).not.toBeNull()
-      expect(result!.hasPos).toBe(true)
-
-      // The slot Y position should be well below the title area.
-      // If it's near 0 or negative, the slot is stuck at the header (the bug).
-      expect(result!.posY).toBeGreaterThan(result!.titleHeight)
-    })
-
-    test('Slot position remains correct after renaming subgraph input label', async ({
-      comfyPage
-    }) => {
-      await comfyPage.workflow.loadWorkflow(
-        'subgraphs/subgraph-with-promoted-text-widget'
-      )
-      await comfyPage.nextFrame()
-      await comfyPage.nextFrame()
-
-      // Verify initial position is correct
-      const before = await getTextSlotPosition(comfyPage.page, '11')
-      expect(before).not.toBeNull()
-      expect(before!.hasPos).toBe(true)
-      expect(before!.posY).toBeGreaterThan(before!.titleHeight)
-
-      // Navigate into subgraph and rename the text input
-      const subgraphNode = await comfyPage.nodeOps.getNodeRefById('11')
-      await subgraphNode.navigateIntoSubgraph()
-
-      const initialLabel = await comfyPage.page.evaluate(() => {
-        const graph = window.app!.canvas.graph
-        if (!graph || !('inputNode' in graph)) return null
-        const textInput = graph.inputs?.find(
-          (i: { type: string }) => i.type === 'STRING'
-        )
-        return textInput?.label || textInput?.name || null
-      })
-
-      if (!initialLabel)
-        throw new Error('Could not find STRING input in subgraph')
-
-      await comfyPage.subgraph.rightClickInputSlot(initialLabel)
-      await comfyPage.contextMenu.clickLitegraphMenuItem('Rename Slot')
-      await comfyPage.nextFrame()
-
-      const dialog = '.graphdialog input'
-      await comfyPage.page.waitForSelector(dialog, { state: 'visible' })
-      await comfyPage.page.fill(dialog, '')
-      await comfyPage.page.fill(dialog, 'my_custom_prompt')
-      await comfyPage.page.keyboard.press('Enter')
-      await comfyPage.page.waitForSelector(dialog, { state: 'hidden' })
-
-      // Navigate back to parent graph
-      await comfyPage.subgraph.exitViaBreadcrumb()
-
-      // Verify slot position is still at the widget row after rename
-      const after = await getTextSlotPosition(comfyPage.page, '11')
-      expect(after).not.toBeNull()
-      expect(after!.hasPos).toBe(true)
-      expect(after!.posY).toBeGreaterThan(after!.titleHeight)
-
-      // widget.name is the stable identity key — it does NOT change on rename.
-      // The display label is on input.label, read via PromotedWidgetView.label.
-      expect(after!.widgetName).not.toBe('my_custom_prompt')
-    })
-  }
-)

browser_tests/tests/subgraph-promoted-widget-dom.spec.ts

@@ -1,57 +0,0 @@
-import { expect } from '@playwright/test'
-
-import { comfyPageFixture as test } from '../fixtures/ComfyPage'
-import { getPromotedWidgetNames } from '../helpers/promotedWidgets'
-
-test.describe(
-  'Subgraph promoted widget DOM position',
-  { tag: '@subgraph' },
-  () => {
-    test.beforeEach(async ({ comfyPage }) => {
-      await comfyPage.settings.setSetting('Comfy.UseNewMenu', 'Disabled')
-    })
-
-    test('Promoted seed widget renders in node body, not header', async ({
-      comfyPage
-    }) => {
-      await comfyPage.workflow.loadWorkflow('default')
-
-      // Convert KSampler (id 3) to subgraph — seed is auto-promoted.
-      const ksampler = await comfyPage.nodeOps.getNodeRefById('3')
-      await ksampler.click('title')
-      const subgraphNode = await ksampler.convertToSubgraph()
-      await comfyPage.nextFrame()
-
-      // Enable Vue nodes now that the subgraph has been created
-      await comfyPage.settings.setSetting('Comfy.VueNodes.Enabled', true)
-
-      const subgraphNodeId = String(subgraphNode.id)
-      const promotedNames = await getPromotedWidgetNames(
-        comfyPage,
-        subgraphNodeId
-      )
-      expect(promotedNames).toContain('seed')
-
-      // Wait for Vue nodes to render
-      await comfyPage.vueNodes.waitForNodes()
-
-      const nodeLocator = comfyPage.vueNodes.getNodeLocator(subgraphNodeId)
-      await expect(nodeLocator).toBeVisible()
-
-      // The seed widget should be visible inside the node body
-      const seedWidget = nodeLocator.getByLabel('seed', { exact: true }).first()
-      await expect(seedWidget).toBeVisible()
-
-      // Verify widget is inside the node body, not the header
-      const headerBox = await nodeLocator
-        .locator('[data-testid^="node-header-"]')
-        .boundingBox()
-      const widgetBox = await seedWidget.boundingBox()
-      expect(headerBox).not.toBeNull()
-      expect(widgetBox).not.toBeNull()
-
-      // Widget top should be below the header bottom
-      expect(widgetBox!.y).toBeGreaterThan(headerBox!.y + headerBox!.height)
-    })
-  }
-)

browser_tests/tests/subgraphInputSlotRename.spec.ts

@@ -1,117 +0,0 @@
-import {
-  comfyPageFixture as test,
-  comfyExpect as expect
-} from '../fixtures/ComfyPage'
-
-const WORKFLOW = 'subgraphs/test-values-input-subgraph'
-const RENAMED_LABEL = 'my_seed'
-
-/**
- * Regression test for subgraph input slot rename propagation.
- *
- * Renaming a SubgraphInput slot (e.g. "seed") inside the subgraph must
- * update the promoted widget label shown on the parent SubgraphNode and
- * keep the widget positioned in the node body (not the header).
- *
- * See: https://github.com/Comfy-Org/ComfyUI_frontend/pull/10195
- */
-test.describe(
-  'Subgraph input slot rename propagation',
-  { tag: ['@subgraph', '@widget'] },
-  () => {
-    test.beforeEach(async ({ comfyPage }) => {
-      await comfyPage.settings.setSetting('Comfy.VueNodes.Enabled', true)
-    })
-
-    test('Renaming a subgraph input slot updates the widget label on the parent node', async ({
-      comfyPage
-    }) => {
-      const { page } = comfyPage
-
-      // 1. Load workflow with subgraph containing a promoted seed widget input
-      await comfyPage.workflow.loadWorkflow(WORKFLOW)
-      await comfyPage.vueNodes.waitForNodes()
-
-      const sgNode = comfyPage.vueNodes.getNodeLocator('19')
-      await expect(sgNode).toBeVisible()
-
-      // 2. Verify the seed widget is visible on the parent node
-      const seedWidget = sgNode.getByLabel('seed', { exact: true })
-      await expect(seedWidget).toBeVisible()
-
-      // Verify widget is in the node body, not the header
-      const headerBox = await sgNode
-        .locator('[data-testid^="node-header-"]')
-        .boundingBox()
-      const widgetBox = await seedWidget.boundingBox()
-      expect(headerBox).not.toBeNull()
-      expect(widgetBox).not.toBeNull()
-      expect(widgetBox!.y).toBeGreaterThan(headerBox!.y + headerBox!.height)
-
-      // 3. Enter the subgraph and rename the seed slot.
-      //    The subgraph IO rename uses canvas.prompt() which requires the
-      //    litegraph context menu, so temporarily disable Vue nodes.
-      await comfyPage.settings.setSetting('Comfy.VueNodes.Enabled', false)
-      await comfyPage.nextFrame()
-
-      const sgNodeRef = await comfyPage.nodeOps.getNodeRefById('19')
-      await sgNodeRef.navigateIntoSubgraph()
-
-      // Find the seed SubgraphInput slot
-      const seedSlotName = await page.evaluate(() => {
-        const graph = window.app!.canvas.graph
-        if (!graph) return null
-        const inputs = (
-          graph as { inputs?: Array<{ name: string; type: string }> }
-        ).inputs
-        return inputs?.find((i) => i.name.includes('seed'))?.name ?? null
-      })
-      expect(seedSlotName).not.toBeNull()
-
-      // 4. Right-click the seed input slot and rename it
-      await comfyPage.subgraph.rightClickInputSlot(seedSlotName!)
-      await comfyPage.contextMenu.clickLitegraphMenuItem('Rename Slot')
-      await comfyPage.nextFrame()
-
-      const dialog = '.graphdialog input'
-      await page.waitForSelector(dialog, { state: 'visible' })
-      await page.fill(dialog, '')
-      await page.fill(dialog, RENAMED_LABEL)
-      await page.keyboard.press('Enter')
-      await page.waitForSelector(dialog, { state: 'hidden' })
-
-      // 5. Navigate back to parent graph and re-enable Vue nodes
-      await comfyPage.subgraph.exitViaBreadcrumb()
-      await comfyPage.settings.setSetting('Comfy.VueNodes.Enabled', true)
-      await comfyPage.vueNodes.waitForNodes()
-
-      // 6. Verify the widget label updated to the renamed value
-      const sgNodeAfter = comfyPage.vueNodes.getNodeLocator('19')
-      await expect(sgNodeAfter).toBeVisible()
-
-      const updatedLabel = await page.evaluate(() => {
-        const node = window.app!.canvas.graph!.getNodeById('19')
-        if (!node) return null
-        const w = node.widgets?.find((w: { name: string }) =>
-          w.name.includes('seed')
-        )
-        return w?.label || w?.name || null
-      })
-      expect(updatedLabel).toBe(RENAMED_LABEL)
-
-      // 7. Verify the widget is still in the body, not the header
-      const seedWidgetAfter = sgNodeAfter.getByLabel('seed', { exact: true })
-      await expect(seedWidgetAfter).toBeVisible()
-
-      const headerAfter = await sgNodeAfter
-        .locator('[data-testid^="node-header-"]')
-        .boundingBox()
-      const widgetAfter = await seedWidgetAfter.boundingBox()
-      expect(headerAfter).not.toBeNull()
-      expect(widgetAfter).not.toBeNull()
-      expect(widgetAfter!.y).toBeGreaterThan(
-        headerAfter!.y + headerAfter!.height
-      )
-    })
-  }
-)

browser_tests/tests/subgraphSlotAlignment.spec.ts

@@ -1,132 +0,0 @@
-import { readFileSync } from 'fs'
-import { resolve } from 'path'
-
-import { expect } from '@playwright/test'
-
-import type { ComfyWorkflowJSON } from '@/platform/workflow/validation/schemas/workflowSchema'
-
-import { comfyPageFixture as test } from '../fixtures/ComfyPage'
-
-interface SlotMeasurement {
-  key: string
-  offsetX: number
-  offsetY: number
-}
-
-interface NodeSlotData {
-  nodeId: string
-  isSubgraph: boolean
-  nodeW: number
-  nodeH: number
-  slots: SlotMeasurement[]
-}
-
-/**
- * Regression test for link misalignment on SubgraphNodes when loading
- * workflows with workflowRendererVersion: "LG".
- *
- * Root cause: ensureCorrectLayoutScale scales nodes by 1.2x for LG workflows,
- * and fitView() updates lgCanvas.ds immediately. The Vue TransformPane's CSS
- * transform lags by a frame, causing clientPosToCanvasPos to produce wrong
- * slot offsets. The fix uses DOM-relative measurement instead.
- */
-test.describe(
-  'Subgraph slot alignment after LG layout scale',
-  { tag: ['@subgraph', '@canvas'] },
-  () => {
-    test('slot positions stay within node bounds after loading LG workflow', async ({
-      comfyPage
-    }) => {
-      const SLOT_BOUNDS_MARGIN = 20
-      await comfyPage.settings.setSetting('Comfy.VueNodes.Enabled', true)
-
-      const workflowPath = resolve(
-        import.meta.dirname,
-        '../assets/subgraphs/basic-subgraph.json'
-      )
-      const workflow = JSON.parse(
-        readFileSync(workflowPath, 'utf-8')
-      ) as ComfyWorkflowJSON
-      workflow.extra = {
-        ...workflow.extra,
-        workflowRendererVersion: 'LG'
-      }
-
-      await comfyPage.page.evaluate(
-        (wf) =>
-          window.app!.loadGraphData(wf as ComfyWorkflowJSON, true, true, null, {
-            openSource: 'template'
-          }),
-        workflow
-      )
-      await comfyPage.nextFrame()
-
-      // Wait for slot elements to appear in DOM
-      await comfyPage.page.locator('[data-slot-key]').first().waitFor()
-
-      const result: NodeSlotData[] = await comfyPage.page.evaluate(() => {
-        const nodes = window.app!.graph._nodes
-        const slotData: NodeSlotData[] = []
-
-        for (const node of nodes) {
-          const nodeId = String(node.id)
-          const nodeEl = document.querySelector(
-            `[data-node-id="${nodeId}"]`
-          ) as HTMLElement | null
-          if (!nodeEl) continue
-
-          const slotEls = nodeEl.querySelectorAll('[data-slot-key]')
-          if (slotEls.length === 0) continue
-
-          const slots: SlotMeasurement[] = []
-
-          const nodeRect = nodeEl.getBoundingClientRect()
-          for (const slotEl of slotEls) {
-            const slotRect = slotEl.getBoundingClientRect()
-            const slotKey = (slotEl as HTMLElement).dataset.slotKey ?? 'unknown'
-            slots.push({
-              key: slotKey,
-              offsetX: slotRect.left + slotRect.width / 2 - nodeRect.left,
-              offsetY: slotRect.top + slotRect.height / 2 - nodeRect.top
-            })
-          }
-
-          slotData.push({
-            nodeId,
-            isSubgraph: !!node.isSubgraphNode?.(),
-            nodeW: nodeRect.width,
-            nodeH: nodeRect.height,
-            slots
-          })
-        }
-
-        return slotData
-      })
-
-      const subgraphNodes = result.filter((n) => n.isSubgraph)
-      expect(subgraphNodes.length).toBeGreaterThan(0)
-
-      for (const node of subgraphNodes) {
-        for (const slot of node.slots) {
-          expect(
-            slot.offsetX,
-            `Slot ${slot.key} on node ${node.nodeId}: X offset ${slot.offsetX} outside node width ${node.nodeW}`
-          ).toBeGreaterThanOrEqual(-SLOT_BOUNDS_MARGIN)
-          expect(
-            slot.offsetX,
-            `Slot ${slot.key} on node ${node.nodeId}: X offset ${slot.offsetX} outside node width ${node.nodeW}`
-          ).toBeLessThanOrEqual(node.nodeW + SLOT_BOUNDS_MARGIN)
-
-          expect(
-            slot.offsetY,
-            `Slot ${slot.key} on node ${node.nodeId}: Y offset ${slot.offsetY} outside node height ${node.nodeH}`
-          ).toBeGreaterThanOrEqual(-SLOT_BOUNDS_MARGIN)
-          expect(
-            slot.offsetY,
-            `Slot ${slot.key} on node ${node.nodeId}: Y offset ${slot.offsetY} outside node height ${node.nodeH}`
-          ).toBeLessThanOrEqual(node.nodeH + SLOT_BOUNDS_MARGIN)
-        }
-      }
-    })
-  }
-)

browser_tests/tests/templates.spec.ts

@@ -206,31 +206,6 @@ test.describe('Templates', { tag: ['@slow', '@workflow'] }, () => {
     await expect(nav).toBeVisible() // Nav should be visible at tablet size
   })
 
-  test(
-    'select components in filter bar render correctly',
-    { tag: '@screenshot' },
-    async ({ comfyPage }) => {
-      await comfyPage.command.executeCommand('Comfy.BrowseTemplates')
-      await expect(comfyPage.templates.content).toBeVisible()
-
-      // Wait for filter bar select components to render
-      const dialog = comfyPage.page.getByRole('dialog')
-      const sortBySelect = dialog.getByRole('combobox', { name: /Sort/ })
-      await expect(sortBySelect).toBeVisible()
-
-      // Screenshot the filter bar containing MultiSelect and SingleSelect
-      const filterBar = sortBySelect.locator(
-        'xpath=ancestor::div[contains(@class, "justify-between")]'
-      )
-      await expect(filterBar).toHaveScreenshot(
-        'template-filter-bar-select-components.png',
-        {
-          mask: [comfyPage.page.locator('.p-toast')]
-        }
-      )
-    }
-  )
-
   test(
     'template cards descriptions adjust height dynamically',
     { tag: '@screenshot' },

browser_tests/tests/vueNodes/interactions/node/move.spec.ts

@@ -47,46 +47,6 @@ test.describe('Vue Node Moving', () => {
     }
   )
 
-  test('should not move node when pointer moves less than drag threshold', async ({
-    comfyPage
-  }) => {
-    const headerPos = await getLoadCheckpointHeaderPos(comfyPage)
-
-    // Move only 2px — below the 3px drag threshold in useNodePointerInteractions
-    await comfyPage.page.mouse.move(headerPos.x, headerPos.y)
-    await comfyPage.page.mouse.down()
-    await comfyPage.page.mouse.move(headerPos.x + 2, headerPos.y + 1, {
-      steps: 5
-    })
-    await comfyPage.page.mouse.up()
-    await comfyPage.nextFrame()
-
-    const afterPos = await getLoadCheckpointHeaderPos(comfyPage)
-    expect(afterPos.x).toBeCloseTo(headerPos.x, 0)
-    expect(afterPos.y).toBeCloseTo(headerPos.y, 0)
-
-    // The small movement should have selected the node, not dragged it
-    expect(await comfyPage.vueNodes.getSelectedNodeCount()).toBe(1)
-  })
-
-  test('should move node when pointer moves beyond drag threshold', async ({
-    comfyPage
-  }) => {
-    const headerPos = await getLoadCheckpointHeaderPos(comfyPage)
-
-    // Move 50px — well beyond the 3px drag threshold
-    await comfyPage.page.mouse.move(headerPos.x, headerPos.y)
-    await comfyPage.page.mouse.down()
-    await comfyPage.page.mouse.move(headerPos.x + 50, headerPos.y + 50, {
-      steps: 20
-    })
-    await comfyPage.page.mouse.up()
-    await comfyPage.nextFrame()
-
-    const afterPos = await getLoadCheckpointHeaderPos(comfyPage)
-    await expectPosChanged(headerPos, afterPos)
-  })
-
   test(
     '@mobile should allow moving nodes by dragging on touch devices',
     { tag: '@screenshot' },

browser_tests/tests/vueNodes/widgets/load/uploadWidgets.spec.ts

@@ -2,7 +2,6 @@ import {
   comfyExpect as expect,
   comfyPageFixture as test
 } from '../../../../fixtures/ComfyPage'
-import { TestIds } from '../../../../fixtures/selectors'
 
 test.describe('Vue Upload Widgets', () => {
   test.beforeEach(async ({ comfyPage }) => {
@@ -20,14 +19,10 @@ test.describe('Vue Upload Widgets', () => {
     ).not.toBeVisible()
 
     await expect
-      .poll(() =>
-        comfyPage.page.getByTestId(TestIds.errors.imageLoadError).count()
-      )
+      .poll(() => comfyPage.page.getByText('Error loading image').count())
       .toBeGreaterThan(0)
     await expect
-      .poll(() =>
-        comfyPage.page.getByTestId(TestIds.errors.videoLoadError).count()
-      )
+      .poll(() => comfyPage.page.getByText('Error loading video').count())
       .toBeGreaterThan(0)
   })
 })

browser_tests/tests/vueNodes/widgets/text/multilineStringWidget.spec.ts

@@ -46,16 +46,4 @@ test.describe('Vue Multiline String Widget', () => {
 
     await expect(textarea).toHaveValue('Keep me around')
   })
-  test('should use native context menu when focused', async ({ comfyPage }) => {
-    const textarea = getFirstMultilineStringWidget(comfyPage)
-    const vueContextMenu = comfyPage.page.locator('.p-contextmenu')
-
-    await textarea.focus()
-    await textarea.click({ button: 'right' })
-    await expect(vueContextMenu).not.toBeVisible()
-    await textarea.blur()
-
-    await textarea.click({ button: 'right' })
-    await expect(vueContextMenu).toBeVisible()
-  })
 })

knip.config.ts

@@ -27,17 +27,6 @@ const config: KnipConfig = {
     },
     'packages/ingest-types': {
       project: ['src/**/*.{js,ts}']
-    },
-    'apps/website': {
-      entry: [
-        'src/pages/**/*.astro',
-        'src/layouts/**/*.astro',
-        'src/components/**/*.vue',
-        'src/styles/global.css',
-        'astro.config.ts'
-      ],
-      project: ['src/**/*.{astro,vue,ts}', '*.{js,ts,mjs}'],
-      ignoreDependencies: ['@comfyorg/design-system', '@vercel/analytics']
     }
   },
   ignoreBinaries: ['python3'],

package.json

@@ -1,6 +1,6 @@
 {
   "name": "@comfyorg/comfyui-frontend",
-  "version": "1.43.4",
+  "version": "1.43.2",
   "private": true,
   "description": "Official front-end implementation of ComfyUI",
   "homepage": "https://comfy.org",

packages/design-system/src/css/base.css

@@ -1,46 +0,0 @@
-/*
- * Design System Base — Brand tokens + fonts only.
- * For marketing sites that don't use PrimeVue or the node editor.
- * Import the full style.css instead for the desktop app.
- */
-
-@import './fonts.css';
-
-@theme {
-  /* Font Families */
-  --font-inter: 'Inter', sans-serif;
-
-  /* Palette Colors */
-  --color-charcoal-100: #55565e;
-  --color-charcoal-200: #494a50;
-  --color-charcoal-300: #3c3d42;
-  --color-charcoal-400: #313235;
-  --color-charcoal-500: #2d2e32;
-  --color-charcoal-600: #262729;
-  --color-charcoal-700: #202121;
-  --color-charcoal-800: #171718;
-
-  --color-neutral-550: #636363;
-
-  --color-ash-300: #bbbbbb;
-  --color-ash-500: #828282;
-  --color-ash-800: #444444;
-
-  --color-smoke-100: #f3f3f3;
-  --color-smoke-200: #e9e9e9;
-  --color-smoke-300: #e1e1e1;
-  --color-smoke-400: #d9d9d9;
-  --color-smoke-500: #c5c5c5;
-  --color-smoke-600: #b4b4b4;
-  --color-smoke-700: #a0a0a0;
-  --color-smoke-800: #8a8a8a;
-
-  --color-white: #ffffff;
-  --color-black: #000000;
-
-  /* Brand Colors */
-  --color-electric-400: #f0ff41;
-  --color-sapphire-700: #172dd7;
-  --color-brand-yellow: var(--color-electric-400);
-  --color-brand-blue: var(--color-sapphire-700);
-}

packages/ingest-types/src/index.ts

@@ -16,7 +16,6 @@ export type {
   AssetCreated,
   AssetCreatedWritable,
   AssetDownloadResponse,
-  AssetInfo,
   AssetMetadataResponse,
   AssetTagHistogramResponse,
   AssetUpdated,
@@ -39,11 +38,6 @@ export type {
   CheckAssetByHashError,
   CheckAssetByHashErrors,
   CheckAssetByHashResponses,
-  CheckHubUsernameData,
-  CheckHubUsernameError,
-  CheckHubUsernameErrors,
-  CheckHubUsernameResponse,
-  CheckHubUsernameResponses,
   ClaimInviteCodeData,
   ClaimInviteCodeError,
   ClaimInviteCodeErrors,
@@ -69,17 +63,6 @@ export type {
   CreateDeletionRequestError,
   CreateDeletionRequestErrors,
   CreateDeletionRequestResponses,
-  CreateHubAssetUploadUrlData,
-  CreateHubAssetUploadUrlError,
-  CreateHubAssetUploadUrlErrors,
-  CreateHubAssetUploadUrlResponse,
-  CreateHubAssetUploadUrlResponses,
-  CreateHubProfileData,
-  CreateHubProfileError,
-  CreateHubProfileErrors,
-  CreateHubProfileRequest,
-  CreateHubProfileResponse,
-  CreateHubProfileResponses,
   CreateInviteRequest,
   CreateSecretData,
   CreateSecretError,
@@ -128,11 +111,6 @@ export type {
   DeleteAssetErrors,
   DeleteAssetResponse,
   DeleteAssetResponses,
-  DeleteHubWorkflowData,
-  DeleteHubWorkflowError,
-  DeleteHubWorkflowErrors,
-  DeleteHubWorkflowResponse,
-  DeleteHubWorkflowResponses,
   DeleteSecretData,
   DeleteSecretError,
   DeleteSecretErrors,
@@ -234,16 +212,6 @@ export type {
   GetGlobalSubgraphsErrors,
   GetGlobalSubgraphsResponse,
   GetGlobalSubgraphsResponses,
-  GetHubProfileByUsernameData,
-  GetHubProfileByUsernameError,
-  GetHubProfileByUsernameErrors,
-  GetHubProfileByUsernameResponse,
-  GetHubProfileByUsernameResponses,
-  GetHubWorkflowData,
-  GetHubWorkflowError,
-  GetHubWorkflowErrors,
-  GetHubWorkflowResponse,
-  GetHubWorkflowResponses,
   GetInviteCodeStatusData,
   GetInviteCodeStatusError,
   GetInviteCodeStatusErrors,
@@ -282,21 +250,11 @@ export type {
   GetModelsInFolderErrors,
   GetModelsInFolderResponse,
   GetModelsInFolderResponses,
-  GetMyHubProfileData,
-  GetMyHubProfileError,
-  GetMyHubProfileErrors,
-  GetMyHubProfileResponse,
-  GetMyHubProfileResponses,
   GetPaymentPortalData,
   GetPaymentPortalError,
   GetPaymentPortalErrors,
   GetPaymentPortalResponse,
   GetPaymentPortalResponses,
-  GetPublishedWorkflowData,
-  GetPublishedWorkflowError,
-  GetPublishedWorkflowErrors,
-  GetPublishedWorkflowResponse,
-  GetPublishedWorkflowResponses,
   GetRawLogsData,
   GetRawLogsError,
   GetRawLogsErrors,
@@ -347,30 +305,11 @@ export type {
   GetWorkspaceResponses,
   GlobalSubgraphData,
   GlobalSubgraphInfo,
-  HubAssetUploadUrlRequest,
-  HubAssetUploadUrlResponse,
-  HubLabelInfo,
-  HubLabelListResponse,
-  HubProfile,
-  HubProfileSummary,
-  HubUsernameCheckResponse,
-  HubWorkflowDetail,
-  HubWorkflowListResponse,
-  HubWorkflowSummary,
-  HubWorkflowTemplateEntry,
-  ImportPublishedAssetsData,
-  ImportPublishedAssetsError,
-  ImportPublishedAssetsErrors,
-  ImportPublishedAssetsRequest,
-  ImportPublishedAssetsResponse,
-  ImportPublishedAssetsResponse2,
-  ImportPublishedAssetsResponses,
   InviteCodeClaimResponse,
   InviteCodeStatusResponse,
   JobStatusResponse,
   JwkKey,
   JwksResponse,
-  LabelRef,
   LeaveWorkspaceData,
   LeaveWorkspaceError,
   LeaveWorkspaceErrors,
@@ -383,21 +322,6 @@ export type {
   ListAssetsResponse2,
   ListAssetsResponses,
   ListAssetsResponseWritable,
-  ListHubLabelsData,
-  ListHubLabelsError,
-  ListHubLabelsErrors,
-  ListHubLabelsResponse,
-  ListHubLabelsResponses,
-  ListHubWorkflowIndexData,
-  ListHubWorkflowIndexError,
-  ListHubWorkflowIndexErrors,
-  ListHubWorkflowIndexResponse,
-  ListHubWorkflowIndexResponses,
-  ListHubWorkflowsData,
-  ListHubWorkflowsError,
-  ListHubWorkflowsErrors,
-  ListHubWorkflowsResponse,
-  ListHubWorkflowsResponses,
   ListInvitesResponse,
   ListMembersResponse,
   ListSecretsData,
@@ -452,11 +376,6 @@ export type {
   PlanAvailability,
   PlanAvailabilityReason,
   PlanSeatSummary,
-  PostAssetsFromWorkflowData,
-  PostAssetsFromWorkflowError,
-  PostAssetsFromWorkflowErrors,
-  PostAssetsFromWorkflowResponse,
-  PostAssetsFromWorkflowResponses,
   PreviewPlanInfo,
   PreviewSubscribeData,
   PreviewSubscribeError,
@@ -465,13 +384,6 @@ export type {
   PreviewSubscribeResponse,
   PreviewSubscribeResponse2,
   PreviewSubscribeResponses,
-  PublishedWorkflowDetail,
-  PublishHubWorkflowData,
-  PublishHubWorkflowError,
-  PublishHubWorkflowErrors,
-  PublishHubWorkflowRequest,
-  PublishHubWorkflowResponse,
-  PublishHubWorkflowResponses,
   RawLogsResponse,
   RemoveAssetTagsData,
   RemoveAssetTagsError,
@@ -543,12 +455,6 @@ export type {
   UpdateAssetTagsErrors,
   UpdateAssetTagsResponse,
   UpdateAssetTagsResponses,
-  UpdateHubProfileData,
-  UpdateHubProfileError,
-  UpdateHubProfileErrors,
-  UpdateHubProfileRequest,
-  UpdateHubProfileResponse,
-  UpdateHubProfileResponses,
   UpdateSecretData,
   UpdateSecretError,
   UpdateSecretErrors,
@@ -580,8 +486,6 @@ export type {
   UserResponse,
   ValidationError,
   ValidationResult,
-  WorkflowApiAssetsRequest,
-  WorkflowApiAssetsResponse,
   WorkflowForkedFrom,
   WorkflowListResponse,
   WorkflowResponse,

packages/ingest-types/src/zod.gen.ts

@@ -2,207 +2,6 @@
 
 import { z } from 'zod'
 
-export const zHubUsernameCheckResponse = z.object({
-  username: z.string(),
-  available: z.boolean(),
-  suggestions: z.array(z.string()).optional(),
-  validation_error: z.string().optional()
-})
-
-export const zHubAssetUploadUrlResponse = z.object({
-  upload_url: z.string(),
-  public_url: z.string(),
-  token: z.string()
-})
-
-export const zHubAssetUploadUrlRequest = z.object({
-  filename: z.string(),
-  content_type: z.string()
-})
-
-export const zPublishHubWorkflowRequest = z.object({
-  username: z.string(),
-  name: z.string(),
-  workflow_filename: z.string(),
-  asset_ids: z.array(z.string()),
-  description: z.string().optional(),
-  tags: z.array(z.string()).optional(),
-  models: z.array(z.string()).optional(),
-  custom_nodes: z.array(z.string()).optional(),
-  tutorial_url: z.string().optional(),
-  metadata: z.record(z.unknown()).optional(),
-  thumbnail_type: z.enum(['image', 'video', 'image_comparison']).optional(),
-  thumbnail_token_or_url: z.string().optional(),
-  thumbnail_comparison_token_or_url: z.string().optional(),
-  sample_image_tokens_or_urls: z.array(z.string()).optional()
-})
-
-export const zAssetInfo = z.object({
-  id: z.string(),
-  name: z.string(),
-  preview_url: z.string(),
-  storage_url: z.string(),
-  model: z.boolean(),
-  public: z.boolean(),
-  in_library: z.boolean()
-})
-
-export const zHubProfileSummary = z.object({
-  username: z.string(),
-  display_name: z.string().optional(),
-  avatar_url: z.string().optional()
-})
-
-export const zLabelRef = z.object({
-  name: z.string(),
-  display_name: z.string()
-})
-
-export const zHubWorkflowDetail = z.object({
-  share_id: z.string(),
-  workflow_id: z.string(),
-  name: z.string(),
-  description: z.string().optional(),
-  tags: z.array(zLabelRef).optional(),
-  thumbnail_type: z.enum(['image', 'video', 'image_comparison']).optional(),
-  thumbnail_url: z.string().optional(),
-  thumbnail_comparison_url: z.string().optional(),
-  models: z.array(zLabelRef).optional(),
-  custom_nodes: z.array(zLabelRef).optional(),
-  tutorial_url: z.string().optional(),
-  metadata: z.record(z.unknown()).optional(),
-  sample_image_urls: z.array(z.string()).optional(),
-  publish_time: z.string().datetime().nullish(),
-  workflow_json: z.record(z.unknown()),
-  assets: z.array(zAssetInfo),
-  profile: zHubProfileSummary
-})
-
-export const zHubWorkflowSummary = z.object({
-  share_id: z.string(),
-  name: z.string(),
-  description: z.string().optional(),
-  tags: z.array(zLabelRef).optional(),
-  models: z.array(zLabelRef).optional(),
-  custom_nodes: z.array(zLabelRef).optional(),
-  thumbnail_type: z.enum(['image', 'video', 'image_comparison']).optional(),
-  thumbnail_url: z.string().optional(),
-  thumbnail_comparison_url: z.string().optional(),
-  publish_time: z.string().datetime().nullish(),
-  profile: zHubProfileSummary,
-  metadata: z.record(z.unknown()).optional(),
-  tutorial_url: z.string().optional(),
-  sample_image_urls: z.array(z.string()).optional()
-})
-
-export const zHubWorkflowListResponse = z.object({
-  workflows: z.array(z.union([zHubWorkflowSummary, zHubWorkflowDetail])),
-  next_cursor: z.string().optional()
-})
-
-export const zHubLabelInfo = z.object({
-  name: z.string(),
-  display_name: z.string(),
-  description: z.string().optional(),
-  type: z.enum(['tag', 'model', 'custom_node'])
-})
-
-export const zHubLabelListResponse = z.object({
-  labels: z.array(zHubLabelInfo)
-})
-
-export const zHubWorkflowTemplateEntry = z.object({
-  name: z.string(),
-  title: z.string(),
-  description: z.string().optional(),
-  tags: z.array(z.string()).optional(),
-  models: z.array(z.string()).optional(),
-  requiresCustomNodes: z.array(z.string()).optional(),
-  thumbnailVariant: z.string().optional(),
-  mediaType: z.string().optional(),
-  mediaSubtype: z.string().optional(),
-  size: z.number().optional(),
-  vram: z.number().optional(),
-  openSource: z.boolean().optional(),
-  profile: zHubProfileSummary.optional(),
-  tutorialUrl: z.string().optional(),
-  logos: z.array(z.record(z.unknown())).optional(),
-  date: z.string().optional(),
-  io: z
-    .object({
-      inputs: z.array(z.record(z.unknown())).optional(),
-      outputs: z.array(z.record(z.unknown())).optional()
-    })
-    .optional(),
-  includeOnDistributions: z.array(z.string()).optional(),
-  thumbnailUrl: z.string().optional(),
-  thumbnailComparisonUrl: z.string().optional(),
-  shareId: z.string().optional(),
-  extendedDescription: z.string().optional(),
-  metaDescription: z.string().optional(),
-  howToUse: z.array(z.string()).optional(),
-  suggestedUseCases: z.array(z.string()).optional(),
-  faqItems: z
-    .array(
-      z.object({
-        question: z.string(),
-        answer: z.string()
-      })
-    )
-    .optional(),
-  contentTemplate: z.string().optional()
-})
-
-export const zUpdateHubProfileRequest = z.object({
-  display_name: z.string().optional(),
-  description: z.string().optional(),
-  avatar_token: z.string().nullish(),
-  website_urls: z.array(z.string()).optional()
-})
-
-export const zCreateHubProfileRequest = z.object({
-  workspace_id: z.string(),
-  username: z.string(),
-  display_name: z.string().optional(),
-  description: z.string().optional(),
-  avatar_token: z.string().optional(),
-  website_urls: z.array(z.string()).optional()
-})
-
-export const zHubProfile = z.object({
-  username: z.string(),
-  display_name: z.string().optional(),
-  description: z.string().optional(),
-  avatar_url: z.string().optional(),
-  website_urls: z.array(z.string()).optional()
-})
-
-export const zImportPublishedAssetsResponse = z.object({
-  assets: z.array(zAssetInfo)
-})
-
-export const zImportPublishedAssetsRequest = z.object({
-  published_asset_ids: z.array(z.string())
-})
-
-export const zPublishedWorkflowDetail = z.object({
-  share_id: z.string(),
-  workflow_id: z.string(),
-  name: z.string(),
-  listed: z.boolean(),
-  publish_time: z.string().datetime().nullish(),
-  workflow_json: z.record(z.unknown()),
-  assets: z.array(zAssetInfo)
-})
-
-export const zWorkflowApiAssetsResponse = z.object({
-  assets: z.array(zAssetInfo)
-})
-
-export const zWorkflowApiAssetsRequest = z.object({
-  workflow_api_json: z.record(z.unknown())
-})
-
 export const zForkWorkflowRequest = z.object({
   source_version: z.number().int(),
   name: z.string().optional()
@@ -1193,9 +992,7 @@ export const zListAssetsData = z.object({
         .enum(['name', 'created_at', 'updated_at', 'size', 'last_access_time'])
         .optional(),
       order: z.enum(['asc', 'desc']).optional(),
-      job_ids: z.array(z.string().uuid()).optional(),
-      include_public: z.boolean().optional().default(true),
-      asset_hash: z.string().optional()
+      include_public: z.boolean().optional().default(true)
     })
     .optional()
 })
@@ -1437,28 +1234,6 @@ export const zCheckAssetByHashData = z.object({
   query: z.never().optional()
 })
 
-export const zPostAssetsFromWorkflowData = z.object({
-  body: zWorkflowApiAssetsRequest,
-  path: z.never().optional(),
-  query: z.never().optional()
-})
-
-/**
- * Success
- */
-export const zPostAssetsFromWorkflowResponse = zWorkflowApiAssetsResponse
-
-export const zImportPublishedAssetsData = z.object({
-  body: zImportPublishedAssetsRequest,
-  path: z.never().optional(),
-  query: z.never().optional()
-})
-
-/**
- * Successfully imported assets
- */
-export const zImportPublishedAssetsResponse2 = zImportPublishedAssetsResponse
-
 export const zListSecretsData = z.object({
   body: z.never().optional(),
   path: z.never().optional(),
@@ -2153,171 +1928,3 @@ export const zForkWorkflowData = z.object({
  * Workflow forked successfully
  */
 export const zForkWorkflowResponse = zWorkflowResponse
-
-export const zCreateHubProfileData = z.object({
-  body: zCreateHubProfileRequest,
-  path: z.never().optional(),
-  query: z.never().optional()
-})
-
-/**
- * Hub profile created
- */
-export const zCreateHubProfileResponse = zHubProfile
-
-export const zGetMyHubProfileData = z.object({
-  body: z.never().optional(),
-  path: z.never().optional(),
-  query: z.never().optional()
-})
-
-/**
- * Hub profile
- */
-export const zGetMyHubProfileResponse = zHubProfile
-
-export const zCheckHubUsernameData = z.object({
-  body: z.never().optional(),
-  path: z.never().optional(),
-  query: z.object({
-    username: z.string()
-  })
-})
-
-/**
- * Username availability result
- */
-export const zCheckHubUsernameResponse = zHubUsernameCheckResponse
-
-export const zGetHubProfileByUsernameData = z.object({
-  body: z.never().optional(),
-  path: z.object({
-    username: z.string()
-  }),
-  query: z.never().optional()
-})
-
-/**
- * Hub profile
- */
-export const zGetHubProfileByUsernameResponse = zHubProfile
-
-export const zUpdateHubProfileData = z.object({
-  body: zUpdateHubProfileRequest,
-  path: z.object({
-    username: z.string()
-  }),
-  query: z.never().optional()
-})
-
-/**
- * Hub profile updated
- */
-export const zUpdateHubProfileResponse = zHubProfile
-
-export const zCreateHubAssetUploadUrlData = z.object({
-  body: zHubAssetUploadUrlRequest,
-  path: z.never().optional(),
-  query: z.never().optional()
-})
-
-/**
- * Presigned upload URL and token
- */
-export const zCreateHubAssetUploadUrlResponse = zHubAssetUploadUrlResponse
-
-export const zListHubLabelsData = z.object({
-  body: z.never().optional(),
-  path: z.never().optional(),
-  query: z
-    .object({
-      type: z.enum(['tag', 'model', 'custom_node']).optional()
-    })
-    .optional()
-})
-
-/**
- * List of labels
- */
-export const zListHubLabelsResponse = zHubLabelListResponse
-
-export const zListHubWorkflowsData = z.object({
-  body: z.never().optional(),
-  path: z.never().optional(),
-  query: z
-    .object({
-      cursor: z.string().optional(),
-      limit: z.number().int().gte(1).lte(100).optional().default(20),
-      search: z.string().optional(),
-      tag: z.string().optional(),
-      username: z.string().optional(),
-      detail: z.boolean().optional().default(false)
-    })
-    .optional()
-})
-
-/**
- * Paginated list of hub workflows
- */
-export const zListHubWorkflowsResponse = zHubWorkflowListResponse
-
-export const zPublishHubWorkflowData = z.object({
-  body: zPublishHubWorkflowRequest,
-  path: z.never().optional(),
-  query: z.never().optional()
-})
-
-/**
- * Workflow published to hub
- */
-export const zPublishHubWorkflowResponse = zHubWorkflowDetail
-
-export const zListHubWorkflowIndexData = z.object({
-  body: z.never().optional(),
-  path: z.never().optional(),
-  query: z.never().optional()
-})
-
-/**
- * List of hub workflow template entries
- */
-export const zListHubWorkflowIndexResponse = z.array(zHubWorkflowTemplateEntry)
-
-export const zDeleteHubWorkflowData = z.object({
-  body: z.never().optional(),
-  path: z.object({
-    share_id: z.string()
-  }),
-  query: z.never().optional()
-})
-
-/**
- * Successfully unpublished
- */
-export const zDeleteHubWorkflowResponse = z.void()
-
-export const zGetHubWorkflowData = z.object({
-  body: z.never().optional(),
-  path: z.object({
-    share_id: z.string()
-  }),
-  query: z.never().optional()
-})
-
-/**
- * Hub workflow detail
- */
-export const zGetHubWorkflowResponse = zHubWorkflowDetail
-
-export const zGetPublishedWorkflowData = z.object({
-  body: z.never().optional(),
-  path: z.object({
-    share_id: z.string()
-  }),
-  query: z.never().optional()
-})
-
-/**
- * Published workflow details with asset statuses
- */
-export const zGetPublishedWorkflowResponse = zPublishedWorkflowDetail

pnpm-workspace.yaml

@@ -4,7 +4,6 @@ packages:
 
 catalog:
   '@alloc/quick-lru': ^5.2.0
-  '@astrojs/vue': ^5.0.0
   '@comfyorg/comfyui-electron-types': 0.6.2
   '@eslint/js': ^9.39.1
   '@formkit/auto-animate': ^0.9.0
@@ -51,7 +50,6 @@ catalog:
   '@types/node': ^24.1.0
   '@types/semver': ^7.7.0
   '@types/three': ^0.169.0
-  '@vercel/analytics': ^2.0.1
   '@vitejs/plugin-vue': ^6.0.0
   '@vitest/coverage-v8': ^4.0.16
   '@vitest/ui': ^4.0.16
@@ -60,7 +58,6 @@ catalog:
   '@vueuse/integrations': ^14.2.0
   '@webgpu/types': ^0.1.66
   algoliasearch: ^5.21.0
-  astro: ^5.10.0
   axios: ^1.13.5
   cross-env: ^10.1.0
   cva: 1.0.0-beta.4

src/App.vue

@@ -9,10 +9,13 @@ import { captureException } from '@sentry/vue'
 import BlockUI from 'primevue/blockui'
 import { computed, onMounted, onUnmounted, watch } from 'vue'
 
+import { useI18n } from 'vue-i18n'
+
 import GlobalDialog from '@/components/dialog/GlobalDialog.vue'
 import config from '@/config'
 import { isDesktop } from '@/platform/distribution/types'
 import { useSettingStore } from '@/platform/settings/settingStore'
+import { useToastStore } from '@/platform/updates/common/toastStore'
 import { app } from '@/scripts/app'
 import { useWorkspaceStore } from '@/stores/workspaceStore'
 import { electronAPI } from '@/utils/envUtil'
@@ -20,6 +23,7 @@ import { parsePreloadError } from '@/utils/preloadErrorUtil'
 import { useDialogService } from '@/services/dialogService'
 import { useConflictDetection } from '@/workbench/extensions/manager/composables/useConflictDetection'
 
+const { t } = useI18n()
 const workspaceStore = useWorkspaceStore()
 app.extensionManager = useWorkspaceStore()
 
@@ -94,17 +98,12 @@ onMounted(() => {
         }
       })
     }
-    // Disabled: Third-party custom node extensions frequently trigger this toast
-    // (e.g., bare "vue" imports, wrong relative paths to scripts/app.js, missing
-    // core dependencies). These are plugin bugs, not ComfyUI core failures, but
-    // the generic error message alarms users and offers no actionable guidance.
-    // The console.error above still logs the details for developers to debug.
-    // useToastStore().add({
-    //   severity: 'error',
-    //   summary: t('g.preloadErrorTitle'),
-    //   detail: t('g.preloadError'),
-    //   life: 10000
-    // })
+    useToastStore().add({
+      severity: 'error',
+      summary: t('g.preloadErrorTitle'),
+      detail: t('g.preloadError'),
+      life: 10000
+    })
   })
 
   // Capture resource load failures (CSS, scripts) in non-localhost distributions

src/assets/palettes/arc.json

@@ -34,7 +34,9 @@
       "CLEAR_BACKGROUND_COLOR": "#2b2f38",
       "NODE_TITLE_COLOR": "#b2b7bd",
       "NODE_SELECTED_TITLE_COLOR": "#FFF",
+      "NODE_TEXT_SIZE": 14,
       "NODE_TEXT_COLOR": "#AAA",
+      "NODE_SUBTEXT_SIZE": 12,
       "NODE_DEFAULT_COLOR": "#2b2f38",
       "NODE_DEFAULT_BGCOLOR": "#242730",
       "NODE_DEFAULT_BOXCOLOR": "#6e7581",
@@ -43,6 +45,7 @@
       "NODE_BYPASS_BGCOLOR": "#FF00FF",
       "NODE_ERROR_COLOUR": "#E00",
       "DEFAULT_SHADOW_COLOR": "rgba(0,0,0,0.5)",
+      "DEFAULT_GROUP_FONT": 22,
       "WIDGET_BGCOLOR": "#2b2f38",
       "WIDGET_OUTLINE_COLOR": "#6e7581",
       "WIDGET_TEXT_COLOR": "#DDD",

src/assets/palettes/dark.json

@@ -25,8 +25,10 @@
       "CLEAR_BACKGROUND_COLOR": "#141414",
       "NODE_TITLE_COLOR": "#999",
       "NODE_SELECTED_TITLE_COLOR": "#FFF",
+      "NODE_TEXT_SIZE": 14,
       "NODE_TEXT_COLOR": "#AAA",
       "NODE_TEXT_HIGHLIGHT_COLOR": "#FFF",
+      "NODE_SUBTEXT_SIZE": 12,
       "NODE_DEFAULT_COLOR": "#333",
       "NODE_DEFAULT_BGCOLOR": "#353535",
       "NODE_DEFAULT_BOXCOLOR": "#666",
@@ -35,6 +37,7 @@
       "NODE_BYPASS_BGCOLOR": "#FF00FF",
       "NODE_ERROR_COLOUR": "#E00",
       "DEFAULT_SHADOW_COLOR": "rgba(0,0,0,0.5)",
+      "DEFAULT_GROUP_FONT": 24,
       "WIDGET_BGCOLOR": "#222",
       "WIDGET_OUTLINE_COLOR": "#666",
       "WIDGET_TEXT_COLOR": "#DDD",

src/assets/palettes/github.json

@@ -34,7 +34,9 @@
       "CLEAR_BACKGROUND_COLOR": "#040506",
       "NODE_TITLE_COLOR": "#999",
       "NODE_SELECTED_TITLE_COLOR": "#e5eaf0",
+      "NODE_TEXT_SIZE": 14,
       "NODE_TEXT_COLOR": "#bcc2c8",
+      "NODE_SUBTEXT_SIZE": 12,
       "NODE_DEFAULT_COLOR": "#161b22",
       "NODE_DEFAULT_BGCOLOR": "#13171d",
       "NODE_DEFAULT_BOXCOLOR": "#30363d",
@@ -43,6 +45,7 @@
       "NODE_BYPASS_BGCOLOR": "#FF00FF",
       "NODE_ERROR_COLOUR": "#E00",
       "DEFAULT_SHADOW_COLOR": "rgba(0,0,0,0.5)",
+      "DEFAULT_GROUP_FONT": 24,
       "WIDGET_BGCOLOR": "#161b22",
       "WIDGET_OUTLINE_COLOR": "#30363d",
       "WIDGET_TEXT_COLOR": "#bcc2c8",

src/assets/palettes/light.json

@@ -26,8 +26,10 @@
       "CLEAR_BACKGROUND_COLOR": "lightgray",
       "NODE_TITLE_COLOR": "#222",
       "NODE_SELECTED_TITLE_COLOR": "#000",
+      "NODE_TEXT_SIZE": 14,
       "NODE_TEXT_COLOR": "#444",
       "NODE_TEXT_HIGHLIGHT_COLOR": "#1e293b",
+      "NODE_SUBTEXT_SIZE": 12,
       "NODE_DEFAULT_COLOR": "#F7F7F7",
       "NODE_DEFAULT_BGCOLOR": "#F5F5F5",
       "NODE_DEFAULT_BOXCOLOR": "#CCC",
@@ -36,6 +38,7 @@
       "NODE_BYPASS_BGCOLOR": "#FF00FF",
       "NODE_ERROR_COLOUR": "#E00",
       "DEFAULT_SHADOW_COLOR": "rgba(0,0,0,0.1)",
+      "DEFAULT_GROUP_FONT": 24,
       "WIDGET_BGCOLOR": "#D4D4D4",
       "WIDGET_OUTLINE_COLOR": "#999",
       "WIDGET_TEXT_COLOR": "#222",

src/assets/palettes/nord.json

@@ -34,7 +34,9 @@
       "CLEAR_BACKGROUND_COLOR": "#212732",
       "NODE_TITLE_COLOR": "#999",
       "NODE_SELECTED_TITLE_COLOR": "#e5eaf0",
+      "NODE_TEXT_SIZE": 14,
       "NODE_TEXT_COLOR": "#bcc2c8",
+      "NODE_SUBTEXT_SIZE": 12,
       "NODE_DEFAULT_COLOR": "#2e3440",
       "NODE_DEFAULT_BGCOLOR": "#161b22",
       "NODE_DEFAULT_BOXCOLOR": "#545d70",
@@ -43,6 +45,7 @@
       "NODE_BYPASS_BGCOLOR": "#FF00FF",
       "NODE_ERROR_COLOUR": "#E00",
       "DEFAULT_SHADOW_COLOR": "rgba(0,0,0,0.5)",
+      "DEFAULT_GROUP_FONT": 24,
       "WIDGET_BGCOLOR": "#2e3440",
       "WIDGET_OUTLINE_COLOR": "#545d70",
       "WIDGET_TEXT_COLOR": "#bcc2c8",

src/assets/palettes/solarized.json

@@ -19,7 +19,9 @@
     "litegraph_base": {
       "NODE_TITLE_COLOR": "#fdf6e3",
       "NODE_SELECTED_TITLE_COLOR": "#A9D400",
+      "NODE_TEXT_SIZE": 14,
       "NODE_TEXT_COLOR": "#657b83",
+      "NODE_SUBTEXT_SIZE": 12,
       "NODE_DEFAULT_COLOR": "#094656",
       "NODE_DEFAULT_BGCOLOR": "#073642",
       "NODE_DEFAULT_BOXCOLOR": "#839496",
@@ -28,6 +30,7 @@
       "NODE_BYPASS_BGCOLOR": "#FF00FF",
       "NODE_ERROR_COLOUR": "#E00",
       "DEFAULT_SHADOW_COLOR": "rgba(0,0,0,0.5)",
+      "DEFAULT_GROUP_FONT": 24,
       "WIDGET_BGCOLOR": "#002b36",
       "WIDGET_OUTLINE_COLOR": "#839496",
       "WIDGET_TEXT_COLOR": "#fdf6e3",

src/components/dialog/content/error/FindIssueButton.vue

@@ -19,7 +19,10 @@ const props = defineProps<{
 
 const queryString = computed(() => props.errorMessage + ' is:issue')
 
-function openGitHubIssues() {
+/**
+ * Open GitHub issues search and track telemetry.
+ */
+const openGitHubIssues = () => {
   useTelemetry()?.trackUiButtonClicked({
     button_id: 'error_dialog_find_existing_issues_clicked'
   })

src/components/error/ErrorOverlay.vue

@@ -49,12 +49,7 @@
           <Button variant="muted-textonly" size="unset" @click="dismiss">
             {{ t('g.dismiss') }}
           </Button>
-          <Button
-            variant="secondary"
-            size="lg"
-            data-testid="error-overlay-see-errors"
-            @click="seeErrors"
-          >
+          <Button variant="secondary" size="lg" @click="seeErrors">
             {{
               appMode ? t('linearMode.error.goto') : t('errorOverlay.seeErrors')
             }}

src/components/graph/TitleEditor.vue

@@ -84,9 +84,7 @@ watch(
         pos: group.pos,
         size: [group.size[0], group.titleHeight]
       })
-      inputFontStyle.value = {
-        fontSize: `${LiteGraph.GROUP_TEXT_SIZE * scale}px`
-      }
+      inputFontStyle.value = { fontSize: `${group.font_size * scale}px` }
     } else if (target instanceof LGraphNode) {
       const node = target
       const [x, y] = node.getBounding()

src/components/input/MultiSelect.test.ts

@@ -1,60 +0,0 @@
-import { mount } from '@vue/test-utils'
-import { describe, expect, it } from 'vitest'
-import { nextTick } from 'vue'
-import { createI18n } from 'vue-i18n'
-
-import MultiSelect from './MultiSelect.vue'
-
-const i18n = createI18n({
-  legacy: false,
-  locale: 'en',
-  messages: {
-    en: {
-      g: {
-        multiSelectDropdown: 'Multi-select dropdown',
-        noResultsFound: 'No results found',
-        search: 'Search',
-        clearAll: 'Clear all',
-        itemsSelected: 'Items selected'
-      }
-    }
-  }
-})
-
-describe('MultiSelect', () => {
-  function createWrapper() {
-    return mount(MultiSelect, {
-      attachTo: document.body,
-      global: {
-        plugins: [i18n]
-      },
-      props: {
-        modelValue: [],
-        label: 'Category',
-        options: [
-          { name: 'One', value: 'one' },
-          { name: 'Two', value: 'two' }
-        ]
-      }
-    })
-  }
-
-  it('keeps open-state border styling available while the dropdown is open', async () => {
-    const wrapper = createWrapper()
-
-    const trigger = wrapper.get('button[aria-haspopup="listbox"]')
-
-    expect(trigger.classes()).toContain(
-      'data-[state=open]:border-node-component-border'
-    )
-    expect(trigger.attributes('aria-expanded')).toBe('false')
-
-    await trigger.trigger('click')
-    await nextTick()
-
-    expect(trigger.attributes('aria-expanded')).toBe('true')
-    expect(trigger.attributes('data-state')).toBe('open')
-
-    wrapper.unmount()
-  })
-})

src/components/input/MultiSelect.vue

@@ -1,215 +1,207 @@
 <template>
-  <ComboboxRoot
+  <!--
+    Note: Unlike SingleSelect, we don't need an explicit options prop because:
+    1. Our value template only shows a static label (not dynamic based on selection)
+    2. We display a count badge instead of actual selected labels
+    3. All PrimeVue props (including options) are passed via v-bind="$attrs"
+    option-label="name" is required because our option template directly accesses option.name
+    max-selected-labels="0" is required to show count badge instead of selected item labels
+  -->
+  <MultiSelect
     v-model="selectedItems"
-    multiple
-    by="value"
-    :disabled
-    ignore-filter
-    :reset-search-term-on-select="false"
+    v-bind="{ ...$attrs, options: filteredOptions }"
+    option-label="name"
+    unstyled
+    :max-selected-labels="0"
+    :pt="{
+      root: ({ props }: MultiSelectPassThroughMethodOptions) => ({
+        class: cn(
+          'relative inline-flex cursor-pointer select-none',
+          size === 'md' ? 'h-8' : 'h-10',
+          'rounded-lg bg-secondary-background text-base-foreground',
+          'transition-all duration-200 ease-in-out',
+          'hover:bg-secondary-background-hover',
+          'border-[2.5px] border-solid',
+          selectedCount > 0 ? 'border-base-foreground' : 'border-transparent',
+          'focus-within:border-base-foreground',
+          props.disabled &&
+            'cursor-default opacity-30 hover:bg-secondary-background'
+        )
+      }),
+      labelContainer: {
+        class: cn(
+          'flex flex-1 items-center overflow-hidden py-2 whitespace-nowrap',
+          size === 'md' ? 'pl-3' : 'pl-4'
+        )
+      },
+      label: {
+        class: 'p-0'
+      },
+      dropdown: {
+        class: 'flex shrink-0 cursor-pointer items-center justify-center px-3'
+      },
+      header: () => ({
+        class:
+          showSearchBox || showSelectedCount || showClearButton
+            ? 'block'
+            : 'hidden'
+      }),
+      // Overlay & list visuals unchanged
+      overlay: {
+        class: cn(
+          'mt-2 rounded-lg p-2',
+          'bg-base-background',
+          'text-base-foreground',
+          'border border-solid border-border-default'
+        )
+      },
+      listContainer: () => ({
+        style: { maxHeight: `min(${listMaxHeight}, 50vh)` },
+        class: 'scrollbar-custom'
+      }),
+      list: {
+        class: 'flex flex-col gap-0 p-0 m-0 list-none border-none text-sm'
+      },
+      // Option row hover and focus tone
+      option: ({ context }: MultiSelectPassThroughMethodOptions) => ({
+        class: cn(
+          'flex h-10 cursor-pointer items-center gap-2 rounded-lg px-2',
+          'hover:bg-secondary-background-hover',
+          // Add focus/highlight state for keyboard navigation
+          context?.focused &&
+            'bg-secondary-background-selected hover:bg-secondary-background-selected'
+        )
+      }),
+      // Hide built-in checkboxes entirely via PT (no :deep)
+      pcHeaderCheckbox: {
+        root: { class: 'hidden' },
+        style: { display: 'none' }
+      },
+      pcOptionCheckbox: {
+        root: { class: 'hidden' },
+        style: { display: 'none' }
+      },
+      emptyMessage: {
+        class: 'px-3 pb-4 text-sm text-muted-foreground'
+      }
+    }"
+    :aria-label="label || t('g.multiSelectDropdown')"
+    role="combobox"
+    :aria-expanded="false"
+    aria-haspopup="listbox"
+    :tabindex="0"
   >
-    <ComboboxAnchor as-child>
-      <ComboboxTrigger
-        v-bind="$attrs"
-        :aria-label="label || t('g.multiSelectDropdown')"
-        :class="
-          cn(
-            'relative inline-flex cursor-pointer items-center select-none',
-            size === 'md' ? 'h-8' : 'h-10',
-            'rounded-lg bg-secondary-background text-base-foreground',
-            'transition-all duration-200 ease-in-out',
-            'hover:bg-secondary-background-hover',
-            'border-[2.5px] border-solid border-transparent',
-            selectedCount > 0
-              ? 'border-base-foreground'
-              : 'focus-visible:border-node-component-border data-[state=open]:border-node-component-border',
-            disabled &&
-              'cursor-default opacity-30 hover:bg-secondary-background'
-          )
-        "
-      >
+    <template
+      v-if="showSearchBox || showSelectedCount || showClearButton"
+      #header
+    >
+      <div class="flex flex-col px-2 pt-2 pb-0">
+        <SearchInput
+          v-if="showSearchBox"
+          v-model="searchQuery"
+          :class="showSelectedCount || showClearButton ? 'mb-2' : ''"
+          :placeholder="searchPlaceholder"
+          size="sm"
+        />
         <div
-          :class="
-            cn(
-              'flex flex-1 items-center overflow-hidden py-2 whitespace-nowrap',
-              size === 'md' ? 'pl-3' : 'pl-4'
-            )
-          "
+          v-if="showSelectedCount || showClearButton"
+          class="mt-2 flex items-center justify-between"
         >
-          <span :class="size === 'md' ? 'text-xs' : 'text-sm'">
-            {{ label }}
-          </span>
           <span
-            v-if="selectedCount > 0"
-            class="pointer-events-none absolute -top-2 -right-2 z-10 flex size-5 items-center justify-center rounded-full bg-base-foreground text-xs font-semibold text-base-background"
+            v-if="showSelectedCount"
+            class="px-1 text-sm text-base-foreground"
           >
-            {{ selectedCount }}
+            {{
+              selectedCount > 0
+                ? $t('g.itemsSelected', { selectedCount })
+                : $t('g.itemSelected', { selectedCount })
+            }}
           </span>
+          <Button
+            v-if="showClearButton"
+            variant="textonly"
+            size="md"
+            @click.stop="selectedItems = []"
+          >
+            {{ $t('g.clearAll') }}
+          </Button>
         </div>
-        <div
-          class="flex shrink-0 cursor-pointer items-center justify-center px-3"
-        >
-          <i class="icon-[lucide--chevron-down] text-muted-foreground" />
-        </div>
-      </ComboboxTrigger>
-    </ComboboxAnchor>
+        <div class="my-4 h-px bg-border-default"></div>
+      </div>
+    </template>
 
-    <ComboboxPortal>
-      <ComboboxContent
-        position="popper"
-        :side-offset="8"
-        align="start"
+    <!-- Trigger value (keep text scale identical) -->
+    <template #value>
+      <span :class="size === 'md' ? 'text-xs' : 'text-sm'">
+        {{ label }}
+      </span>
+      <span
+        v-if="selectedCount > 0"
+        class="pointer-events-none absolute -top-2 -right-2 z-10 flex size-5 items-center justify-center rounded-full bg-base-foreground text-xs font-semibold text-base-background"
+      >
+        {{ selectedCount }}
+      </span>
+    </template>
+
+    <!-- Chevron size identical to current -->
+    <template #dropdownicon>
+      <i class="icon-[lucide--chevron-down] text-muted-foreground" />
+    </template>
+
+    <!-- Custom option row: square checkbox + label (unchanged layout/colors) -->
+    <template #option="slotProps">
+      <div
+        role="button"
+        class="flex cursor-pointer items-center gap-2"
         :style="popoverStyle"
-        :class="
-          cn(
-            'z-3000 overflow-hidden',
-            'rounded-lg p-2',
-            'bg-base-background text-base-foreground',
-            'border border-solid border-border-default',
-            'shadow-md',
-            'data-[state=closed]:animate-out data-[state=open]:animate-in',
-            'data-[state=closed]:fade-out-0 data-[state=open]:fade-in-0',
-            'data-[state=closed]:zoom-out-95 data-[state=open]:zoom-in-95',
-            'data-[side=bottom]:slide-in-from-top-2'
-          )
-        "
-        @focus-outside="preventFocusDismiss"
       >
         <div
-          v-if="showSearchBox || showSelectedCount || showClearButton"
-          class="flex flex-col px-2 pt-2 pb-0"
-        >
-          <div
-            v-if="showSearchBox"
-            :class="
-              cn(
-                'flex items-center gap-2 rounded-lg border border-solid border-border-default px-3 py-1.5',
-                (showSelectedCount || showClearButton) && 'mb-2'
-              )
-            "
-          >
-            <i
-              class="icon-[lucide--search] shrink-0 text-sm text-muted-foreground"
-            />
-            <ComboboxInput
-              v-model="searchQuery"
-              :placeholder="searchPlaceholder ?? t('g.search')"
-              class="w-full border-none bg-transparent text-sm outline-none"
-            />
-          </div>
-          <div
-            v-if="showSelectedCount || showClearButton"
-            class="mt-2 flex items-center justify-between"
-          >
-            <span
-              v-if="showSelectedCount"
-              class="px-1 text-sm text-base-foreground"
-            >
-              {{ $t('g.itemsSelected', { count: selectedCount }) }}
-            </span>
-            <Button
-              v-if="showClearButton"
-              variant="textonly"
-              size="md"
-              @click.stop="selectedItems = []"
-            >
-              {{ $t('g.clearAll') }}
-            </Button>
-          </div>
-          <div class="my-4 h-px bg-border-default" />
-        </div>
-
-        <ComboboxViewport
+          class="flex size-4 shrink-0 items-center justify-center rounded-sm p-0.5 transition-all duration-200"
           :class="
-            cn(
-              'flex flex-col gap-0 p-0 text-sm',
-              'scrollbar-custom overflow-y-auto',
-              'min-w-(--reka-combobox-trigger-width)'
-            )
+            slotProps.selected
+              ? 'bg-primary-background'
+              : 'bg-secondary-background'
           "
-          :style="{ maxHeight: `min(${listMaxHeight}, 50vh)` }"
         >
-          <ComboboxItem
-            v-for="opt in filteredOptions"
-            :key="opt.value"
-            :value="opt"
-            :class="
-              cn(
-                'group flex h-10 shrink-0 cursor-pointer items-center gap-2 rounded-lg px-2 outline-none',
-                'hover:bg-secondary-background-hover',
-                'data-highlighted:bg-secondary-background-selected data-highlighted:hover:bg-secondary-background-selected'
-              )
-            "
-          >
-            <div
-              class="flex size-4 shrink-0 items-center justify-center rounded-sm transition-all duration-200 group-data-[state=checked]:bg-primary-background group-data-[state=unchecked]:bg-secondary-background [&>span]:flex"
-            >
-              <ComboboxItemIndicator>
-                <i
-                  class="icon-[lucide--check] text-xs font-bold text-base-foreground"
-                />
-              </ComboboxItemIndicator>
-            </div>
-            <span>{{ opt.name }}</span>
-          </ComboboxItem>
-          <ComboboxEmpty class="px-3 pb-4 text-sm text-muted-foreground">
-            {{ $t('g.noResultsFound') }}
-          </ComboboxEmpty>
-        </ComboboxViewport>
-      </ComboboxContent>
-    </ComboboxPortal>
-  </ComboboxRoot>
+          <i
+            v-if="slotProps.selected"
+            class="text-bold icon-[lucide--check] text-xs text-base-foreground"
+          />
+        </div>
+        <span>
+          {{ slotProps.option.name }}
+        </span>
+      </div>
+    </template>
+  </MultiSelect>
 </template>
 
 <script setup lang="ts">
 import { useFuse } from '@vueuse/integrations/useFuse'
 import type { UseFuseOptions } from '@vueuse/integrations/useFuse'
-import type { FocusOutsideEvent } from 'reka-ui'
-import {
-  ComboboxAnchor,
-  ComboboxContent,
-  ComboboxEmpty,
-  ComboboxInput,
-  ComboboxItem,
-  ComboboxItemIndicator,
-  ComboboxPortal,
-  ComboboxRoot,
-  ComboboxTrigger,
-  ComboboxViewport
-} from 'reka-ui'
-import { computed } from 'vue'
+import type { MultiSelectPassThroughMethodOptions } from 'primevue/multiselect'
+import MultiSelect from 'primevue/multiselect'
+import { computed, useAttrs } from 'vue'
 import { useI18n } from 'vue-i18n'
 
+import SearchInput from '@/components/ui/search-input/SearchInput.vue'
 import Button from '@/components/ui/button/Button.vue'
 import { usePopoverSizing } from '@/composables/usePopoverSizing'
 import { cn } from '@/utils/tailwindUtil'
 
 import type { SelectOption } from './types'
 
+type Option = SelectOption
+
 defineOptions({
   inheritAttrs: false
 })
 
-const {
-  label,
-  options = [],
-  size = 'lg',
-  disabled = false,
-  showSearchBox = false,
-  showSelectedCount = false,
-  showClearButton = false,
-  searchPlaceholder,
-  listMaxHeight = '28rem',
-  popoverMinWidth,
-  popoverMaxWidth
-} = defineProps<{
+interface Props {
   /** Input label shown on the trigger button */
   label?: string
-  /** Available options */
-  options?: SelectOption[]
   /** Trigger size: 'lg' (40px, Interface) or 'md' (32px, Node) */
   size?: 'lg' | 'md'
-  /** Disable the select */
-  disabled?: boolean
   /** Show search box in the panel header */
   showSearchBox?: boolean
   /** Show selected count text in the panel header */
@@ -224,9 +216,22 @@ const {
   popoverMinWidth?: string
   /** Maximum width of the popover (default: auto) */
   popoverMaxWidth?: string
-}>()
+  // Note: options prop is intentionally omitted.
+  // It's passed via $attrs to maximize PrimeVue API compatibility
+}
+const {
+  label,
+  size = 'lg',
+  showSearchBox = false,
+  showSelectedCount = false,
+  showClearButton = false,
+  searchPlaceholder = 'Search...',
+  listMaxHeight = '28rem',
+  popoverMinWidth,
+  popoverMaxWidth
+} = defineProps<Props>()
 
-const selectedItems = defineModel<SelectOption[]>({
+const selectedItems = defineModel<Option[]>({
   required: true
 })
 const searchQuery = defineModel<string>('searchQuery', { default: '' })
@@ -234,16 +239,15 @@ const searchQuery = defineModel<string>('searchQuery', { default: '' })
 const { t } = useI18n()
 const selectedCount = computed(() => selectedItems.value.length)
 
-function preventFocusDismiss(event: FocusOutsideEvent) {
-  event.preventDefault()
-}
-
 const popoverStyle = usePopoverSizing({
   minWidth: popoverMinWidth,
   maxWidth: popoverMaxWidth
 })
+const attrs = useAttrs()
+const originalOptions = computed(() => (attrs.options as Option[]) || [])
 
-const fuseOptions: UseFuseOptions<SelectOption> = {
+// Use VueUse's useFuse for better reactivity and performance
+const fuseOptions: UseFuseOptions<Option> = {
   fuseOptions: {
     keys: ['name', 'value'],
     threshold: 0.3,
@@ -252,20 +256,23 @@ const fuseOptions: UseFuseOptions<SelectOption> = {
   matchAllWhenSearchEmpty: true
 }
 
-const { results } = useFuse(searchQuery, () => options, fuseOptions)
+const { results } = useFuse(searchQuery, originalOptions, fuseOptions)
 
+// Filter options based on search, but always include selected items
 const filteredOptions = computed(() => {
   if (!searchQuery.value || searchQuery.value.trim() === '') {
-    return options
+    return originalOptions.value
   }
 
+  // results.value already contains the search results from useFuse
   const searchResults = results.value.map(
-    (result: { item: SelectOption }) => result.item
+    (result: { item: Option }) => result.item
   )
 
+  // Include selected items that aren't in search results
   const selectedButNotInResults = selectedItems.value.filter(
     (item) =>
-      !searchResults.some((result: SelectOption) => result.value === item.value)
+      !searchResults.some((result: Option) => result.value === item.value)
   )
 
   return [...selectedButNotInResults, ...searchResults]

src/components/input/SingleSelect.vue

@@ -1,12 +1,21 @@
 <template>
-  <SelectRoot v-model="selectedItem" :disabled>
-    <SelectTrigger
-      v-bind="$attrs"
-      :aria-label="label || t('g.singleSelectDropdown')"
-      :aria-busy="loading || undefined"
-      :aria-invalid="invalid || undefined"
-      :class="
-        cn(
+  <!--
+    Note: We explicitly pass options here (not just via $attrs) because:
+    1. Our custom value template needs options to look up labels from values
+    2. PrimeVue's value slot only provides 'value' and 'placeholder', not the selected item's label
+    3. We need to maintain the icon slot functionality in the value template
+    option-label="name" is required because our option template directly accesses option.name
+  -->
+  <Select
+    v-model="selectedItem"
+    v-bind="$attrs"
+    :options="options"
+    option-label="name"
+    option-value="value"
+    unstyled
+    :pt="{
+      root: ({ props }: SelectPassThroughMethodOptions<SelectOption>) => ({
+        class: cn(
           'relative inline-flex cursor-pointer items-center select-none',
           size === 'md' ? 'h-8' : 'h-10',
           'rounded-lg',
@@ -14,107 +23,121 @@
           'transition-all duration-200 ease-in-out',
           'hover:bg-secondary-background-hover',
           'border-[2.5px] border-solid',
-          invalid ? 'border-destructive-background' : 'border-transparent',
-          'focus:border-node-component-border focus:outline-none',
-          'disabled:cursor-default disabled:opacity-30 disabled:hover:bg-secondary-background'
+          invalid
+            ? 'border-destructive-background'
+            : 'border-transparent focus-within:border-node-component-border',
+          props.disabled &&
+            'cursor-default opacity-30 hover:bg-secondary-background'
         )
-      "
-    >
+      }),
+      label: {
+        class: cn(
+          'flex flex-1 items-center py-2 whitespace-nowrap outline-hidden',
+          size === 'md' ? 'pl-3' : 'pl-4'
+        )
+      },
+      dropdown: {
+        class:
+          // Right chevron touch area
+          'flex shrink-0 items-center justify-center px-3 py-2'
+      },
+      overlay: {
+        class: cn(
+          'mt-2 rounded-lg p-2',
+          'bg-base-background text-base-foreground',
+          'border border-solid border-border-default'
+        )
+      },
+      listContainer: () => ({
+        style: `max-height: min(${listMaxHeight}, 50vh)`,
+        class: 'scrollbar-custom'
+      }),
+      list: {
+        class:
+          // Same list tone/size as MultiSelect
+          'flex flex-col gap-0 p-0 m-0 list-none border-none text-sm'
+      },
+      option: ({ context }: SelectPassThroughMethodOptions<SelectOption>) => ({
+        class: cn(
+          // Row layout
+          'flex items-center justify-between gap-3 rounded-sm px-2 py-3',
+          'hover:bg-secondary-background-hover',
+          // Add focus state for keyboard navigation
+          context.focused && 'bg-secondary-background-hover',
+          // Selected state + check icon
+          context.selected &&
+            'bg-secondary-background-selected hover:bg-secondary-background-selected'
+        )
+      }),
+      optionLabel: {
+        class: 'truncate'
+      },
+      optionGroupLabel: {
+        class: 'px-3 py-2 text-xs uppercase tracking-wide text-muted-foreground'
+      },
+      emptyMessage: {
+        class: 'px-3 py-2 text-sm text-muted-foreground'
+      }
+    }"
+    :aria-label="label || t('g.singleSelectDropdown')"
+    :aria-busy="loading || undefined"
+    :aria-invalid="invalid || undefined"
+    role="combobox"
+    :aria-expanded="false"
+    aria-haspopup="listbox"
+    :tabindex="0"
+  >
+    <!-- Trigger value -->
+    <template #value="slotProps">
       <div
         :class="
-          cn(
-            'flex flex-1 items-center gap-2 overflow-hidden py-2',
-            size === 'md' ? 'pl-3 text-xs' : 'pl-4 text-sm'
-          )
+          cn('flex items-center gap-2', size === 'md' ? 'text-xs' : 'text-sm')
         "
       >
         <i
           v-if="loading"
-          class="icon-[lucide--loader-circle] shrink-0 animate-spin text-muted-foreground"
+          class="icon-[lucide--loader-circle] animate-spin text-muted-foreground"
         />
         <slot v-else name="icon" />
-        <SelectValue :placeholder="label" class="truncate" />
-      </div>
-      <div
-        class="flex shrink-0 cursor-pointer items-center justify-center px-3"
-      >
-        <i class="icon-[lucide--chevron-down] text-muted-foreground" />
-      </div>
-    </SelectTrigger>
-
-    <SelectPortal>
-      <SelectContent
-        position="popper"
-        :side-offset="8"
-        align="start"
-        :style="optionStyle"
-        :class="
-          cn(
-            'z-3000 overflow-hidden',
-            'rounded-lg p-2',
-            'bg-base-background text-base-foreground',
-            'border border-solid border-border-default',
-            'shadow-md',
-            'min-w-(--reka-select-trigger-width)',
-            'data-[state=closed]:animate-out data-[state=open]:animate-in',
-            'data-[state=closed]:fade-out-0 data-[state=open]:fade-in-0',
-            'data-[state=closed]:zoom-out-95 data-[state=open]:zoom-in-95',
-            'data-[side=bottom]:slide-in-from-top-2'
-          )
-        "
-      >
-        <SelectViewport
-          :style="{ maxHeight: `min(${listMaxHeight}, 50vh)` }"
-          class="scrollbar-custom w-full"
+        <span
+          v-if="slotProps.value !== null && slotProps.value !== undefined"
+          class="text-base-foreground"
         >
-          <SelectItem
-            v-for="opt in options"
-            :key="opt.value"
-            :value="opt.value"
-            :class="
-              cn(
-                'relative flex w-full cursor-pointer items-center justify-between select-none',
-                'gap-3 rounded-sm px-2 py-3 text-sm outline-none',
-                'hover:bg-secondary-background-hover',
-                'focus:bg-secondary-background-hover',
-                'data-[state=checked]:bg-secondary-background-selected',
-                'data-[state=checked]:hover:bg-secondary-background-selected'
-              )
-            "
-          >
-            <SelectItemText class="truncate">
-              {{ opt.name }}
-            </SelectItemText>
-            <SelectItemIndicator
-              class="flex shrink-0 items-center justify-center"
-            >
-              <i
-                class="icon-[lucide--check] text-base-foreground"
-                aria-hidden="true"
-              />
-            </SelectItemIndicator>
-          </SelectItem>
-        </SelectViewport>
-      </SelectContent>
-    </SelectPortal>
-  </SelectRoot>
+          {{ getLabel(slotProps.value) }}
+        </span>
+        <span v-else class="text-base-foreground">
+          {{ label }}
+        </span>
+      </div>
+    </template>
+
+    <!-- Trigger caret (hidden when loading) -->
+    <template #dropdownicon>
+      <i
+        v-if="!loading"
+        class="icon-[lucide--chevron-down] text-muted-foreground"
+      />
+    </template>
+
+    <!-- Option row -->
+    <template #option="{ option, selected }">
+      <div
+        class="flex w-full items-center justify-between gap-3"
+        :style="optionStyle"
+      >
+        <span class="truncate">{{ option.name }}</span>
+        <i v-if="selected" class="icon-[lucide--check] text-base-foreground" />
+      </div>
+    </template>
+  </Select>
 </template>
 
 <script setup lang="ts">
-import {
-  SelectContent,
-  SelectItem,
-  SelectItemIndicator,
-  SelectItemText,
-  SelectPortal,
-  SelectRoot,
-  SelectTrigger,
-  SelectValue,
-  SelectViewport
-} from 'reka-ui'
+import type { SelectPassThroughMethodOptions } from 'primevue/select'
+import Select from 'primevue/select'
+import { computed } from 'vue'
 import { useI18n } from 'vue-i18n'
 
-import { usePopoverSizing } from '@/composables/usePopoverSizing'
 import { cn } from '@/utils/tailwindUtil'
 
 import type { SelectOption } from './types'
@@ -129,12 +152,16 @@ const {
   size = 'lg',
   invalid = false,
   loading = false,
-  disabled = false,
   listMaxHeight = '28rem',
   popoverMinWidth,
   popoverMaxWidth
 } = defineProps<{
   label?: string
+  /**
+   * Required for displaying the selected item's label.
+   * Cannot rely on $attrs alone because we need to access options
+   * in getLabel() to map values to their display names.
+   */
   options?: SelectOption[]
   /** Trigger size: 'lg' (40px, Interface) or 'md' (32px, Node) */
   size?: 'lg' | 'md'
@@ -142,8 +169,6 @@ const {
   invalid?: boolean
   /** Show loading spinner instead of chevron */
   loading?: boolean
-  /** Disable the select */
-  disabled?: boolean
   /** Maximum height of the dropdown panel (default: 28rem) */
   listMaxHeight?: string
   /** Minimum width of the popover (default: auto) */
@@ -156,8 +181,26 @@ const selectedItem = defineModel<string | undefined>({ required: true })
 
 const { t } = useI18n()
 
-const optionStyle = usePopoverSizing({
-  minWidth: popoverMinWidth,
-  maxWidth: popoverMaxWidth
+/**
+ * Maps a value to its display label.
+ * Necessary because PrimeVue's value slot doesn't provide the selected item's label,
+ * only the raw value. We need this to show the correct text when an item is selected.
+ */
+const getLabel = (val: string | null | undefined) => {
+  if (val == null) return label ?? ''
+  if (!options) return label ?? ''
+  const found = options.find((o) => o.value === val)
+  return found ? found.name : (label ?? '')
+}
+
+// Extract complex style logic from template
+const optionStyle = computed(() => {
+  if (!popoverMinWidth && !popoverMaxWidth) return undefined
+
+  const styles: string[] = []
+  if (popoverMinWidth) styles.push(`min-width: ${popoverMinWidth}`)
+  if (popoverMaxWidth) styles.push(`max-width: ${popoverMaxWidth}`)
+
+  return styles.join('; ')
 })
 </script>

src/components/rightSidePanel/RightSidePanel.vue

@@ -9,15 +9,12 @@ import TabList from '@/components/tab/TabList.vue'
 import Button from '@/components/ui/button/Button.vue'
 import { useGraphHierarchy } from '@/composables/graph/useGraphHierarchy'
 import { st } from '@/i18n'
-import { app } from '@/scripts/app'
-import { getActiveGraphNodeIds } from '@/utils/graphTraversalUtil'
 import { SubgraphNode } from '@/lib/litegraph/src/litegraph'
 import type { LGraphNode } from '@/lib/litegraph/src/litegraph'
 import { useSettingStore } from '@/platform/settings/settingStore'
 import { useCanvasStore } from '@/renderer/core/canvas/canvasStore'
 import { useMissingModelStore } from '@/platform/missingModel/missingModelStore'
 import { useExecutionErrorStore } from '@/stores/executionErrorStore'
-import { useMissingNodesErrorStore } from '@/platform/nodeReplacement/missingNodesErrorStore'
 import { useRightSidePanelStore } from '@/stores/workspace/rightSidePanelStore'
 import type { RightSidePanelTab } from '@/stores/workspace/rightSidePanelStore'
 import { resolveNodeDisplayName } from '@/utils/nodeTitleUtil'
@@ -41,21 +38,12 @@ import TabErrors from './errors/TabErrors.vue'
 const canvasStore = useCanvasStore()
 const executionErrorStore = useExecutionErrorStore()
 const missingModelStore = useMissingModelStore()
-const missingNodesErrorStore = useMissingNodesErrorStore()
 const rightSidePanelStore = useRightSidePanelStore()
 const settingStore = useSettingStore()
 const { t } = useI18n()
 
-const { hasAnyError, allErrorExecutionIds } = storeToRefs(executionErrorStore)
-
-const activeMissingNodeGraphIds = computed<Set<string>>(() => {
-  if (!app.isGraphReady) return new Set()
-  return getActiveGraphNodeIds(
-    app.rootGraph,
-    canvasStore.currentGraph ?? app.rootGraph,
-    missingNodesErrorStore.missingAncestorExecutionIds
-  )
-})
+const { hasAnyError, allErrorExecutionIds, activeMissingNodeGraphIds } =
+  storeToRefs(executionErrorStore)
 
 const { activeMissingModelGraphIds } = storeToRefs(missingModelStore)
 

src/components/rightSidePanel/errors/ErrorNodeCard.test.ts

@@ -237,11 +237,6 @@ describe('ErrorNodeCard.vue', () => {
 
     // Report is still generated with fallback log message
     expect(mockGenerateErrorReport).toHaveBeenCalledOnce()
-    expect(mockGenerateErrorReport).toHaveBeenCalledWith(
-      expect.objectContaining({
-        serverLogs: 'Failed to retrieve server logs'
-      })
-    )
     expect(wrapper.text()).toContain('ComfyUI Error Report')
   })
 

src/components/rightSidePanel/errors/ErrorNodeCard.vue

@@ -90,7 +90,6 @@
               variant="secondary"
               size="sm"
               class="h-8 w-2/3 justify-center gap-1 rounded-lg text-xs"
-              data-testid="error-card-find-on-github"
               @click="handleCheckGithub(error)"
             >
               {{ t('g.findOnGithub') }}
@@ -100,7 +99,6 @@
               variant="secondary"
               size="sm"
               class="h-8 w-1/3 justify-center gap-1 rounded-lg text-xs"
-              data-testid="error-card-copy"
               @click="handleCopyError(idx)"
             >
               {{ t('g.copy') }}
@@ -127,10 +125,12 @@
 import { useI18n } from 'vue-i18n'
 
 import Button from '@/components/ui/button/Button.vue'
+import { useExternalLink } from '@/composables/useExternalLink'
+import { useTelemetry } from '@/platform/telemetry'
+import { useCommandStore } from '@/stores/commandStore'
 import { cn } from '@/utils/tailwindUtil'
 
 import type { ErrorCardData, ErrorItem } from './types'
-import { useErrorActions } from './useErrorActions'
 import { useErrorReport } from './useErrorReport'
 
 const {
@@ -154,8 +154,10 @@ const emit = defineEmits<{
 }>()
 
 const { t } = useI18n()
+const telemetry = useTelemetry()
+const { staticUrls } = useExternalLink()
+const commandStore = useCommandStore()
 const { displayedDetailsMap } = useErrorReport(() => card)
-const { findOnGitHub, contactSupport: handleGetHelp } = useErrorActions()
 
 function handleLocateNode() {
   if (card.nodeId) {
@@ -176,6 +178,23 @@ function handleCopyError(idx: number) {
 }
 
 function handleCheckGithub(error: ErrorItem) {
-  findOnGitHub(error.message)
+  telemetry?.trackUiButtonClicked({
+    button_id: 'error_tab_find_existing_issues_clicked'
+  })
+  const query = encodeURIComponent(error.message + ' is:issue')
+  window.open(
+    `${staticUrls.githubIssues}?q=${query}`,
+    '_blank',
+    'noopener,noreferrer'
+  )
+}
+
+function handleGetHelp() {
+  telemetry?.trackHelpResourceClicked({
+    resource_type: 'help_feedback',
+    is_external: true,
+    source: 'error_dialog'
+  })
+  commandStore.execute('Comfy.ContactSupport')
 }
 </script>

src/components/rightSidePanel/errors/MissingNodeCard.test.ts

@@ -1,5 +1,7 @@
 import { mount } from '@vue/test-utils'
 import { createTestingPinia } from '@pinia/testing'
+import PrimeVue from 'primevue/config'
+import { ref } from 'vue'
 import { beforeEach, describe, expect, it, vi } from 'vitest'
 import { createI18n } from 'vue-i18n'
 
@@ -40,25 +42,23 @@ vi.mock('@/stores/systemStatsStore', () => ({
   })
 }))
 
-const mockApplyChanges = vi.hoisted(() => vi.fn())
-const mockIsRestarting = vi.hoisted(() => ({ value: false }))
+const mockApplyChanges = vi.fn()
+const mockIsRestarting = ref(false)
 vi.mock('@/workbench/extensions/manager/composables/useApplyChanges', () => ({
   useApplyChanges: () => ({
-    get isRestarting() {
-      return mockIsRestarting.value
-    },
+    isRestarting: mockIsRestarting,
     applyChanges: mockApplyChanges
   })
 }))
 
-const mockIsPackInstalled = vi.hoisted(() => vi.fn(() => false))
+const mockIsPackInstalled = vi.fn(() => false)
 vi.mock('@/workbench/extensions/manager/stores/comfyManagerStore', () => ({
   useComfyManagerStore: () => ({
     isPackInstalled: mockIsPackInstalled
   })
 }))
 
-const mockShouldShowManagerButtons = vi.hoisted(() => ({ value: false }))
+const mockShouldShowManagerButtons = { value: false }
 vi.mock('@/workbench/extensions/manager/composables/useManagerState', () => ({
   useManagerState: () => ({
     shouldShowManagerButtons: mockShouldShowManagerButtons
@@ -128,7 +128,7 @@ function mountCard(
       ...props
     },
     global: {
-      plugins: [createTestingPinia({ createSpy: vi.fn }), i18n],
+      plugins: [createTestingPinia({ createSpy: vi.fn }), PrimeVue, i18n],
       stubs: {
         DotSpinner: { template: '<span role="status" aria-label="loading" />' }
       }

src/components/rightSidePanel/errors/TabErrors.test.ts

@@ -209,9 +209,12 @@ describe('TabErrors.vue', () => {
       }
     })
 
-    const copyButton = wrapper.find('[data-testid="error-card-copy"]')
-    expect(copyButton.exists()).toBe(true)
-    await copyButton.trigger('click')
+    // Find the copy button by text (rendered inside ErrorNodeCard)
+    const copyButton = wrapper
+      .findAll('button')
+      .find((btn) => btn.text().includes('Copy'))
+    expect(copyButton).toBeTruthy()
+    await copyButton!.trigger('click')
 
     expect(mockCopy).toHaveBeenCalledWith('Test message\n\nTest details')
   })
@@ -242,9 +245,5 @@ describe('TabErrors.vue', () => {
     // Should render in the dedicated runtime error panel, not inside accordion
     const runtimePanel = wrapper.find('[data-testid="runtime-error-panel"]')
     expect(runtimePanel.exists()).toBe(true)
-    // Verify the error message appears exactly once (not duplicated in accordion)
-    expect(
-      wrapper.text().match(/RuntimeError: Out of memory/g) ?? []
-    ).toHaveLength(1)
   })
 })

src/components/rightSidePanel/errors/TabErrors.vue

@@ -53,7 +53,6 @@
         <PropertiesAccordionItem
           v-for="group in filteredGroups"
           :key="group.title"
-          :data-testid="'error-group-' + group.type.replaceAll('_', '-')"
           :collapse="isSectionCollapsed(group.title) && !isSearching"
           class="border-b border-interface-stroke"
           :size="getGroupSize(group)"
@@ -210,9 +209,12 @@
 import { computed, ref, watch } from 'vue'
 import { useI18n } from 'vue-i18n'
 
+import { useCommandStore } from '@/stores/commandStore'
 import { useCopyToClipboard } from '@/composables/useCopyToClipboard'
 import { useFocusNode } from '@/composables/canvas/useFocusNode'
+import { useExternalLink } from '@/composables/useExternalLink'
 import { useSettingStore } from '@/platform/settings/settingStore'
+import { useTelemetry } from '@/platform/telemetry'
 import { useRightSidePanelStore } from '@/stores/workspace/rightSidePanelStore'
 import { useManagerState } from '@/workbench/extensions/manager/composables/useManagerState'
 import { ManagerTab } from '@/workbench/extensions/manager/types/comfyManagerTypes'
@@ -236,7 +238,6 @@ import Button from '@/components/ui/button/Button.vue'
 import DotSpinner from '@/components/common/DotSpinner.vue'
 import { usePackInstall } from '@/workbench/extensions/manager/composables/nodePack/usePackInstall'
 import { useMissingNodes } from '@/workbench/extensions/manager/composables/nodePack/useMissingNodes'
-import { useErrorActions } from './useErrorActions'
 import { useErrorGroups } from './useErrorGroups'
 import type { SwapNodeGroup } from './useErrorGroups'
 import type { ErrorGroup } from './types'
@@ -245,7 +246,7 @@ import { useNodeReplacement } from '@/platform/nodeReplacement/useNodeReplacemen
 const { t } = useI18n()
 const { copyToClipboard } = useCopyToClipboard()
 const { focusNode, enterSubgraph } = useFocusNode()
-const { openGitHubIssues, contactSupport } = useErrorActions()
+const { staticUrls } = useExternalLink()
 const settingStore = useSettingStore()
 const rightSidePanelStore = useRightSidePanelStore()
 const { shouldShowManagerButtons, shouldShowInstallButton, openManager } =
@@ -371,13 +372,13 @@ watch(
     if (!graphNodeId) return
     const prefix = `${graphNodeId}:`
     for (const group of allErrorGroups.value) {
-      if (group.type !== 'execution') continue
-
-      const hasMatch = group.cards.some(
-        (card) =>
-          card.graphNodeId === graphNodeId ||
-          (card.nodeId?.startsWith(prefix) ?? false)
-      )
+      const hasMatch =
+        group.type === 'execution' &&
+        group.cards.some(
+          (card) =>
+            card.graphNodeId === graphNodeId ||
+            (card.nodeId?.startsWith(prefix) ?? false)
+        )
       setSectionCollapsed(group.title, !hasMatch)
     }
     rightSidePanelStore.focusedErrorNodeId = null
@@ -417,4 +418,20 @@ function handleReplaceAll() {
 function handleEnterSubgraph(nodeId: string) {
   enterSubgraph(nodeId, errorNodeCache.value)
 }
+
+function openGitHubIssues() {
+  useTelemetry()?.trackUiButtonClicked({
+    button_id: 'error_tab_github_issues_clicked'
+  })
+  window.open(staticUrls.githubIssues, '_blank', 'noopener,noreferrer')
+}
+
+async function contactSupport() {
+  useTelemetry()?.trackHelpResourceClicked({
+    resource_type: 'help_feedback',
+    is_external: true,
+    source: 'error_dialog'
+  })
+  useCommandStore().execute('Comfy.ContactSupport')
+}
 </script>

src/components/rightSidePanel/errors/swapNodeGroups.test.ts

@@ -47,7 +47,7 @@ vi.mock('@/utils/executableGroupNodeDto', () => ({
   isGroupNode: vi.fn(() => false)
 }))
 
-import { useMissingNodesErrorStore } from '@/platform/nodeReplacement/missingNodesErrorStore'
+import { useExecutionErrorStore } from '@/stores/executionErrorStore'
 import { useErrorGroups } from './useErrorGroups'
 
 function makeMissingNodeType(
@@ -80,7 +80,8 @@ describe('swapNodeGroups computed', () => {
   })
 
   function getSwapNodeGroups(nodeTypes: MissingNodeType[]) {
-    useMissingNodesErrorStore().surfaceMissingNodes(nodeTypes)
+    const store = useExecutionErrorStore()
+    store.surfaceMissingNodes(nodeTypes)
 
     const searchQuery = ref('')
     const t = (key: string) => key

src/components/rightSidePanel/errors/useErrorActions.ts

@@ -1,39 +0,0 @@
-import { useCommandStore } from '@/stores/commandStore'
-import { useExternalLink } from '@/composables/useExternalLink'
-import { useTelemetry } from '@/platform/telemetry'
-
-export function useErrorActions() {
-  const telemetry = useTelemetry()
-  const commandStore = useCommandStore()
-  const { staticUrls } = useExternalLink()
-
-  function openGitHubIssues() {
-    telemetry?.trackUiButtonClicked({
-      button_id: 'error_tab_github_issues_clicked'
-    })
-    window.open(staticUrls.githubIssues, '_blank', 'noopener,noreferrer')
-  }
-
-  function contactSupport() {
-    telemetry?.trackHelpResourceClicked({
-      resource_type: 'help_feedback',
-      is_external: true,
-      source: 'error_dialog'
-    })
-    void commandStore.execute('Comfy.ContactSupport')
-  }
-
-  function findOnGitHub(errorMessage: string) {
-    telemetry?.trackUiButtonClicked({
-      button_id: 'error_tab_find_existing_issues_clicked'
-    })
-    const query = encodeURIComponent(errorMessage + ' is:issue')
-    window.open(
-      `${staticUrls.githubIssues}?q=${query}`,
-      '_blank',
-      'noopener,noreferrer'
-    )
-  }
-
-  return { openGitHubIssues, contactSupport, findOnGitHub }
-}

src/components/rightSidePanel/errors/useErrorGroups.test.ts

@@ -58,7 +58,6 @@ vi.mock(
 )
 
 import { useExecutionErrorStore } from '@/stores/executionErrorStore'
-import { useMissingNodesErrorStore } from '@/platform/nodeReplacement/missingNodesErrorStore'
 import { useErrorGroups } from './useErrorGroups'
 
 function makeMissingNodeType(
@@ -127,9 +126,8 @@ describe('useErrorGroups', () => {
     })
 
     it('groups non-replaceable nodes by cnrId', async () => {
-      const { groups } = createErrorGroups()
-      const missingNodesStore = useMissingNodesErrorStore()
-      missingNodesStore.setMissingNodeTypes([
+      const { store, groups } = createErrorGroups()
+      store.setMissingNodeTypes([
         makeMissingNodeType('NodeA', { cnrId: 'pack-1' }),
         makeMissingNodeType('NodeB', { cnrId: 'pack-1', nodeId: '2' }),
         makeMissingNodeType('NodeC', { cnrId: 'pack-2', nodeId: '3' })
@@ -148,9 +146,8 @@ describe('useErrorGroups', () => {
     })
 
     it('excludes replaceable nodes from missingPackGroups', async () => {
-      const { groups } = createErrorGroups()
-      const missingNodesStore = useMissingNodesErrorStore()
-      missingNodesStore.setMissingNodeTypes([
+      const { store, groups } = createErrorGroups()
+      store.setMissingNodeTypes([
         makeMissingNodeType('OldNode', {
           isReplaceable: true,
           replacement: { new_node_id: 'NewNode' }
@@ -167,9 +164,8 @@ describe('useErrorGroups', () => {
     })
 
     it('groups nodes without cnrId under null packId', async () => {
-      const { groups } = createErrorGroups()
-      const missingNodesStore = useMissingNodesErrorStore()
-      missingNodesStore.setMissingNodeTypes([
+      const { store, groups } = createErrorGroups()
+      store.setMissingNodeTypes([
         makeMissingNodeType('UnknownNode', { nodeId: '1' }),
         makeMissingNodeType('AnotherUnknown', { nodeId: '2' })
       ])
@@ -181,9 +177,8 @@ describe('useErrorGroups', () => {
     })
 
     it('sorts groups alphabetically with null packId last', async () => {
-      const { groups } = createErrorGroups()
-      const missingNodesStore = useMissingNodesErrorStore()
-      missingNodesStore.setMissingNodeTypes([
+      const { store, groups } = createErrorGroups()
+      store.setMissingNodeTypes([
         makeMissingNodeType('NodeA', { cnrId: 'zebra-pack' }),
         makeMissingNodeType('NodeB', { nodeId: '2' }),
         makeMissingNodeType('NodeC', { cnrId: 'alpha-pack', nodeId: '3' })
@@ -195,9 +190,8 @@ describe('useErrorGroups', () => {
     })
 
     it('sorts nodeTypes within each group alphabetically by type then nodeId', async () => {
-      const { groups } = createErrorGroups()
-      const missingNodesStore = useMissingNodesErrorStore()
-      missingNodesStore.setMissingNodeTypes([
+      const { store, groups } = createErrorGroups()
+      store.setMissingNodeTypes([
         makeMissingNodeType('NodeB', { cnrId: 'pack-1', nodeId: '2' }),
         makeMissingNodeType('NodeA', { cnrId: 'pack-1', nodeId: '3' }),
         makeMissingNodeType('NodeA', { cnrId: 'pack-1', nodeId: '1' })
@@ -212,9 +206,8 @@ describe('useErrorGroups', () => {
     })
 
     it('handles string nodeType entries', async () => {
-      const { groups } = createErrorGroups()
-      const missingNodesStore = useMissingNodesErrorStore()
-      missingNodesStore.setMissingNodeTypes([
+      const { store, groups } = createErrorGroups()
+      store.setMissingNodeTypes([
         'StringGroupNode' as unknown as MissingNodeType
       ])
       await nextTick()
@@ -231,9 +224,8 @@ describe('useErrorGroups', () => {
     })
 
     it('includes missing_node group when missing nodes exist', async () => {
-      const { groups } = createErrorGroups()
-      const missingNodesStore = useMissingNodesErrorStore()
-      missingNodesStore.setMissingNodeTypes([
+      const { store, groups } = createErrorGroups()
+      store.setMissingNodeTypes([
         makeMissingNodeType('NodeA', { cnrId: 'pack-1' })
       ])
       await nextTick()
@@ -245,9 +237,8 @@ describe('useErrorGroups', () => {
     })
 
     it('includes swap_nodes group when replaceable nodes exist', async () => {
-      const { groups } = createErrorGroups()
-      const missingNodesStore = useMissingNodesErrorStore()
-      missingNodesStore.setMissingNodeTypes([
+      const { store, groups } = createErrorGroups()
+      store.setMissingNodeTypes([
         makeMissingNodeType('OldNode', {
           isReplaceable: true,
           replacement: { new_node_id: 'NewNode' }
@@ -262,9 +253,8 @@ describe('useErrorGroups', () => {
     })
 
     it('includes both swap_nodes and missing_node when both exist', async () => {
-      const { groups } = createErrorGroups()
-      const missingNodesStore = useMissingNodesErrorStore()
-      missingNodesStore.setMissingNodeTypes([
+      const { store, groups } = createErrorGroups()
+      store.setMissingNodeTypes([
         makeMissingNodeType('OldNode', {
           isReplaceable: true,
           replacement: { new_node_id: 'NewNode' }
@@ -282,9 +272,8 @@ describe('useErrorGroups', () => {
     })
 
     it('swap_nodes has lower priority than missing_node', async () => {
-      const { groups } = createErrorGroups()
-      const missingNodesStore = useMissingNodesErrorStore()
-      missingNodesStore.setMissingNodeTypes([
+      const { store, groups } = createErrorGroups()
+      store.setMissingNodeTypes([
         makeMissingNodeType('OldNode', {
           isReplaceable: true,
           replacement: { new_node_id: 'NewNode' }
@@ -544,18 +533,13 @@ describe('useErrorGroups', () => {
     })
 
     it('includes missing node group title as message', async () => {
-      const { groups } = createErrorGroups()
-      const missingNodesStore = useMissingNodesErrorStore()
-      missingNodesStore.setMissingNodeTypes([
+      const { store, groups } = createErrorGroups()
+      store.setMissingNodeTypes([
         makeMissingNodeType('NodeA', { cnrId: 'pack-1' })
       ])
       await nextTick()
 
-      const missingGroup = groups.allErrorGroups.value.find(
-        (g) => g.type === 'missing_node'
-      )
-      expect(missingGroup).toBeDefined()
-      expect(groups.groupedErrorMessages.value).toContain(missingGroup!.title)
+      expect(groups.groupedErrorMessages.value.length).toBeGreaterThan(0)
     })
   })
 

src/components/rightSidePanel/errors/useErrorGroups.ts

@@ -5,7 +5,6 @@ import type { IFuseOptions } from 'fuse.js'
 
 import { useMissingModelStore } from '@/platform/missingModel/missingModelStore'
 import { useExecutionErrorStore } from '@/stores/executionErrorStore'
-import { useMissingNodesErrorStore } from '@/platform/nodeReplacement/missingNodesErrorStore'
 import { useComfyRegistryStore } from '@/stores/comfyRegistryStore'
 import { useCanvasStore } from '@/renderer/core/canvas/canvasStore'
 import { app } from '@/scripts/app'
@@ -196,8 +195,12 @@ function searchErrorGroups(groups: ErrorGroup[], query: string) {
         cardIndex: ci,
         searchableNodeId: card.nodeId ?? '',
         searchableNodeTitle: card.nodeTitle ?? '',
-        searchableMessage: card.errors.map((e) => e.message).join(' '),
-        searchableDetails: card.errors.map((e) => e.details ?? '').join(' ')
+        searchableMessage: card.errors
+          .map((e: ErrorItem) => e.message)
+          .join(' '),
+        searchableDetails: card.errors
+          .map((e: ErrorItem) => e.details ?? '')
+          .join(' ')
       })
     }
   }
@@ -237,7 +240,6 @@ export function useErrorGroups(
   t: (key: string) => string
 ) {
   const executionErrorStore = useExecutionErrorStore()
-  const missingNodesStore = useMissingNodesErrorStore()
   const missingModelStore = useMissingModelStore()
   const canvasStore = useCanvasStore()
   const { inferPackFromNodeName } = useComfyRegistryStore()
@@ -283,7 +285,7 @@ export function useErrorGroups(
 
   const missingNodeCache = computed(() => {
     const map = new Map<string, LGraphNode>()
-    const nodeTypes = missingNodesStore.missingNodesError?.nodeTypes ?? []
+    const nodeTypes = executionErrorStore.missingNodesError?.nodeTypes ?? []
     for (const nodeType of nodeTypes) {
       if (typeof nodeType === 'string') continue
       if (nodeType.nodeId == null) continue
@@ -405,7 +407,7 @@ export function useErrorGroups(
   const asyncResolvedIds = ref<Map<string, string | null>>(new Map())
 
   const pendingTypes = computed(() =>
-    (missingNodesStore.missingNodesError?.nodeTypes ?? []).filter(
+    (executionErrorStore.missingNodesError?.nodeTypes ?? []).filter(
       (n): n is Exclude<MissingNodeType, string> =>
         typeof n !== 'string' && !n.cnrId
     )
@@ -446,8 +448,6 @@ export function useErrorGroups(
       for (const r of results) {
         if (r.status === 'fulfilled') {
           final.set(r.value.type, r.value.packId)
-        } else {
-          console.warn('Failed to resolve pack ID:', r.reason)
         }
       }
       // Clear any remaining RESOLVING markers for failed lookups
@@ -459,18 +459,8 @@ export function useErrorGroups(
     { immediate: true }
   )
 
-  // Evict stale entries when missing nodes are cleared
-  watch(
-    () => missingNodesStore.missingNodesError,
-    (error) => {
-      if (!error && asyncResolvedIds.value.size > 0) {
-        asyncResolvedIds.value = new Map()
-      }
-    }
-  )
-
   const missingPackGroups = computed<MissingPackGroup[]>(() => {
-    const nodeTypes = missingNodesStore.missingNodesError?.nodeTypes ?? []
+    const nodeTypes = executionErrorStore.missingNodesError?.nodeTypes ?? []
     const map = new Map<
       string | null,
       { nodeTypes: MissingNodeType[]; isResolving: boolean }
@@ -532,7 +522,7 @@ export function useErrorGroups(
   })
 
   const swapNodeGroups = computed<SwapNodeGroup[]>(() => {
-    const nodeTypes = missingNodesStore.missingNodesError?.nodeTypes ?? []
+    const nodeTypes = executionErrorStore.missingNodesError?.nodeTypes ?? []
     const map = new Map<string, SwapNodeGroup>()
 
     for (const nodeType of nodeTypes) {
@@ -556,7 +546,7 @@ export function useErrorGroups(
 
   /** Builds an ErrorGroup from missingNodesError. Returns [] when none present. */
   function buildMissingNodeGroups(): ErrorGroup[] {
-    const error = missingNodesStore.missingNodesError
+    const error = executionErrorStore.missingNodesError
     if (!error) return []
 
     const groups: ErrorGroup[] = []

src/components/rightSidePanel/errors/useErrorReport.ts

@@ -2,8 +2,6 @@ import { computed, onMounted, onUnmounted, reactive, toValue } from 'vue'
 
 import type { MaybeRefOrGetter } from 'vue'
 
-import { until } from '@vueuse/core'
-
 import { api } from '@/scripts/api'
 import { app } from '@/scripts/app'
 import { useSystemStatsStore } from '@/stores/systemStatsStore'
@@ -42,33 +40,24 @@ export function useErrorReport(cardSource: MaybeRefOrGetter<ErrorCardData>) {
     if (runtimeErrors.length === 0) return
 
     if (!systemStatsStore.systemStats) {
-      if (systemStatsStore.isLoading) {
-        await until(systemStatsStore.isLoading).toBe(false)
-      } else {
-        try {
-          await systemStatsStore.refetchSystemStats()
-        } catch (e) {
-          console.warn('Failed to fetch system stats for error report:', e)
-          return
-        }
+      try {
+        await systemStatsStore.refetchSystemStats()
+      } catch {
+        return
       }
     }
-    if (!systemStatsStore.systemStats || cancelled) return
+    if (cancelled || !systemStatsStore.systemStats) return
+
+    let logs: string
+    try {
+      logs = await api.getLogs()
+    } catch {
+      logs = 'Failed to retrieve server logs'
+    }
 
-    const logs = await api
-      .getLogs()
-      .catch(() => 'Failed to retrieve server logs')
     if (cancelled) return
 
-    const workflow = (() => {
-      try {
-        return app.rootGraph.serialize()
-      } catch (e) {
-        console.warn('Failed to serialize workflow for error report:', e)
-        return null
-      }
-    })()
-    if (!workflow) return
+    const workflow = app.rootGraph.serialize()
 
     for (const { error, idx } of runtimeErrors) {
       try {
@@ -83,8 +72,8 @@ export function useErrorReport(cardSource: MaybeRefOrGetter<ErrorCardData>) {
           workflow
         })
         enrichedDetails[idx] = report
-      } catch (e) {
-        console.warn('Failed to generate error report:', e)
+      } catch {
+        // Fallback: keep original error.details
       }
     }
   })

src/composables/graph/useErrorClearingHooks.test.ts

@@ -315,45 +315,6 @@ describe('installErrorClearingHooks lifecycle', () => {
     cleanup()
     expect(graph.onNodeAdded).toBe(originalHook)
   })
-
-  it('restores original node callbacks when a node is removed', () => {
-    const graph = new LGraph()
-    const node = new LGraphNode('test')
-    node.addInput('clip', 'CLIP')
-    node.addWidget('number', 'steps', 20, () => undefined, {})
-    const originalOnConnectionsChange = vi.fn()
-    const originalOnWidgetChanged = vi.fn()
-    node.onConnectionsChange = originalOnConnectionsChange
-    node.onWidgetChanged = originalOnWidgetChanged
-    graph.add(node)
-
-    installErrorClearingHooks(graph)
-
-    // Callbacks should be chained (not the originals)
-    expect(node.onConnectionsChange).not.toBe(originalOnConnectionsChange)
-    expect(node.onWidgetChanged).not.toBe(originalOnWidgetChanged)
-
-    // Simulate node removal via the graph hook
-    graph.onNodeRemoved!(node)
-
-    // Original callbacks should be restored
-    expect(node.onConnectionsChange).toBe(originalOnConnectionsChange)
-    expect(node.onWidgetChanged).toBe(originalOnWidgetChanged)
-  })
-
-  it('does not double-wrap callbacks when installErrorClearingHooks is called twice', () => {
-    const graph = new LGraph()
-    const node = new LGraphNode('test')
-    node.addInput('clip', 'CLIP')
-    graph.add(node)
-
-    installErrorClearingHooks(graph)
-    const chainedAfterFirst = node.onConnectionsChange
-
-    // Install again on the same graph — should be a no-op for existing nodes
-    installErrorClearingHooks(graph)
-    expect(node.onConnectionsChange).toBe(chainedAfterFirst)
-  })
 })
 
 describe('clearWidgetRelatedErrors parameter routing', () => {

src/composables/graph/useErrorClearingHooks.ts

@@ -35,22 +35,10 @@ function resolvePromotedExecId(
 
 const hookedNodes = new WeakSet<LGraphNode>()
 
-type OriginalCallbacks = {
-  onConnectionsChange: LGraphNode['onConnectionsChange']
-  onWidgetChanged: LGraphNode['onWidgetChanged']
-}
-
-const originalCallbacks = new WeakMap<LGraphNode, OriginalCallbacks>()
-
 function installNodeHooks(node: LGraphNode): void {
   if (hookedNodes.has(node)) return
   hookedNodes.add(node)
 
-  originalCallbacks.set(node, {
-    onConnectionsChange: node.onConnectionsChange,
-    onWidgetChanged: node.onWidgetChanged
-  })
-
   node.onConnectionsChange = useChainCallback(
     node.onConnectionsChange,
     function (type, slotIndex, isConnected) {
@@ -94,15 +82,6 @@ function installNodeHooks(node: LGraphNode): void {
   )
 }
 
-function restoreNodeHooks(node: LGraphNode): void {
-  const originals = originalCallbacks.get(node)
-  if (!originals) return
-  node.onConnectionsChange = originals.onConnectionsChange
-  node.onWidgetChanged = originals.onWidgetChanged
-  originalCallbacks.delete(node)
-  hookedNodes.delete(node)
-}
-
 function installNodeHooksRecursive(node: LGraphNode): void {
   installNodeHooks(node)
   if (node.isSubgraphNode?.()) {
@@ -112,15 +91,6 @@ function installNodeHooksRecursive(node: LGraphNode): void {
   }
 }
 
-function restoreNodeHooksRecursive(node: LGraphNode): void {
-  restoreNodeHooks(node)
-  if (node.isSubgraphNode?.()) {
-    for (const innerNode of node.subgraph._nodes ?? []) {
-      restoreNodeHooksRecursive(innerNode)
-    }
-  }
-}
-
 export function installErrorClearingHooks(graph: LGraph): () => void {
   for (const node of graph._nodes ?? []) {
     installNodeHooksRecursive(node)
@@ -132,17 +102,7 @@ export function installErrorClearingHooks(graph: LGraph): () => void {
     originalOnNodeAdded?.call(this, node)
   }
 
-  const originalOnNodeRemoved = graph.onNodeRemoved
-  graph.onNodeRemoved = function (node: LGraphNode) {
-    restoreNodeHooksRecursive(node)
-    originalOnNodeRemoved?.call(this, node)
-  }
-
   return () => {
-    for (const node of graph._nodes ?? []) {
-      restoreNodeHooksRecursive(node)
-    }
     graph.onNodeAdded = originalOnNodeAdded || undefined
-    graph.onNodeRemoved = originalOnNodeRemoved || undefined
   }
 }

src/composables/graph/useGraphNodeManager.test.ts

@@ -197,16 +197,14 @@ describe('Widget slotMetadata reactivity on link disconnect', () => {
 
     const subgraphNode = createTestSubgraphNode(subgraph, { id: 123 })
 
-    // Create a PromotedWidgetView with identityName="value" (subgraph input
+    // Create a PromotedWidgetView with displayName="value" (subgraph input
     // slot name) and sourceWidgetName="prompt" (interior widget name).
-    // PromotedWidgetView.name returns "value" (identity), safeWidgetMapper
-    // sets SafeWidgetData.name to sourceWidgetName ("prompt").
+    // PromotedWidgetView.name returns "value", but safeWidgetMapper sets
+    // SafeWidgetData.name to sourceWidgetName ("prompt").
     const promotedView = createPromotedWidgetView(
       subgraphNode,
       '10',
       'prompt',
-      'value',
-      undefined,
       'value'
     )
 

src/composables/graph/useGraphNodeManager.ts

@@ -92,10 +92,6 @@ export interface SafeWidgetData {
    * execution ID (e.g. `"65:42"` vs the host node's `"65"`).
    */
   sourceExecutionId?: string
-  /** Tooltip text from the resolved widget. */
-  tooltip?: string
-  /** For promoted widgets, the display label from the subgraph input slot. */
-  promotedLabel?: string
 }
 
 export interface VueNodeData {
@@ -356,8 +352,7 @@ function safeWidgetMapper(
           sourceNode && app.rootGraph
             ? (getExecutionIdByNode(app.rootGraph, sourceNode) ?? undefined)
             : undefined,
-        tooltip: widget.tooltip,
-        promotedLabel: isPromotedWidgetView(widget) ? widget.label : undefined
+        tooltip: widget.tooltip
       }
     } catch (error) {
       console.warn(
@@ -808,8 +803,6 @@ export function useGraphNodeManager(graph: LGraph): GraphNodeManager {
         if (slotLabelEvent.slotType !== NodeSlotType.INPUT && nodeRef.outputs) {
           nodeRef.outputs = [...nodeRef.outputs]
         }
-        // Re-extract widget data so promotedLabel reflects the rename
-        vueNodeData.set(nodeId, extractVueNodeData(nodeRef))
       }
     }
 

src/composables/graph/useNodeErrorFlagSync.ts

@@ -1,111 +0,0 @@
-import type { Ref } from 'vue'
-import { computed, watch } from 'vue'
-
-import type { LGraph, LGraphNode } from '@/lib/litegraph/src/litegraph'
-import type { useMissingModelStore } from '@/platform/missingModel/missingModelStore'
-import { useSettingStore } from '@/platform/settings/settingStore'
-import { app } from '@/scripts/app'
-import type { NodeError } from '@/schemas/apiSchema'
-import { getParentExecutionIds } from '@/types/nodeIdentification'
-import { forEachNode, getNodeByExecutionId } from '@/utils/graphTraversalUtil'
-
-function setNodeHasErrors(node: LGraphNode, hasErrors: boolean): void {
-  if (node.has_errors === hasErrors) return
-  const oldValue = node.has_errors
-  node.has_errors = hasErrors
-  node.graph?.trigger('node:property:changed', {
-    type: 'node:property:changed',
-    nodeId: node.id,
-    property: 'has_errors',
-    oldValue,
-    newValue: hasErrors
-  })
-}
-
-/**
- * Single-pass reconciliation of node error flags.
- * Collects the set of nodes that should have errors, then walks all nodes
- * once, setting each flag exactly once. This avoids the redundant
- * true→false→true transition (and duplicate events) that a clear-then-apply
- * approach would cause.
- */
-function reconcileNodeErrorFlags(
-  rootGraph: LGraph,
-  nodeErrors: Record<string, NodeError> | null,
-  missingModelExecIds: Set<string>
-): void {
-  // Collect nodes and slot info that should be flagged
-  // Includes both error-owning nodes and their ancestor containers
-  const flaggedNodes = new Set<LGraphNode>()
-  const errorSlots = new Map<LGraphNode, Set<string>>()
-
-  if (nodeErrors) {
-    for (const [executionId, nodeError] of Object.entries(nodeErrors)) {
-      const node = getNodeByExecutionId(rootGraph, executionId)
-      if (!node) continue
-
-      flaggedNodes.add(node)
-      const slotNames = new Set<string>()
-      for (const error of nodeError.errors) {
-        const name = error.extra_info?.input_name
-        if (name) slotNames.add(name)
-      }
-      if (slotNames.size > 0) errorSlots.set(node, slotNames)
-
-      for (const parentId of getParentExecutionIds(executionId)) {
-        const parentNode = getNodeByExecutionId(rootGraph, parentId)
-        if (parentNode) flaggedNodes.add(parentNode)
-      }
-    }
-  }
-
-  for (const execId of missingModelExecIds) {
-    const node = getNodeByExecutionId(rootGraph, execId)
-    if (node) flaggedNodes.add(node)
-  }
-
-  forEachNode(rootGraph, (node) => {
-    setNodeHasErrors(node, flaggedNodes.has(node))
-
-    if (node.inputs) {
-      const nodeSlotNames = errorSlots.get(node)
-      for (const slot of node.inputs) {
-        slot.hasErrors = !!nodeSlotNames?.has(slot.name)
-      }
-    }
-  })
-}
-
-export function useNodeErrorFlagSync(
-  lastNodeErrors: Ref<Record<string, NodeError> | null>,
-  missingModelStore: ReturnType<typeof useMissingModelStore>
-): () => void {
-  const settingStore = useSettingStore()
-  const showErrorsTab = computed(() =>
-    settingStore.get('Comfy.RightSidePanel.ShowErrorsTab')
-  )
-
-  const stop = watch(
-    [
-      lastNodeErrors,
-      () => missingModelStore.missingModelNodeIds,
-      showErrorsTab
-    ],
-    () => {
-      if (!app.isGraphReady) return
-      // Legacy (LGraphNode) only: suppress missing-model error flags when
-      // the Errors tab is hidden, since legacy nodes lack the per-widget
-      // red highlight that Vue nodes use to indicate *why* a node has errors.
-      // Vue nodes compute hasAnyError independently and are unaffected.
-      reconcileNodeErrorFlags(
-        app.rootGraph,
-        lastNodeErrors.value,
-        showErrorsTab.value
-          ? missingModelStore.missingModelAncestorExecutionIds
-          : new Set()
-      )
-    },
-    { flush: 'post' }
-  )
-  return stop
-}

src/composables/graph/useVueNodeLifecycle.ts

@@ -86,24 +86,6 @@ function useVueNodeLifecycleIndividual() {
     () => !shouldRenderVueNodes.value,
     () => {
       disposeNodeManagerAndSyncs()
-
-      // Force arrange() on all nodes so input.pos is computed before
-      // the first legacy drawConnections frame (which may run before
-      // drawNode on the foreground canvas).
-      const graph = comfyApp.canvas?.graph
-      if (!graph) {
-        comfyApp.canvas?.setDirty(true, true)
-        return
-      }
-      for (const node of graph._nodes) {
-        if (node.flags.collapsed) continue
-        try {
-          node.arrange()
-        } catch {
-          /* skip nodes not fully initialized */
-        }
-      }
-
       comfyApp.canvas?.setDirty(true, true)
     }
   )

src/composables/useClickDragGuard.test.ts

@@ -1,65 +0,0 @@
-import { describe, expect, it } from 'vitest'
-
-import {
-  exceedsClickThreshold,
-  useClickDragGuard
-} from '@/composables/useClickDragGuard'
-
-describe('exceedsClickThreshold', () => {
-  it('returns false when distance is within threshold', () => {
-    expect(exceedsClickThreshold({ x: 0, y: 0 }, { x: 2, y: 2 }, 5)).toBe(false)
-  })
-
-  it('returns true when distance exceeds threshold', () => {
-    expect(exceedsClickThreshold({ x: 0, y: 0 }, { x: 3, y: 5 }, 5)).toBe(true)
-  })
-
-  it('returns false when distance exactly equals threshold', () => {
-    expect(exceedsClickThreshold({ x: 0, y: 0 }, { x: 3, y: 4 }, 5)).toBe(false)
-  })
-
-  it('handles negative deltas', () => {
-    expect(exceedsClickThreshold({ x: 10, y: 10 }, { x: 4, y: 2 }, 5)).toBe(
-      true
-    )
-  })
-})
-
-describe('useClickDragGuard', () => {
-  it('reports no drag when pointer has not moved', () => {
-    const guard = useClickDragGuard(5)
-    guard.recordStart({ clientX: 100, clientY: 200 })
-    expect(guard.wasDragged({ clientX: 100, clientY: 200 })).toBe(false)
-  })
-
-  it('reports no drag when movement is within threshold', () => {
-    const guard = useClickDragGuard(5)
-    guard.recordStart({ clientX: 100, clientY: 200 })
-    expect(guard.wasDragged({ clientX: 103, clientY: 204 })).toBe(false)
-  })
-
-  it('reports drag when movement exceeds threshold', () => {
-    const guard = useClickDragGuard(5)
-    guard.recordStart({ clientX: 100, clientY: 200 })
-    expect(guard.wasDragged({ clientX: 106, clientY: 200 })).toBe(true)
-  })
-
-  it('returns false when no start has been recorded', () => {
-    const guard = useClickDragGuard(5)
-    expect(guard.wasDragged({ clientX: 100, clientY: 200 })).toBe(false)
-  })
-
-  it('returns false after reset', () => {
-    const guard = useClickDragGuard(5)
-    guard.recordStart({ clientX: 100, clientY: 200 })
-    guard.reset()
-    expect(guard.wasDragged({ clientX: 200, clientY: 300 })).toBe(false)
-  })
-
-  it('respects custom threshold', () => {
-    const guard = useClickDragGuard(3)
-    guard.recordStart({ clientX: 0, clientY: 0 })
-    expect(guard.wasDragged({ clientX: 3, clientY: 0 })).toBe(false)
-    expect(guard.wasDragged({ clientX: 4, clientY: 0 })).toBe(true)
-  })
-})

src/composables/useClickDragGuard.ts

@@ -1,41 +0,0 @@
-interface PointerPosition {
-  readonly x: number
-  readonly y: number
-}
-
-function squaredDistance(a: PointerPosition, b: PointerPosition): number {
-  const dx = a.x - b.x
-  const dy = a.y - b.y
-  return dx * dx + dy * dy
-}
-
-export function exceedsClickThreshold(
-  start: PointerPosition,
-  end: PointerPosition,
-  threshold: number
-): boolean {
-  return squaredDistance(start, end) > threshold * threshold
-}
-
-export function useClickDragGuard(threshold: number = 5) {
-  let start: PointerPosition | null = null
-
-  function recordStart(e: { clientX: number; clientY: number }) {
-    start = { x: e.clientX, y: e.clientY }
-  }
-
-  function wasDragged(e: { clientX: number; clientY: number }): boolean {
-    if (!start) return false
-    return exceedsClickThreshold(
-      start,
-      { x: e.clientX, y: e.clientY },
-      threshold
-    )
-  }
-
-  function reset() {
-    start = null
-  }
-
-  return { recordStart, wasDragged, reset }
-}

src/constants/essentialsNodes.ts

@@ -107,27 +107,6 @@ export const ESSENTIALS_CATEGORY_CANONICAL: ReadonlyMap<
   EssentialsCategory
 > = new Map(ESSENTIALS_CATEGORIES.map((c) => [c.toLowerCase(), c]))
 
-/**
- * Precomputed rank map: category → display order index.
- * Used for sorting essentials folders in their canonical order.
- */
-export const ESSENTIALS_CATEGORY_RANK: ReadonlyMap<string, number> = new Map(
-  ESSENTIALS_CATEGORIES.map((c, i) => [c, i])
-)
-
-/**
- * Precomputed rank maps: category → (node name → display order index).
- * Used for sorting nodes within each essentials folder.
- */
-export const ESSENTIALS_NODE_RANK: Partial<
-  Record<EssentialsCategory, ReadonlyMap<string, number>>
-> = Object.fromEntries(
-  Object.entries(ESSENTIALS_NODES).map(([category, nodes]) => [
-    category,
-    new Map(nodes.map((name, i) => [name, i]))
-  ])
-)
-
 /**
  * "Novel" toolkit nodes for telemetry — basics excluded.
  * Derived from ESSENTIALS_NODES minus the 'basics' category.

src/core/graph/subgraph/promotedWidgetView.test.ts

@@ -138,18 +138,15 @@ describe(createPromotedWidgetView, () => {
     expect(view.name).toBe('myWidget')
   })
 
-  test('name uses identityName when provided, label uses displayName', () => {
+  test('name uses displayName when provided', () => {
     const [subgraphNode] = setupSubgraph()
     const view = createPromotedWidgetView(
       subgraphNode,
       '1',
       'myWidget',
-      'Custom Label',
-      undefined,
-      'my_slot'
+      'Custom Label'
     )
-    expect(view.name).toBe('my_slot')
-    expect(view.label).toBe('Custom Label')
+    expect(view.name).toBe('Custom Label')
   })
 
   test('node getter returns the subgraphNode', () => {
@@ -337,11 +334,11 @@ describe(createPromotedWidgetView, () => {
     innerNode.addWidget('text', 'myWidget', 'val', () => {})
     const bareId = String(innerNode.id)
 
-    // No displayName → label is undefined (rendering uses widget.label ?? widget.name)
+    // No displayName → falls back to widgetName
     const view1 = createPromotedWidgetView(subgraphNode, bareId, 'myWidget')
-    expect(view1.label).toBeUndefined()
+    expect(view1.label).toBe('myWidget')
 
-    // With displayName → label falls back to displayName
+    // With displayName → falls back to displayName
     const view2 = createPromotedWidgetView(
       subgraphNode,
       bareId,
@@ -1015,9 +1012,7 @@ describe('SubgraphNode.widgets getter', () => {
 
     const afterRename = promotedWidgets(subgraphNode)[0]
     if (!afterRename) throw new Error('Expected linked promoted view')
-    // .name stays as identity (subgraph input name), .label updates for display
-    expect(afterRename.name).toBe('seed')
-    expect(afterRename.label).toBe('seed_renamed')
+    expect(afterRename.name).toBe('seed_renamed')
   })
 
   test('caches view objects across getter calls (stable references)', () => {

src/core/graph/subgraph/promotedWidgetView.ts

@@ -27,12 +27,6 @@ import type { PromotedWidgetView as IPromotedWidgetView } from './promotedWidget
 export type { PromotedWidgetView } from './promotedWidgetTypes'
 export { isPromotedWidgetView } from './promotedWidgetTypes'
 
-interface SubgraphSlotRef {
-  name: string
-  label?: string
-  displayName?: string
-}
-
 function isWidgetValue(value: unknown): value is IBaseWidget['value'] {
   if (value === undefined) return true
   if (typeof value === 'string') return true
@@ -56,16 +50,14 @@ export function createPromotedWidgetView(
   nodeId: string,
   widgetName: string,
   displayName?: string,
-  disambiguatingSourceNodeId?: string,
-  identityName?: string
+  disambiguatingSourceNodeId?: string
 ): IPromotedWidgetView {
   return new PromotedWidgetView(
     subgraphNode,
     nodeId,
     widgetName,
     displayName,
-    disambiguatingSourceNodeId,
-    identityName
+    disambiguatingSourceNodeId
   )
 }
 
@@ -91,17 +83,12 @@ class PromotedWidgetView implements IPromotedWidgetView {
   private cachedDeepestByFrame?: { node: LGraphNode; widget: IBaseWidget }
   private cachedDeepestFrame = -1
 
-  /** Cached reference to the bound subgraph slot, set at construction. */
-  private _boundSlot?: SubgraphSlotRef
-  private _boundSlotVersion = -1
-
   constructor(
     private readonly subgraphNode: SubgraphNode,
     nodeId: string,
     widgetName: string,
     private readonly displayName?: string,
-    readonly disambiguatingSourceNodeId?: string,
-    private readonly identityName?: string
+    readonly disambiguatingSourceNodeId?: string
   ) {
     this.sourceNodeId = nodeId
     this.sourceWidgetName = widgetName
@@ -113,7 +100,7 @@ class PromotedWidgetView implements IPromotedWidgetView {
   }
 
   get name(): string {
-    return this.identityName ?? this.sourceWidgetName
+    return this.displayName ?? this.sourceWidgetName
   }
 
   get y(): number {
@@ -201,58 +188,15 @@ class PromotedWidgetView implements IPromotedWidgetView {
   }
 
   get label(): string | undefined {
-    const slot = this.getBoundSubgraphSlot()
-    if (slot) return slot.label ?? slot.displayName ?? slot.name
-    // Fall back to persisted widget state (survives save/reload before
-    // the slot binding is established) then to construction displayName.
     const state = this.getWidgetState()
-    return state?.label ?? this.displayName
+    return state?.label ?? this.displayName ?? this.sourceWidgetName
   }
 
   set label(value: string | undefined) {
-    const slot = this.getBoundSubgraphSlot()
-    if (slot) slot.label = value || undefined
-    // Also persist to widget state store for save/reload resilience
     const state = this.getWidgetState()
     if (state) state.label = value
   }
 
-  /**
-   * Returns the cached bound subgraph slot reference, refreshing only when
-   * the subgraph node's input list has changed (length mismatch).
-   *
-   * Note: Using length as the cache key works because the returned reference
-   * is the same mutable slot object. When slot properties (label, name) change,
-   * the caller reads fresh values from that reference.  The cache only needs
-   * to invalidate when slots are added or removed, which changes length.
-   */
-  private getBoundSubgraphSlot(): SubgraphSlotRef | undefined {
-    const version = this.subgraphNode.inputs?.length ?? 0
-    if (this._boundSlotVersion === version) return this._boundSlot
-
-    this._boundSlot = this.findBoundSubgraphSlot()
-    this._boundSlotVersion = version
-    return this._boundSlot
-  }
-
-  private findBoundSubgraphSlot(): SubgraphSlotRef | undefined {
-    for (const input of this.subgraphNode.inputs ?? []) {
-      const slot = input._subgraphSlot as SubgraphSlotRef | undefined
-      if (!slot) continue
-
-      const w = input._widget
-      if (
-        w &&
-        isPromotedWidgetView(w) &&
-        w.sourceNodeId === this.sourceNodeId &&
-        w.sourceWidgetName === this.sourceWidgetName
-      ) {
-        return slot
-      }
-    }
-    return undefined
-  }
-
   get hidden(): boolean {
     return this.resolveDeepest()?.widget.hidden ?? false
   }
@@ -294,27 +238,21 @@ class PromotedWidgetView implements IPromotedWidgetView {
     const originalComputedHeight = projected.computedHeight
     const originalComputedDisabled = projected.computedDisabled
 
-    const originalLabel = projected.label
-
     projected.y = this.y
     projected.computedHeight = this.computedHeight
     projected.computedDisabled = this.computedDisabled
     projected.value = this.value
-    projected.label = this.label
 
-    try {
-      projected.drawWidget(ctx, {
-        width: widgetWidth,
-        showText: !lowQuality,
-        suppressPromotedOutline: true,
-        previewImages: resolved.node.imgs
-      })
-    } finally {
-      projected.y = originalY
-      projected.computedHeight = originalComputedHeight
-      projected.computedDisabled = originalComputedDisabled
-      projected.label = originalLabel
-    }
+    projected.drawWidget(ctx, {
+      width: widgetWidth,
+      showText: !lowQuality,
+      suppressPromotedOutline: true,
+      previewImages: resolved.node.imgs
+    })
+
+    projected.y = originalY
+    projected.computedHeight = originalComputedHeight
+    projected.computedDisabled = originalComputedDisabled
   }
 
   onPointerDown(

src/extensions/core/customWidgets.test.ts

@@ -30,7 +30,6 @@ describe('PrimitiveFloat widget type bridging', () => {
     })
 
     Object.defineProperty(widget.options, 'gradient_stops', {
-      enumerable: true,
       get: () => properties.gradient_stops,
       set: (v) => {
         properties.gradient_stops = v
@@ -83,20 +82,6 @@ describe('PrimitiveFloat widget type bridging', () => {
     expect(widget.options.gradient_stops).toBe(stops)
   })
 
-  it('gradient_stops survives object spread', () => {
-    const { properties, widget } = createMockNodeAndWidget()
-    applyFloatPropertyBridges(properties, widget)
-
-    const stops = [
-      { offset: 0, color: [0, 255, 255] },
-      { offset: 1, color: [255, 0, 0] }
-    ]
-    properties.gradient_stops = stops
-
-    const spread = { ...widget.options }
-    expect(spread.gradient_stops).toBe(stops)
-  })
-
   it('writes gradient_stops back to properties', () => {
     const { properties, widget } = createMockNodeAndWidget()
     applyFloatPropertyBridges(properties, widget)

src/extensions/core/customWidgets.ts

@@ -169,7 +169,6 @@ function onCustomFloatCreated(this: LGraphNode) {
   })
 
   Object.defineProperty(valueWidget.options, 'gradient_stops', {
-    enumerable: true,
     get: () => this.properties.gradient_stops,
     set: (v) => {
       this.properties.gradient_stops = v

src/extensions/core/load3d/Load3d.ts

@@ -1,7 +1,5 @@
 import * as THREE from 'three'
 
-import { exceedsClickThreshold } from '@/composables/useClickDragGuard'
-
 import { AnimationManager } from './AnimationManager'
 import { CameraManager } from './CameraManager'
 import { ControlsManager } from './ControlsManager'
@@ -70,7 +68,9 @@ class Load3d {
   targetAspectRatio: number = 1
   isViewerMode: boolean = false
 
-  private rightMouseStart: { x: number; y: number } = { x: 0, y: 0 }
+  // Context menu tracking
+  private rightMouseDownX: number = 0
+  private rightMouseDownY: number = 0
   private rightMouseMoved: boolean = false
   private readonly dragThreshold: number = 5
   private contextMenuAbortController: AbortController | null = null
@@ -197,20 +197,18 @@ class Load3d {
 
     const mousedownHandler = (e: MouseEvent) => {
       if (e.button === 2) {
-        this.rightMouseStart = { x: e.clientX, y: e.clientY }
+        this.rightMouseDownX = e.clientX
+        this.rightMouseDownY = e.clientY
         this.rightMouseMoved = false
       }
     }
 
     const mousemoveHandler = (e: MouseEvent) => {
       if (e.buttons === 2) {
-        if (
-          exceedsClickThreshold(
-            this.rightMouseStart,
-            { x: e.clientX, y: e.clientY },
-            this.dragThreshold
-          )
-        ) {
+        const dx = Math.abs(e.clientX - this.rightMouseDownX)
+        const dy = Math.abs(e.clientY - this.rightMouseDownY)
+
+        if (dx > this.dragThreshold || dy > this.dragThreshold) {
           this.rightMouseMoved = true
         }
       }
@@ -219,13 +217,12 @@ class Load3d {
     const contextmenuHandler = (e: MouseEvent) => {
       if (this.isViewerMode) return
 
+      const dx = Math.abs(e.clientX - this.rightMouseDownX)
+      const dy = Math.abs(e.clientY - this.rightMouseDownY)
       const wasDragging =
         this.rightMouseMoved ||
-        exceedsClickThreshold(
-          this.rightMouseStart,
-          { x: e.clientX, y: e.clientY },
-          this.dragThreshold
-        )
+        dx > this.dragThreshold ||
+        dy > this.dragThreshold
 
       this.rightMouseMoved = false
 

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

@@ -7,8 +7,7 @@ import {
   LGraph,
   LGraphNode,
   LiteGraph,
-  LLink,
-  Reroute
+  LLink
 } from '@/lib/litegraph/src/litegraph'
 import type { SerialisableGraph } from '@/lib/litegraph/src/types/serialisation'
 import type { UUID } from '@/lib/litegraph/src/utils/uuid'
@@ -18,7 +17,6 @@ import {
   createTestSubgraphData,
   createTestSubgraphNode
 } from './subgraph/__fixtures__/subgraphHelpers'
-import { subgraphTest } from './subgraph/__fixtures__/subgraphFixtures'
 
 import {
   duplicateLinksRoot,
@@ -100,42 +98,6 @@ describe('LGraph', () => {
     const fromOldSchema = new LGraph(oldSchemaGraph)
     expect(fromOldSchema).toMatchSnapshot('oldSchemaGraph')
   })
-  subgraphTest('should snap slots to same y-level', ({ emptySubgraph }) => {
-    const node = new LGraphNode('testname')
-    node.addInput('test', 'IMAGE')
-    emptySubgraph.add(node)
-
-    emptySubgraph.inputNode.pos = [0, 0]
-    // Reroute needs offset of ~20y to align with first slot
-    const reroute = new Reroute(1, emptySubgraph, [0, 20])
-
-    node.snapToGrid(10)
-    reroute.snapToGrid(10)
-    emptySubgraph.inputNode.snapToGrid(10)
-
-    node.arrange()
-    emptySubgraph.inputNode.arrange()
-
-    const yPos = node.getInputPos(0)[1]
-    expect(reroute.pos[1]).toBe(yPos)
-    expect(emptySubgraph.inputNode.emptySlot.pos[1]).toBe(yPos)
-
-    // Assign non-equal positions and repeat
-    emptySubgraph.inputNode.pos = [0, 43]
-    node.pos = [0, 50]
-    reroute.pos = [0, 63]
-
-    node.snapToGrid(10)
-    reroute.snapToGrid(10)
-    emptySubgraph.inputNode.snapToGrid(10)
-
-    node.arrange()
-    emptySubgraph.inputNode.arrange()
-
-    const yPos2 = node.getInputPos(0)[1]
-    expect(reroute.pos[1]).toBe(yPos2)
-    expect(emptySubgraph.inputNode.emptySlot.pos[1]).toBe(yPos2)
-  })
 })
 
 describe('Floating Links / Reroutes', () => {

src/lib/litegraph/src/LGraphCanvas.drawConnections.test.ts

@@ -1,207 +0,0 @@
-import { createTestingPinia } from '@pinia/testing'
-import { setActivePinia } from 'pinia'
-import { afterEach, beforeEach, describe, expect, it, vi } from 'vitest'
-
-import {
-  LGraph,
-  LGraphCanvas,
-  LGraphNode,
-  LiteGraph
-} from '@/lib/litegraph/src/litegraph'
-import { LLink } from '@/lib/litegraph/src/LLink'
-import { createMockCanvas2DContext } from '@/utils/__tests__/litegraphTestUtils'
-
-vi.mock('@/renderer/core/layout/store/layoutStore', () => ({
-  layoutStore: {
-    querySlotAtPoint: vi.fn(),
-    queryRerouteAtPoint: vi.fn(),
-    getNodeLayoutRef: vi.fn(() => ({ value: null })),
-    getSlotLayout: vi.fn(),
-    setSource: vi.fn(),
-    batchUpdateNodeBounds: vi.fn(),
-    getCurrentSource: vi.fn(() => 'test'),
-    getCurrentActor: vi.fn(() => 'test'),
-    applyOperation: vi.fn(),
-    pendingSlotSync: false
-  }
-}))
-
-function createMockCtx(): CanvasRenderingContext2D {
-  return createMockCanvas2DContext({
-    translate: vi.fn(),
-    scale: vi.fn(),
-    fillText: vi.fn(),
-    measureText: vi.fn().mockReturnValue({ width: 50 }),
-    closePath: vi.fn(),
-    rect: vi.fn(),
-    clip: vi.fn(),
-    setTransform: vi.fn(),
-    roundRect: vi.fn(),
-    getTransform: vi
-      .fn()
-      .mockReturnValue({ a: 1, b: 0, c: 0, d: 1, e: 0, f: 0 }),
-    createLinearGradient: vi.fn().mockReturnValue({
-      addColorStop: vi.fn()
-    }),
-    bezierCurveTo: vi.fn(),
-    quadraticCurveTo: vi.fn(),
-    isPointInStroke: vi.fn().mockReturnValue(false),
-    globalAlpha: 1,
-    textAlign: 'left' as CanvasTextAlign,
-    textBaseline: 'alphabetic' as CanvasTextBaseline,
-    shadowColor: '',
-    shadowBlur: 0,
-    shadowOffsetX: 0,
-    shadowOffsetY: 0,
-    imageSmoothingEnabled: true
-  })
-}
-
-/**
- * Creates a link between two nodes by directly mutating graph state,
- * bypassing the layout store integration in connect().
- */
-function createTestLink(
-  graph: LGraph,
-  sourceNode: LGraphNode,
-  outputSlot: number,
-  targetNode: LGraphNode,
-  inputSlot: number
-): LLink {
-  const linkId = ++graph.state.lastLinkId
-  const link = new LLink(
-    linkId,
-    sourceNode.outputs[outputSlot].type,
-    sourceNode.id,
-    outputSlot,
-    targetNode.id,
-    inputSlot
-  )
-  graph._links.set(linkId, link)
-  sourceNode.outputs[outputSlot].links ??= []
-  sourceNode.outputs[outputSlot].links!.push(linkId)
-  targetNode.inputs[inputSlot].link = linkId
-  return link
-}
-
-describe('drawConnections widget-input slot positioning', () => {
-  let graph: LGraph
-  let canvas: LGraphCanvas
-  let canvasElement: HTMLCanvasElement
-
-  beforeEach(() => {
-    vi.clearAllMocks()
-    setActivePinia(createTestingPinia())
-
-    canvasElement = document.createElement('canvas')
-    canvasElement.width = 800
-    canvasElement.height = 600
-    canvasElement.getContext = vi.fn().mockReturnValue(createMockCtx())
-    canvasElement.getBoundingClientRect = vi.fn().mockReturnValue({
-      left: 0,
-      top: 0,
-      width: 800,
-      height: 600
-    })
-
-    graph = new LGraph()
-    canvas = new LGraphCanvas(canvasElement, graph, {
-      skip_render: true
-    })
-
-    LiteGraph.vueNodesMode = false
-  })
-
-  afterEach(() => {
-    LiteGraph.vueNodesMode = false
-  })
-
-  it('arranges widget-input slots before rendering links', () => {
-    const sourceNode = new LGraphNode('Source')
-    sourceNode.pos = [0, 100]
-    sourceNode.size = [150, 60]
-    sourceNode.addOutput('out', 'STRING')
-    graph.add(sourceNode)
-
-    const targetNode = new LGraphNode('Target')
-    targetNode.pos = [300, 100]
-    targetNode.size = [200, 120]
-    const widget = targetNode.addWidget('text', 'value', '', null)
-    const input = targetNode.addInput('value', 'STRING')
-    input.widget = { name: 'value' }
-    graph.add(targetNode)
-
-    createTestLink(graph, sourceNode, 0, targetNode, 0)
-
-    // Before drawConnections, input.pos should not be set
-    expect(input.pos).toBeUndefined()
-
-    canvas.drawConnections(createMockCtx())
-
-    // After drawConnections, input.pos should be set to the widget row
-    expect(input.pos).toBeDefined()
-    expect(input.pos![1]).toBeGreaterThan(0)
-
-    const offset = LiteGraph.NODE_SLOT_HEIGHT * 0.5
-    expect(input.pos![1]).toBe(widget.y + offset)
-  })
-
-  it('does not re-arrange nodes whose widget-input slots already have positions', () => {
-    const sourceNode = new LGraphNode('Source')
-    sourceNode.pos = [0, 100]
-    sourceNode.size = [150, 60]
-    sourceNode.addOutput('out', 'STRING')
-    graph.add(sourceNode)
-
-    const targetNode = new LGraphNode('Target')
-    targetNode.pos = [300, 100]
-    targetNode.size = [200, 120]
-    targetNode.addWidget('text', 'value', '', null)
-    const input = targetNode.addInput('value', 'STRING')
-    input.widget = { name: 'value' }
-    graph.add(targetNode)
-
-    createTestLink(graph, sourceNode, 0, targetNode, 0)
-
-    // Pre-arrange so input.pos is already set
-    targetNode._setConcreteSlots()
-    targetNode.arrange()
-    expect(input.pos).toBeDefined()
-
-    const arrangeSpy = vi.spyOn(targetNode, 'arrange')
-
-    canvas.drawConnections(createMockCtx())
-
-    expect(arrangeSpy).not.toHaveBeenCalled()
-  })
-
-  it('positions widget-input slots when display name differs from slot.widget.name', () => {
-    const sourceNode = new LGraphNode('Source')
-    sourceNode.pos = [0, 100]
-    sourceNode.size = [150, 60]
-    sourceNode.addOutput('out', 'STRING')
-    graph.add(sourceNode)
-
-    const targetNode = new LGraphNode('Target')
-    targetNode.pos = [300, 100]
-    targetNode.size = [200, 120]
-
-    // Widget has a display name that differs from the slot's widget.name
-    // (simulates a renamed subgraph label)
-    const widget = targetNode.addWidget('text', 'renamed_label', '', null)
-    const input = targetNode.addInput('renamed_label', 'STRING')
-    input.widget = { name: 'original_name' }
-
-    // Bind the widget as the slot's _widget (preferred over name-map lookup)
-    input._widget = widget
-
-    graph.add(targetNode)
-    createTestLink(graph, sourceNode, 0, targetNode, 0)
-
-    canvas.drawConnections(createMockCtx())
-
-    expect(input.pos).toBeDefined()
-    const offset = LiteGraph.NODE_SLOT_HEIGHT * 0.5
-    expect(input.pos![1]).toBe(widget.y + offset)
-  })
-})

src/lib/litegraph/src/LGraphCanvas.ts

@@ -2616,7 +2616,8 @@ export class LGraphCanvas implements CustomEventDispatcher<LGraphCanvasEventMap>
           }
           pointer.finally = () => (this.resizingGroup = null)
         } else {
-          const headerHeight = LiteGraph.NODE_TITLE_HEIGHT
+          const f = group.font_size || LiteGraph.DEFAULT_GROUP_FONT_SIZE
+          const headerHeight = f * 1.4
           if (
             isInRectangle(
               x,
@@ -5881,8 +5882,7 @@ export class LGraphCanvas implements CustomEventDispatcher<LGraphCanvasEventMap>
   drawSnapGuide(
     ctx: CanvasRenderingContext2D,
     item: Positionable,
-    shape = RenderShape.ROUND,
-    { offsetToSlot }: { offsetToSlot?: boolean } = {}
+    shape = RenderShape.ROUND
   ) {
     const snapGuide = temp
     snapGuide.set(item.boundingRect)
@@ -5890,10 +5890,7 @@ export class LGraphCanvas implements CustomEventDispatcher<LGraphCanvasEventMap>
     // Not all items have pos equal to top-left of bounds
     const { pos } = item
     const offsetX = pos[0] - snapGuide[0]
-    const offsetY =
-      pos[1] -
-      snapGuide[1] -
-      (offsetToSlot ? LiteGraph.NODE_SLOT_HEIGHT * 0.7 : 0)
+    const offsetY = pos[1] - snapGuide[1]
 
     // Normalise boundingRect to pos to snap
     snapGuide[0] += offsetX
@@ -5953,19 +5950,6 @@ export class LGraphCanvas implements CustomEventDispatcher<LGraphCanvasEventMap>
     ctx.globalAlpha = this.editor_alpha
     // for every node
     const nodes = graph._nodes
-
-    // Ensure widget-input slot positions are computed before rendering links.
-    // arrange() sets input.pos for widget-backed slots, but is normally called
-    // in drawNode (foreground canvas). drawConnections runs on the background
-    // canvas, which may render before drawNode has executed for this frame.
-    // The dirty flag avoids a per-frame O(N) scan of all inputs.
-    for (const node of nodes) {
-      if (node.flags.collapsed || !node._widgetSlotsDirty) continue
-
-      node._setConcreteSlots()
-      node.arrange()
-    }
-
     for (const node of nodes) {
       // for every input (we render just inputs because it is easier as every slot can only have one input)
       const { inputs } = node
@@ -6083,9 +6067,7 @@ export class LGraphCanvas implements CustomEventDispatcher<LGraphCanvasEventMap>
         this.isDragging &&
         this.selectedItems.has(reroute)
       ) {
-        this.drawSnapGuide(ctx, reroute, RenderShape.CIRCLE, {
-          offsetToSlot: true
-        })
+        this.drawSnapGuide(ctx, reroute, RenderShape.CIRCLE)
       }
       reroute.draw(ctx, this._pattern)
 

src/lib/litegraph/src/LGraphGroup.ts

@@ -40,7 +40,7 @@ export class LGraphGroup implements Positionable, IPinnable, IColorable {
   color?: string
   title: string
   font?: string
-  font_size: number = LiteGraph.GROUP_TEXT_SIZE
+  font_size: number = LiteGraph.DEFAULT_GROUP_FONT || 24
   _bounding = new Rectangle(10, 10, LGraphGroup.minWidth, LGraphGroup.minHeight)
 
   _pos: Point = this._bounding.pos
@@ -116,7 +116,7 @@ export class LGraphGroup implements Positionable, IPinnable, IColorable {
   }
 
   get titleHeight() {
-    return LiteGraph.NODE_TITLE_HEIGHT
+    return this.font_size * 1.4
   }
 
   get children(): ReadonlySet<Positionable> {
@@ -148,6 +148,7 @@ export class LGraphGroup implements Positionable, IPinnable, IColorable {
     this._bounding.set(o.bounding)
     this.color = o.color
     this.flags = o.flags || this.flags
+    if (o.font_size) this.font_size = o.font_size
   }
 
   serialize(): ISerialisedGroup {
@@ -157,6 +158,7 @@ export class LGraphGroup implements Positionable, IPinnable, IColorable {
       title: this.title,
       bounding: [...b],
       color: this.color,
+      font_size: this.font_size,
       flags: this.flags
     }
   }
@@ -168,7 +170,7 @@ export class LGraphGroup implements Positionable, IPinnable, IColorable {
    */
   draw(graphCanvas: LGraphCanvas, ctx: CanvasRenderingContext2D): void {
     const { padding, resizeLength, defaultColour } = LGraphGroup
-    const font_size = LiteGraph.GROUP_TEXT_SIZE
+    const font_size = this.font_size || LiteGraph.DEFAULT_GROUP_FONT_SIZE
 
     const [x, y] = this._pos
     const [width, height] = this._size
@@ -179,7 +181,7 @@ export class LGraphGroup implements Positionable, IPinnable, IColorable {
     ctx.fillStyle = color
     ctx.strokeStyle = color
     ctx.beginPath()
-    ctx.rect(x + 0.5, y + 0.5, width, LiteGraph.NODE_TITLE_HEIGHT)
+    ctx.rect(x + 0.5, y + 0.5, width, font_size * 1.4)
     ctx.fill()
 
     // Group background, border
@@ -201,13 +203,11 @@ export class LGraphGroup implements Positionable, IPinnable, IColorable {
     // Title
     ctx.font = `${font_size}px ${LiteGraph.GROUP_FONT}`
     ctx.textAlign = 'left'
-    ctx.textBaseline = 'middle'
     ctx.fillText(
       this.title + (this.pinned ? '📌' : ''),
-      x + font_size / 2,
-      y + LiteGraph.NODE_TITLE_HEIGHT / 2 + 1
+      x + padding,
+      y + font_size
     )
-    ctx.textBaseline = 'alphabetic'
 
     if (LiteGraph.highlight_selected_group && this.selected) {
       strokeShape(ctx, this._bounding, {

src/lib/litegraph/src/LGraphNode.ts

@@ -295,12 +295,6 @@ export class LGraphNode
    */
   freeWidgetSpace?: number
 
-  /**
-   * Set to true when widget-backed input slot positions need recalculation.
-   * Cleared after arrange() runs. Avoids per-frame O(N) scans in drawConnections.
-   */
-  _widgetSlotsDirty = false
-
   locked?: boolean
 
   /** Execution order, automatically computed during run @see {@link LGraph.computeExecutionOrder} */
@@ -1998,7 +1992,6 @@ export class LGraphNode
     this.widgets ||= []
     const widget = toConcreteWidget(custom_widget, this, false) ?? custom_widget
     this.widgets.push(widget)
-    this._widgetSlotsDirty = true
 
     // Only register with store if node has a valid ID (is already in a graph).
     // If the node isn't in a graph yet (id === -1), registration happens
@@ -2038,11 +2031,9 @@ export class LGraphNode
         if (input._widget === widget) {
           input._widget = undefined
           input.widget = undefined
-          input.pos = undefined
         }
       }
     }
-    this._widgetSlotsDirty = true
 
     widget.onRemove?.()
     this.widgets.splice(widgetIndex, 1)
@@ -4215,29 +4206,40 @@ export class LGraphNode
    * Arranges the layout of the node's widget input slots.
    */
   private _arrangeWidgetInputSlots(): void {
-    if (!this.widgets?.length) return
+    if (!this.widgets) return
 
-    // Build a name→widget map for fast lookup.
-    const widgetByName = new Map<string, IBaseWidget>()
-    for (const w of this.widgets) widgetByName.set(w.name, w)
+    const slotByWidgetName = new Map<
+      string,
+      INodeInputSlot & { index: number }
+    >()
 
-    // Set widget-backed slot positions from widget Y coordinates.
-    // In Vue mode, promoted widget inputs are not rendered as <InputSlot>
-    // components (NodeSlots filters them out), so they have no DOM-registered
-    // position. input.pos serves as the fallback for getSlotPosition().
-    for (const [i, slot] of this._concreteInputs.entries()) {
+    for (const [i, slot] of this.inputs.entries()) {
       if (!isWidgetInputSlot(slot)) continue
 
-      // Prefer the slot's direct _widget binding (1:1 for promoted inputs).
-      // Fall back to name-map lookup for regular nodes without _widget set.
-      // Note: the name-map is ambiguous if two promoted inputs share a label;
-      // _widget avoids this since it is a direct reference.
-      const widget = slot._widget ?? widgetByName.get(slot.widget.name)
-      if (!widget) continue
+      slotByWidgetName.set(slot.widget.name, { ...slot, index: i })
+    }
+    if (!slotByWidgetName.size) return
 
-      const offset = LiteGraph.NODE_SLOT_HEIGHT * 0.5
-      slot.pos = [offset, widget.y + offset]
-      this._measureSlot(slot, i, true)
+    // Only set custom pos if not using Vue positioning
+    // Vue positioning calculates widget slot positions dynamically
+    if (!LiteGraph.vueNodesMode) {
+      for (const widget of this.widgets) {
+        const slot = slotByWidgetName.get(widget.name)
+        if (!slot) continue
+
+        const actualSlot = this._concreteInputs[slot.index]
+        const offset = LiteGraph.NODE_SLOT_HEIGHT * 0.5
+        actualSlot.pos = [offset, widget.y + offset]
+        this._measureSlot(actualSlot, slot.index, true)
+      }
+    } else {
+      // For Vue positioning, just measure the slots without setting pos
+      for (const widget of this.widgets) {
+        const slot = slotByWidgetName.get(widget.name)
+        if (!slot) continue
+
+        this._measureSlot(this._concreteInputs[slot.index], slot.index, true)
+      }
     }
   }
 
@@ -4267,7 +4269,6 @@ export class LGraphNode
       : 0
     this._arrangeWidgets(widgetStartY)
     this._arrangeWidgetInputSlots()
-    this._widgetSlotsDirty = false
   }
 
   /**

src/lib/litegraph/src/LiteGraphGlobal.ts

@@ -72,7 +72,8 @@ export class LiteGraphGlobal {
   DEFAULT_FONT = 'Inter'
   DEFAULT_SHADOW_COLOR = 'rgba(0,0,0,0.5)'
 
-  GROUP_TEXT_SIZE = 20
+  DEFAULT_GROUP_FONT = 24
+  DEFAULT_GROUP_FONT_SIZE = 24
   GROUP_FONT = 'Inter'
 
   WIDGET_BGCOLOR = '#222'

src/lib/litegraph/src/Reroute.ts

@@ -16,7 +16,6 @@ import type {
   ReadOnlyRect,
   ReadonlyLinkNetwork
 } from './interfaces'
-import { LiteGraph } from './litegraph'
 import { distance, isPointInRect } from './measure'
 import type { Serialisable, SerialisableReroute } from './types/serialisation'
 
@@ -429,10 +428,9 @@ export class Reroute
   snapToGrid(snapTo: number): boolean {
     if (!snapTo) return false
 
-    const offsetY = LiteGraph.NODE_SLOT_HEIGHT * 0.7
     const { pos } = this
     pos[0] = snapTo * Math.round(pos[0] / snapTo)
-    pos[1] = snapTo * Math.round((pos[1] - offsetY) / snapTo) + offsetY
+    pos[1] = snapTo * Math.round(pos[1] / snapTo)
     return true
   }
 

src/lib/litegraph/src/__snapshots__/LGraph.test.ts.snap

@@ -18,6 +18,7 @@ exports[`LGraph > supports schema v0.4 graphs > oldSchemaGraph 1`] = `
       ],
       "color": "#6029aa",
       "flags": {},
+      "font_size": 14,
       "id": 123,
       "title": "A group to test with",
     },

src/lib/litegraph/src/__snapshots__/LGraphGroup.test.ts.snap

@@ -10,6 +10,7 @@ exports[`LGraphGroup > serializes to the existing format > Basic 1`] = `
   ],
   "color": "#3f789e",
   "flags": {},
+  "font_size": 24,
   "id": 929,
   "title": "title",
 }

src/lib/litegraph/src/__snapshots__/litegraph.test.ts.snap

@@ -21,6 +21,8 @@ LiteGraphGlobal {
   "ContextMenu": [Function],
   "CurveEditor": [Function],
   "DEFAULT_FONT": "Inter",
+  "DEFAULT_GROUP_FONT": 24,
+  "DEFAULT_GROUP_FONT_SIZE": 24,
   "DEFAULT_POSITION": [
     100,
     100,
@@ -32,7 +34,6 @@ LiteGraphGlobal {
   "EVENT_LINK_COLOR": "#A86",
   "GRID_SHAPE": 6,
   "GROUP_FONT": "Inter",
-  "GROUP_TEXT_SIZE": 20,
   "Globals": {},
   "HIDDEN_LINK": -1,
   "INPUT": 1,

src/lib/litegraph/src/subgraph/PromotedWidgetViewManager.ts

@@ -1,8 +1,8 @@
 import type { PromotedWidgetSource } from '@/core/graph/subgraph/promotedWidgetTypes'
 
-type ViewManagerEntry = PromotedWidgetSource & {
-  viewKey?: string
-}
+type ViewManagerEntry = PromotedWidgetSource & { viewKey?: string }
+
+type CreateView<TView> = (entry: ViewManagerEntry) => TView
 
 /**
  * Reconciles promoted widget entries to stable view instances.
@@ -15,9 +15,9 @@ export class PromotedWidgetViewManager<TView> {
   private cachedViews: TView[] | null = null
   private cachedEntryKeys: string[] | null = null
 
-  reconcile<TEntry extends ViewManagerEntry>(
-    entries: readonly TEntry[],
-    createView: (entry: TEntry) => TView
+  reconcile(
+    entries: readonly ViewManagerEntry[],
+    createView: CreateView<TView>
   ): TView[] {
     const entryKeys = entries.map((entry) =>
       this.makeKey(entry.sourceNodeId, entry.sourceWidgetName, entry.viewKey)

src/lib/litegraph/src/subgraph/SubgraphIONodeBase.ts

@@ -36,7 +36,7 @@ export abstract class SubgraphIONodeBase<
 {
   static margin = 10
   static minWidth = 100
-  static roundedRadius = 14 // Matches NODE_SLOT_HEIGHT * 0.7 for slot alignment
+  static roundedRadius = 10
 
   private readonly _boundingRect: Rectangle = new Rectangle()
 

src/lib/litegraph/src/subgraph/SubgraphNode.test.ts

@@ -9,7 +9,7 @@ import { createTestingPinia } from '@pinia/testing'
 import { setActivePinia } from 'pinia'
 
 import type { ExportedSubgraphInstance } from '@/lib/litegraph/src/types/serialisation'
-import { LGraph, LGraphNode, SubgraphNode } from '@/lib/litegraph/src/litegraph'
+import { LGraph, SubgraphNode } from '@/lib/litegraph/src/litegraph'
 
 import { subgraphTest } from './__fixtures__/subgraphFixtures'
 import {
@@ -196,258 +196,6 @@ describe('SubgraphNode Synchronization', () => {
 
     expect(subgraphNode.outputs[0].label).toBe('newOutput')
   })
-
-  it('should keep input.widget.name stable after rename (onGraphConfigured safety)', () => {
-    const subgraph = createTestSubgraph({
-      inputs: [{ name: 'text', type: 'STRING' }]
-    })
-
-    const interiorNode = new LGraphNode('Interior')
-    const input = interiorNode.addInput('value', 'STRING')
-    input.widget = { name: 'value' }
-    interiorNode.addOutput('out', 'STRING')
-    interiorNode.addWidget('text', 'value', '', () => {})
-    subgraph.add(interiorNode)
-    subgraph.inputNode.slots[0].connect(interiorNode.inputs[0], interiorNode)
-
-    const subgraphNode = createTestSubgraphNode(subgraph)
-    const promotedInput = subgraphNode.inputs[0]
-    expect(promotedInput.widget).toBeDefined()
-
-    const originalWidgetName = promotedInput.widget!.name
-
-    // Rename the subgraph input label
-    subgraph.inputs[0].label = 'my_custom_prompt'
-    subgraph.events.dispatch('renaming-input', {
-      input: subgraph.inputs[0],
-      index: 0,
-      oldName: 'text',
-      newName: 'my_custom_prompt'
-    })
-
-    // widget.name stays as the internal name — NOT the display label
-    expect(promotedInput.widget!.name).toBe(originalWidgetName)
-
-    // The display label is on input.label (live-read via PromotedWidgetView.label)
-    expect(promotedInput.label).toBe('my_custom_prompt')
-
-    // input.widget.name should still match a widget in node.widgets
-    const matchingWidget = subgraphNode.widgets?.find(
-      (w) => w.name === promotedInput.widget!.name
-    )
-    expect(matchingWidget).toBeDefined()
-  })
-
-  it('should preserve renamed label through serialize/configure round-trip', () => {
-    const subgraph = createTestSubgraph({
-      inputs: [{ name: 'seed', type: 'INT' }]
-    })
-
-    const interiorNode = new LGraphNode('Interior')
-    const input = interiorNode.addInput('value', 'INT')
-    input.widget = { name: 'value' }
-    interiorNode.addOutput('out', 'INT')
-    interiorNode.addWidget('number', 'value', 0, () => {})
-    subgraph.add(interiorNode)
-    subgraph.inputNode.slots[0].connect(interiorNode.inputs[0], interiorNode)
-
-    const subgraphNode = createTestSubgraphNode(subgraph)
-    const promotedWidget = subgraphNode.widgets?.[0]
-    expect(promotedWidget).toBeDefined()
-
-    // Rename via the subgraph slot (simulates right-click rename)
-    subgraph.inputs[0].label = 'My Seed'
-    subgraphNode.inputs[0].label = 'My Seed'
-    subgraph.events.dispatch('renaming-input', {
-      input: subgraph.inputs[0],
-      index: 0,
-      oldName: 'seed',
-      newName: 'My Seed'
-    })
-
-    // Label should be visible before round-trip
-    const widgetBeforeRoundTrip = subgraphNode.widgets?.[0]
-    expect(widgetBeforeRoundTrip!.label || widgetBeforeRoundTrip!.name).toBe(
-      'My Seed'
-    )
-
-    // Serialize and reconfigure (simulates save/reload)
-    const serialized = subgraphNode.serialize()
-    subgraphNode.configure(serialized)
-
-    // Label should survive the round-trip
-    const widgetAfterRoundTrip = subgraphNode.widgets?.[0]
-    expect(widgetAfterRoundTrip).toBeDefined()
-    expect(widgetAfterRoundTrip!.label || widgetAfterRoundTrip!.name).toBe(
-      'My Seed'
-    )
-  })
-})
-
-describe('SubgraphNode widget name collision on rename', () => {
-  it('should not collapse two inputs when renamed to the same label', () => {
-    const subgraph = createTestSubgraph({
-      inputs: [
-        { name: 'prompt_a', type: 'STRING' },
-        { name: 'prompt_b', type: 'STRING' }
-      ]
-    })
-
-    // Create two interior nodes with widgets
-    const nodeA = new LGraphNode('NodeA')
-    nodeA.addInput('value', 'STRING')
-    nodeA.inputs[0].widget = { name: 'value' }
-    nodeA.addOutput('out', 'STRING')
-    nodeA.addWidget('text', 'value', '', () => {})
-    subgraph.add(nodeA)
-    subgraph.inputNode.slots[0].connect(nodeA.inputs[0], nodeA)
-
-    const nodeB = new LGraphNode('NodeB')
-    nodeB.addInput('value', 'STRING')
-    nodeB.inputs[0].widget = { name: 'value' }
-    nodeB.addOutput('out', 'STRING')
-    nodeB.addWidget('text', 'value', '', () => {})
-    subgraph.add(nodeB)
-    subgraph.inputNode.slots[1].connect(nodeB.inputs[0], nodeB)
-
-    const subgraphNode = createTestSubgraphNode(subgraph)
-
-    expect(subgraphNode.inputs).toHaveLength(2)
-    // widget.name is now nodeId:widgetName (stable composite key)
-    const key0 = subgraphNode.inputs[0].widget?.name
-    const key1 = subgraphNode.inputs[1].widget?.name
-    expect(key0).toBeDefined()
-    expect(key1).toBeDefined()
-    expect(key0).not.toBe(key1)
-
-    // Rename prompt_b to same LABEL as prompt_a
-    subgraph.inputs[1].label = 'prompt_a'
-    subgraph.events.dispatch('renaming-input', {
-      input: subgraph.inputs[1],
-      index: 1,
-      oldName: 'prompt_b',
-      newName: 'prompt_a'
-    })
-
-    // Both inputs survive — widget.name stays as composite key, no collision
-    expect(subgraphNode.inputs).toHaveLength(2)
-    expect(subgraphNode.inputs[0].widget?.name).toBe(key0)
-    expect(subgraphNode.inputs[1].widget?.name).toBe(key1)
-
-    // Display labels: input[1] was renamed
-    expect(subgraphNode.inputs[1].label).toBe('prompt_a')
-
-    // Distinct _widget bindings
-    expect(subgraphNode.inputs[0]._widget).toBeDefined()
-    expect(subgraphNode.inputs[1]._widget).toBeDefined()
-    expect(subgraphNode.inputs[0]._widget).not.toBe(
-      subgraphNode.inputs[1]._widget
-    )
-  })
-
-  it('should keep unique widget.name keys even with duplicate labels', () => {
-    const subgraph = createTestSubgraph({
-      inputs: [
-        { name: 'seed', type: 'INT' },
-        { name: 'seed2', type: 'INT' }
-      ]
-    })
-
-    const nodeA = new LGraphNode('NodeA')
-    nodeA.addInput('value', 'INT')
-    nodeA.inputs[0].widget = { name: 'value' }
-    nodeA.addOutput('out', 'INT')
-    nodeA.addWidget('number', 'value', 0, () => {})
-    subgraph.add(nodeA)
-    subgraph.inputNode.slots[0].connect(nodeA.inputs[0], nodeA)
-
-    const nodeB = new LGraphNode('NodeB')
-    nodeB.addInput('value', 'INT')
-    nodeB.inputs[0].widget = { name: 'value' }
-    nodeB.addOutput('out', 'INT')
-    nodeB.addWidget('number', 'value', 0, () => {})
-    subgraph.add(nodeB)
-    subgraph.inputNode.slots[1].connect(nodeB.inputs[0], nodeB)
-
-    const subgraphNode = createTestSubgraphNode(subgraph)
-
-    const key0 = subgraphNode.inputs[0].widget?.name
-    const key1 = subgraphNode.inputs[1].widget?.name
-
-    // Keys should be unique composite identifiers (nodeId:widgetName)
-    expect(key0).toBeDefined()
-    expect(key1).toBeDefined()
-    expect(key0).not.toBe(key1)
-
-    // Rename seed2 to "seed" — duplicate display label
-    subgraph.inputs[1].label = 'seed'
-    subgraph.events.dispatch('renaming-input', {
-      input: subgraph.inputs[1],
-      index: 1,
-      oldName: 'seed2',
-      newName: 'seed'
-    })
-
-    // Widget keys remain stable — rename only affects display label
-    expect(subgraphNode.inputs[0].widget?.name).toBe(key0)
-    expect(subgraphNode.inputs[1].widget?.name).toBe(key1)
-
-    // Distinct _widget bindings survive the rename
-    expect(subgraphNode.inputs[0]._widget).toBeDefined()
-    expect(subgraphNode.inputs[1]._widget).toBeDefined()
-    expect(subgraphNode.inputs[0]._widget).not.toBe(
-      subgraphNode.inputs[1]._widget
-    )
-  })
-
-  it('should not lose input when onGraphConfigured runs after duplicate rename', () => {
-    const subgraph = createTestSubgraph({
-      inputs: [
-        { name: 'alpha', type: 'STRING' },
-        { name: 'beta', type: 'STRING' }
-      ]
-    })
-
-    const nodeA = new LGraphNode('NodeA')
-    nodeA.addInput('value', 'STRING')
-    nodeA.inputs[0].widget = { name: 'value' }
-    nodeA.addOutput('out', 'STRING')
-    nodeA.addWidget('text', 'value', '', () => {})
-    subgraph.add(nodeA)
-    subgraph.inputNode.slots[0].connect(nodeA.inputs[0], nodeA)
-
-    const nodeB = new LGraphNode('NodeB')
-    nodeB.addInput('value', 'STRING')
-    nodeB.inputs[0].widget = { name: 'value' }
-    nodeB.addOutput('out', 'STRING')
-    nodeB.addWidget('text', 'value', '', () => {})
-    subgraph.add(nodeB)
-    subgraph.inputNode.slots[1].connect(nodeB.inputs[0], nodeB)
-
-    const subgraphNode = createTestSubgraphNode(subgraph)
-
-    // Rename beta to "alpha" — collision
-    subgraph.inputs[1].label = 'alpha'
-    subgraph.events.dispatch('renaming-input', {
-      input: subgraph.inputs[1],
-      index: 1,
-      oldName: 'beta',
-      newName: 'alpha'
-    })
-
-    // Simulate onGraphConfigured check: for each input with widget,
-    // find a matching widget by name. If not found, the input gets removed.
-    for (const input of subgraphNode.inputs) {
-      if (!input.widget) continue
-      const name = input.widget.name
-      const w = subgraphNode.widgets?.find((w) => w.name === name)
-      // Every input should find at least one matching widget
-      expect(w).toBeDefined()
-    }
-
-    // Both inputs should survive
-    expect(subgraphNode.inputs).toHaveLength(2)
-  })
 })
 
 describe('SubgraphNode Lifecycle', () => {

src/lib/litegraph/src/subgraph/SubgraphNode.ts

@@ -63,8 +63,6 @@ workflowSvg.src =
 type LinkedPromotionEntry = PromotedWidgetSource & {
   inputName: string
   inputKey: string
-  /** The subgraph input slot's internal name (stable identity). */
-  slotName: string
 }
 // Pre-rasterize the SVG to a bitmap canvas to avoid Firefox re-processing
 // the SVG's internal stylesheet on every ctx.drawImage() call per frame.
@@ -194,7 +192,6 @@ export class SubgraphNode extends LGraphNode implements BaseLGraph {
           linkedEntries.push({
             inputName: input.label ?? input.name,
             inputKey: String(subgraphInput.id),
-            slotName: subgraphInput.name,
             sourceNodeId: boundWidget.sourceNodeId,
             sourceWidgetName: boundWidget.sourceWidgetName
           })
@@ -209,7 +206,6 @@ export class SubgraphNode extends LGraphNode implements BaseLGraph {
       linkedEntries.push({
         inputName: input.label ?? input.name,
         inputKey: String(subgraphInput.id),
-        slotName: subgraphInput.name,
         ...resolved
       })
     }
@@ -281,8 +277,7 @@ export class SubgraphNode extends LGraphNode implements BaseLGraph {
           entry.sourceNodeId,
           entry.sourceWidgetName,
           entry.viewKey ? displayNameByViewKey.get(entry.viewKey) : undefined,
-          entry.disambiguatingSourceNodeId,
-          entry.slotName
+          entry.disambiguatingSourceNodeId
         )
     )
 
@@ -338,7 +333,6 @@ export class SubgraphNode extends LGraphNode implements BaseLGraph {
       sourceWidgetName: string
       viewKey?: string
       disambiguatingSourceNodeId?: string
-      slotName?: string
     }>
   } {
     const { fallbackStoredEntries } = this._collectLinkedAndFallbackEntries(
@@ -568,22 +562,17 @@ export class SubgraphNode extends LGraphNode implements BaseLGraph {
     sourceNodeId: string
     sourceWidgetName: string
     viewKey: string
-    disambiguatingSourceNodeId?: string
-    slotName: string
   }> {
     return linkedEntries.map(
       ({
         inputKey,
         inputName,
-        slotName,
         sourceNodeId,
         sourceWidgetName,
         disambiguatingSourceNodeId
       }) => ({
         sourceNodeId,
         sourceWidgetName,
-        slotName,
-        disambiguatingSourceNodeId,
         viewKey: this._makePromotionViewKey(
           inputKey,
           sourceNodeId,
@@ -791,12 +780,9 @@ export class SubgraphNode extends LGraphNode implements BaseLGraph {
         if (!input) throw new Error('Subgraph input not found')
 
         input.label = newName
-        // Do NOT change input.widget.name — it is the stable internal
-        // identifier used by onGraphConfigured (widgetInputs.ts) to match
-        // inputs to widgets. Changing it to the display label would cause
-        // collisions when two promoted inputs share the same label.
-        // Display is handled via input.label and _widget.label.
-        if (input._widget) input._widget.label = newName
+        if (input._widget) {
+          input._widget.label = newName
+        }
         this._invalidatePromotedViewsCache()
         this.graph?.trigger('node:slot-label:changed', {
           nodeId: this.id,
@@ -1148,13 +1134,6 @@ export class SubgraphNode extends LGraphNode implements BaseLGraph {
     }
   }
 
-  /**
-   * Binds a promoted widget view to a subgraph input slot.
-   *
-   * Creates or retrieves a {@link PromotedWidgetView}, registers it in the
-   * promotion store, sets up the prototype chain for multi-level subgraph
-   * nesting, and dispatches the `widget-promoted` event.
-   */
   private _setWidget(
     subgraphInput: Readonly<SubgraphInput>,
     input: INodeInputSlot,
@@ -1208,10 +1187,7 @@ export class SubgraphNode extends LGraphNode implements BaseLGraph {
       })
     }
 
-    // Create/retrieve the view from cache.
-    // The cache key uses `input.name` (the slot's internal name) rather
-    // than `subgraphInput.name` because nested subgraphs may remap
-    // the internal name independently of the interior node.
+    // Create/retrieve the view from cache
     const view = this._promotedViewManager.getOrCreate(
       nodeId,
       widgetName,
@@ -1221,8 +1197,7 @@ export class SubgraphNode extends LGraphNode implements BaseLGraph {
           nodeId,
           widgetName,
           input.label ?? subgraphInput.name,
-          sourceNodeId,
-          subgraphInput.name
+          sourceNodeId
         ),
       this._makePromotionViewKey(
         String(subgraphInput.id),
@@ -1236,9 +1211,6 @@ export class SubgraphNode extends LGraphNode implements BaseLGraph {
     // NOTE: This code creates linked chains of prototypes for passing across
     // multiple levels of subgraphs. As part of this, it intentionally avoids
     // creating new objects. Have care when making changes.
-    // Use subgraphInput.name as the stable identity — unique per subgraph
-    // slot, immune to label renames. Matches PromotedWidgetView.name.
-    // Display is handled via widget.label / PromotedWidgetView.label.
     input.widget ??= { name: subgraphInput.name }
     input.widget.name = subgraphInput.name
     if (inputWidget) Object.setPrototypeOf(input.widget, inputWidget)

src/locales/ar/main.json

@@ -15,14 +15,6 @@
     "message": "يحتوي سير العمل هذا على عقد API، والتي تتطلب تسجيل دخولك إلى حسابك لتشغيلها.",
     "title": "تسجيل الدخول مطلوب لاستخدام عقد API"
   },
-  "appBuilder": {
-    "vueNodeSwitch": {
-      "content": "لأفضل تجربة، يستخدم منشئ التطبيقات Nodes 2.0. يمكنك العودة بعد بناء التطبيق من القائمة الرئيسية.",
-      "dismiss": "تجاهل",
-      "dontShowAgain": "عدم الإظهار مرة أخرى",
-      "title": "تم التبديل إلى Nodes 2.0"
-    }
-  },
   "assetBrowser": {
     "allCategory": "جميع {category}",
     "allModels": "جميع النماذج",
@@ -780,7 +772,6 @@
     "COMFY_MATCHTYPE_V3": "COMFY_MATCHTYPE_V3",
     "CONDITIONING": "تكييف",
     "CONTROL_NET": "ControlNet",
-    "CURVE": "منحنى",
     "ELEVENLABS_VOICE": "ELEVENLABS_VOICE",
     "FILE_3D": "ملف ثلاثي الأبعاد",
     "FILE_3D_FBX": "ملف FBX ثلاثي الأبعاد",
@@ -794,7 +785,6 @@
     "GEMINI_INPUT_FILES": "ملفات إدخال جيميني",
     "GLIGEN": "GLIGEN",
     "GUIDER": "موجه",
-    "HISTOGRAM": "مخطط بياني",
     "HOOKS": "معالجات",
     "HOOK_KEYFRAMES": "مفاتيح المعالجات",
     "IMAGE": "صورة",
@@ -886,8 +876,6 @@
     "resume": "استئناف التنزيل"
   },
   "errorDialog": {
-    "accessRestrictedMessage": "Your account is not authorized for this feature.",
-    "accessRestrictedTitle": "Access Restricted",
     "defaultTitle": "حدث خطأ",
     "extensionFileHint": "قد يكون السبب هو السكربت التالي",
     "loadWorkflowTitle": "تم إلغاء التحميل بسبب خطأ في إعادة تحميل بيانات سير العمل",
@@ -936,19 +924,6 @@
     "textToImage": "تحويل نص إلى صورة",
     "textToVideo": "تحويل نص إلى فيديو"
   },
-  "execution": {
-    "decoding": "جارٍ فك الترميز…",
-    "encoding": "جارٍ الترميز…",
-    "generating": "جارٍ التوليد…",
-    "generatingVideo": "جارٍ توليد الفيديو…",
-    "loading": "جارٍ التحميل…",
-    "processing": "جارٍ المعالجة…",
-    "processingVideo": "جارٍ معالجة الفيديو…",
-    "resizing": "جارٍ تغيير الحجم…",
-    "running": "جارٍ التشغيل…",
-    "saving": "جارٍ الحفظ…",
-    "training": "جارٍ التدريب…"
-  },
   "exportToast": {
     "allExportsCompleted": "اكتملت جميع عمليات التصدير",
     "downloadExport": "تحميل التصدير",
@@ -1089,14 +1064,11 @@
     "filterBy": "تصفية حسب:",
     "filterByType": "تصفية حسب {type}...",
     "findIssues": "العثور على مشاكل",
-    "findOnGithub": "ابحث في GitHub",
     "frameNodes": "تأطير العقد",
     "frontendNewer": "إصدار الواجهة الأمامية {frontendVersion} قد لا يكون متوافقاً مع الإصدار الخلفي {backendVersion}.",
     "frontendOutdated": "إصدار الواجهة الأمامية {frontendVersion} قديم. يتطلب الإصدار الخلفي {requiredVersion} أو أحدث.",
-    "gallery": "المعرض",
     "galleryImage": "صورة المعرض",
     "galleryThumbnail": "صورة مصغرة للمعرض",
-    "getHelpAction": "الحصول على المساعدة",
     "goToNode": "الانتقال إلى العقدة",
     "graphNavigation": "التنقل في الرسم البياني",
     "halfSpeed": "0.5x",
@@ -1105,8 +1077,6 @@
     "icon": "أيقونة",
     "imageDoesNotExist": "الصورة غير موجودة",
     "imageFailedToLoad": "فشل تحميل الصورة",
-    "imageGallery": "معرض الصور",
-    "imageLightbox": "معاينة الصورة",
     "imagePreview": "معاينة الصورة - استخدم مفاتيح الأسهم للتنقل بين الصور",
     "imageUrl": "رابط الصورة",
     "import": "استيراد",
@@ -1120,38 +1090,13 @@
     "installed": "مثبت",
     "installing": "جارٍ التثبيت",
     "interrupted": "تمت المقاطعة",
+    "itemSelected": "تم تحديد عنصر واحد",
     "itemsCopiedToClipboard": "تم نسخ العناصر إلى الحافظة",
     "itemsSelected": "تم تحديد {selectedCount} عناصر",
     "job": "مهمة",
     "jobIdCopied": "تم نسخ معرف المهمة إلى الحافظة",
     "keybinding": "اختصار لوحة المفاتيح",
     "keybindingAlreadyExists": "الاختصار موجود بالفعل في",
-    "keybindingPresets": {
-      "default": "الإعداد المسبق الافتراضي",
-      "deletePreset": "حذف الإعداد المسبق",
-      "deletePresetFailed": "فشل في حذف الإعداد المسبق \"{name}\"",
-      "deletePresetTitle": "حذف الإعداد المسبق الحالي؟",
-      "deletePresetWarning": "سيتم حذف هذا الإعداد المسبق. لا يمكن التراجع عن ذلك.",
-      "discardAndSwitch": "تجاهل والانتقال",
-      "exportPreset": "تصدير الإعداد المسبق",
-      "importKeybindingPreset": "استيراد إعداد مفاتيح الاختصار",
-      "importPreset": "استيراد الإعداد المسبق",
-      "invalidPresetFile": "يجب أن يكون ملف الإعداد المسبق ملف JSON صالح تم تصديره من ComfyUI",
-      "invalidPresetName": "يجب ألا يكون اسم الإعداد المسبق فارغًا أو \"default\" أو يبدأ بنقطة أو يحتوي على فواصل مسار أو ينتهي بـ .json",
-      "loadPresetFailed": "فشل في تحميل الإعداد المسبق \"{name}\"",
-      "overwritePresetMessage": "يوجد إعداد مسبق باسم \"{name}\" بالفعل. هل تريد استبداله؟",
-      "overwritePresetTitle": "استبدال الإعداد المسبق",
-      "presetDeleted": "تم حذف الإعداد المسبق \"{name}\"",
-      "presetImported": "تم استيراد إعداد مفاتيح الاختصار",
-      "presetNamePrompt": "أدخل اسمًا للإعداد المسبق",
-      "presetSaved": "تم حفظ الإعداد المسبق \"{name}\"",
-      "resetToDefault": "إعادة التعيين إلى الافتراضي",
-      "saveAndSwitch": "حفظ والانتقال",
-      "saveAsNewPreset": "حفظ كإعداد مخصص جديد",
-      "saveChanges": "حفظ التغييرات",
-      "unsavedChangesMessage": "لديك تغييرات غير محفوظة ستفقد إذا انتقلت دون حفظ.",
-      "unsavedChangesTo": "تغييرات غير محفوظة على {name}"
-    },
     "keybindings": "اختصارات لوحة المفاتيح",
     "learnMore": "اعرف المزيد",
     "listening": "جاري الاستماع...",
@@ -1208,8 +1153,6 @@
     "output": "إخراج",
     "overwrite": "الكتابة فوق",
     "partner": "شريك",
-    "pause": "إيقاف مؤقت",
-    "play": "تشغيل",
     "playPause": "تشغيل/إيقاف مؤقت",
     "playRecording": "تشغيل التسجيل",
     "playbackSpeed": "سرعة التشغيل",
@@ -1217,7 +1160,6 @@
     "preloadError": "فشل تحميل مورد مطلوب. يرجى إعادة تحميل الصفحة.",
     "preloadErrorTitle": "خطأ في التحميل",
     "preview": "معاينة",
-    "previous": "السابق",
     "previousImage": "الصورة السابقة",
     "profile": "الملف الشخصي",
     "progressCountOf": "من",
@@ -1292,8 +1234,6 @@
     "showReport": "عرض التقرير",
     "showRightPanel": "إظهار اللوحة اليمنى",
     "singleSelectDropdown": "قائمة منسدلة اختيار واحد",
-    "skipToEnd": "الانتقال للنهاية",
-    "skipToStart": "الانتقال للبداية",
     "sort": "فرز",
     "source": "المصدر",
     "startRecording": "بدء التسجيل",
@@ -1325,7 +1265,6 @@
     "versionMismatchWarningMessage": "{warning}: {detail} زر https://docs.comfy.org/installation/update_comfyui#common-update-issues للحصول على تعليمات التحديث.",
     "videoFailedToLoad": "فشل تحميل الفيديو",
     "videoPreview": "معاينة الفيديو - استخدم مفاتيح الأسهم للتنقل بين الفيديوهات",
-    "viewGrid": "عرض الشبكة",
     "viewImageOfTotal": "عرض الصورة {index} من {total}",
     "viewVideoOfTotal": "عرض الفيديو {index} من {total}",
     "volume": "مستوى الصوت",
@@ -1893,7 +1832,6 @@
     "mirrorVertical": "انعكاس عمودي",
     "negative": "سلبي",
     "opacity": "الشفافية",
-    "openMaskEditor": "فتح في محرر القناع",
     "paintBucketSettings": "إعدادات دلو الطلاء",
     "paintLayer": "طبقة الطلاء",
     "redo": "إعادة",
@@ -2208,7 +2146,6 @@
     "Moonvalley Marey": "مون فالي ماري",
     "OpenAI": "OpenAI",
     "PixVerse": "PixVerse",
-    "Quiver": "Quiver",
     "Recraft": "Recraft",
     "Reve": "Reve",
     "Rodin": "رودان",
@@ -2484,8 +2421,6 @@
     "favoritesNoneDesc": "ستظهر المدخلات التي تضعها في المفضلة هنا",
     "favoritesNoneHint": "في علامة تبويب المعلمات، انقر على {moreIcon} بجانب أي إدخال لإضافته هنا",
     "favoritesNoneTooltip": "قم بوضع نجمة على الأدوات للوصول السريع إليها دون اختيار العقد",
-    "findOnGithubTooltip": "ابحث في مشكلات GitHub عن مشاكل مشابهة",
-    "getHelpTooltip": "أبلغ عن هذا الخطأ وسنساعدك في حله",
     "globalSettings": {
       "canvas": "اللوحة",
       "connectionLinks": "روابط الاتصال",
@@ -3167,7 +3102,6 @@
     },
     "gpuLabel": "RTX 6000 Pro (ذاكرة 96GB VRAM)",
     "haveQuestions": "هل لديك أسئلة أو ترغب في معرفة المزيد عن المؤسسات؟",
-    "inviteUpTo": "ادعُ حتى",
     "invoiceHistory": "سجل الفواتير",
     "learnMore": "معرفة المزيد",
     "managePayment": "إدارة الدفع",
@@ -3193,16 +3127,13 @@
     "monthlyCreditsPerMemberLabel": "الرصيد الشهري / عضو",
     "monthlyCreditsRollover": "سيتم ترحيل هذا الرصيد إلى الشهر التالي",
     "mostPopular": "الأكثر شيوعًا",
-    "needTeamWorkspace": "هل تحتاج إلى مساحة عمل للفريق؟",
     "nextBillingCycle": "دورة الفوترة التالية",
     "nextMonthInvoice": "فاتورة الشهر القادم",
     "partnerNodesBalance": "رصيد \"عُقَد الشريك\"",
     "partnerNodesCredits": "رصيد العقد الشريكة",
     "partnerNodesDescription": "لتشغيل النماذج التجارية/المملوكة",
     "perMonth": "دولار أمريكي / شهر",
-    "personalWorkspace": "مساحة العمل الشخصية",
     "plansAndPricing": "الخطط والأسعار",
-    "plansForWorkspace": "الخطط لمساحة العمل {workspace}",
     "prepaidCreditsInfo": "رصيد تم شراؤه بشكل منفصل ولا ينتهي صلاحيته",
     "prepaidDescription": "رصيد مسبق الدفع",
     "preview": {
@@ -3238,7 +3169,6 @@
     "resubscribe": "إعادة الاشتراك",
     "resubscribeSuccess": "تمت إعادة تفعيل الاشتراك بنجاح",
     "resubscribeTo": "إعادة الاشتراك في {plan}",
-    "soloUseOnly": "للاستخدام الفردي فقط",
     "subscribeForMore": "ترقية",
     "subscribeNow": "اشترك الآن",
     "subscribeTo": "اشترك في {plan}",
@@ -3246,7 +3176,6 @@
     "subscribeToRun": "اشتراك",
     "subscribeToRunFull": "الاشتراك للتشغيل",
     "subscriptionRequiredMessage": "الاشتراك مطلوب للأعضاء لتشغيل سير العمل على السحابة",
-    "teamWorkspace": "مساحة عمل الفريق",
     "tierNameYearly": "{name} سنوي",
     "tiers": {
       "creator": {
@@ -3298,18 +3227,6 @@
     "duplicateTab": "تكرار التبويب",
     "removeFromBookmarks": "إزالة من العلامات"
   },
-  "teamWorkspacesDialog": {
-    "confirmCallbackFailed": "تم إنشاء مساحة العمل لكن الإعداد غير مكتمل",
-    "createWorkspace": "إنشاء مساحة عمل",
-    "namePlaceholder": "مثال: فريق التسويق",
-    "nameValidationError": "يجب أن يكون الاسم من ١ إلى ٥٠ حرفًا باستخدام الحروف أو الأرقام أو المسافات أو علامات الترقيم الشائعة.",
-    "newWorkspace": "مساحة عمل جديدة",
-    "subtitle": "انتقل إلى مساحة عمل موجودة أو أنشئ مساحة عمل جديدة",
-    "subtitleNoWorkspaces": "أنشئ مساحة عمل فريق جديدة لمشاركة الرصيد",
-    "switch": "تبديل",
-    "title": "مساحات عمل الفريق",
-    "yourTeamWorkspaces": "مساحات عمل فريقك"
-  },
   "templateWidgets": {
     "sort": {
       "searchPlaceholder": "بحث..."
@@ -3696,7 +3613,6 @@
   },
   "workspaceSwitcher": {
     "createWorkspace": "إنشاء مساحة عمل جديدة",
-    "failedToSwitch": "فشل في تبديل مساحة العمل",
     "maxWorkspacesReached": "يمكنك امتلاك ١٠ مساحات عمل فقط. احذف واحدة لإنشاء مساحة جديدة.",
     "personal": "شخصي",
     "roleMember": "عضو",

src/locales/ar/nodeDefs.json

@@ -1438,22 +1438,6 @@
       }
     }
   },
-  "ComfyNumberConvert": {
-    "display_name": "تحويل الرقم",
-    "inputs": {
-      "value": {
-        "name": "القيمة"
-      }
-    },
-    "outputs": {
-      "0": {
-        "tooltip": null
-      },
-      "1": {
-        "tooltip": null
-      }
-    }
-  },
   "ComfySwitchNode": {
     "display_name": "مفتاح التحويل",
     "inputs": {
@@ -1752,10 +1736,6 @@
         "name": "closed_loop",
         "tooltip": "ما إذا كان سيتم إغلاق حلقة نافذة السياق؛ تنطبق فقط على الجداول الحلقية."
       },
-      "cond_retain_index_list": {
-        "name": "cond_retain_index_list",
-        "tooltip": "قائمة مؤشرات latent التي سيتم الاحتفاظ بها في موترات التكييف لكل نافذة. على سبيل المثال، تعيين هذه القيمة إلى '0' سيستخدم صورة البداية الأولية لكل نافذة."
-      },
       "context_length": {
         "name": "context_length",
         "tooltip": "طول نافذة السياق."
@@ -1787,10 +1767,6 @@
       "model": {
         "name": "model",
         "tooltip": "النموذج المراد تطبيق نوافذ السياق عليه أثناء أخذ العينات."
-      },
-      "split_conds_to_windows": {
-        "name": "split_conds_to_windows",
-        "tooltip": "هل تريد تقسيم التكييفات المتعددة (التي تم إنشاؤها بواسطة ConditionCombine) إلى كل نافذة بناءً على مؤشر المنطقة."
       }
     },
     "outputs": {
@@ -2234,23 +2210,6 @@
       }
     }
   },
-  "CurveEditor": {
-    "display_name": "محرر المنحنى",
-    "inputs": {
-      "curve": {
-        "name": "منحنى"
-      },
-      "histogram": {
-        "name": "مخطط بياني"
-      }
-    },
-    "outputs": {
-      "0": {
-        "name": "منحنى",
-        "tooltip": null
-      }
-    }
-  },
   "CustomCombo": {
     "display_name": "توليفة مخصصة",
     "inputs": {
@@ -3856,10 +3815,6 @@
       },
       "1": {
         "tooltip": null
-      },
-      "2": {
-        "name": "thought_image",
-        "tooltip": "الصورة الأولى من عملية تفكير النموذج. متوفرة فقط عند مستوى التفكير العالي ونمط IMAGE+TEXT."
       }
     }
   },
@@ -4125,39 +4080,6 @@
       }
     }
   },
-  "GrokVideoExtendNode": {
-    "description": "تمديد فيديو موجود باستمرار سلس بناءً على وصف نصي.",
-    "display_name": "تمديد فيديو Grok",
-    "inputs": {
-      "control_after_generate": {
-        "name": "التحكم بعد التوليد"
-      },
-      "model": {
-        "name": "النموذج",
-        "tooltip": "النموذج المستخدم لتمديد الفيديو."
-      },
-      "model_duration": {
-        "name": "المدة"
-      },
-      "prompt": {
-        "name": "الوصف النصي",
-        "tooltip": "وصف نصي لما يجب أن يحدث بعد ذلك في الفيديو."
-      },
-      "seed": {
-        "name": "البذرة",
-        "tooltip": "بذرة لتحديد ما إذا كان يجب إعادة تشغيل العقدة؛ النتائج الفعلية غير حتمية بغض النظر عن البذرة."
-      },
-      "video": {
-        "name": "فيديو",
-        "tooltip": "الفيديو المصدر للتمديد. صيغة MP4، من ٢ إلى ١٥ ثانية."
-      }
-    },
-    "outputs": {
-      "0": {
-        "tooltip": null
-      }
-    }
-  },
   "GrokVideoNode": {
     "description": "توليد فيديو من مطالبة أو صورة",
     "display_name": "فيديو Grok",
@@ -4198,41 +4120,6 @@
       }
     }
   },
-  "GrokVideoReferenceNode": {
-    "description": "توليد فيديو موجه بواسطة صور مرجعية كمرجع للأسلوب والمحتوى.",
-    "display_name": "Grok من مرجع إلى فيديو",
-    "inputs": {
-      "control_after_generate": {
-        "name": "التحكم بعد التوليد"
-      },
-      "model": {
-        "name": "النموذج",
-        "tooltip": "النموذج المستخدم لتوليد الفيديو."
-      },
-      "model_aspect_ratio": {
-        "name": "نسبة العرض إلى الارتفاع"
-      },
-      "model_duration": {
-        "name": "المدة"
-      },
-      "model_resolution": {
-        "name": "الدقة"
-      },
-      "prompt": {
-        "name": "الوصف النصي",
-        "tooltip": "وصف نصي للفيديو المطلوب."
-      },
-      "seed": {
-        "name": "البذرة",
-        "tooltip": "بذرة لتحديد ما إذا كان يجب إعادة تشغيل العقدة؛ النتائج الفعلية غير حتمية بغض النظر عن البذرة."
-      }
-    },
-    "outputs": {
-      "0": {
-        "tooltip": null
-      }
-    }
-  },
   "GrowMask": {
     "display_name": "توسيع القناع",
     "inputs": {
@@ -6849,54 +6736,6 @@
       }
     }
   },
-  "LTXVReferenceAudio": {
-    "description": "تعيين صوت مرجعي لنقل هوية المتحدث باستخدام ID-LoRA. يقوم بترميز مقطع صوتي مرجعي إلى التكييف، ويمكنه أيضًا تعديل النموذج بتوجيه الهوية (تمرير إضافي للأمام بدون المرجع، مما يعزز تأثير هوية المتحدث).",
-    "display_name": "LTXV مرجع الصوت (ID-LoRA)",
-    "inputs": {
-      "audio_vae": {
-        "name": "audio_vae",
-        "tooltip": "LTXV Audio VAE للترميز."
-      },
-      "end_percent": {
-        "name": "نسبة النهاية",
-        "tooltip": "نهاية نطاق سيغما حيث يكون توجيه الهوية نشطًا."
-      },
-      "identity_guidance_scale": {
-        "name": "مقياس توجيه الهوية",
-        "tooltip": "قوة توجيه الهوية. ينفذ تمريرًا إضافيًا للأمام بدون المرجع في كل خطوة لتعزيز هوية المتحدث. اضبط على ٠ للتعطيل (بدون تمرير إضافي)."
-      },
-      "model": {
-        "name": "النموذج"
-      },
-      "negative": {
-        "name": "سلبي"
-      },
-      "positive": {
-        "name": "إيجابي"
-      },
-      "reference_audio": {
-        "name": "الصوت_المرجعي",
-        "tooltip": "مقطع صوتي مرجعي لنقل هوية المتحدث. يُوصى بأن يكون حوالي ٥ ثوانٍ (مدة التدريب). المقاطع الأقصر أو الأطول قد تؤثر سلبًا على نقل هوية الصوت."
-      },
-      "start_percent": {
-        "name": "نسبة البداية",
-        "tooltip": "بداية نطاق سيغما حيث يكون توجيه الهوية نشطًا."
-      }
-    },
-    "outputs": {
-      "0": {
-        "tooltip": null
-      },
-      "1": {
-        "name": "إيجابي",
-        "tooltip": null
-      },
-      "2": {
-        "name": "سلبي",
-        "tooltip": null
-      }
-    }
-  },
   "LTXVScheduler": {
     "display_name": "LTXV المجدول",
     "inputs": {
@@ -12110,91 +11949,6 @@
       }
     }
   },
-  "QuiverImageToSVGNode": {
-    "description": "تحويل صورة نقطية إلى SVG باستخدام Quiver AI.",
-    "display_name": "Quiver تحويل صورة إلى SVG",
-    "inputs": {
-      "auto_crop": {
-        "name": "auto_crop",
-        "tooltip": "قص تلقائي للعنصر الرئيسي في الصورة."
-      },
-      "control_after_generate": {
-        "name": "control after generate"
-      },
-      "image": {
-        "name": "image",
-        "tooltip": "الصورة المدخلة لتحويلها إلى متجهات."
-      },
-      "model": {
-        "name": "model",
-        "tooltip": "النموذج المستخدم لتحويل الصورة إلى SVG."
-      },
-      "model_presence_penalty": {
-        "name": "presence_penalty"
-      },
-      "model_target_size": {
-        "name": "target_size"
-      },
-      "model_temperature": {
-        "name": "temperature"
-      },
-      "model_top_p": {
-        "name": "top_p"
-      },
-      "seed": {
-        "name": "seed",
-        "tooltip": "البذرة لتحديد ما إذا كان يجب إعادة تشغيل العقدة؛ النتائج الفعلية غير حتمية بغض النظر عن البذرة."
-      }
-    },
-    "outputs": {
-      "0": {
-        "tooltip": null
-      }
-    }
-  },
-  "QuiverTextToSVGNode": {
-    "description": "إنشاء SVG من وصف نصي باستخدام Quiver AI.",
-    "display_name": "Quiver تحويل نص إلى SVG",
-    "inputs": {
-      "control_after_generate": {
-        "name": "control after generate"
-      },
-      "instructions": {
-        "name": "instructions",
-        "tooltip": "إرشادات إضافية حول الأسلوب أو التنسيق."
-      },
-      "model": {
-        "name": "model",
-        "tooltip": "النموذج المستخدم لإنشاء SVG."
-      },
-      "model_presence_penalty": {
-        "name": "presence_penalty"
-      },
-      "model_temperature": {
-        "name": "temperature"
-      },
-      "model_top_p": {
-        "name": "top_p"
-      },
-      "prompt": {
-        "name": "prompt",
-        "tooltip": "وصف نصي لمخرجات SVG المطلوبة."
-      },
-      "reference_images": {
-        "name": "reference_images",
-        "tooltip": "حتى ٤ صور مرجعية لتوجيه عملية الإنشاء."
-      },
-      "seed": {
-        "name": "seed",
-        "tooltip": "البذرة لتحديد ما إذا كان يجب إعادة تشغيل العقدة؛ النتائج الفعلية غير حتمية بغض النظر عن البذرة."
-      }
-    },
-    "outputs": {
-      "0": {
-        "tooltip": null
-      }
-    }
-  },
   "QwenImageDiffsynthControlnet": {
     "display_name": "QwenImageDiffsynthControlnet",
     "inputs": {

src/locales/ar/settings.json

@@ -25,10 +25,6 @@
     },
     "tooltip": "مخصص: استبدال شريط عنوان النظام بالقائمة العلوية لـ ComfyUI"
   },
-  "Comfy_Appearance_DisableAnimations": {
-    "name": "تعطيل الرسوم المتحركة",
-    "tooltip": "يقوم بإيقاف معظم الرسوم المتحركة والانتقالات في CSS. يسرّع الاستدلال عندما يتم استخدام وحدة معالجة الرسوميات للعرض أيضًا في التوليد."
-  },
   "Comfy_Canvas_BackgroundImage": {
     "name": "صورة خلفية اللوحة",
     "tooltip": "رابط صورة لخلفية اللوحة. يمكنك النقر بزر الفأرة الأيمن على صورة في لوحة النتائج واختيار \"تعيين كخلفية\" لاستخدامها، أو رفع صورتك الخاصة باستخدام زر الرفع."
@@ -99,10 +95,6 @@
     "name": "عدد أرقام التقريب العشرية لأدوات التحكم العائمة [0 = تلقائي]",
     "tooltip": "(يتطلب إعادة تحميل الصفحة)"
   },
-  "Comfy_Graph_AutoPanSpeed": {
-    "name": "سرعة التحريك التلقائي",
-    "tooltip": "السرعة القصوى عند التحريك التلقائي بسحب المؤشر إلى حافة اللوحة. اضبطها على 0 لتعطيل التحريك التلقائي."
-  },
   "Comfy_Graph_CanvasInfo": {
     "name": "عرض معلومات اللوحة في الزاوية السفلى اليسرى (الإطارات في الثانية، إلخ)"
   },
@@ -462,6 +454,9 @@
   "Comfy_Workflow_ShowMissingModelsWarning": {
     "name": "عرض تحذير النماذج المفقودة"
   },
+  "Comfy_Workflow_ShowMissingNodesWarning": {
+    "name": "عرض تحذير العقد المفقودة"
+  },
   "Comfy_Workflow_SortNodeIdOnSave": {
     "name": "ترتيب معرفات العقد عند حفظ سير العمل"
   },