[automated] Update test expectations

Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>

.github/actions/upsert-comment-section/action.yaml

@@ -1,22 +1,21 @@
 name: Upsert Comment Section
 description: >
   Manage a consolidated PR comment with independently-updatable sections.
-  Multiple CI workflows can share the same comment by using the same
-  comment-marker and different section-names. Each workflow upserts only
-  its own section, leaving other sections intact.
+  All website CI workflows share the marker <!-- WEBSITE_CI_REPORT -->.
+  Valid section names: "e2e", "preview", "screenshot-update".
 
 inputs:
   pr-number:
     description: PR number to comment on
     required: true
   section-name:
-    description: 'Section identifier (e.g. "playwright", "storybook", "e2e", "preview")'
+    description: 'Section identifier: "e2e", "preview", or "screenshot-update"'
     required: true
   section-content:
     description: Markdown content for this section
     required: true
   comment-marker:
-    description: Top-level HTML comment marker shared by all sections in this comment
+    description: Top-level HTML comment marker (must be <!-- WEBSITE_CI_REPORT --> for all callers)
     required: true
   token:
     description: GitHub token with pull-requests write permission
@@ -39,10 +38,6 @@ runs:
           const sectionContent = process.env.INPUT_SECTION_CONTENT
           const commentMarker = process.env.INPUT_COMMENT_MARKER
 
-          if (!/^[a-z0-9-]+$/.test(sectionName)) {
-            throw new Error(`Invalid section-name: ${sectionName}`)
-          }
-
           const sectionStart = `<!-- section:${sectionName}:start -->`
           const sectionEnd = `<!-- section:${sectionName}:end -->`
           const sectionBlock = `${sectionStart}\n${sectionContent}\n${sectionEnd}`

.github/workflows/ci-dist-telemetry-scan.yaml

@@ -109,27 +109,3 @@ jobs:
             exit 1
           fi
           echo '✅ No PostHog references found'
-
-      - name: Scan dist for Customer.io telemetry references
-        run: |
-          set -euo pipefail
-          echo '🔍 Scanning for Customer.io references...'
-          if rg --no-ignore -n \
-            -g '*.html' \
-            -g '*.js' \
-            -e 'CustomerIoTelemetryProvider' \
-            -e '@customerio/cdp-analytics-browser' \
-            -e 'customerio-gist-web' \
-            -e '(?i)cdp\.customer\.io' \
-            -e 'Comfy\.CustomerIo' \
-            dist; then
-            echo '❌ ERROR: Customer.io references found in dist assets!'
-            echo 'Customer.io must be properly tree-shaken from OSS builds.'
-            echo ''
-            echo 'To fix this:'
-            echo '1. Use the TelemetryProvider pattern (see src/platform/telemetry/)'
-            echo '2. Call telemetry via useTelemetry() hook'
-            echo '3. Use conditional dynamic imports behind isCloud checks'
-            exit 1
-          fi
-          echo '✅ No Customer.io references found'

.github/workflows/ci-tests-e2e-forks.yaml

@@ -38,15 +38,16 @@ jobs:
         id: pr
         uses: ./.github/actions/resolve-pr-from-workflow-run
 
-      - name: Handle Test Start — upsert playwright starting section
+      - name: Handle Test Start
         if: steps.pr.outputs.skip != 'true' && github.event.action == 'requested'
-        uses: ./.github/actions/upsert-comment-section
-        with:
-          pr-number: ${{ steps.pr.outputs.number }}
-          section-name: playwright
-          section-content: '## 🎭 Playwright: ⏳ Running...'
-          comment-marker: '<!-- COMFYUI_FRONTEND_PR_REPORT -->'
-          token: ${{ github.token }}
+        env:
+          GITHUB_TOKEN: ${{ github.token }}
+        run: |
+          chmod +x scripts/cicd/pr-playwright-deploy-and-comment.sh
+          ./scripts/cicd/pr-playwright-deploy-and-comment.sh \
+            "${{ steps.pr.outputs.number }}" \
+            "${{ github.event.workflow_run.head_branch }}" \
+            "starting"
 
       - name: Download and Deploy Reports
         if: steps.pr.outputs.skip != 'true' && github.event.action == 'completed'
@@ -58,15 +59,13 @@ jobs:
           path: reports
           if_no_artifact_found: warn
 
-      - name: Handle Test Completion — deploy and generate section
+      - name: Handle Test Completion
         if: steps.pr.outputs.skip != 'true' && github.event.action == 'completed' && hashFiles('reports/**') != ''
         env:
           CLOUDFLARE_API_TOKEN: ${{ secrets.CLOUDFLARE_API_TOKEN }}
           CLOUDFLARE_ACCOUNT_ID: ${{ secrets.CLOUDFLARE_ACCOUNT_ID }}
           GITHUB_TOKEN: ${{ github.token }}
           GITHUB_SHA: ${{ github.event.workflow_run.head_sha }}
-          SUMMARY_FILE: playwright-section.md
-          BRANCH_NAME: ${{ github.event.workflow_run.head_branch }}
         run: |
           # Rename merged report if exists
           [ -d "reports/playwright-report-chromium-merged" ] && \
@@ -75,22 +74,5 @@ jobs:
           chmod +x scripts/cicd/pr-playwright-deploy-and-comment.sh
           ./scripts/cicd/pr-playwright-deploy-and-comment.sh \
             "${{ steps.pr.outputs.number }}" \
-            "$BRANCH_NAME" \
+            "${{ github.event.workflow_run.head_branch }}" \
             "completed"
-
-      - name: Read playwright section
-        id: section
-        if: steps.pr.outputs.skip != 'true' && github.event.action == 'completed' && hashFiles('playwright-section.md') != ''
-        uses: juliangruber/read-file-action@b549046febe0fe86f8cb4f93c24e284433f9ab58 # v1.1.7
-        with:
-          path: playwright-section.md
-
-      - name: Upsert playwright section into unified report
-        if: steps.pr.outputs.skip != 'true' && github.event.action == 'completed' && steps.section.outputs.content != ''
-        uses: ./.github/actions/upsert-comment-section
-        with:
-          pr-number: ${{ steps.pr.outputs.number }}
-          section-name: playwright
-          section-content: ${{ steps.section.outputs.content }}
-          comment-marker: '<!-- COMFYUI_FRONTEND_PR_REPORT -->'
-          token: ${{ github.token }}

.github/workflows/ci-tests-e2e.yaml

@@ -224,7 +224,7 @@ jobs:
   # when using pull_request event, we have permission to comment directly
   # if its a forked repo, we need to use workflow_run event in a separate workflow (pr-playwright-deploy.yaml)
 
-  # Post starting section into the unified PR report comment for non-forked PRs
+  # Post starting comment for non-forked PRs
   comment-on-pr-start:
     needs: changes
     runs-on: ubuntu-latest
@@ -240,16 +240,17 @@ jobs:
       - name: Checkout repository
         uses: actions/checkout@v6
 
-      - name: Upsert playwright starting section into unified report
-        uses: ./.github/actions/upsert-comment-section
-        with:
-          pr-number: ${{ github.event.pull_request.number }}
-          section-name: playwright
-          section-content: '## 🎭 Playwright: ⏳ Running...'
-          comment-marker: '<!-- COMFYUI_FRONTEND_PR_REPORT -->'
-          token: ${{ github.token }}
+      - name: Post starting comment
+        env:
+          GITHUB_TOKEN: ${{ github.token }}
+        run: |
+          chmod +x scripts/cicd/pr-playwright-deploy-and-comment.sh
+          ./scripts/cicd/pr-playwright-deploy-and-comment.sh \
+            "${{ github.event.pull_request.number }}" \
+            "${{ github.head_ref }}" \
+            "starting"
 
-  # Deploy and upsert final playwright section for non-forked PRs only
+  # Deploy and comment for non-forked PRs only
   deploy-and-comment:
     needs: [changes, playwright-tests, merge-reports]
     runs-on: ubuntu-latest
@@ -273,34 +274,15 @@ jobs:
           pattern: playwright-report-*
           path: reports
 
-      - name: Deploy reports and generate section
+      - name: Deploy reports and comment on PR
         env:
           CLOUDFLARE_API_TOKEN: ${{ secrets.CLOUDFLARE_API_TOKEN }}
           CLOUDFLARE_ACCOUNT_ID: ${{ secrets.CLOUDFLARE_ACCOUNT_ID }}
           GITHUB_TOKEN: ${{ github.token }}
           GITHUB_SHA: ${{ github.event.pull_request.head.sha }}
-          SUMMARY_FILE: playwright-section.md
-          BRANCH_NAME: ${{ github.head_ref }}
         run: |
           bash ./scripts/cicd/pr-playwright-deploy-and-comment.sh \
             "${{ github.event.pull_request.number }}" \
-            "$BRANCH_NAME" \
+            "${{ github.head_ref }}" \
             "completed"
-
-      - name: Read playwright section
-        id: section
-        if: ${{ !cancelled() && hashFiles('playwright-section.md') != '' }}
-        uses: juliangruber/read-file-action@b549046febe0fe86f8cb4f93c24e284433f9ab58 # v1.1.7
-        with:
-          path: playwright-section.md
-
-      - name: Upsert playwright section into unified report
-        if: ${{ !cancelled() && steps.section.outputs.content != '' }}
-        uses: ./.github/actions/upsert-comment-section
-        with:
-          pr-number: ${{ github.event.pull_request.number }}
-          section-name: playwright
-          section-content: ${{ steps.section.outputs.content }}
-          comment-marker: '<!-- COMFYUI_FRONTEND_PR_REPORT -->'
-          token: ${{ github.token }}
   #### END Deployment and commenting (non-forked PRs only)

.github/workflows/ci-tests-storybook-forks.yaml

@@ -38,15 +38,16 @@ jobs:
         id: pr
         uses: ./.github/actions/resolve-pr-from-workflow-run
 
-      - name: Handle Storybook Start — upsert storybook starting section
+      - name: Handle Storybook Start
         if: steps.pr.outputs.skip != 'true' && github.event.action == 'requested'
-        uses: ./.github/actions/upsert-comment-section
-        with:
-          pr-number: ${{ steps.pr.outputs.number }}
-          section-name: storybook
-          section-content: '## 🎨 Storybook: 🚧 Building...'
-          comment-marker: '<!-- COMFYUI_FRONTEND_PR_REPORT -->'
-          token: ${{ github.token }}
+        env:
+          GITHUB_TOKEN: ${{ github.token }}
+        run: |
+          chmod +x scripts/cicd/pr-storybook-deploy-and-comment.sh
+          ./scripts/cicd/pr-storybook-deploy-and-comment.sh \
+            "${{ steps.pr.outputs.number }}" \
+            "${{ github.event.workflow_run.head_branch }}" \
+            "starting"
 
       - name: Download and Deploy Storybook
         if: steps.pr.outputs.skip != 'true' && github.event.action == 'completed' && github.event.workflow_run.conclusion == 'success'
@@ -57,7 +58,7 @@ jobs:
           name: storybook-static
           path: storybook-static
 
-      - name: Handle Storybook Completion — deploy and generate section
+      - name: Handle Storybook Completion
         if: steps.pr.outputs.skip != 'true' && github.event.action == 'completed'
         env:
           CLOUDFLARE_API_TOKEN: ${{ secrets.CLOUDFLARE_API_TOKEN }}
@@ -65,28 +66,9 @@ jobs:
           GITHUB_TOKEN: ${{ github.token }}
           WORKFLOW_CONCLUSION: ${{ github.event.workflow_run.conclusion }}
           WORKFLOW_URL: ${{ github.event.workflow_run.html_url }}
-          SUMMARY_FILE: storybook-section.md
-          BRANCH_NAME: ${{ github.event.workflow_run.head_branch }}
         run: |
           chmod +x scripts/cicd/pr-storybook-deploy-and-comment.sh
           ./scripts/cicd/pr-storybook-deploy-and-comment.sh \
             "${{ steps.pr.outputs.number }}" \
-            "$BRANCH_NAME" \
+            "${{ github.event.workflow_run.head_branch }}" \
             "completed"
-
-      - name: Read storybook section
-        id: section
-        if: steps.pr.outputs.skip != 'true' && github.event.action == 'completed' && hashFiles('storybook-section.md') != ''
-        uses: juliangruber/read-file-action@b549046febe0fe86f8cb4f93c24e284433f9ab58 # v1.1.7
-        with:
-          path: storybook-section.md
-
-      - name: Upsert storybook section into unified report
-        if: steps.pr.outputs.skip != 'true' && github.event.action == 'completed' && steps.section.outputs.content != ''
-        uses: ./.github/actions/upsert-comment-section
-        with:
-          pr-number: ${{ steps.pr.outputs.number }}
-          section-name: storybook
-          section-content: ${{ steps.section.outputs.content }}
-          comment-marker: '<!-- COMFYUI_FRONTEND_PR_REPORT -->'
-          token: ${{ github.token }}

.github/workflows/ci-tests-storybook.yaml

@@ -37,14 +37,15 @@ jobs:
       - name: Checkout repository
         uses: actions/checkout@v6
 
-      - name: Upsert storybook starting section into unified report
-        uses: ./.github/actions/upsert-comment-section
-        with:
-          pr-number: ${{ github.event.pull_request.number }}
-          section-name: storybook
-          section-content: '## 🎨 Storybook: 🚧 Building...'
-          comment-marker: '<!-- COMFYUI_FRONTEND_PR_REPORT -->'
-          token: ${{ github.token }}
+      - name: Post starting comment
+        env:
+          GITHUB_TOKEN: ${{ github.token }}
+        run: |
+          chmod +x scripts/cicd/pr-storybook-deploy-and-comment.sh
+          ./scripts/cicd/pr-storybook-deploy-and-comment.sh \
+            "${{ github.event.pull_request.number }}" \
+            "${{ github.head_ref }}" \
+            "starting"
 
   # Build Storybook for all PRs (free Cloudflare deployment)
   storybook-build:
@@ -163,38 +164,19 @@ jobs:
       - name: Make deployment script executable
         run: chmod +x scripts/cicd/pr-storybook-deploy-and-comment.sh
 
-      - name: Deploy Storybook and generate section
+      - name: Deploy Storybook and comment on PR
         env:
           CLOUDFLARE_API_TOKEN: ${{ secrets.CLOUDFLARE_API_TOKEN }}
           CLOUDFLARE_ACCOUNT_ID: ${{ secrets.CLOUDFLARE_ACCOUNT_ID }}
           GITHUB_TOKEN: ${{ github.token }}
           WORKFLOW_CONCLUSION: ${{ needs.storybook-build.outputs.conclusion }}
           WORKFLOW_URL: ${{ needs.storybook-build.outputs.workflow-url }}
-          SUMMARY_FILE: storybook-section.md
-          BRANCH_NAME: ${{ github.head_ref }}
         run: |
           ./scripts/cicd/pr-storybook-deploy-and-comment.sh \
             "${{ github.event.pull_request.number }}" \
-            "$BRANCH_NAME" \
+            "${{ github.head_ref }}" \
             "completed"
 
-      - name: Read storybook section
-        id: section
-        if: hashFiles('storybook-section.md') != ''
-        uses: juliangruber/read-file-action@b549046febe0fe86f8cb4f93c24e284433f9ab58 # v1.1.7
-        with:
-          path: storybook-section.md
-
-      - name: Upsert storybook section into unified report
-        if: steps.section.outputs.content != ''
-        uses: ./.github/actions/upsert-comment-section
-        with:
-          pr-number: ${{ github.event.pull_request.number }}
-          section-name: storybook
-          section-content: ${{ steps.section.outputs.content }}
-          comment-marker: '<!-- COMFYUI_FRONTEND_PR_REPORT -->'
-          token: ${{ github.token }}
-
   # Deploy Storybook to production URL on main branch push
   deploy-production:
     runs-on: ubuntu-latest
@@ -226,17 +208,35 @@ jobs:
     permissions:
       pull-requests: write
     steps:
-      - name: Checkout repository
-        uses: actions/checkout@v6
-
-      - name: Upsert Chromatic section into unified report
-        uses: ./.github/actions/upsert-comment-section
+      - name: Update comment with Chromatic URLs
+        uses: actions/github-script@v8
         with:
-          pr-number: ${{ github.event.pull_request.number }}
-          section-name: chromatic
-          section-content: |
-            ### 🎨 Chromatic Visual Tests
-            - 📊 [View Chromatic Build](${{ needs.chromatic-deployment.outputs.chromatic-build-url }})
-            - 📚 [View Chromatic Storybook](${{ needs.chromatic-deployment.outputs.chromatic-storybook-url }})
-          comment-marker: '<!-- COMFYUI_FRONTEND_PR_REPORT -->'
-          token: ${{ github.token }}
+          script: |
+            const buildUrl = '${{ needs.chromatic-deployment.outputs.chromatic-build-url }}';
+            const storybookUrl = '${{ needs.chromatic-deployment.outputs.chromatic-storybook-url }}';
+
+            // Find the existing Storybook comment
+            const { data: comments } = await github.rest.issues.listComments({
+              owner: context.repo.owner,
+              repo: context.repo.repo,
+              issue_number: ${{ github.event.pull_request.number }}
+            });
+
+            const storybookComment = comments.find(comment =>
+              comment.body.includes('<!-- STORYBOOK_BUILD_STATUS -->')
+            );
+
+            if (storybookComment && buildUrl && storybookUrl) {
+              // Append Chromatic info to existing comment
+              const updatedBody = storybookComment.body.replace(
+                /---\n(.*)$/s,
+                `---\n### 🎨 Chromatic Visual Tests\n- 📊 [View Chromatic Build](${buildUrl})\n- 📚 [View Chromatic Storybook](${storybookUrl})\n\n$1`
+              );
+
+              await github.rest.issues.updateComment({
+                owner: context.repo.owner,
+                repo: context.repo.repo,
+                comment_id: storybookComment.id,
+                body: updatedBody
+              });
+            }

.github/workflows/pr-cursor-review.yaml

@@ -1,55 +0,0 @@
-# Description: Team-gated multi-model Cursor review — a thin caller for the
-# reusable workflow in Comfy-Org/github-workflows, which is the single source of
-# truth for the panel, judge, prompts, and scripts. Triggered by the
-# 'cursor-review' label.
-#
-# Access control (team-only, two layers):
-#   1. Only users with triage permission or higher can apply a label in a public
-#      repo, so the public cannot trigger this.
-#   2. The reusable workflow's secret-bearing jobs do not run on fork PRs (forks
-#      get no secrets), so CURSOR_API_KEY is reachable only on internal branches.
-name: 'PR: Cursor Review'
-
-on:
-  pull_request:
-    types: [labeled, unlabeled]
-
-permissions:
-  contents: read
-  pull-requests: write
-
-concurrency:
-  # Re-labeling cancels an in-flight run for the same PR + label.
-  group: cursor-review-pr-${{ github.event.pull_request.number }}-${{ github.event.label.name }}
-  cancel-in-progress: true
-
-jobs:
-  cursor-review:
-    if: github.event.action == 'labeled' && github.event.label.name == 'cursor-review'
-    # SHA-pinned per zizmor `unpinned-uses: hash-pin`. Bump this SHA to pick up
-    # upstream changes; keep `workflows_ref` matching so prompts/scripts load
-    # from the same commit as the workflow definition.
-    uses: Comfy-Org/github-workflows/.github/workflows/cursor-review.yml@047ca48febe3a6647608ed2e0c4331b491cb9d6a # github-workflows#9
-    with:
-      # Overriding diff_excludes replaces the reusable default wholesale, so
-      # this restates the generated/vendored defaults and adds this repo's heavy
-      # paths (Playwright snapshots, generated manager types).
-      diff_excludes: >-
-        :!**/package-lock.json
-        :!**/yarn.lock
-        :!**/pnpm-lock.yaml
-        :!**/node_modules/**
-        :!**/.claude/**
-        :!**/dist/**
-        :!**/vendor/**
-        :!**/*.generated.*
-        :!**/*.min.js
-        :!**/*.min.css
-        :!**/*-snapshots/**
-        :!src/workbench/extensions/manager/types/generatedManagerTypes.ts
-      # Load the prompts/scripts from the same ref as `uses:`.
-      workflows_ref: 047ca48febe3a6647608ed2e0c4331b491cb9d6a
-    secrets:
-      CURSOR_API_KEY: ${{ secrets.CURSOR_API_KEY }}
-      # Optional — enables start/complete Slack DMs to the triggerer.
-      SLACK_BOT_TOKEN: ${{ secrets.SLACK_BOT_TOKEN }}

.github/workflows/pr-report.yaml

@@ -140,8 +140,6 @@ jobs:
             const legacyMarkers = [
               '<!-- COMFYUI_FRONTEND_SIZE -->',
               '<!-- COMFYUI_FRONTEND_PERF -->',
-              '<!-- PLAYWRIGHT_TEST_STATUS -->',
-              '<!-- STORYBOOK_BUILD_STATUS -->',
             ];
 
             const comments = await github.paginate(github.rest.issues.listComments, {
@@ -162,19 +160,11 @@ jobs:
               }
             }
 
-      - name: Read PR report
-        id: report
+      - name: Post PR comment
         if: steps.pr-meta.outputs.skip != 'true'
-        uses: juliangruber/read-file-action@b549046febe0fe86f8cb4f93c24e284433f9ab58 # v1.1.7
-        with:
-          path: ./pr-report.md
-
-      - name: Upsert bundle/perf/coverage section into unified report
-        if: steps.pr-meta.outputs.skip != 'true'
-        uses: ./.github/actions/upsert-comment-section
+        uses: ./.github/actions/post-pr-report-comment
         with:
           pr-number: ${{ steps.pr-meta.outputs.number }}
-          section-name: ci-metrics
-          section-content: ${{ steps.report.outputs.content }}
+          report-file: ./pr-report.md
           comment-marker: '<!-- COMFYUI_FRONTEND_PR_REPORT -->'
           token: ${{ secrets.GITHUB_TOKEN }}

apps/website/src/i18n/translations.ts

@@ -1385,9 +1385,9 @@ const translations = {
     'zh-CN': '随时加购积分'
   },
   'pricing.included.feature5.description': {
-    en: 'Purchase additional credits at any time. Top-up credits are valid for 1 year from the date of purchase and do not roll over with your monthly plan.',
+    en: 'Purchase additional credits at any time. Unused top-ups roll over to the next month automatically for up to 1 year.',
     'zh-CN':
-      '可随时购买额外积分。充值积分自购买之日起 1 年内有效，且不会随月度计划结转。'
+      '可随时购买额外积分。未使用的充值积分自动结转至下月，最长保留 1 年。'
   },
   'pricing.included.feature6.title': {
     en: 'Pre-installed models',

browser_tests/assets/subgraphs/link-seed.json

@@ -1,436 +0,0 @@
-{
-  "id": "ca685f6a-7402-42cc-84ae-b659b06cc8b1",
-  "revision": 0,
-  "last_node_id": 10,
-  "last_link_id": 15,
-  "nodes": [
-    {
-      "id": 7,
-      "type": "CLIPTextEncode",
-      "pos": [497.59999999999985, 468.79999999999995],
-      "size": [510.328125, 216.71875],
-      "flags": {},
-      "order": 3,
-      "mode": 0,
-      "inputs": [
-        {
-          "name": "clip",
-          "type": "CLIP",
-          "link": 5
-        }
-      ],
-      "outputs": [
-        {
-          "name": "CONDITIONING",
-          "type": "CONDITIONING",
-          "slot_index": 0,
-          "links": [12]
-        }
-      ],
-      "properties": {
-        "Node name for S&R": "CLIPTextEncode"
-      },
-      "widgets_values": ["text, watermark"]
-    },
-    {
-      "id": 6,
-      "type": "CLIPTextEncode",
-      "pos": [499.9999999999999, 225.1999633789062],
-      "size": [507.40625, 197.171875],
-      "flags": {},
-      "order": 2,
-      "mode": 0,
-      "inputs": [
-        {
-          "name": "clip",
-          "type": "CLIP",
-          "link": 3
-        }
-      ],
-      "outputs": [
-        {
-          "name": "CONDITIONING",
-          "type": "CONDITIONING",
-          "slot_index": 0,
-          "links": [11]
-        }
-      ],
-      "properties": {
-        "Node name for S&R": "CLIPTextEncode"
-      },
-      "widgets_values": [
-        "beautiful scenery nature glass bottle landscape, , purple galaxy bottle,"
-      ]
-    },
-    {
-      "id": 5,
-      "type": "EmptyLatentImage",
-      "pos": [569.5999633789061, 732.7998535156249],
-      "size": [378, 144],
-      "flags": {},
-      "order": 0,
-      "mode": 0,
-      "inputs": [],
-      "outputs": [
-        {
-          "name": "LATENT",
-          "type": "LATENT",
-          "slot_index": 0,
-          "links": [13]
-        }
-      ],
-      "properties": {
-        "Node name for S&R": "EmptyLatentImage"
-      },
-      "widgets_values": [512, 512, 1]
-    },
-    {
-      "id": 8,
-      "type": "VAEDecode",
-      "pos": [1452.7999999999997, 227.59999999999997],
-      "size": [252, 72],
-      "flags": {},
-      "order": 5,
-      "mode": 0,
-      "inputs": [
-        {
-          "name": "samples",
-          "type": "LATENT",
-          "link": 14
-        },
-        {
-          "name": "vae",
-          "type": "VAE",
-          "link": 8
-        }
-      ],
-      "outputs": [
-        {
-          "name": "IMAGE",
-          "type": "IMAGE",
-          "slot_index": 0,
-          "links": [9]
-        }
-      ],
-      "properties": {
-        "Node name for S&R": "VAEDecode"
-      },
-      "widgets_values": []
-    },
-    {
-      "id": 9,
-      "type": "SaveImage",
-      "pos": [1743.1999999999998, 228.79999999999995],
-      "size": [252, 84],
-      "flags": {},
-      "order": 6,
-      "mode": 0,
-      "inputs": [
-        {
-          "name": "images",
-          "type": "IMAGE",
-          "link": 9
-        }
-      ],
-      "outputs": [],
-      "properties": {},
-      "widgets_values": ["ComfyUI"]
-    },
-    {
-      "id": 4,
-      "type": "CheckpointLoaderSimple",
-      "pos": [33.20003662109363, 570.8],
-      "size": [378, 130.65625],
-      "flags": {},
-      "order": 1,
-      "mode": 0,
-      "inputs": [],
-      "outputs": [
-        {
-          "name": "MODEL",
-          "type": "MODEL",
-          "slot_index": 0,
-          "links": [10]
-        },
-        {
-          "name": "CLIP",
-          "type": "CLIP",
-          "slot_index": 1,
-          "links": [3, 5]
-        },
-        {
-          "name": "VAE",
-          "type": "VAE",
-          "slot_index": 2,
-          "links": [8]
-        }
-      ],
-      "properties": {
-        "Node name for S&R": "CheckpointLoaderSimple"
-      },
-      "widgets_values": ["v1-5-pruned-emaonly-fp16.safetensors"]
-    },
-    {
-      "id": 10,
-      "type": "5526b801-03ef-4797-9052-cbc171512972",
-      "pos": [1145.277734375, 340.85618896484374],
-      "size": [225, 184],
-      "flags": {},
-      "order": 4,
-      "mode": 0,
-      "inputs": [
-        {
-          "name": "model",
-          "type": "MODEL",
-          "link": 10
-        },
-        {
-          "name": "positive",
-          "type": "CONDITIONING",
-          "link": 11
-        },
-        {
-          "name": "negative",
-          "type": "CONDITIONING",
-          "link": 12
-        },
-        {
-          "name": "latent_image",
-          "type": "LATENT",
-          "link": 13
-        }
-      ],
-      "outputs": [
-        {
-          "name": "LATENT",
-          "type": "LATENT",
-          "links": [14]
-        }
-      ],
-      "properties": {
-        "proxyWidgets": [["-1", "seed"]]
-      },
-      "widgets_values": [1]
-    }
-  ],
-  "links": [
-    [3, 4, 1, 6, 0, "CLIP"],
-    [5, 4, 1, 7, 0, "CLIP"],
-    [8, 4, 2, 8, 1, "VAE"],
-    [9, 8, 0, 9, 0, "IMAGE"],
-    [10, 4, 0, 10, 0, "MODEL"],
-    [11, 6, 0, 10, 1, "CONDITIONING"],
-    [12, 7, 0, 10, 2, "CONDITIONING"],
-    [13, 5, 0, 10, 3, "LATENT"],
-    [14, 10, 0, 8, 0, "LATENT"]
-  ],
-  "groups": [],
-  "definitions": {
-    "subgraphs": [
-      {
-        "id": "5526b801-03ef-4797-9052-cbc171512972",
-        "version": 1,
-        "state": {
-          "lastGroupId": 0,
-          "lastNodeId": 10,
-          "lastLinkId": 15,
-          "lastRerouteId": 0
-        },
-        "revision": 0,
-        "config": {},
-        "name": "New Subgraph",
-        "inputNode": {
-          "id": -10,
-          "bounding": [1031.12, 372.62745605468746, 120, 140]
-        },
-        "outputNode": {
-          "id": -20,
-          "bounding": [1772.7199999999998, 408.62745605468746, 120, 60]
-        },
-        "inputs": [
-          {
-            "id": "2a9d656b-f723-4cdd-897f-894835ce9c50",
-            "name": "model",
-            "type": "MODEL",
-            "linkIds": [1],
-            "localized_name": "model",
-            "pos": [1131.12, 392.62745605468746]
-          },
-          {
-            "id": "ea2d1491-db84-40fa-81e0-48008843ef25",
-            "name": "positive",
-            "type": "CONDITIONING",
-            "linkIds": [4],
-            "localized_name": "positive",
-            "pos": [1131.12, 412.62745605468746]
-          },
-          {
-            "id": "8e021d1a-2032-4dfc-84a3-b649831bd474",
-            "name": "negative",
-            "type": "CONDITIONING",
-            "linkIds": [6],
-            "localized_name": "negative",
-            "pos": [1131.12, 432.62745605468746]
-          },
-          {
-            "id": "977613a0-f164-4004-87a4-1f70ecca7c73",
-            "name": "latent_image",
-            "type": "LATENT",
-            "linkIds": [2],
-            "localized_name": "latent_image",
-            "pos": [1131.12, 452.62745605468746]
-          },
-          {
-            "id": "42ba848c-ab1d-4eab-9f86-3693f407e253",
-            "name": "seed",
-            "type": "INT",
-            "linkIds": [15],
-            "pos": [1131.12, 472.62745605468746]
-          }
-        ],
-        "outputs": [
-          {
-            "id": "73e0e3cd-90f1-4934-8278-2c5c64fd40f6",
-            "name": "LATENT",
-            "type": "LATENT",
-            "linkIds": [7],
-            "localized_name": "LATENT",
-            "pos": [1792.7199999999998, 428.62745605468746]
-          }
-        ],
-        "widgets": [],
-        "nodes": [
-          {
-            "id": 3,
-            "type": "KSampler",
-            "pos": [1247.1199707031249, 272.23994140624995],
-            "size": [453.59375, 380.765625],
-            "flags": {},
-            "order": 0,
-            "mode": 0,
-            "inputs": [
-              {
-                "localized_name": "model",
-                "name": "model",
-                "type": "MODEL",
-                "link": 1
-              },
-              {
-                "localized_name": "positive",
-                "name": "positive",
-                "type": "CONDITIONING",
-                "link": 4
-              },
-              {
-                "localized_name": "negative",
-                "name": "negative",
-                "type": "CONDITIONING",
-                "link": 6
-              },
-              {
-                "localized_name": "latent_image",
-                "name": "latent_image",
-                "type": "LATENT",
-                "link": 2
-              },
-              {
-                "localized_name": "seed",
-                "name": "seed",
-                "type": "INT",
-                "widget": {
-                  "name": "seed"
-                },
-                "link": 15
-              }
-            ],
-            "outputs": [
-              {
-                "localized_name": "LATENT",
-                "name": "LATENT",
-                "type": "LATENT",
-                "slot_index": 0,
-                "links": [7]
-              }
-            ],
-            "properties": {
-              "Node name for S&R": "KSampler"
-            },
-            "widgets_values": [
-              156680208700286,
-              "increment",
-              20,
-              8,
-              "euler",
-              "normal",
-              1
-            ]
-          }
-        ],
-        "groups": [],
-        "links": [
-          {
-            "id": 1,
-            "origin_id": -10,
-            "origin_slot": 0,
-            "target_id": 3,
-            "target_slot": 0,
-            "type": "MODEL"
-          },
-          {
-            "id": 4,
-            "origin_id": -10,
-            "origin_slot": 1,
-            "target_id": 3,
-            "target_slot": 1,
-            "type": "CONDITIONING"
-          },
-          {
-            "id": 6,
-            "origin_id": -10,
-            "origin_slot": 2,
-            "target_id": 3,
-            "target_slot": 2,
-            "type": "CONDITIONING"
-          },
-          {
-            "id": 2,
-            "origin_id": -10,
-            "origin_slot": 3,
-            "target_id": 3,
-            "target_slot": 3,
-            "type": "LATENT"
-          },
-          {
-            "id": 7,
-            "origin_id": 3,
-            "origin_slot": 0,
-            "target_id": -20,
-            "target_slot": 0,
-            "type": "LATENT"
-          },
-          {
-            "id": 15,
-            "origin_id": -10,
-            "origin_slot": 4,
-            "target_id": 3,
-            "target_slot": 4,
-            "type": "INT"
-          }
-        ],
-        "extra": {
-          "workflowRendererVersion": "Vue"
-        }
-      }
-    ]
-  },
-  "config": {},
-  "extra": {
-    "ds": {
-      "offset": [0, 0],
-      "scale": 1
-    },
-    "workflowRendererVersion": "Vue",
-    "frontendVersion": "1.40.0"
-  },
-  "version": 0.4
-}

browser_tests/assets/subgraphs/proxy-seed.json

@@ -1,404 +0,0 @@
-{
-  "id": "ca685f6a-7402-42cc-84ae-b659b06cc8b1",
-  "revision": 0,
-  "last_node_id": 10,
-  "last_link_id": 14,
-  "nodes": [
-    {
-      "id": 7,
-      "type": "CLIPTextEncode",
-      "pos": [497.59999999999985, 468.79999999999995],
-      "size": [510.328125, 216.71875],
-      "flags": {},
-      "order": 3,
-      "mode": 0,
-      "inputs": [
-        {
-          "name": "clip",
-          "type": "CLIP",
-          "link": 5
-        }
-      ],
-      "outputs": [
-        {
-          "name": "CONDITIONING",
-          "type": "CONDITIONING",
-          "slot_index": 0,
-          "links": [12]
-        }
-      ],
-      "properties": {
-        "Node name for S&R": "CLIPTextEncode"
-      },
-      "widgets_values": ["text, watermark"]
-    },
-    {
-      "id": 6,
-      "type": "CLIPTextEncode",
-      "pos": [499.9999999999999, 225.1999633789062],
-      "size": [507.40625, 197.171875],
-      "flags": {},
-      "order": 2,
-      "mode": 0,
-      "inputs": [
-        {
-          "name": "clip",
-          "type": "CLIP",
-          "link": 3
-        }
-      ],
-      "outputs": [
-        {
-          "name": "CONDITIONING",
-          "type": "CONDITIONING",
-          "slot_index": 0,
-          "links": [11]
-        }
-      ],
-      "properties": {
-        "Node name for S&R": "CLIPTextEncode"
-      },
-      "widgets_values": [
-        "beautiful scenery nature glass bottle landscape, , purple galaxy bottle,"
-      ]
-    },
-    {
-      "id": 5,
-      "type": "EmptyLatentImage",
-      "pos": [569.5999633789061, 732.7998535156249],
-      "size": [378, 144],
-      "flags": {},
-      "order": 0,
-      "mode": 0,
-      "inputs": [],
-      "outputs": [
-        {
-          "name": "LATENT",
-          "type": "LATENT",
-          "slot_index": 0,
-          "links": [13]
-        }
-      ],
-      "properties": {
-        "Node name for S&R": "EmptyLatentImage"
-      },
-      "widgets_values": [512, 512, 1]
-    },
-    {
-      "id": 8,
-      "type": "VAEDecode",
-      "pos": [1452.7999999999997, 227.59999999999997],
-      "size": [252, 72],
-      "flags": {},
-      "order": 5,
-      "mode": 0,
-      "inputs": [
-        {
-          "name": "samples",
-          "type": "LATENT",
-          "link": 14
-        },
-        {
-          "name": "vae",
-          "type": "VAE",
-          "link": 8
-        }
-      ],
-      "outputs": [
-        {
-          "name": "IMAGE",
-          "type": "IMAGE",
-          "slot_index": 0,
-          "links": [9]
-        }
-      ],
-      "properties": {
-        "Node name for S&R": "VAEDecode"
-      },
-      "widgets_values": []
-    },
-    {
-      "id": 9,
-      "type": "SaveImage",
-      "pos": [1743.1999999999998, 228.79999999999995],
-      "size": [252, 84],
-      "flags": {},
-      "order": 6,
-      "mode": 0,
-      "inputs": [
-        {
-          "name": "images",
-          "type": "IMAGE",
-          "link": 9
-        }
-      ],
-      "outputs": [],
-      "properties": {},
-      "widgets_values": ["ComfyUI"]
-    },
-    {
-      "id": 4,
-      "type": "CheckpointLoaderSimple",
-      "pos": [33.20003662109363, 570.8],
-      "size": [378, 130.65625],
-      "flags": {},
-      "order": 1,
-      "mode": 0,
-      "inputs": [],
-      "outputs": [
-        {
-          "name": "MODEL",
-          "type": "MODEL",
-          "slot_index": 0,
-          "links": [10]
-        },
-        {
-          "name": "CLIP",
-          "type": "CLIP",
-          "slot_index": 1,
-          "links": [3, 5]
-        },
-        {
-          "name": "VAE",
-          "type": "VAE",
-          "slot_index": 2,
-          "links": [8]
-        }
-      ],
-      "properties": {
-        "Node name for S&R": "CheckpointLoaderSimple"
-      },
-      "widgets_values": ["v1-5-pruned-emaonly-fp16.safetensors"]
-    },
-    {
-      "id": 10,
-      "type": "5526b801-03ef-4797-9052-cbc171512972",
-      "pos": [1145.277734375, 340.85618896484374],
-      "size": [225, 184],
-      "flags": {},
-      "order": 4,
-      "mode": 0,
-      "inputs": [
-        {
-          "name": "model",
-          "type": "MODEL",
-          "link": 10
-        },
-        {
-          "name": "positive",
-          "type": "CONDITIONING",
-          "link": 11
-        },
-        {
-          "name": "negative",
-          "type": "CONDITIONING",
-          "link": 12
-        },
-        {
-          "name": "latent_image",
-          "type": "LATENT",
-          "link": 13
-        }
-      ],
-      "outputs": [
-        {
-          "name": "LATENT",
-          "type": "LATENT",
-          "links": [14]
-        }
-      ],
-      "properties": {
-        "proxyWidgets": [["3", "seed"]]
-      },
-      "widgets_values": []
-    }
-  ],
-  "links": [
-    [3, 4, 1, 6, 0, "CLIP"],
-    [5, 4, 1, 7, 0, "CLIP"],
-    [8, 4, 2, 8, 1, "VAE"],
-    [9, 8, 0, 9, 0, "IMAGE"],
-    [10, 4, 0, 10, 0, "MODEL"],
-    [11, 6, 0, 10, 1, "CONDITIONING"],
-    [12, 7, 0, 10, 2, "CONDITIONING"],
-    [13, 5, 0, 10, 3, "LATENT"],
-    [14, 10, 0, 8, 0, "LATENT"]
-  ],
-  "groups": [],
-  "definitions": {
-    "subgraphs": [
-      {
-        "id": "5526b801-03ef-4797-9052-cbc171512972",
-        "version": 1,
-        "state": {
-          "lastGroupId": 0,
-          "lastNodeId": 10,
-          "lastLinkId": 14,
-          "lastRerouteId": 0
-        },
-        "revision": 0,
-        "config": {},
-        "name": "New Subgraph",
-        "inputNode": {
-          "id": -10,
-          "bounding": [1031.12, 372.62745605468746, 120, 120]
-        },
-        "outputNode": {
-          "id": -20,
-          "bounding": [1772.7199999999998, 408.62745605468746, 120, 60]
-        },
-        "inputs": [
-          {
-            "id": "2a9d656b-f723-4cdd-897f-894835ce9c50",
-            "name": "model",
-            "type": "MODEL",
-            "linkIds": [1],
-            "localized_name": "model",
-            "pos": [1131.12, 392.62745605468746]
-          },
-          {
-            "id": "ea2d1491-db84-40fa-81e0-48008843ef25",
-            "name": "positive",
-            "type": "CONDITIONING",
-            "linkIds": [4],
-            "localized_name": "positive",
-            "pos": [1131.12, 412.62745605468746]
-          },
-          {
-            "id": "8e021d1a-2032-4dfc-84a3-b649831bd474",
-            "name": "negative",
-            "type": "CONDITIONING",
-            "linkIds": [6],
-            "localized_name": "negative",
-            "pos": [1131.12, 432.62745605468746]
-          },
-          {
-            "id": "977613a0-f164-4004-87a4-1f70ecca7c73",
-            "name": "latent_image",
-            "type": "LATENT",
-            "linkIds": [2],
-            "localized_name": "latent_image",
-            "pos": [1131.12, 452.62745605468746]
-          }
-        ],
-        "outputs": [
-          {
-            "id": "73e0e3cd-90f1-4934-8278-2c5c64fd40f6",
-            "name": "LATENT",
-            "type": "LATENT",
-            "linkIds": [7],
-            "localized_name": "LATENT",
-            "pos": [1792.7199999999998, 428.62745605468746]
-          }
-        ],
-        "widgets": [],
-        "nodes": [
-          {
-            "id": 3,
-            "type": "KSampler",
-            "pos": [1247.1199707031249, 272.23994140624995],
-            "size": [453.59375, 380.765625],
-            "flags": {},
-            "order": 0,
-            "mode": 0,
-            "inputs": [
-              {
-                "localized_name": "model",
-                "name": "model",
-                "type": "MODEL",
-                "link": 1
-              },
-              {
-                "localized_name": "positive",
-                "name": "positive",
-                "type": "CONDITIONING",
-                "link": 4
-              },
-              {
-                "localized_name": "negative",
-                "name": "negative",
-                "type": "CONDITIONING",
-                "link": 6
-              },
-              {
-                "localized_name": "latent_image",
-                "name": "latent_image",
-                "type": "LATENT",
-                "link": 2
-              }
-            ],
-            "outputs": [
-              {
-                "localized_name": "LATENT",
-                "name": "LATENT",
-                "type": "LATENT",
-                "slot_index": 0,
-                "links": [7]
-              }
-            ],
-            "properties": {
-              "Node name for S&R": "KSampler"
-            },
-            "widgets_values": [1, "increment", 20, 8, "euler", "normal", 1]
-          }
-        ],
-        "groups": [],
-        "links": [
-          {
-            "id": 1,
-            "origin_id": -10,
-            "origin_slot": 0,
-            "target_id": 3,
-            "target_slot": 0,
-            "type": "MODEL"
-          },
-          {
-            "id": 4,
-            "origin_id": -10,
-            "origin_slot": 1,
-            "target_id": 3,
-            "target_slot": 1,
-            "type": "CONDITIONING"
-          },
-          {
-            "id": 6,
-            "origin_id": -10,
-            "origin_slot": 2,
-            "target_id": 3,
-            "target_slot": 2,
-            "type": "CONDITIONING"
-          },
-          {
-            "id": 2,
-            "origin_id": -10,
-            "origin_slot": 3,
-            "target_id": 3,
-            "target_slot": 3,
-            "type": "LATENT"
-          },
-          {
-            "id": 7,
-            "origin_id": 3,
-            "origin_slot": 0,
-            "target_id": -20,
-            "target_slot": 0,
-            "type": "LATENT"
-          }
-        ],
-        "extra": {
-          "workflowRendererVersion": "Vue"
-        }
-      }
-    ]
-  },
-  "config": {},
-  "extra": {
-    "ds": {
-      "offset": [0, 0],
-      "scale": 1
-    },
-    "workflowRendererVersion": "Vue",
-    "frontendVersion": "1.40.0"
-  },
-  "version": 0.4
-}

browser_tests/assets/subgraphs/zit-seed.json

@@ -1,439 +0,0 @@
-{
-  "id": "ca685f6a-7402-42cc-84ae-b659b06cc8b1",
-  "revision": 0,
-  "last_node_id": 10,
-  "last_link_id": 15,
-  "nodes": [
-    {
-      "id": 7,
-      "type": "CLIPTextEncode",
-      "pos": [498.26665242513025, 471.46666463216144],
-      "size": [510.328125, 252.71875],
-      "flags": {},
-      "order": 3,
-      "mode": 0,
-      "inputs": [
-        {
-          "name": "clip",
-          "type": "CLIP",
-          "link": 5
-        }
-      ],
-      "outputs": [
-        {
-          "name": "CONDITIONING",
-          "type": "CONDITIONING",
-          "slot_index": 0,
-          "links": [12]
-        }
-      ],
-      "properties": {
-        "Node name for S&R": "CLIPTextEncode"
-      },
-      "widgets_values": ["text, watermark"]
-    },
-    {
-      "id": 6,
-      "type": "CLIPTextEncode",
-      "pos": [500.66667683919275, 227.8666280110677],
-      "size": [507.40625, 233.171875],
-      "flags": {},
-      "order": 2,
-      "mode": 0,
-      "inputs": [
-        {
-          "name": "clip",
-          "type": "CLIP",
-          "link": 3
-        }
-      ],
-      "outputs": [
-        {
-          "name": "CONDITIONING",
-          "type": "CONDITIONING",
-          "slot_index": 0,
-          "links": [11]
-        }
-      ],
-      "properties": {
-        "Node name for S&R": "CLIPTextEncode"
-      },
-      "widgets_values": [
-        "beautiful scenery nature glass bottle landscape, , purple galaxy bottle,"
-      ]
-    },
-    {
-      "id": 5,
-      "type": "EmptyLatentImage",
-      "pos": [570.266591389974, 735.4665120442708],
-      "size": [378, 216],
-      "flags": {},
-      "order": 0,
-      "mode": 0,
-      "inputs": [],
-      "outputs": [
-        {
-          "name": "LATENT",
-          "type": "LATENT",
-          "slot_index": 0,
-          "links": [13]
-        }
-      ],
-      "properties": {
-        "Node name for S&R": "EmptyLatentImage"
-      },
-      "widgets_values": [512, 512, 1]
-    },
-    {
-      "id": 8,
-      "type": "VAEDecode",
-      "pos": [1453.466512044271, 230.26666768391925],
-      "size": [252, 138],
-      "flags": {},
-      "order": 5,
-      "mode": 0,
-      "inputs": [
-        {
-          "name": "samples",
-          "type": "LATENT",
-          "link": 14
-        },
-        {
-          "name": "vae",
-          "type": "VAE",
-          "link": 8
-        }
-      ],
-      "outputs": [
-        {
-          "name": "IMAGE",
-          "type": "IMAGE",
-          "slot_index": 0,
-          "links": [9]
-        }
-      ],
-      "properties": {
-        "Node name for S&R": "VAEDecode"
-      },
-      "widgets_values": []
-    },
-    {
-      "id": 9,
-      "type": "SaveImage",
-      "pos": [1743.866658528646, 231.46666463216144],
-      "size": [252, 148],
-      "flags": {},
-      "order": 6,
-      "mode": 0,
-      "inputs": [
-        {
-          "name": "images",
-          "type": "IMAGE",
-          "link": 9
-        }
-      ],
-      "outputs": [],
-      "properties": {},
-      "widgets_values": ["ComfyUI"]
-    },
-    {
-      "id": 4,
-      "type": "CheckpointLoaderSimple",
-      "pos": [33.866689046223996, 573.4666951497395],
-      "size": [378, 196],
-      "flags": {},
-      "order": 1,
-      "mode": 0,
-      "inputs": [],
-      "outputs": [
-        {
-          "name": "MODEL",
-          "type": "MODEL",
-          "slot_index": 0,
-          "links": [10]
-        },
-        {
-          "name": "CLIP",
-          "type": "CLIP",
-          "slot_index": 1,
-          "links": [3, 5]
-        },
-        {
-          "name": "VAE",
-          "type": "VAE",
-          "slot_index": 2,
-          "links": [8]
-        }
-      ],
-      "properties": {
-        "Node name for S&R": "CheckpointLoaderSimple"
-      },
-      "widgets_values": ["v1-5-pruned-emaonly-fp16.safetensors"]
-    },
-    {
-      "id": 10,
-      "type": "5526b801-03ef-4797-9052-cbc171512972",
-      "pos": [1145.9444173177085, 343.52284749348956],
-      "size": [225, 220],
-      "flags": {},
-      "order": 4,
-      "mode": 0,
-      "inputs": [
-        {
-          "name": "model",
-          "type": "MODEL",
-          "link": 10
-        },
-        {
-          "name": "positive",
-          "type": "CONDITIONING",
-          "link": 11
-        },
-        {
-          "name": "negative",
-          "type": "CONDITIONING",
-          "link": 12
-        },
-        {
-          "name": "latent_image",
-          "type": "LATENT",
-          "link": 13
-        }
-      ],
-      "outputs": [
-        {
-          "name": "LATENT",
-          "type": "LATENT",
-          "links": [14]
-        }
-      ],
-      "properties": {
-        "proxyWidgets": [
-          ["-1", "seed"],
-          ["3", "control_after_generate"]
-        ]
-      },
-      "widgets_values": [1]
-    }
-  ],
-  "links": [
-    [3, 4, 1, 6, 0, "CLIP"],
-    [5, 4, 1, 7, 0, "CLIP"],
-    [8, 4, 2, 8, 1, "VAE"],
-    [9, 8, 0, 9, 0, "IMAGE"],
-    [10, 4, 0, 10, 0, "MODEL"],
-    [11, 6, 0, 10, 1, "CONDITIONING"],
-    [12, 7, 0, 10, 2, "CONDITIONING"],
-    [13, 5, 0, 10, 3, "LATENT"],
-    [14, 10, 0, 8, 0, "LATENT"]
-  ],
-  "groups": [],
-  "definitions": {
-    "subgraphs": [
-      {
-        "id": "5526b801-03ef-4797-9052-cbc171512972",
-        "version": 1,
-        "state": {
-          "lastGroupId": 0,
-          "lastNodeId": 10,
-          "lastLinkId": 15,
-          "lastRerouteId": 0
-        },
-        "revision": 0,
-        "config": {},
-        "name": "New Subgraph",
-        "inputNode": {
-          "id": -10,
-          "bounding": [1031.12, 372.62745605468746, 120, 140]
-        },
-        "outputNode": {
-          "id": -20,
-          "bounding": [1772.7199999999998, 408.62745605468746, 120, 60]
-        },
-        "inputs": [
-          {
-            "id": "2a9d656b-f723-4cdd-897f-894835ce9c50",
-            "name": "model",
-            "type": "MODEL",
-            "linkIds": [1],
-            "localized_name": "model",
-            "pos": [1131.12, 392.62745605468746]
-          },
-          {
-            "id": "ea2d1491-db84-40fa-81e0-48008843ef25",
-            "name": "positive",
-            "type": "CONDITIONING",
-            "linkIds": [4],
-            "localized_name": "positive",
-            "pos": [1131.12, 412.62745605468746]
-          },
-          {
-            "id": "8e021d1a-2032-4dfc-84a3-b649831bd474",
-            "name": "negative",
-            "type": "CONDITIONING",
-            "linkIds": [6],
-            "localized_name": "negative",
-            "pos": [1131.12, 432.62745605468746]
-          },
-          {
-            "id": "977613a0-f164-4004-87a4-1f70ecca7c73",
-            "name": "latent_image",
-            "type": "LATENT",
-            "linkIds": [2],
-            "localized_name": "latent_image",
-            "pos": [1131.12, 452.62745605468746]
-          },
-          {
-            "id": "42ba848c-ab1d-4eab-9f86-3693f407e253",
-            "name": "seed",
-            "type": "INT",
-            "linkIds": [15],
-            "pos": [1131.12, 472.62745605468746]
-          }
-        ],
-        "outputs": [
-          {
-            "id": "73e0e3cd-90f1-4934-8278-2c5c64fd40f6",
-            "name": "LATENT",
-            "type": "LATENT",
-            "linkIds": [7],
-            "localized_name": "LATENT",
-            "pos": [1792.7199999999998, 428.62745605468746]
-          }
-        ],
-        "widgets": [],
-        "nodes": [
-          {
-            "id": 3,
-            "type": "KSampler",
-            "pos": [1247.1199707031249, 272.23994140624995],
-            "size": [453.59375, 380.765625],
-            "flags": {},
-            "order": 0,
-            "mode": 0,
-            "inputs": [
-              {
-                "localized_name": "model",
-                "name": "model",
-                "type": "MODEL",
-                "link": 1
-              },
-              {
-                "localized_name": "positive",
-                "name": "positive",
-                "type": "CONDITIONING",
-                "link": 4
-              },
-              {
-                "localized_name": "negative",
-                "name": "negative",
-                "type": "CONDITIONING",
-                "link": 6
-              },
-              {
-                "localized_name": "latent_image",
-                "name": "latent_image",
-                "type": "LATENT",
-                "link": 2
-              },
-              {
-                "localized_name": "seed",
-                "name": "seed",
-                "type": "INT",
-                "widget": {
-                  "name": "seed"
-                },
-                "link": 15
-              }
-            ],
-            "outputs": [
-              {
-                "localized_name": "LATENT",
-                "name": "LATENT",
-                "type": "LATENT",
-                "slot_index": 0,
-                "links": [7]
-              }
-            ],
-            "properties": {
-              "Node name for S&R": "KSampler"
-            },
-            "widgets_values": [
-              156680208700286,
-              "increment",
-              20,
-              8,
-              "euler",
-              "normal",
-              1
-            ]
-          }
-        ],
-        "groups": [],
-        "links": [
-          {
-            "id": 1,
-            "origin_id": -10,
-            "origin_slot": 0,
-            "target_id": 3,
-            "target_slot": 0,
-            "type": "MODEL"
-          },
-          {
-            "id": 4,
-            "origin_id": -10,
-            "origin_slot": 1,
-            "target_id": 3,
-            "target_slot": 1,
-            "type": "CONDITIONING"
-          },
-          {
-            "id": 6,
-            "origin_id": -10,
-            "origin_slot": 2,
-            "target_id": 3,
-            "target_slot": 2,
-            "type": "CONDITIONING"
-          },
-          {
-            "id": 2,
-            "origin_id": -10,
-            "origin_slot": 3,
-            "target_id": 3,
-            "target_slot": 3,
-            "type": "LATENT"
-          },
-          {
-            "id": 7,
-            "origin_id": 3,
-            "origin_slot": 0,
-            "target_id": -20,
-            "target_slot": 0,
-            "type": "LATENT"
-          },
-          {
-            "id": 15,
-            "origin_id": -10,
-            "origin_slot": 4,
-            "target_id": 3,
-            "target_slot": 4,
-            "type": "INT"
-          }
-        ],
-        "extra": {
-          "workflowRendererVersion": "Vue"
-        }
-      }
-    ]
-  },
-  "config": {},
-  "extra": {
-    "ds": {
-      "offset": [0, 0],
-      "scale": 1
-    },
-    "workflowRendererVersion": "Vue",
-    "frontendVersion": "1.35.0"
-  },
-  "version": 0.4
-}

browser_tests/fixtures/VueNodeHelpers.ts

@@ -59,7 +59,7 @@ export class VueNodeHelpers {
    * Matches against the actual title element, not the full node body.
    * Use `.first()` for unique titles, `.nth(n)` for duplicates.
    */
-  getNodeByTitle(title: string | RegExp): Locator {
+  getNodeByTitle(title: string): Locator {
     return this.page.locator('[data-node-id]').filter({
       has: this.page.getByTestId('node-title').filter({ hasText: title })
     })
@@ -145,7 +145,7 @@ export class VueNodeHelpers {
   /**
    * Resolve the data-node-id of the first rendered node matching the title.
    */
-  async getNodeIdByTitle(title: string | RegExp): Promise<string> {
+  async getNodeIdByTitle(title: string): Promise<string> {
     const node = this.getNodeByTitle(title).first()
     await node.waitFor({ state: 'visible' })
 
@@ -163,7 +163,7 @@ export class VueNodeHelpers {
    * Return a DOM-focused VueNodeFixture for the first node matching the title.
    * Resolves the node id up front so subsequent interactions survive title changes.
    */
-  async getFixtureByTitle(title: string | RegExp): Promise<VueNodeFixture> {
+  async getFixtureByTitle(title: string): Promise<VueNodeFixture> {
     const nodeId = await this.getNodeIdByTitle(title)
     return new VueNodeFixture(this.getNodeLocator(nodeId))
   }

browser_tests/fixtures/components/ContextMenu.ts

@@ -1,10 +1,14 @@
 import { expect } from '@playwright/test'
 import type { Locator, Page } from '@playwright/test'
 
+import { TestIds } from '@e2e/fixtures/selectors'
+
 export class ContextMenu {
   public readonly primeVueMenu: Locator
   public readonly litegraphMenu: Locator
   public readonly litegraphContextMenu: Locator
+  public readonly linkReleaseMenu: Locator
+  public readonly linkReleaseMenuSearch: Locator
   public readonly menuItems: Locator
   protected readonly anyMenu: Locator
 
@@ -12,6 +16,10 @@ export class ContextMenu {
     this.primeVueMenu = page.locator('.p-contextmenu, .p-menu')
     this.litegraphMenu = page.locator('.litemenu')
     this.litegraphContextMenu = page.locator('.litecontextmenu')
+    this.linkReleaseMenu = page.getByTestId(TestIds.linkReleaseMenu.root)
+    this.linkReleaseMenuSearch = page.getByTestId(
+      TestIds.linkReleaseMenu.search
+    )
     this.menuItems = page.locator('.p-menuitem, .litemenu-entry')
     this.anyMenu = this.primeVueMenu
       .or(this.litegraphMenu)

browser_tests/fixtures/selectors.ts

@@ -4,6 +4,10 @@
  */
 
 export const TestIds = {
+  linkReleaseMenu: {
+    root: 'link-release-context-menu',
+    search: 'link-release-search'
+  },
   sidebar: {
     toolbar: 'side-toolbar',
     nodeLibrary: 'node-library-tree',

browser_tests/fixtures/utils/flashDetector.ts

@@ -1,45 +0,0 @@
-import type { Page } from '@playwright/test'
-
-function flagAttributeFor(testId: string) {
-  const encoded = Array.from(testId, (ch) =>
-    ch.charCodeAt(0).toString(16)
-  ).join('')
-  return `data-flashed-${encoded}`
-}
-
-/**
- * Flags the first time an element matching `[data-testid="<testId>"]` is
- * present and rendered, sampled every frame via `requestAnimationFrame` from
- * page load. Catches a dialog that mounts and unmounts within a few frames,
- * which `toBeHidden()` (final state only) cannot.
- *
- * Must be called before navigation (e.g. before `comfyPage.setup()`).
- */
-export async function trackElementFlash(
-  page: Page,
-  testId: string
-): Promise<{ hasFlashed: () => Promise<boolean> }> {
-  const flagAttribute = flagAttributeFor(testId)
-
-  await page.addInitScript(
-    ({ id, attribute }: { id: string; attribute: string }) => {
-      const sample = () => {
-        const el = document.querySelector(`[data-testid="${CSS.escape(id)}"]`)
-        if (el instanceof HTMLElement) {
-          const rect = el.getBoundingClientRect()
-          if (rect.width > 0 && rect.height > 0) {
-            document.documentElement.setAttribute(attribute, 'true')
-          }
-        }
-        requestAnimationFrame(sample)
-      }
-      requestAnimationFrame(sample)
-    },
-    { id: testId, attribute: flagAttribute }
-  )
-
-  return {
-    hasFlashed: async () =>
-      (await page.locator('html').getAttribute(flagAttribute)) === 'true'
-  }
-}

browser_tests/fixtures/utils/promotedWidgets.ts

@@ -1,5 +1,6 @@
 import type { NodeProperty } from '@/lib/litegraph/src/LGraphNode'
 
+import type { PromotedWidgetSource } from '@/core/graph/subgraph/promotedWidgetTypes'
 import { parsePreviewExposures } from '@/core/schemas/previewExposureSchema'
 import type { PreviewExposure } from '@/core/schemas/previewExposureSchema'
 
@@ -7,13 +8,8 @@ import type { ComfyPage } from '@e2e/fixtures/ComfyPage'
 
 export type PromotedWidgetEntry = [string, string]
 
-interface ResolvedWidgetSource {
-  sourceNodeId: string
-  sourceWidgetName: string
-}
-
 function widgetSourceToEntry(
-  source: ResolvedWidgetSource
+  source: PromotedWidgetSource
 ): PromotedWidgetEntry {
   return [source.sourceNodeId, source.sourceWidgetName]
 }
@@ -24,22 +20,23 @@ function previewExposureToEntry(
   return [exposure.sourceNodeId, exposure.sourcePreviewName]
 }
 
+function isPromotedWidgetSource(value: unknown): value is PromotedWidgetSource {
+  return (
+    !!value &&
+    typeof value === 'object' &&
+    'sourceNodeId' in value &&
+    'sourceWidgetName' in value &&
+    typeof value.sourceNodeId === 'string' &&
+    typeof value.sourceWidgetName === 'string'
+  )
+}
+
 function isNodeProperty(value: unknown): value is NodeProperty {
   if (value === null || value === undefined) return false
   const t = typeof value
   return t === 'string' || t === 'number' || t === 'boolean' || t === 'object'
 }
 
-/**
- * Reads the promoted widgets of a subgraph host node from the live graph.
- *
- * Promoted widgets are now store-backed: a host input is promoted iff it
- * carries a `widgetId`, and its interior source identity is resolved on demand
- * by walking the subgraph input link (mirroring `resolveSubgraphInputTarget`).
- * This intentionally avoids the removed `widget.sourceNodeId`/`sourceWidgetName`
- * denormalization, so the helper reflects the real projection rather than a
- * deleted widget-object contract.
- */
 export async function getPromotedWidgets(
   comfyPage: ComfyPage,
   nodeId: string
@@ -47,49 +44,21 @@ export async function getPromotedWidgets(
   const { widgetSources, previewExposures } = await comfyPage.page.evaluate(
     (id) => {
       const node = window.app!.canvas.graph!.getNodeById(id)
-      const previewExposures = node?.serialize()?.properties?.previewExposures
-      if (!node?.isSubgraphNode?.())
-        return { widgetSources: [], previewExposures }
-
-      const { subgraph } = node
-      const resolveSource = (
-        inputName: string
-      ): ResolvedWidgetSource | undefined => {
-        const inputSlot = subgraph.inputNode.slots.find(
-          (slot) => slot.name === inputName
-        )
-        if (!inputSlot) return undefined
-        for (const linkId of inputSlot.linkIds) {
-          const link = subgraph.getLink(linkId)
-          if (!link) continue
-          const { inputNode } = link.resolve(subgraph)
-          if (!inputNode || !Array.isArray(inputNode.inputs)) continue
-          const targetInput = inputNode.inputs.find(
-            (entry) => entry.link === linkId
-          )
-          if (!targetInput) continue
-          if (inputNode.isSubgraphNode?.()) {
-            return {
-              sourceNodeId: String(inputNode.id),
-              sourceWidgetName: targetInput.name
-            }
+      const widgetSources = (node?.widgets ?? []).flatMap((widget) => {
+        if (!('sourceNodeId' in widget) || !('sourceWidgetName' in widget))
+          return []
+        return [
+          {
+            sourceNodeId: widget.sourceNodeId,
+            sourceWidgetName: widget.sourceWidgetName
           }
-          const widget = inputNode.getWidgetFromSlot(targetInput)
-          if (!widget) continue
-          return {
-            sourceNodeId: String(inputNode.id),
-            sourceWidgetName: widget.name
-          }
-        }
-        return undefined
-      }
-
-      const widgetSources = (node.inputs ?? []).flatMap((input) => {
-        if (!input.widgetId) return []
-        const source = resolveSource(input.name)
-        return source ? [source] : []
+        ]
       })
-      return { widgetSources, previewExposures }
+      const serializedNode = node?.serialize()
+      return {
+        widgetSources,
+        previewExposures: serializedNode?.properties?.previewExposures
+      }
     },
     nodeId
   )
@@ -98,7 +67,7 @@ export async function getPromotedWidgets(
     ? parsePreviewExposures(previewExposures)
     : []
   return [
-    ...widgetSources.map(widgetSourceToEntry),
+    ...widgetSources.filter(isPromotedWidgetSource).map(widgetSourceToEntry),
     ...exposures.map(previewExposureToEntry)
   ]
 }

browser_tests/tests/linkNodeInteractionSettings.spec.ts

@@ -21,7 +21,7 @@ test.describe('Link & node interaction settings', { tag: '@canvas' }, () => {
       await expect(comfyPage.searchBoxV2.input).toBeVisible()
     })
 
-    test('"context menu" opens litegraph connection menu on link release', async ({
+    test('"context menu" opens the link-release context menu on link release', async ({
       comfyPage
     }) => {
       await comfyPage.settings.setSetting(
@@ -29,7 +29,7 @@ test.describe('Link & node interaction settings', { tag: '@canvas' }, () => {
         'context menu'
       )
       await comfyPage.canvasOps.disconnectEdge()
-      await expect(comfyPage.contextMenu.litegraphContextMenu).toBeVisible()
+      await expect(comfyPage.contextMenu.linkReleaseMenu).toBeVisible()
     })
 
     test('"no action" suppresses both search box and context menu', async ({
@@ -41,7 +41,7 @@ test.describe('Link & node interaction settings', { tag: '@canvas' }, () => {
       )
       await comfyPage.canvasOps.disconnectEdge()
       await expect(comfyPage.searchBoxV2.input).toBeHidden()
-      await expect(comfyPage.contextMenu.litegraphContextMenu).toBeHidden()
+      await expect(comfyPage.contextMenu.linkReleaseMenu).toBeHidden()
     })
   })
 

browser_tests/tests/nodeReplacement.spec.ts

@@ -131,14 +131,6 @@ test.describe('Node replacement', { tag: ['@node', '@ui'] }, () => {
             'normal',
             1
           ])
-
-          if (mode.vueNodesEnabled) {
-            await expect(
-              comfyPage.vueNodes
-                .getWidgetByName('KSampler', 'denoise')
-                .locator('input')
-            ).toHaveValue(/^1(?:\.0+)?$/)
-          }
         })
 
         test('Success toast is shown after replacement', async ({

browser_tests/tests/nodeSearchBox.spec.ts

@@ -296,12 +296,7 @@ test.describe('Release context menu', { tag: '@node' }, () => {
     { tag: '@screenshot' },
     async ({ comfyPage }) => {
       await comfyPage.canvasOps.disconnectEdge()
-      const contextMenu = comfyPage.page.locator('.litecontextmenu')
-      // Wait for context menu with correct title (slot name | slot type)
-      // The title shows the output slot name and type from the disconnected link
-      await expect(contextMenu.locator('.litemenu-title')).toContainText(
-        'CLIP | CLIP'
-      )
+      await expect(comfyPage.contextMenu.linkReleaseMenu).toBeVisible()
       await comfyPage.page.mouse.move(10, 10)
       await comfyPage.expectScreenshot(
         comfyPage.canvas,
@@ -313,14 +308,20 @@ test.describe('Release context menu', { tag: '@node' }, () => {
   test(
     'Can search and add node from context menu',
     { tag: '@screenshot' },
-    async ({ comfyPage, comfyMouse }) => {
+    async ({ comfyPage }) => {
       const initialNodeCount = await comfyPage.nodeOps.getGraphNodesCount()
       await comfyPage.canvasOps.disconnectEdge()
-      await comfyMouse.move({ x: 10, y: 10 })
-      await comfyPage.contextMenu.clickMenuItem('Search')
-      await comfyPage.nextFrame()
-      await comfyPage.searchBox.fillAndSelectFirstNode('CLIP Prompt')
-      await waitForSearchInsertion(comfyPage, initialNodeCount)
+      await expect(comfyPage.contextMenu.linkReleaseMenu).toBeVisible()
+
+      await comfyPage.contextMenu.linkReleaseMenuSearch.fill('CLIP Prompt')
+      await expect(
+        comfyPage.contextMenu.linkReleaseMenu.getByRole('menuitem').first()
+      ).toBeVisible()
+      await comfyPage.page.keyboard.press('Enter')
+
+      await expect
+        .poll(() => comfyPage.nodeOps.getGraphNodesCount())
+        .toBe(initialNodeCount + 1)
       await expect(comfyPage.canvas).toHaveScreenshot(
         'link-context-menu-search.png'
       )
@@ -343,8 +344,7 @@ test.describe('Release context menu', { tag: '@node' }, () => {
     await comfyPage.canvasOps.disconnectEdge()
     // Context menu should appear, search box should not
     await expect(comfyPage.searchBox.input).toHaveCount(0)
-    const contextMenu = comfyPage.page.locator('.litecontextmenu')
-    await expect(contextMenu).toBeVisible()
+    await expect(comfyPage.contextMenu.linkReleaseMenu).toBeVisible()
   })
 
   test('Explicit setting overrides versioned defaults', async ({
@@ -366,7 +366,6 @@ test.describe('Release context menu', { tag: '@node' }, () => {
     await comfyPage.canvasOps.disconnectEdge()
     // Context menu should appear due to explicit setting, not search box
     await expect(comfyPage.searchBox.input).toHaveCount(0)
-    const contextMenu = comfyPage.page.locator('.litecontextmenu')
-    await expect(contextMenu).toBeVisible()
+    await expect(comfyPage.contextMenu.linkReleaseMenu).toBeVisible()
   })
 })

browser_tests/tests/propertiesPanel/nodeSelection.spec.ts

@@ -34,22 +34,6 @@ test.describe('Properties panel - Node selection', () => {
       await expect(panel.contentArea.getByText('seed')).toBeVisible()
       await expect(panel.contentArea.getByText('steps')).toBeVisible()
     })
-
-    test(
-      'a linked widget is disabled',
-      { tag: '@vue-nodes' },
-      async ({ comfyPage }) => {
-        const seed = panel.contentArea.getByLabel('seed').locator('input')
-        await comfyPage.searchBoxV2.addNode('Int')
-        const intNode = await comfyPage.vueNodes.getFixtureByTitle(/Int/)
-        const ksampler = await comfyPage.vueNodes.getFixtureByTitle('KSampler')
-
-        await ksampler.select()
-        await expect(seed).toBeEnabled()
-        await intNode.getSlot('INT').dragTo(ksampler.getSlot('seed'))
-        await expect(seed).toBeDisabled()
-      }
-    )
   })
 
   test.describe('Multi-node', () => {

browser_tests/tests/sidebar/assets-filter.spec.ts

@@ -15,10 +15,6 @@ import { createMixedMediaJobs } from '@e2e/fixtures/helpers/AssetsHelper'
 // fixtures — Playwright runs auto fixtures before the `comfyPage` fixture's
 // internal `setup()`, so the page first-loads with mocks already in place.
 // See cloud-asset-default.spec.ts for the same pattern.
-//
-// Use `waitForAssets()` not `waitForAssets(MIXED_JOBS.length)`: VirtualGrid can
-// virtualize the 3D card out of the initial render (#11635). Filtering reads the
-// full store, so the per-filter count assertions still cover the behavior.
 
 const MIXED_JOBS = createMixedMediaJobs(['images', 'video', 'audio', '3D'])
 
@@ -117,7 +113,7 @@ test.describe('Assets sidebar - media type filter', { tag: '@cloud' }, () => {
   }) => {
     const tab = comfyPage.menu.assetsTab
     await tab.open()
-    await tab.waitForAssets()
+    await tab.waitForAssets(MIXED_JOBS.length)
 
     await tab.openFilterMenu()
 
@@ -140,7 +136,7 @@ test.describe('Assets sidebar - media type filter', { tag: '@cloud' }, () => {
   }) => {
     const tab = comfyPage.menu.assetsTab
     await tab.open()
-    await tab.waitForAssets()
+    await tab.waitForAssets(MIXED_JOBS.length)
 
     await tab.openFilterMenu()
     await tab.toggleMediaTypeFilter('image')
@@ -157,7 +153,7 @@ test.describe('Assets sidebar - media type filter', { tag: '@cloud' }, () => {
   }) => {
     const tab = comfyPage.menu.assetsTab
     await tab.open()
-    await tab.waitForAssets()
+    await tab.waitForAssets(MIXED_JOBS.length)
 
     await tab.openFilterMenu()
     await tab.toggleMediaTypeFilter('video')
@@ -171,7 +167,7 @@ test.describe('Assets sidebar - media type filter', { tag: '@cloud' }, () => {
   }) => {
     const tab = comfyPage.menu.assetsTab
     await tab.open()
-    await tab.waitForAssets()
+    await tab.waitForAssets(MIXED_JOBS.length)
 
     await tab.openFilterMenu()
     await tab.toggleMediaTypeFilter('audio')
@@ -183,7 +179,7 @@ test.describe('Assets sidebar - media type filter', { tag: '@cloud' }, () => {
   test('Selecting only "3D" hides non-3D assets', async ({ comfyPage }) => {
     const tab = comfyPage.menu.assetsTab
     await tab.open()
-    await tab.waitForAssets()
+    await tab.waitForAssets(MIXED_JOBS.length)
 
     await tab.openFilterMenu()
     await tab.toggleMediaTypeFilter('3d')
@@ -197,7 +193,7 @@ test.describe('Assets sidebar - media type filter', { tag: '@cloud' }, () => {
   }) => {
     const tab = comfyPage.menu.assetsTab
     await tab.open()
-    await tab.waitForAssets()
+    await tab.waitForAssets(MIXED_JOBS.length)
 
     await tab.openFilterMenu()
     await tab.toggleMediaTypeFilter('image')
@@ -215,7 +211,7 @@ test.describe('Assets sidebar - media type filter', { tag: '@cloud' }, () => {
   }) => {
     const tab = comfyPage.menu.assetsTab
     await tab.open()
-    await tab.waitForAssets()
+    await tab.waitForAssets(MIXED_JOBS.length)
 
     await tab.openFilterMenu()
     await tab.toggleMediaTypeFilter('image')

browser_tests/tests/subgraph/subgraphNested.spec.ts

@@ -217,14 +217,6 @@ test.describe('Nested Subgraphs', { tag: ['@subgraph'] }, () => {
         }
       })
 
-      // Each promoted input must surface its own source value, so assert the
-      // name->value mapping rather than the first textbox in DOM order.
-      const EXPECTED_VALUE_BY_INPUT: Record<string, RegExp> = {
-        value: /Inner 1/,
-        value_1: /Inner 2/,
-        value_1_1: /Inner 3/
-      }
-
       test('Promoted widgets from inner SubgraphNode are visible with correct values', async ({
         comfyPage
       }) => {
@@ -236,16 +228,11 @@ test.describe('Nested Subgraphs', { tag: ['@subgraph'] }, () => {
         const widgets = outerNode.getByTestId(TestIds.widgets.widget)
         await comfyExpect(widgets).toHaveCount(4)
 
-        for (const [inputName, expectedValue] of Object.entries(
-          EXPECTED_VALUE_BY_INPUT
-        )) {
-          const valueWidget = outerNode.getByRole('textbox', {
-            name: inputName,
-            exact: true
-          })
-          await comfyExpect(valueWidget).toBeVisible()
-          await comfyExpect(valueWidget).toHaveValue(expectedValue)
-        }
+        const valueWidget = outerNode
+          .getByRole('textbox', { name: 'value' })
+          .first()
+        await comfyExpect(valueWidget).toBeVisible()
+        await comfyExpect(valueWidget).toHaveValue(/Inner 1/)
       })
 
       test('Promoted widgets from inner SubgraphNode carry correct source identity', async ({
@@ -284,16 +271,11 @@ test.describe('Nested Subgraphs', { tag: ['@subgraph'] }, () => {
         const widgetsAfter = outerNodeAfter.getByTestId(TestIds.widgets.widget)
         await comfyExpect(widgetsAfter).toHaveCount(initialCount)
 
-        for (const [inputName, expectedValue] of Object.entries(
-          EXPECTED_VALUE_BY_INPUT
-        )) {
-          const valueWidget = outerNodeAfter.getByRole('textbox', {
-            name: inputName,
-            exact: true
-          })
-          await comfyExpect(valueWidget).toBeVisible()
-          await comfyExpect(valueWidget).toHaveValue(expectedValue)
-        }
+        const valueWidget = outerNodeAfter
+          .getByRole('textbox', { name: 'value' })
+          .first()
+        await comfyExpect(valueWidget).toBeVisible()
+        await comfyExpect(valueWidget).toHaveValue(/Inner 1/)
       })
     }
   )

browser_tests/tests/subgraph/subgraphPromotionDom.spec.ts

@@ -53,22 +53,6 @@ test.describe(
       await SubgraphHelper.expectWidgetBelowHeader(nodeLocator, seedWidget)
     })
 
-    test('Promoted textarea materializes once when a node is converted to a subgraph', async ({
-      comfyPage
-    }) => {
-      await comfyPage.workflow.loadWorkflow('default')
-
-      const clipNode = await comfyPage.nodeOps.getNodeRefById('6')
-      await clipNode.click('title')
-      const subgraphNode = await clipNode.convertToSubgraph()
-
-      const promotedTextarea = comfyPage.vueNodes
-        .getNodeLocator(String(subgraphNode.id))
-        .getByRole('textbox', { name: 'text', exact: true })
-      await expect(promotedTextarea).toHaveCount(1)
-      await expect(promotedTextarea).toBeVisible()
-    })
-
     test.describe(
       'Promoted Text Widget Lifecycle',
       { tag: ['@vue-nodes'] },

browser_tests/tests/subgraph/subgraphSeed.spec.ts

@@ -1,50 +0,0 @@
-import { mergeTests } from '@playwright/test'
-
-import {
-  comfyExpect as expect,
-  comfyPageFixture as test
-} from '@e2e/fixtures/ComfyPage'
-import { ExecutionHelper } from '@e2e/fixtures/helpers/ExecutionHelper'
-import { webSocketFixture } from '@e2e/fixtures/ws'
-
-const wstest = mergeTests(test, webSocketFixture)
-
-wstest(
-  'Seed handling',
-  { tag: '@vue-nodes' },
-  async ({ comfyPage, getWebSocket }) => {
-    const execution = new ExecutionHelper(comfyPage, await getWebSocket())
-
-    async function verifySeedControl(initializeState = true) {
-      const seedWidget = comfyPage.vueNodes.getWidgetByName('', 'seed')
-      const { input, valueControl } =
-        comfyPage.vueNodes.getInputNumberControls(seedWidget)
-
-      if (initializeState) {
-        await input.fill('1')
-        await valueControl.click()
-        await comfyPage.page.getByRole('radio', { name: 'increment' }).click()
-        await comfyPage.keyboard.press('Escape')
-      }
-
-      await execution.run()
-      await expect.soft(input).toHaveValue('2')
-    }
-
-    await test.step('seed updates on generation', async () => {
-      await verifySeedControl()
-    })
-
-    await test.step('subgraph seed updates on generation', async () => {
-      await comfyPage.subgraph.convertDefaultKSamplerToSubgraph()
-      await verifySeedControl()
-    })
-
-    for (const w of ['link-seed', 'proxy-seed', 'zit-seed']) {
-      await test.step(`seed updates for old workflow: ${w}`, async () => {
-        await comfyPage.workflow.loadWorkflow('subgraphs/' + w)
-        await verifySeedControl(false)
-      })
-    }
-  }
-)

browser_tests/tests/subgraph/subgraphSerialization.spec.ts

@@ -484,14 +484,6 @@ test.describe('Subgraph Serialization', { tag: ['@subgraph'] }, () => {
         'subgraphs/subgraph-with-promoted-text-widget'
       )
 
-      // Assert against the visible textbox the user sees, not the internal
-      // graph/widget projection.
-      const promotedTextWidgets = comfyPage.page.getByRole('textbox', {
-        name: 'text',
-        exact: true
-      })
-      await comfyExpect(promotedTextWidgets).toHaveCount(1)
-
       const originalNode = await comfyPage.nodeOps.getNodeRefById('11')
       const originalPos = await originalNode.getPosition()
 
@@ -505,58 +497,31 @@ test.describe('Subgraph Serialization', { tag: ['@subgraph'] }, () => {
         await comfyPage.page.keyboard.up('Alt')
       }
 
-      await comfyExpect(promotedTextWidgets).toHaveCount(2)
-    })
-
-    test(
-      'Cloning a subgraph node preserves edited promoted widget values on original and clone',
-      { tag: ['@vue-nodes'] },
-      async ({ comfyPage }) => {
-        await comfyPage.workflow.loadWorkflow(
-          'subgraphs/subgraph-with-promoted-text-widget'
-        )
-
-        const editedValue = 'Edited prompt that must survive cloning'
-        const originalTextbox = comfyPage.vueNodes
-          .getNodeLocator('11')
-          .getByRole('textbox', { name: 'text' })
-        await expect(originalTextbox).toBeVisible()
-        await expect(originalTextbox).toHaveValue('')
-        await originalTextbox.fill(editedValue)
-
-        const originalNode = await comfyPage.nodeOps.getNodeRefById('11')
-        await originalNode.click('title')
-        await comfyPage.clipboard.copy()
-        await comfyPage.clipboard.paste()
-
-        async function collectSubgraphNodeIds() {
-          return comfyPage.page.evaluate(() => {
-            const graph = window.app!.canvas.graph!
-            return graph.nodes
-              .filter(
-                (n) =>
-                  typeof n.isSubgraphNode === 'function' && n.isSubgraphNode()
-              )
-              .map((n) => String(n.id))
-          })
-        }
-
-        await expect
-          .poll(async () => (await collectSubgraphNodeIds()).length)
-          .toBeGreaterThan(1)
-
-        const subgraphNodeIds = await collectSubgraphNodeIds()
-        for (const nodeId of subgraphNodeIds) {
-          const textbox = comfyPage.vueNodes
-            .getNodeLocator(nodeId)
-            .getByRole('textbox', { name: 'text' })
-          await expect(
-            textbox,
-            `node ${nodeId} promoted text widget reset to default after clone`
-          ).toHaveValue(editedValue)
-        }
+      async function collectSubgraphNodeIds() {
+        return comfyPage.page.evaluate(() => {
+          const graph = window.app!.canvas.graph!
+          return graph.nodes
+            .filter(
+              (n) =>
+                typeof n.isSubgraphNode === 'function' && n.isSubgraphNode()
+            )
+            .map((n) => String(n.id))
+        })
       }
-    )
+
+      await expect
+        .poll(async () => (await collectSubgraphNodeIds()).length)
+        .toBeGreaterThan(1)
+
+      const subgraphNodeIds = await collectSubgraphNodeIds()
+      for (const nodeId of subgraphNodeIds) {
+        const promotedWidgets = await getPromotedWidgets(comfyPage, nodeId)
+        expect(promotedWidgets.length).toBeGreaterThan(0)
+        expect(
+          promotedWidgets.some(([, widgetName]) => widgetName === 'text')
+        ).toBe(true)
+      }
+    })
   })
 
   test.describe('Duplicate ID Remapping', () => {

browser_tests/tests/templates.spec.ts

@@ -5,7 +5,6 @@ import type { WorkflowTemplates } from '@/platform/workflow/templates/types/temp
 import { getWav } from '@e2e/fixtures/components/AudioPreview'
 import { comfyPageFixture as test } from '@e2e/fixtures/ComfyPage'
 import { TestIds } from '@e2e/fixtures/selectors'
-import { trackElementFlash } from '@e2e/fixtures/utils/flashDetector'
 
 async function checkTemplateFileExists(
   page: Page,
@@ -506,32 +505,3 @@ test.describe('Templates', { tag: ['@slow', '@workflow'] }, () => {
     expect(popup.url()).toEqual(tutorialUrl)
   })
 })
-
-test.describe(
-  'Templates deeplink (new user)',
-  { tag: ['@slow', '@workflow'] },
-  () => {
-    test('templates dialog never flashes when first-time user opens a template link', async ({
-      comfyPage
-    }) => {
-      const templatesFlash = await trackElementFlash(
-        comfyPage.page,
-        TestIds.templates.content
-      )
-
-      await comfyPage.settings.setSetting('Comfy.TutorialCompleted', false)
-
-      await comfyPage.setup({
-        clearStorage: true,
-        url: '/?template=default'
-      })
-
-      await expect
-        .poll(() => comfyPage.nodeOps.getGraphNodesCount())
-        .toBeGreaterThan(0)
-
-      expect(await templatesFlash.hasFlashed()).toBe(false)
-      await expect(comfyPage.templates.content).toBeHidden()
-    })
-  }
-)

browser_tests/tests/vueNodes/groups/groups.spec.ts

@@ -177,30 +177,6 @@ test.describe('Vue Node Groups', { tag: ['@screenshot', '@vue-nodes'] }, () => {
     }).toPass({ timeout: 5000 })
   })
 
-  test('does not drag contents when control is held', async ({ comfyPage }) => {
-    await comfyPage.keyboard.selectAll()
-    await comfyPage.page.keyboard.press(CREATE_GROUP_HOTKEY)
-    const groupCount = () => comfyPage.page.evaluate(() => graph!.groups.length)
-    await expect.poll(groupCount, 'create group').toBe(1)
-    await comfyPage.page.mouse.click(100, 100)
-
-    const ksampler = await comfyPage.vueNodes.getFixtureByTitle('KSampler')
-    const initialNodeBounds = await ksampler.boundingBox()
-    expect(initialNodeBounds).toBeTruthy()
-
-    const groupPos = await getGroupTitlePosition(comfyPage, 'Group')
-    await comfyPage.page.mouse.move(groupPos.x, groupPos.y)
-    await comfyPage.page.mouse.down()
-    await comfyPage.page.keyboard.down('Control')
-    await comfyPage.page.mouse.move(groupPos.x + 100, groupPos.y)
-    await comfyPage.page.mouse.up()
-    await comfyPage.page.keyboard.up('Control')
-    await expect
-      .poll(() => getGroupTitlePosition(comfyPage, 'Group'))
-      .not.toEqual(groupPos)
-    expect(await ksampler.boundingBox()).toEqual(initialNodeBounds)
-  })
-
   test('should keep groups aligned after loading legacy Vue workflows', async ({
     comfyPage
   }) => {

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

@@ -1,5 +1,3 @@
-import type { UploadImageResponse } from '@comfyorg/ingest-types'
-
 import {
   comfyExpect as expect,
   comfyPageFixture as test
@@ -25,42 +23,4 @@ test.describe('Vue Upload Widgets', { tag: '@vue-nodes' }, () => {
       )
       .toBeGreaterThan(0)
   })
-
-  test('shows a spinner during upload', async ({ comfyPage }) => {
-    let releaseUpload: () => void = () => {}
-    const uploadResponse: UploadImageResponse = { name: 'spinner-test.png' }
-
-    await comfyPage.page.route('**/upload/image', async (route) => {
-      await new Promise<void>((resolve) => {
-        releaseUpload = resolve
-      })
-      await route.fulfill({
-        status: 200,
-        contentType: 'application/json',
-        body: JSON.stringify(uploadResponse)
-      })
-    })
-    for (const nodeName of ['Load Image', 'Load Video', 'Load Audio']) {
-      await test.step(`for ${nodeName}`, async () => {
-        await comfyPage.menu.topbar.newWorkflowButton.click()
-        await comfyPage.nextFrame()
-        await comfyPage.searchBoxV2.addNode(nodeName)
-
-        const node = comfyPage.vueNodes.getNodeByTitle(nodeName)
-        const fileInput = node.locator('input[type="file"]')
-        const spinner = node.getByRole('status')
-
-        await expect(spinner).toBeHidden()
-        await fileInput.setInputFiles({
-          name: 'spinner-test.png',
-          mimeType: 'image/png',
-          buffer: Buffer.from('test')
-        })
-
-        await expect(spinner).toBeVisible()
-        releaseUpload()
-        await expect(spinner).toBeHidden()
-      })
-    }
-  })
 })

codecov.yml

@@ -4,14 +4,3 @@ comment:
   require_changes: false
   require_base: false
   require_head: true
-
-# Carry forward the last known coverage for a flag when its upload is missing or
-# late. The `e2e` flag is uploaded by a separate workflow_run job that can fail
-# or arrive after Codecov has already computed the patch status; without this,
-# E2E-only code paths show up as patch misses and the patch status fails. See
-# https://docs.codecov.com/docs/carryforward-flags
-flags:
-  unit:
-    carryforward: true
-  e2e:
-    carryforward: true

global.d.ts

@@ -49,11 +49,6 @@ interface Window {
     posthog_project_token?: string
     posthog_api_host?: string
     posthog_config?: Record<string, unknown>
-    customer_io?: {
-      write_key?: string
-      site_id?: string
-      user_id?: string
-    }
     require_whitelist?: boolean
     subscription_required?: boolean
     max_upload_size?: number

package.json

@@ -1,6 +1,6 @@
 {
   "name": "@comfyorg/comfyui-frontend",
-  "version": "1.47.2",
+  "version": "1.47.0",
   "private": true,
   "description": "Official front-end implementation of ComfyUI",
   "homepage": "https://comfy.org",
@@ -66,7 +66,6 @@
     "@comfyorg/registry-types": "workspace:*",
     "@comfyorg/shared-frontend-utils": "workspace:*",
     "@comfyorg/tailwind-utils": "workspace:*",
-    "@customerio/cdp-analytics-browser": "catalog:",
     "@formkit/auto-animate": "catalog:",
     "@iconify/json": "catalog:",
     "@primeuix/forms": "catalog:",

pnpm-lock.yaml

@@ -21,9 +21,6 @@ catalogs:
     '@comfyorg/comfyui-electron-types':
       specifier: 0.6.2
       version: 0.6.2
-    '@customerio/cdp-analytics-browser':
-      specifier: ^0.5.3
-      version: 0.5.3
     '@eslint/js':
       specifier: ^10.0.1
       version: 10.0.1
@@ -450,9 +447,6 @@ importers:
       '@comfyorg/tailwind-utils':
         specifier: workspace:*
         version: link:packages/tailwind-utils
-      '@customerio/cdp-analytics-browser':
-        specifier: 'catalog:'
-        version: 0.5.3
       '@formkit/auto-animate':
         specifier: 'catalog:'
         version: 0.9.0
@@ -1447,15 +1441,6 @@ packages:
     peerDependencies:
       postcss-selector-parser: ^7.0.0
 
-  '@customerio/cdp-analytics-browser@0.5.3':
-    resolution: {integrity: sha512-P4lBz+P2iCekq+DOETiAtSfdMyNVQd7OjXhocjffjPtyBJ0ADhpvYuNZAT9R+q2AFrDTx0m8cuyJAtEG+qiXPQ==}
-
-  '@customerio/cdp-analytics-core@0.5.3':
-    resolution: {integrity: sha512-mjR0dyzsX8UjMAh22bT5ByiIEYwtpnNhc9TlHTk2nGPhFnMctSsn9KuMXD9BmfSFcjdmTPg+iABOq68yyPBPHg==}
-
-  '@customerio/jist@0.1.8':
-    resolution: {integrity: sha512-MPiAm5rxu6+wQiEPwY+nV/5i7y67vJ0TvQpeQrOuATzWC45kgpu4YAJm+RlrpDOq35CK1C3utlPG/wI1F6ycXg==}
-
   '@cyberalien/svg-utils@1.2.15':
     resolution: {integrity: sha512-ZbKU6npzW5PNocdoLVJYfKzaP+c/RpT6JUkoaKrW1DOcw6lyXub8XtcNpI3xok6FnyNjS6ZbsrrtjTnS9yeZAQ==}
 
@@ -2397,14 +2382,6 @@ packages:
     engines: {node: '>=18'}
     hasBin: true
 
-  '@lukeed/csprng@1.1.0':
-    resolution: {integrity: sha512-Z7C/xXCiGWsg0KuKsHTKJxbWhpI3Vs5GwLfOean7MGyVFGqdRgBbAjOCh6u4bbjPc/8MJ2pZmK/0DLdCbivLDA==}
-    engines: {node: '>=8'}
-
-  '@lukeed/uuid@2.0.1':
-    resolution: {integrity: sha512-qC72D4+CDdjGqJvkFMMEAtancHUQ7/d/tAiHf64z8MopFDmcrtbcJuerDtFceuAfQJ2pDSfCKCtbqoGBNnwg0w==}
-    engines: {node: '>=8'}
-
   '@mdx-js/react@3.1.1':
     resolution: {integrity: sha512-f++rKLQgUVYDAtECQ6fn/is15GkEH9+nZPM3MS0RcxVqoTfawHvDlSCH7JbMhAM6uJ32v3eXLvLmLvjGu7PTQw==}
     peerDependencies:
@@ -3298,18 +3275,6 @@ packages:
   '@rushstack/ts-command-line@5.3.1':
     resolution: {integrity: sha512-mid/JIZSJafwy3x9e4v0wVLuAqSSYYErEHV0HXPALYLSBN13YNkR5caOk0hf97lSRKrxhtvQjGaDKSEelR3sMg==}
 
-  '@segment/analytics.js-video-plugins@0.2.1':
-    resolution: {integrity: sha512-lZwCyEXT4aaHBLNK433okEKdxGAuyrVmop4BpQqQSJuRz0DglPZgd9B/XjiiWs1UyOankg2aNYMN3VcS8t4eSQ==}
-
-  '@segment/facade@3.4.10':
-    resolution: {integrity: sha512-xVQBbB/lNvk/u8+ey0kC/+g8pT3l0gCT8O2y9Z+StMMn3KAFAQ9w8xfgef67tJybktOKKU7pQGRPolRM1i1pdA==}
-
-  '@segment/isodate-traverse@1.1.1':
-    resolution: {integrity: sha512-+G6e1SgAUkcq0EDMi+SRLfT48TNlLPF3QnSgFGVs0V9F3o3fq/woQ2rHFlW20W0yy5NnCUH0QGU3Am2rZy/E3w==}
-
-  '@segment/isodate@1.0.3':
-    resolution: {integrity: sha512-BtanDuvJqnACFkeeYje7pWULVv8RgZaqKHWwGFnL/g/TH/CcZjkIVTfGDp/MAxmilYHUkrX70SqwnYSTNEaN7A==}
-
   '@sentry-internal/browser-utils@10.32.1':
     resolution: {integrity: sha512-sjLLep1es3rTkbtAdTtdpc/a6g7v7bK5YJiZJsUigoJ4NTiFeMI5uIDCxbH/tjJ1q23YE1LzVn7T96I+qBRjHA==}
     engines: {node: '>=18'}
@@ -5072,9 +5037,6 @@ packages:
   csstype@3.2.3:
     resolution: {integrity: sha512-z1HGKcYy2xA8AGQfwrn0PAy+PB7X/GSj3UVJW9qKyn43xWa+gl5nXmU4qqLMRzWVLFC8KusUX8T/0kCiOYpAIQ==}
 
-  customerio-gist-web@3.23.2:
-    resolution: {integrity: sha512-oCM7WNEx/3cmEG1qQCKWrMwOtU+h41TTKJICNEb7Wj/1jR6+RJsj3b+3N+5u9TxgvUMusmLFvnVvqshU017eHA==}
-
   cva@1.0.0-beta.4:
     resolution: {integrity: sha512-F/JS9hScapq4DBVQXcK85l9U91M6ePeXoBMSp7vypzShoefUBxjQTo3g3935PUHgQd+IW77DjbPRIxugy4/GCQ==}
     peerDependencies:
@@ -6293,10 +6255,6 @@ packages:
     engines: {node: '>=14'}
     hasBin: true
 
-  js-cookie@3.0.1:
-    resolution: {integrity: sha512-+0rgsUXZu4ncpPxRL+lNEptWMOWl9etvPHc/koSRp6MPwpRYAhmk0dUG00J4bxVV3r9uUzfo24wW0knS07SKSw==}
-    engines: {node: '>=12'}
-
   js-cookie@3.0.7:
     resolution: {integrity: sha512-z/wZZgDrkNV1eA0ULjM/F9/50Ya8fbzgKneSpoPsXSGd0KnpdtHfOZWK+GcwLk+EZbS4F9RBhU+K2RgzuDaItw==}
     engines: {node: '>=20'}
@@ -6929,9 +6887,6 @@ packages:
     resolution: {integrity: sha512-Z4SmBUweYa09+o6pG+eASabEpP6QkQ70yHj351pQoEXIs8uHbaU2DWVmzBANKgflPa47A50PtB2+NgRpQvr7vA==}
     engines: {node: '>= 10'}
 
-  new-date@1.0.3:
-    resolution: {integrity: sha512-0fsVvQPbo2I18DT2zVHpezmeeNYV2JaJSrseiHLc17GNOxJzUdx5mvSigPu8LtIfZSij5i1wXnXFspEs2CD6hA==}
-
   nlcst-to-string@4.0.0:
     resolution: {integrity: sha512-YKLBCcUYKAg0FNlOBT6aI91qFmSiFKiluk655WzPF+DDMA02qIyy8uiRqI8QXtcFpEvll12LpL5MXqEmAZ+dcA==}
 
@@ -6981,9 +6936,6 @@ packages:
     engines: {node: '>=18'}
     hasBin: true
 
-  obj-case@0.2.1:
-    resolution: {integrity: sha512-PquYBBTy+Y6Ob/O2574XHhDtHJlV1cJHMCgW+rDRc9J5hhmRelJB3k5dTK/3cVmFVtzvAKuENeuLpoyTzMzkOg==}
-
   object-assign@4.1.1:
     resolution: {integrity: sha512-rJgTQnkUnH1sFw8yT6VSU3zD3sWmu6sZhIseY8VX+GRu3P6F7Fu+JNDoXfklElbLJSnc3FUQHVe4cU5hj+BcUg==}
     engines: {node: '>=0.10.0'}
@@ -7824,9 +7776,6 @@ packages:
   space-separated-tokens@2.0.2:
     resolution: {integrity: sha512-PEGlAwrG8yXGXRjW32fGbg66JAlOAwbObuqVoJpv/mRgoWDQfgH1wDPvtzWyUSNAXBGSk8h755YDbbcEy3SH2Q==}
 
-  spark-md5@3.0.2:
-    resolution: {integrity: sha512-wcFzz9cDfbuqe0FZzfi2or1sgyIrsDwmPwfZC4hiNidPdPINjeUwNfv5kldczoEAcjl9Y1L3SM7Uz2PUEQzxQw==}
-
   speakingurl@14.0.1:
     resolution: {integrity: sha512-1POYv7uv2gXoyGFpBCmpDVSNV74IfsWlDW216UPjbWufNf+bSU6GdbDsxdcxtfwb4xlI3yxzOTKClUosxARYrQ==}
     engines: {node: '>=0.10.0'}
@@ -8226,12 +8175,6 @@ packages:
   unescape-js@1.1.4:
     resolution: {integrity: sha512-42SD8NOQEhdYntEiUQdYq/1V/YHwr1HLwlHuTJB5InVVdOSbgI6xu8jK5q65yIzuFCfczzyDF/7hbGzVbyCw0g==}
 
-  unfetch@3.1.2:
-    resolution: {integrity: sha512-L0qrK7ZeAudGiKYw6nzFjnJ2D5WHblUBwmHIqtPS6oKUd+Hcpk7/hKsSmcHsTlpd1TbTNsiRBUKRq3bHLNIqIw==}
-
-  unfetch@4.2.0:
-    resolution: {integrity: sha512-F9p7yYCn6cIW9El1zi0HI6vqpeIvBsr3dSuRO6Xuppb1u5rXpCPmMvLSyECLhybr9isec8Ohl0hPekMVrEinDA==}
-
   unified@11.0.5:
     resolution: {integrity: sha512-xKvGhPWw3k84Qjh8bI3ZeJjqnyadK+GEFtazSfZv/rKeTkTjOJho6mFqh2SM96iIcZokxiOpg78GazTSg8+KHA==}
 
@@ -8417,10 +8360,6 @@ packages:
     resolution: {integrity: sha512-vIYxrBCC/N/K+Js3qSN88go7kIfNPssr/hHCesKCQNAjmgvYS2oqr69kIufEG+O4+PfezOH4EbIeHCfFov8ZgQ==}
     hasBin: true
 
-  uuid@14.0.0:
-    resolution: {integrity: sha512-Qo+uWgilfSmAhXCMav1uYFynlQO7fMFiMVZsQqZRMIXp0O7rR7qjkj+cPvBHLgBqi960QCoo/PH2/6ZtVqKvrg==}
-    hasBin: true
-
   valibot@1.2.0:
     resolution: {integrity: sha512-mm1rxUsmOxzrwnX5arGS+U4T25RdvpPjPN4yR0u9pUBov9+zGVtO84tif1eY4r6zWxVxu3KzIyknJy3rxfRZZg==}
     peerDependencies:
@@ -8701,8 +8640,8 @@ packages:
   vue-component-type-helpers@3.3.2:
     resolution: {integrity: sha512-l4Z2Y34m7nFMlx8vrslJaVtXxUpzgDMSESC7TakG/c5kwjYT/do+E0NcT2/vWDzaoIhsShg/2OKwX7Q4nbzC0g==}
 
-  vue-component-type-helpers@3.3.5:
-    resolution: {integrity: sha512-Fe1jyPJoUGpJOYKOri44jduR7My4yYINOMJISuMAbmrs+L5LbIDUc8NTWZYY3EJLK0yPLuCmcd5zoCsE4k2/KA==}
+  vue-component-type-helpers@3.3.4:
+    resolution: {integrity: sha512-joip1uZTaQR0nD23N400gIdJ7xY+WiiiMA/BCKz842gvGBknqDQAzklUvDEhqFvvrhQY8S2ZANBMu4X70VMFGw==}
 
   vue-demi@0.14.10:
     resolution: {integrity: sha512-nMZBOwuzabUO0nLgIcc6rycZEebF6eeUfaiQx9+WSk8e29IbLvPU9feI6tqW4kTo3hvoYAJkMh8n8D0fuISphg==}
@@ -9551,30 +9490,6 @@ snapshots:
     dependencies:
       postcss-selector-parser: 7.1.1
 
-  '@customerio/cdp-analytics-browser@0.5.3':
-    dependencies:
-      '@customerio/cdp-analytics-core': 0.5.3
-      '@lukeed/uuid': 2.0.1
-      '@segment/analytics.js-video-plugins': 0.2.1
-      '@segment/facade': 3.4.10
-      customerio-gist-web: 3.23.2
-      dset: 3.1.4
-      js-cookie: 3.0.1
-      node-fetch: 2.7.0
-      spark-md5: 3.0.2
-      tslib: 2.8.1
-      unfetch: 4.2.0
-    transitivePeerDependencies:
-      - encoding
-
-  '@customerio/cdp-analytics-core@0.5.3':
-    dependencies:
-      '@lukeed/uuid': 2.0.1
-      dset: 3.1.4
-      tslib: 2.8.1
-
-  '@customerio/jist@0.1.8': {}
-
   '@cyberalien/svg-utils@1.2.15':
     dependencies:
       '@iconify/types': 2.0.0
@@ -10535,12 +10450,6 @@ snapshots:
       - ws
       - zod
 
-  '@lukeed/csprng@1.1.0': {}
-
-  '@lukeed/uuid@2.0.1':
-    dependencies:
-      '@lukeed/csprng': 1.1.0
-
   '@mdx-js/react@3.1.1(@types/react@19.1.9)(react@19.2.4)':
     dependencies:
       '@types/mdx': 2.0.13
@@ -11170,23 +11079,6 @@ snapshots:
     transitivePeerDependencies:
       - '@types/node'
 
-  '@segment/analytics.js-video-plugins@0.2.1':
-    dependencies:
-      unfetch: 3.1.2
-
-  '@segment/facade@3.4.10':
-    dependencies:
-      '@segment/isodate-traverse': 1.1.1
-      inherits: 2.0.4
-      new-date: 1.0.3
-      obj-case: 0.2.1
-
-  '@segment/isodate-traverse@1.1.1':
-    dependencies:
-      '@segment/isodate': 1.0.3
-
-  '@segment/isodate@1.0.3': {}
-
   '@sentry-internal/browser-utils@10.32.1':
     dependencies:
       '@sentry/core': 10.32.1
@@ -11431,7 +11323,7 @@ snapshots:
       storybook: 10.2.10(@testing-library/dom@10.4.1)(prettier@3.7.4)(react-dom@19.2.4(react@19.2.4))(react@19.2.4)
       type-fest: 2.19.0
       vue: 3.5.34(typescript@5.9.3)
-      vue-component-type-helpers: 3.3.5
+      vue-component-type-helpers: 3.3.4
 
   '@swc/helpers@0.5.21':
     dependencies:
@@ -13211,11 +13103,6 @@ snapshots:
 
   csstype@3.2.3: {}
 
-  customerio-gist-web@3.23.2:
-    dependencies:
-      '@customerio/jist': 0.1.8
-      uuid: 14.0.0
-
   cva@1.0.0-beta.4(typescript@5.9.3):
     dependencies:
       clsx: 2.1.1
@@ -14588,8 +14475,6 @@ snapshots:
       js-cookie: 3.0.7
       nopt: 7.2.1
 
-  js-cookie@3.0.1: {}
-
   js-cookie@3.0.7: {}
 
   js-stringify@1.0.2: {}
@@ -15396,10 +15281,6 @@ snapshots:
 
   neotraverse@0.6.18: {}
 
-  new-date@1.0.3:
-    dependencies:
-      '@segment/isodate': 1.0.3
-
   nlcst-to-string@4.0.0:
     dependencies:
       '@types/nlcst': 2.0.3
@@ -15442,8 +15323,6 @@ snapshots:
       pathe: 2.0.3
       tinyexec: 1.0.4
 
-  obj-case@0.2.1: {}
-
   object-assign@4.1.1: {}
 
   object-inspect@1.13.4: {}
@@ -16561,8 +16440,6 @@ snapshots:
 
   space-separated-tokens@2.0.2: {}
 
-  spark-md5@3.0.2: {}
-
   speakingurl@14.0.1: {}
 
   sprintf-js@1.0.3: {}
@@ -16977,10 +16854,6 @@ snapshots:
     dependencies:
       string.fromcodepoint: 0.2.1
 
-  unfetch@3.1.2: {}
-
-  unfetch@4.2.0: {}
-
   unified@11.0.5:
     dependencies:
       '@types/unist': 3.0.3
@@ -17171,8 +17044,6 @@ snapshots:
 
   uuid@11.1.1: {}
 
-  uuid@14.0.0: {}
-
   valibot@1.2.0(typescript@5.9.3):
     optionalDependencies:
       typescript: 5.9.3
@@ -17598,7 +17469,7 @@ snapshots:
 
   vue-component-type-helpers@3.3.2: {}
 
-  vue-component-type-helpers@3.3.5: {}
+  vue-component-type-helpers@3.3.4: {}
 
   vue-demi@0.14.10(vue@3.5.34(typescript@5.9.3)):
     dependencies:

pnpm-workspace.yaml

@@ -15,7 +15,6 @@ catalog:
   '@astrojs/sitemap': ^3.7.3
   '@astrojs/vue': ^6.0.1
   '@comfyorg/comfyui-electron-types': 0.6.2
-  '@customerio/cdp-analytics-browser': ^0.5.3
   '@eslint/js': ^10.0.1
   '@formkit/auto-animate': ^0.9.0
   '@iconify-json/lucide': ^1.1.178

scripts/cicd/pr-playwright-deploy-and-comment.sh

@@ -1,13 +1,8 @@
 #!/bin/bash
 set -e
 
-# Deploy Playwright test reports to Cloudflare Pages and write section markdown.
+# Deploy Playwright test reports to Cloudflare Pages and comment on PR
 # Usage: ./pr-playwright-deploy-and-comment.sh <pr_number> <branch_name> <status>
-#
-# When SUMMARY_FILE env var is set, the generated markdown is written there
-# instead of posted as a standalone GitHub comment. The caller is then
-# responsible for upserting that content into the unified PR report via the
-# upsert-comment-section action.
 
 # Input validation
 # Validate PR number is numeric
@@ -108,28 +103,17 @@ deploy_report() {
     echo "failed"
 }
 
-# Post or update GitHub comment, or write to SUMMARY_FILE if set.
-# When SUMMARY_FILE is set, the caller (workflow) is responsible for upserting
-# the content into the unified PR report via upsert-comment-section.
-# The gh-api branch below is unused in CI (SUMMARY_FILE is always set there);
-# it is retained for local/standalone runs that post a comment directly.
+# Post or update GitHub comment
 post_comment() {
     body="$1"
-
-    if [ -n "${SUMMARY_FILE:-}" ]; then
-        printf '%s\n' "$body" > "$SUMMARY_FILE" || { echo "Failed to write $SUMMARY_FILE" >&2; exit 1; }
-        echo "Wrote playwright section to $SUMMARY_FILE" >&2
-        return
-    fi
-
     temp_file=$(mktemp)
     echo "$body" > "$temp_file"
-
+    
     if command -v gh > /dev/null 2>&1; then
         # Find existing comment ID
         existing=$(gh api "repos/$GITHUB_REPOSITORY/issues/$PR_NUMBER/comments" \
             --jq ".[] | select(.body | contains(\"$COMMENT_MARKER\")) | .id" | head -1)
-
+        
         if [ -n "$existing" ]; then
             # Update specific comment by ID
             gh api --method PATCH "repos/$GITHUB_REPOSITORY/issues/comments/$existing" \
@@ -142,20 +126,15 @@ post_comment() {
         echo "GitHub CLI not available, outputting comment:"
         cat "$temp_file"
     fi
-
+    
     rm -f "$temp_file"
 }
 
 # Main execution
 if [ "$STATUS" = "starting" ]; then
-    # When writing to SUMMARY_FILE, omit the standalone marker (the upsert
-    # action uses its own section delimiters).
-    if [ -n "${SUMMARY_FILE:-}" ]; then
-        comment="## 🎭 Playwright: ⏳ Running..."
-    else
-        comment="$COMMENT_MARKER
+    # Post concise starting comment
+    comment="$COMMENT_MARKER
 ## 🎭 Playwright: ⏳ Running..."
-    fi
     post_comment "$comment"
     
 else
@@ -302,14 +281,9 @@ else
         flaky_note=" · $total_flaky flaky"
     fi
     
-    # Generate compact single-line comment (omit standalone marker when writing
-    # to SUMMARY_FILE — the upsert action adds its own section delimiters).
-    if [ -n "${SUMMARY_FILE:-}" ]; then
-        comment="## 🎭 Playwright: $status_icon $total_passed passed, $total_failed failed$flaky_note"
-    else
-        comment="$COMMENT_MARKER
+    # Generate compact single-line comment
+    comment="$COMMENT_MARKER
 ## 🎭 Playwright: $status_icon $total_passed passed, $total_failed failed$flaky_note"
-    fi
 
     # Extract and display failed tests from all browsers (flaky tests are treated as passing)
     if [ $total_failed -gt 0 ]; then

scripts/cicd/pr-storybook-deploy-and-comment.sh

@@ -1,13 +1,8 @@
 #!/bin/bash
 set -e
 
-# Deploy Storybook to Cloudflare Pages and write section markdown.
+# Deploy Storybook to Cloudflare Pages and comment on PR
 # Usage: ./pr-storybook-deploy-and-comment.sh <pr_number> <branch_name> <status>
-#
-# When SUMMARY_FILE env var is set, the generated markdown is written there
-# instead of posted as a standalone GitHub comment. The caller is then
-# responsible for upserting that content into the unified PR report via the
-# upsert-comment-section action.
 
 # Input validation
 # Validate PR number is numeric
@@ -96,26 +91,17 @@ deploy_storybook() {
     echo "failed"
 }
 
-# Post or update GitHub comment, or write to SUMMARY_FILE if set.
-# When SUMMARY_FILE is set, the caller (workflow) is responsible for upserting
-# the content into the unified PR report via upsert-comment-section.
+# Post or update GitHub comment
 post_comment() {
     body="$1"
-
-    if [ -n "${SUMMARY_FILE:-}" ]; then
-        printf '%s\n' "$body" > "$SUMMARY_FILE" || { echo "Failed to write $SUMMARY_FILE" >&2; exit 1; }
-        echo "Wrote storybook section to $SUMMARY_FILE" >&2
-        return
-    fi
-
     temp_file=$(mktemp)
     echo "$body" > "$temp_file"
-
+    
     if command -v gh > /dev/null 2>&1; then
         # Find existing comment ID
         existing=$(gh api "repos/$GITHUB_REPOSITORY/issues/$PR_NUMBER/comments" \
             --jq ".[] | select(.body | contains(\"$COMMENT_MARKER\")) | .id" | head -1)
-
+        
         if [ -n "$existing" ]; then
             # Update specific comment by ID
             gh api --method PATCH "repos/$GITHUB_REPOSITORY/issues/comments/$existing" \
@@ -127,20 +113,15 @@ post_comment() {
         echo "GitHub CLI not available, outputting comment:"
         cat "$temp_file"
     fi
-
+    
     rm -f "$temp_file"
 }
 
 # Main execution
 if [ "$STATUS" = "starting" ]; then
-    # When writing to SUMMARY_FILE, omit the standalone marker (the upsert
-    # action uses its own section delimiters).
-    if [ -n "${SUMMARY_FILE:-}" ]; then
-        comment="## 🎨 Storybook: <img alt='loading' src='https://github.com/user-attachments/assets/755c86ee-e445-4ea8-bc2c-cca85df48686' width='14px' height='14px'/> Building..."
-    else
-        comment="$COMMENT_MARKER
+    # Post starting comment
+    comment="$COMMENT_MARKER
 ## 🎨 Storybook: <img alt='loading' src='https://github.com/user-attachments/assets/755c86ee-e445-4ea8-bc2c-cca85df48686' width='14px' height='14px'/> Building..."
-    fi
     post_comment "$comment"
     
 elif [ "$STATUS" = "completed" ]; then
@@ -216,18 +197,10 @@ elif [ "$STATUS" = "completed" ]; then
 
 </details>"
 
-    # Omit standalone marker when writing to SUMMARY_FILE — the upsert action
-    # adds its own section delimiters.
-    if [ -n "${SUMMARY_FILE:-}" ]; then
-        comment="$header
-
-$details"
-    else
-        comment="$COMMENT_MARKER
+    comment="$COMMENT_MARKER
 $header
 
 $details"
-    fi
-
+    
     post_comment "$comment"
-fi
+fi

scripts/perf-report.ts

@@ -316,16 +316,12 @@ function renderFullReport(
     lines.push(
       `⚠️ **${flaggedRows.length} regression${flaggedRows.length > 1 ? 's' : ''} detected**`,
       '',
-      '<details><summary>Show regressions</summary>',
-      '',
       ...tableHeader,
       ...flaggedRows,
-      '',
-      '</details>',
       ''
     )
   } else {
-    lines.push('✅ No regressions detected.', '')
+    lines.push('No regressions detected.', '')
   }
 
   lines.push(
@@ -397,8 +393,6 @@ function renderColdStartReport(
   lines.push(
     `> ℹ️ Collecting baseline variance data (${historicalCount}/15 runs). Significance will appear after 2 main branch runs.`,
     '',
-    '<details><summary>All metrics (cold start)</summary>',
-    '',
     '| Metric | Baseline | PR | Δ |',
     '|--------|----------|-----|---|'
   )
@@ -436,7 +430,6 @@ function renderColdStartReport(
     }
   }
 
-  lines.push('', '</details>')
   return lines
 }
 
@@ -445,10 +438,7 @@ function renderNoBaselineReport(
 ): string[] {
   const lines: string[] = []
   lines.push(
-    '> ℹ️ No baseline found — significance unavailable.',
-    '',
-    '<details><summary>Absolute values</summary>',
-    '',
+    'No baseline found — showing absolute values.\n',
     '| Metric | Value |',
     '|--------|-------|'
   )
@@ -459,7 +449,6 @@ function renderNoBaselineReport(
       lines.push(`| ${testName}: ${label} | ${formatValue(prVal, unit)} |`)
     }
   }
-  lines.push('', '</details>')
   return lines
 }
 

src/components/actionbar/ComfyRunButton/CloudRunButtonWrapper.test.ts

@@ -1,69 +0,0 @@
-import { render, screen } from '@testing-library/vue'
-import { beforeEach, describe, expect, it, vi } from 'vitest'
-import { nextTick, ref } from 'vue'
-
-import CloudRunButtonWrapper from './CloudRunButtonWrapper.vue'
-
-const mockIsActiveSubscription = ref(true)
-
-vi.mock('@/composables/billing/useBillingContext', () => ({
-  useBillingContext: () => ({
-    isActiveSubscription: mockIsActiveSubscription
-  })
-}))
-
-vi.mock('@/components/actionbar/ComfyRunButton/ComfyQueueButton.vue', () => ({
-  default: {
-    name: 'ComfyQueueButton',
-    template: '<div data-testid="queue-button" />'
-  }
-}))
-
-vi.mock('@/platform/cloud/subscription/components/SubscribeToRun.vue', () => ({
-  default: {
-    name: 'SubscribeToRun',
-    template: '<div data-testid="subscribe-to-run-button" />'
-  }
-}))
-
-function renderWrapper() {
-  return render(CloudRunButtonWrapper)
-}
-
-describe('CloudRunButtonWrapper', () => {
-  beforeEach(() => {
-    mockIsActiveSubscription.value = true
-  })
-
-  it('renders the runnable queue button when the subscription is active', () => {
-    renderWrapper()
-
-    expect(screen.getByTestId('queue-button')).toBeInTheDocument()
-    expect(
-      screen.queryByTestId('subscribe-to-run-button')
-    ).not.toBeInTheDocument()
-  })
-
-  it('locks the run button when the subscription is inactive', () => {
-    mockIsActiveSubscription.value = false
-    renderWrapper()
-
-    expect(screen.getByTestId('subscribe-to-run-button')).toBeInTheDocument()
-    expect(screen.queryByTestId('queue-button')).not.toBeInTheDocument()
-  })
-
-  it('unlocks the run button once the subscription becomes active again', async () => {
-    mockIsActiveSubscription.value = false
-    renderWrapper()
-
-    expect(screen.getByTestId('subscribe-to-run-button')).toBeInTheDocument()
-
-    mockIsActiveSubscription.value = true
-    await nextTick()
-
-    expect(screen.getByTestId('queue-button')).toBeInTheDocument()
-    expect(
-      screen.queryByTestId('subscribe-to-run-button')
-    ).not.toBeInTheDocument()
-  })
-})

src/components/builder/AppBuilder.vue

@@ -10,7 +10,7 @@ import IoItem from '@/components/builder/IoItem.vue'
 import PropertiesAccordionItem from '@/components/rightSidePanel/layout/PropertiesAccordionItem.vue'
 import { useResolvedSelectedInputs } from '@/components/builder/useResolvedSelectedInputs'
 import type { ResolvedSelection } from '@/components/builder/useResolvedSelectedInputs'
-import type { WidgetId } from '@/types/widgetId'
+import type { WidgetEntityId } from '@/world/entityIds'
 import { LiteGraph } from '@/lib/litegraph/src/litegraph'
 import type { LGraphNode, NodeId } from '@/lib/litegraph/src/LGraphNode'
 import type { LGraphCanvas } from '@/lib/litegraph/src/LGraphCanvas'
@@ -110,8 +110,8 @@ function getWidgetBounding(entry: ResolvedSelection): BoundStyle | undefined {
   }
 }
 
-function removeSelectedWidgetId(widgetId: WidgetId): void {
-  const index = appModeStore.selectedInputs.findIndex(([id]) => id === widgetId)
+function removeSelectedEntityId(entityId: WidgetEntityId): void {
+  const index = appModeStore.selectedInputs.findIndex(([id]) => id === entityId)
   if (index !== -1) appModeStore.selectedInputs.splice(index, 1)
 }
 
@@ -139,11 +139,11 @@ function handleClick(e: MouseEvent) {
   }
   if (!isSelectInputsMode.value || widget.options.canvasOnly) return
 
-  const widgetId = widget.widgetId
-  if (!widgetId) return
-  const index = appModeStore.selectedInputs.findIndex(([id]) => id === widgetId)
+  const entityId = widget.entityId
+  if (!entityId) return
+  const index = appModeStore.selectedInputs.findIndex(([id]) => id === entityId)
   if (index === -1)
-    appModeStore.selectedInputs.push([widgetId, widget.name, undefined])
+    appModeStore.selectedInputs.push([entityId, widget.name, undefined])
   else appModeStore.selectedInputs.splice(index, 1)
 }
 
@@ -172,7 +172,7 @@ const renderedInputs = computed<[string, MaybeRef<BoundStyle> | undefined][]>(
   () =>
     resolvedInputs.value.map(
       (entry) =>
-        [entry.widgetId, getWidgetBounding(entry)] as [
+        [entry.entityId, getWidgetBounding(entry)] as [
           string,
           MaybeRef<BoundStyle> | undefined
         ]
@@ -220,7 +220,7 @@ const renderedInputs = computed<[string, MaybeRef<BoundStyle> | undefined][]>(
           v-slot="{ dragClass }"
           v-model="appModeStore.selectedInputs"
         >
-          <template v-for="entry in resolvedInputs" :key="entry.widgetId">
+          <template v-for="entry in resolvedInputs" :key="entry.entityId">
             <IoItem
               v-if="entry.status === 'resolved'"
               :class="
@@ -239,7 +239,7 @@ const renderedInputs = computed<[string, MaybeRef<BoundStyle> | undefined][]>(
               "
               :title="entry.displayName"
               :sub-title="t('linearMode.builder.unknownWidget')"
-              :remove="() => removeSelectedWidgetId(entry.widgetId)"
+              :remove="() => removeSelectedEntityId(entry.entityId)"
             />
           </template>
         </DraggableList>

src/components/builder/AppModeWidgetList.vue

@@ -60,7 +60,7 @@ const mappedSelections = computed((): WidgetEntry[] => {
 
   return resolvedInputs.value.flatMap((entry) => {
     if (entry.status !== 'resolved') return []
-    const { widgetId, node, widget, config } = entry
+    const { entityId, node, widget, config } = entry
     if (node.mode !== LGraphEventMode.ALWAYS) return []
 
     if (!nodeDataByNode.has(node)) {
@@ -70,7 +70,7 @@ const mappedSelections = computed((): WidgetEntry[] => {
 
     const matchingWidget = fullNodeData.widgets?.find((vueWidget) => {
       if (vueWidget.slotMetadata?.linked) return false
-      return vueWidget.widgetId === widgetId
+      return vueWidget.entityId === entityId
     })
     if (!matchingWidget) return []
 
@@ -79,7 +79,7 @@ const mappedSelections = computed((): WidgetEntry[] => {
 
     return [
       {
-        key: widgetId,
+        key: entityId,
         persistedHeight: config?.height,
         nodeData: {
           ...fullNodeData,

src/components/builder/useResolvedSelectedInputs.test.ts

@@ -1,13 +1,12 @@
 import { createTestingPinia } from '@pinia/testing'
-import { fromAny, fromPartial } from '@total-typescript/shoehorn'
+import { fromAny } from '@total-typescript/shoehorn'
 import { setActivePinia } from 'pinia'
 import { afterEach, beforeEach, describe, expect, it, vi } from 'vitest'
 
 import type { LGraphNode } from '@/lib/litegraph/src/LGraphNode'
-import type { INodeInputSlot } from '@/lib/litegraph/src/interfaces'
 import { app } from '@/scripts/app'
 import { useAppModeStore } from '@/stores/appModeStore'
-import type { WidgetId } from '@/types/widgetId'
+import type { WidgetEntityId } from '@/world/entityIds'
 
 import { useResolvedSelectedInputs } from './useResolvedSelectedInputs'
 
@@ -23,29 +22,18 @@ vi.mock('@/scripts/app', () => ({
 }))
 
 const rootGraphId = '11111111-1111-4111-8111-111111111111'
-const entitySeed = `${rootGraphId}:1:seed` as WidgetId
+const entitySeed = `${rootGraphId}:1:seed` as WidgetEntityId
 
 function makeNode(id: number, widgetNames: string[]): LGraphNode {
   return fromAny<LGraphNode, unknown>({
     id,
-    inputs: [],
-    isSubgraphNode: () => false,
     widgets: widgetNames.map((name) => ({
       name,
-      widgetId: `${rootGraphId}:${id}:${name}` as WidgetId
+      entityId: `${rootGraphId}:${id}:${name}` as WidgetEntityId
     }))
   })
 }
 
-function makeSubgraphNode(id: number, inputs: INodeInputSlot[]): LGraphNode {
-  return fromAny<LGraphNode, unknown>({
-    id,
-    inputs,
-    isSubgraphNode: () => true,
-    widgets: []
-  })
-}
-
 function setRootGraphNodes(nodes: LGraphNode[]) {
   vi.mocked(app.rootGraph).nodes = nodes
   vi.mocked(app.rootGraph).getNodeById = vi.fn(
@@ -100,27 +88,4 @@ describe('useResolvedSelectedInputs', () => {
 
     expect(resolved.value[0]?.status).toBe('unknown')
   })
-
-  it('resolves promoted subgraph inputs from their host input widgetId', () => {
-    const node = makeSubgraphNode(1, [
-      fromPartial<INodeInputSlot>({
-        name: 'seed',
-        label: 'renamed_seed',
-        widgetId: entitySeed
-      })
-    ])
-    setRootGraphNodes([node])
-
-    const appModeStore = useAppModeStore()
-    appModeStore.selectedInputs = [[entitySeed, 'seed']]
-
-    const resolved = useResolvedSelectedInputs()
-
-    expect(resolved.value[0]).toMatchObject({
-      status: 'resolved',
-      node,
-      displayName: 'seed',
-      widget: { name: 'seed', label: 'renamed_seed', widgetId: entitySeed }
-    })
-  })
 })

src/components/builder/useResolvedSelectedInputs.ts

@@ -1,19 +1,18 @@
 import { useEventListener } from '@vueuse/core'
 import { computed, shallowRef, triggerRef } from 'vue'
 
-import { promotedInputWidgets } from '@/core/graph/subgraph/promotedInputWidget'
 import type { LGraphNode } from '@/lib/litegraph/src/LGraphNode'
 import type { IBaseWidget } from '@/lib/litegraph/src/types/widgets'
 import type { InputWidgetConfig } from '@/platform/workflow/management/stores/comfyWorkflow'
 import { app } from '@/scripts/app'
 import { useAppModeStore } from '@/stores/appModeStore'
-import type { WidgetId } from '@/types/widgetId'
-import { isWidgetId, parseWidgetId } from '@/types/widgetId'
+import type { WidgetEntityId } from '@/world/entityIds'
+import { isWidgetEntityId, parseWidgetEntityId } from '@/world/entityIds'
 
 export type ResolvedSelection =
   | {
       status: 'resolved'
-      widgetId: WidgetId
+      entityId: WidgetEntityId
       node: LGraphNode
       widget: IBaseWidget
       displayName: string
@@ -21,7 +20,7 @@ export type ResolvedSelection =
     }
   | {
       status: 'unknown'
-      widgetId: WidgetId
+      entityId: WidgetEntityId
       displayName: string
       config?: InputWidgetConfig
     }
@@ -55,19 +54,16 @@ export function useResolvedSelectedInputs() {
     if (!rootGraph) return []
 
     return appModeStore.selectedInputs.flatMap(
-      ([widgetId, displayName, config]): ResolvedSelection[] => {
-        if (!isWidgetId(widgetId)) return []
-        const { nodeId, name } = parseWidgetId(widgetId)
+      ([entityId, displayName, config]): ResolvedSelection[] => {
+        if (!isWidgetEntityId(entityId)) return []
+        const { nodeId, name } = parseWidgetEntityId(entityId)
         const node = rootGraph.getNodeById(nodeId)
-        const widgets = node?.isSubgraphNode()
-          ? promotedInputWidgets(node)
-          : node?.widgets
-        const widget = widgets?.find((w) => w.name === name)
+        const widget = node?.widgets?.find((w) => w.name === name)
         if (!node || !widget) {
-          return [{ status: 'unknown', widgetId, displayName, config }]
+          return [{ status: 'unknown', entityId, displayName, config }]
         }
         return [
-          { status: 'resolved', widgetId, node, widget, displayName, config }
+          { status: 'resolved', entityId, node, widget, displayName, config }
         ]
       }
     )

src/components/error/ErrorOverlay.test.ts

@@ -7,26 +7,12 @@ import { createI18n } from 'vue-i18n'
 import ErrorOverlay from './ErrorOverlay.vue'
 import { useExecutionErrorStore } from '@/stores/executionErrorStore'
 import type { NodeError } from '@/schemas/apiSchema'
-import type {
-  MissingPackGroup,
-  SwapNodeGroup
-} from '@/components/rightSidePanel/errors/useErrorGroups'
 import type { ErrorGroup } from '@/components/rightSidePanel/errors/types'
-import type { MissingMediaGroup } from '@/platform/missingMedia/types'
-import type { MissingModelGroup } from '@/platform/missingModel/types'
 
-const mockErrorGroups = vi.hoisted(() => ({
-  allErrorGroups: { value: [] as ErrorGroup[] },
-  missingPackGroups: { value: [] as MissingPackGroup[] },
-  missingModelGroups: { value: [] as MissingModelGroup[] },
-  missingMediaGroups: { value: [] as MissingMediaGroup[] },
-  swapNodeGroups: { value: [] as SwapNodeGroup[] }
-}))
-
-const mockAllErrorGroups = mockErrorGroups.allErrorGroups
+const mockAllErrorGroups = vi.hoisted(() => ({ value: [] as ErrorGroup[] }))
 
 vi.mock('@/components/rightSidePanel/errors/useErrorGroups', () => ({
-  useErrorGroups: () => mockErrorGroups
+  useErrorGroups: () => ({ allErrorGroups: mockAllErrorGroups })
 }))
 
 vi.mock('@/composables/graph/useNodeErrorFlagSync', () => ({
@@ -76,6 +62,7 @@ function createTestI18n() {
           dismiss: 'Dismiss'
         },
         errorOverlay: {
+          errorCount: '{count} ERROR | {count} ERRORS',
           multipleErrorCount: '{count} error found | {count} errors found',
           multipleErrorsMessage: 'Resolve them before running the workflow.',
           viewDetails: 'View details'
@@ -121,10 +108,6 @@ function renderOverlay(props: { appMode?: boolean } = {}) {
 describe('ErrorOverlay', () => {
   beforeEach(() => {
     mockAllErrorGroups.value = []
-    mockErrorGroups.missingPackGroups.value = []
-    mockErrorGroups.missingModelGroups.value = []
-    mockErrorGroups.missingMediaGroups.value = []
-    mockErrorGroups.swapNodeGroups.value = []
     mockOpenPanel.mockClear()
     mockCanvasStore.linearMode = false
     mockCanvasStore.canvas = null
@@ -133,12 +116,17 @@ describe('ErrorOverlay', () => {
   })
 
   it('renders a single overlay message without list markup', async () => {
+    renderOverlay()
+
+    const executionErrorStore = useExecutionErrorStore()
+    executionErrorStore.lastNodeErrors = {
+      '1': makeNodeError(['Only error'])
+    }
     mockAllErrorGroups.value = [
       {
         type: 'execution',
         groupKey: 'execution:KSampler',
         displayTitle: 'Execution failed',
-        count: 1,
         priority: 0,
         cards: [
           {
@@ -149,12 +137,6 @@ describe('ErrorOverlay', () => {
         ]
       }
     ]
-    renderOverlay()
-
-    const executionErrorStore = useExecutionErrorStore()
-    executionErrorStore.lastNodeErrors = {
-      '1': makeNodeError(['Only error'])
-    }
     executionErrorStore.showErrorOverlay()
     await nextTick()
 
@@ -163,19 +145,21 @@ describe('ErrorOverlay', () => {
     expect(screen.getByTestId('error-overlay-see-errors')).toHaveTextContent(
       'View details'
     )
-    expect(screen.getByTestId('error-overlay-dismiss')).toHaveAccessibleName(
-      'Close'
-    )
     expect(screen.queryByRole('list')).not.toBeInTheDocument()
   })
 
   it('keeps the app mode button label', async () => {
+    renderOverlay({ appMode: true })
+
+    const executionErrorStore = useExecutionErrorStore()
+    executionErrorStore.lastNodeErrors = {
+      '1': makeNodeError(['Only error'])
+    }
     mockAllErrorGroups.value = [
       {
         type: 'execution',
         groupKey: 'execution:KSampler',
         displayTitle: 'Execution failed',
-        count: 1,
         priority: 0,
         cards: [
           {
@@ -186,12 +170,6 @@ describe('ErrorOverlay', () => {
         ]
       }
     ]
-    renderOverlay({ appMode: true })
-
-    const executionErrorStore = useExecutionErrorStore()
-    executionErrorStore.lastNodeErrors = {
-      '1': makeNodeError(['Only error'])
-    }
     executionErrorStore.showErrorOverlay()
     await nextTick()
 

src/components/error/ErrorOverlay.vue

@@ -7,35 +7,47 @@
     <div v-if="isVisible" class="pointer-events-none flex w-full justify-end">
       <div
         role="status"
+        aria-live="polite"
         data-testid="error-overlay"
-        class="pointer-events-auto relative flex w-fit max-w-120 min-w-80 flex-col gap-2 overflow-hidden rounded-lg border border-l-4 border-border-default border-l-destructive-background bg-base-background p-3 shadow-interface transition-colors duration-200 ease-in-out"
+        class="pointer-events-auto flex w-fit max-w-120 min-w-80 flex-col overflow-hidden rounded-lg border border-destructive-background bg-comfy-menu-bg shadow-interface transition-colors duration-200 ease-in-out"
       >
-        <div class="flex w-full items-start gap-2 pr-8">
-          <i
-            class="mt-0.5 icon-[lucide--circle-x] size-4 shrink-0 text-destructive-background"
-          />
-          <span class="min-w-0 flex-1 truncate text-sm text-base-foreground">
+        <!-- Header -->
+        <div class="flex h-12 items-center gap-2 px-4">
+          <span class="flex-1 text-sm font-bold text-destructive-background">
             {{ overlayTitle }}
           </span>
+          <Button
+            variant="muted-textonly"
+            size="icon-sm"
+            :aria-label="t('g.close')"
+            @click="dismiss"
+          >
+            <i class="icon-[lucide--x] block size-5 leading-none" />
+          </Button>
         </div>
 
-        <div
-          class="flex w-full items-start gap-2 pr-8"
-          data-testid="error-overlay-messages"
-        >
-          <span class="size-4 shrink-0" aria-hidden="true" />
+        <!-- Body -->
+        <div class="px-4 pb-3" data-testid="error-overlay-messages">
           <p
-            class="m-0 line-clamp-3 min-w-0 flex-1 text-sm/snug wrap-break-word whitespace-pre-wrap text-muted-foreground"
+            class="m-0 line-clamp-3 text-sm/snug wrap-break-word whitespace-pre-wrap text-muted-foreground"
           >
             {{ overlayMessage }}
           </p>
         </div>
 
-        <div class="flex w-full items-center justify-end pt-2">
+        <!-- Footer -->
+        <div class="flex items-center justify-end gap-4 px-4 py-3">
+          <Button
+            variant="muted-textonly"
+            size="unset"
+            data-testid="error-overlay-dismiss"
+            @click="dismiss"
+          >
+            {{ t('g.dismiss') }}
+          </Button>
           <Button
             variant="secondary"
-            size="unset"
-            class="min-h-8 rounded-lg px-3 py-2 text-xs font-normal"
+            size="lg"
             data-testid="error-overlay-see-errors"
             @click="seeErrors"
           >
@@ -46,17 +58,6 @@
             }}
           </Button>
         </div>
-
-        <Button
-          variant="muted-textonly"
-          size="icon-sm"
-          class="absolute top-2 right-2 size-6 rounded-sm"
-          data-testid="error-overlay-dismiss"
-          :aria-label="t('g.close')"
-          @click="dismiss"
-        >
-          <i class="icon-[lucide--x] block size-4 leading-none" />
-        </Button>
       </div>
     </div>
   </Transition>

src/components/error/useErrorOverlayState.test.ts

@@ -8,26 +8,12 @@ import { useErrorOverlayState } from './useErrorOverlayState'
 import { useExecutionErrorStore } from '@/stores/executionErrorStore'
 import { useMissingMediaStore } from '@/platform/missingMedia/missingMediaStore'
 import type { NodeError } from '@/schemas/apiSchema'
-import type {
-  MissingPackGroup,
-  SwapNodeGroup
-} from '@/components/rightSidePanel/errors/useErrorGroups'
 import type { ErrorGroup } from '@/components/rightSidePanel/errors/types'
-import type { MissingMediaGroup } from '@/platform/missingMedia/types'
-import type { MissingModelGroup } from '@/platform/missingModel/types'
 
-const mockErrorGroups = vi.hoisted(() => ({
-  allErrorGroups: { value: [] as ErrorGroup[] },
-  missingPackGroups: { value: [] as MissingPackGroup[] },
-  missingModelGroups: { value: [] as MissingModelGroup[] },
-  missingMediaGroups: { value: [] as MissingMediaGroup[] },
-  swapNodeGroups: { value: [] as SwapNodeGroup[] }
-}))
-
-const mockAllErrorGroups = mockErrorGroups.allErrorGroups
+const mockAllErrorGroups = vi.hoisted(() => ({ value: [] as ErrorGroup[] }))
 
 vi.mock('@/components/rightSidePanel/errors/useErrorGroups', () => ({
-  useErrorGroups: () => mockErrorGroups
+  useErrorGroups: () => ({ allErrorGroups: mockAllErrorGroups })
 }))
 
 vi.mock('@/composables/graph/useNodeErrorFlagSync', () => ({
@@ -58,6 +44,7 @@ function createTestI18n() {
     messages: {
       en: {
         errorOverlay: {
+          errorCount: '{count} ERROR | {count} ERRORS',
           multipleErrorCount: '{count} error found | {count} errors found',
           multipleErrorsMessage: 'Resolve them before running the workflow.'
         }
@@ -105,19 +92,20 @@ function mountOverlayState() {
 describe('useErrorOverlayState', () => {
   beforeEach(() => {
     mockAllErrorGroups.value = []
-    mockErrorGroups.missingPackGroups.value = []
-    mockErrorGroups.missingModelGroups.value = []
-    mockErrorGroups.missingMediaGroups.value = []
-    mockErrorGroups.swapNodeGroups.value = []
   })
 
   it('uses the raw message for a single uncataloged execution error', async () => {
+    mountOverlayState()
+
+    const executionErrorStore = useExecutionErrorStore()
+    executionErrorStore.lastNodeErrors = {
+      '1': makeNodeError(['Only error'])
+    }
     mockAllErrorGroups.value = [
       {
         type: 'execution',
         groupKey: 'execution:KSampler',
         displayTitle: 'Execution failed',
-        count: 1,
         priority: 0,
         cards: [
           {
@@ -128,12 +116,6 @@ describe('useErrorOverlayState', () => {
         ]
       }
     ]
-    mountOverlayState()
-
-    const executionErrorStore = useExecutionErrorStore()
-    executionErrorStore.lastNodeErrors = {
-      '1': makeNodeError(['Only error'])
-    }
     executionErrorStore.showErrorOverlay()
     await nextTick()
 
@@ -143,12 +125,17 @@ describe('useErrorOverlayState', () => {
   })
 
   it('uses toast copy for a single validation error', async () => {
+    mountOverlayState()
+
+    const executionErrorStore = useExecutionErrorStore()
+    executionErrorStore.lastNodeErrors = {
+      '1': makeNodeError(['Required input is missing'])
+    }
     mockAllErrorGroups.value = [
       {
         type: 'execution',
         groupKey: 'execution:KSampler',
         displayTitle: 'Required input is missing',
-        count: 1,
         priority: 0,
         cards: [
           {
@@ -165,12 +152,6 @@ describe('useErrorOverlayState', () => {
         ]
       }
     ]
-    mountOverlayState()
-
-    const executionErrorStore = useExecutionErrorStore()
-    executionErrorStore.lastNodeErrors = {
-      '1': makeNodeError(['Required input is missing'])
-    }
     executionErrorStore.showErrorOverlay()
     await nextTick()
 
@@ -183,12 +164,17 @@ describe('useErrorOverlayState', () => {
   })
 
   it('uses display copy before raw copy when toast copy is absent', async () => {
+    mountOverlayState()
+
+    const executionErrorStore = useExecutionErrorStore()
+    executionErrorStore.lastNodeErrors = {
+      '1': makeNodeError(['Raw validation error'])
+    }
     mockAllErrorGroups.value = [
       {
         type: 'execution',
         groupKey: 'execution:KSampler',
         displayTitle: 'Friendly validation title',
-        count: 1,
         priority: 0,
         cards: [
           {
@@ -204,12 +190,6 @@ describe('useErrorOverlayState', () => {
         ]
       }
     ]
-    mountOverlayState()
-
-    const executionErrorStore = useExecutionErrorStore()
-    executionErrorStore.lastNodeErrors = {
-      '1': makeNodeError(['Raw validation error'])
-    }
     executionErrorStore.showErrorOverlay()
     await nextTick()
 
@@ -222,12 +202,24 @@ describe('useErrorOverlayState', () => {
   })
 
   it('uses toast copy for a single runtime error', async () => {
+    mountOverlayState()
+
+    const executionErrorStore = useExecutionErrorStore()
+    executionErrorStore.lastExecutionError = {
+      prompt_id: 'prompt',
+      node_id: 1,
+      node_type: 'KSampler',
+      executed: [],
+      exception_message: 'CUDA out of memory',
+      exception_type: 'torch.OutOfMemoryError',
+      traceback: [],
+      timestamp: Date.now()
+    }
     mockAllErrorGroups.value = [
       {
         type: 'execution',
         groupKey: 'execution:KSampler',
         displayTitle: 'Generation failed',
-        count: 1,
         priority: 0,
         cards: [
           {
@@ -245,19 +237,6 @@ describe('useErrorOverlayState', () => {
         ]
       }
     ]
-    mountOverlayState()
-
-    const executionErrorStore = useExecutionErrorStore()
-    executionErrorStore.lastExecutionError = {
-      prompt_id: 'prompt',
-      node_id: 1,
-      node_type: 'KSampler',
-      executed: [],
-      exception_message: 'CUDA out of memory',
-      exception_type: 'torch.OutOfMemoryError',
-      traceback: [],
-      timestamp: Date.now()
-    }
     executionErrorStore.showErrorOverlay()
     await nextTick()
 
@@ -268,44 +247,6 @@ describe('useErrorOverlayState', () => {
   })
 
   it('uses group toast copy for a single missing media error', async () => {
-    mockErrorGroups.missingMediaGroups.value = [
-      {
-        mediaType: 'image',
-        items: [
-          {
-            name: 'image.png',
-            mediaType: 'image',
-            representative: {
-              nodeId: '1',
-              nodeType: 'LoadImage',
-              widgetName: 'image',
-              mediaType: 'image',
-              name: 'image.png',
-              isMissing: true
-            },
-            referencingNodes: [
-              {
-                nodeId: '1',
-                nodeType: 'LoadImage',
-                widgetName: 'image'
-              }
-            ]
-          }
-        ]
-      }
-    ]
-    mockAllErrorGroups.value = [
-      {
-        type: 'missing_media',
-        groupKey: 'missing_media',
-        displayTitle: 'Media input missing',
-        displayMessage: 'A required media input has no file selected.',
-        toastTitle: 'Media input missing',
-        toastMessage: 'Load Image is missing a required media file.',
-        count: 1,
-        priority: 3
-      }
-    ]
     mountOverlayState()
 
     const executionErrorStore = useExecutionErrorStore()
@@ -320,6 +261,17 @@ describe('useErrorOverlayState', () => {
         isMissing: true
       }
     ])
+    mockAllErrorGroups.value = [
+      {
+        type: 'missing_media',
+        groupKey: 'missing_media',
+        displayTitle: 'Media input missing',
+        displayMessage: 'A required media input has no file selected.',
+        toastTitle: 'Media input missing',
+        toastMessage: 'Load Image is missing a required media file.',
+        priority: 3
+      }
+    ]
     executionErrorStore.showErrorOverlay()
     await nextTick()
 
@@ -329,147 +281,6 @@ describe('useErrorOverlayState', () => {
     )
   })
 
-  it('uses group copy for one missing model referenced by multiple nodes', async () => {
-    mockErrorGroups.missingModelGroups.value = [
-      {
-        directory: 'checkpoints',
-        isAssetSupported: true,
-        models: [
-          {
-            name: 'missing.safetensors',
-            representative: {
-              nodeId: '1',
-              nodeType: 'CheckpointLoaderSimple',
-              widgetName: 'ckpt_name',
-              name: 'missing.safetensors',
-              directory: 'checkpoints',
-              isAssetSupported: true,
-              isMissing: true
-            },
-            referencingNodes: [
-              { nodeId: '1', widgetName: 'ckpt_name' },
-              { nodeId: '2', widgetName: 'ckpt_name' }
-            ]
-          }
-        ]
-      }
-    ]
-    mockAllErrorGroups.value = [
-      {
-        type: 'missing_model',
-        groupKey: 'missing_model',
-        displayTitle: 'Missing Models',
-        displayMessage: 'Import a model, or open the node to replace it.',
-        toastTitle: 'Model missing',
-        toastMessage: 'CheckpointLoaderSimple is missing missing.safetensors.',
-        count: 1,
-        priority: 2
-      }
-    ]
-    mountOverlayState()
-
-    const executionErrorStore = useExecutionErrorStore()
-    executionErrorStore.showErrorOverlay()
-    await nextTick()
-
-    expect(screen.getByTestId('title')).toHaveTextContent('Missing Models')
-    expect(screen.getByTestId('message')).toHaveTextContent(
-      'Import a model, or open the node to replace it.'
-    )
-  })
-
-  it('uses group copy for one execution group with multiple errors', async () => {
-    mockAllErrorGroups.value = [
-      {
-        type: 'execution',
-        groupKey: 'execution:required_input_missing',
-        displayTitle: 'Missing connection',
-        displayMessage: 'Required input slots have no connection feeding them.',
-        count: 2,
-        priority: 1,
-        cards: [
-          {
-            id: '1',
-            title: 'KSampler',
-            errors: [
-              { message: 'KSampler is missing model' },
-              { message: 'KSampler is missing positive' }
-            ]
-          }
-        ]
-      }
-    ]
-    mountOverlayState()
-
-    const executionErrorStore = useExecutionErrorStore()
-    executionErrorStore.showErrorOverlay()
-    await nextTick()
-
-    expect(screen.getByTestId('title')).toHaveTextContent('Missing connection')
-    expect(screen.getByTestId('message')).toHaveTextContent(
-      'Required input slots have no connection feeding them.'
-    )
-  })
-
-  it('uses aggregate copy for one missing model group with multiple rows', async () => {
-    mockErrorGroups.missingModelGroups.value = [
-      {
-        directory: 'checkpoints',
-        isAssetSupported: true,
-        models: [
-          {
-            name: 'first.safetensors',
-            representative: {
-              nodeId: '1',
-              nodeType: 'CheckpointLoaderSimple',
-              widgetName: 'ckpt_name',
-              name: 'first.safetensors',
-              directory: 'checkpoints',
-              isAssetSupported: true,
-              isMissing: true
-            },
-            referencingNodes: [{ nodeId: '1', widgetName: 'ckpt_name' }]
-          },
-          {
-            name: 'second.safetensors',
-            representative: {
-              nodeId: '2',
-              nodeType: 'CheckpointLoaderSimple',
-              widgetName: 'ckpt_name',
-              name: 'second.safetensors',
-              directory: 'checkpoints',
-              isAssetSupported: true,
-              isMissing: true
-            },
-            referencingNodes: [{ nodeId: '2', widgetName: 'ckpt_name' }]
-          }
-        ]
-      }
-    ]
-    mockAllErrorGroups.value = [
-      {
-        type: 'missing_model',
-        groupKey: 'missing_model',
-        displayTitle: 'Missing Models',
-        displayMessage: 'Import a model, or open the node to replace it.',
-        toastTitle: 'Missing models',
-        toastMessage: '2 model files are missing.',
-        count: 2,
-        priority: 2
-      }
-    ]
-    mountOverlayState()
-
-    const executionErrorStore = useExecutionErrorStore()
-    executionErrorStore.showErrorOverlay()
-    await nextTick()
-
-    expect(screen.getByTestId('title')).toHaveTextContent('2 errors found')
-    expect(screen.getByTestId('message')).toHaveTextContent(
-      'Resolve them before running the workflow.'
-    )
-  })
-
   it('does not show when a raw error has no resolved overlay message', async () => {
     mountOverlayState()
 
@@ -484,14 +295,26 @@ describe('useErrorOverlayState', () => {
     expect(screen.getByTestId('message')).toBeEmptyDOMElement()
   })
 
-  it('uses grouped error counts for aggregate copy', async () => {
+  it('uses aggregate copy for multiple errors', async () => {
+    mountOverlayState()
+
+    const executionErrorStore = useExecutionErrorStore()
+    executionErrorStore.lastNodeErrors = {
+      '1': makeNodeError([
+        'First error',
+        'Second error',
+        'Third error',
+        'Fourth error',
+        'Fifth error',
+        'Sixth error',
+        'Seventh error'
+      ])
+    }
     mockAllErrorGroups.value = [
       {
         type: 'execution',
         groupKey: 'execution:KSampler',
         displayTitle: 'Execution failed',
-        displayMessage: 'First group message',
-        count: 2,
         priority: 0,
         cards: [
           {
@@ -500,31 +323,13 @@ describe('useErrorOverlayState', () => {
             errors: [{ message: 'First error' }]
           }
         ]
-      },
-      {
-        type: 'execution',
-        groupKey: 'execution:CLIPTextEncode',
-        displayTitle: 'Invalid CLIP input',
-        displayMessage: 'Second group message',
-        count: 3,
-        priority: 1,
-        cards: [
-          {
-            id: '2',
-            title: 'CLIPTextEncode',
-            errors: [{ message: 'Second error' }]
-          }
-        ]
       }
     ]
-    mountOverlayState()
-
-    const executionErrorStore = useExecutionErrorStore()
     executionErrorStore.showErrorOverlay()
     await nextTick()
 
     expect(screen.getByTestId('visible')).toHaveTextContent('true')
-    expect(screen.getByTestId('title')).toHaveTextContent('5 errors found')
+    expect(screen.getByTestId('title')).toHaveTextContent('7 errors found')
     expect(screen.getByTestId('message')).toHaveTextContent(
       'Resolve them before running the workflow.'
     )

src/components/error/useErrorOverlayState.ts

@@ -4,17 +4,11 @@ import { storeToRefs } from 'pinia'
 
 import { useExecutionErrorStore } from '@/stores/executionErrorStore'
 import { useErrorGroups } from '@/components/rightSidePanel/errors/useErrorGroups'
-import type {
-  MissingPackGroup,
-  SwapNodeGroup
-} from '@/components/rightSidePanel/errors/useErrorGroups'
 import type { ErrorGroup } from '@/components/rightSidePanel/errors/types'
-import type { MissingMediaGroup } from '@/platform/missingMedia/types'
-import type { MissingModelGroup } from '@/platform/missingModel/types'
 
-type OverlayCopy = { title?: string; message: string }
-
-function resolveSingleOverlayCopy(group: ErrorGroup): OverlayCopy | undefined {
+function resolveSingleOverlayCopy(
+  group: ErrorGroup
+): { title?: string; message: string } | undefined {
   if (group.type === 'execution') {
     const [card] = group.cards
     const [error] = card?.errors ?? []
@@ -43,119 +37,27 @@ function resolveSingleOverlayCopy(group: ErrorGroup): OverlayCopy | undefined {
   }
 }
 
-function resolveGroupOverlayCopy(group: ErrorGroup): OverlayCopy | undefined {
-  const message =
-    group.displayMessage ?? group.toastMessage ?? group.displayTitle
-  if (!message) return undefined
-
-  return {
-    title: group.displayTitle,
-    message
-  }
-}
-
-function countMissingNodeReferences(groups: MissingPackGroup[]): number {
-  return groups.reduce((count, group) => count + group.nodeTypes.length, 0)
-}
-
-function countSwapNodeReferences(groups: SwapNodeGroup[]): number {
-  return groups.reduce((count, group) => count + group.nodeTypes.length, 0)
-}
-
-function getMissingModelRows(groups: MissingModelGroup[]) {
-  return groups.flatMap((group) => group.models)
-}
-
-function getMissingMediaRows(groups: MissingMediaGroup[]) {
-  return groups.flatMap((group) => group.items)
-}
-
-function hasSingleRowWithAtMostOneReference(
-  rows: Array<{ referencingNodes: readonly unknown[] }>
-): boolean {
-  const row = rows[0]
-  return (
-    rows.length === 1 && row !== undefined && row.referencingNodes.length <= 1
-  )
-}
-
-interface OverlayGroupContext {
-  missingPackGroups: MissingPackGroup[]
-  missingModelGroups: MissingModelGroup[]
-  missingMediaGroups: MissingMediaGroup[]
-  swapNodeGroups: SwapNodeGroup[]
-}
-
-function isSingleLeafGroup(
-  group: ErrorGroup,
-  context: OverlayGroupContext
-): boolean {
-  if (group.type === 'execution') {
-    return group.cards.length === 1 && group.cards[0]?.errors.length === 1
-  }
-
-  if (group.type === 'missing_node') {
-    return (
-      context.missingPackGroups.length === 1 &&
-      countMissingNodeReferences(context.missingPackGroups) === 1
-    )
-  }
-
-  if (group.type === 'swap_nodes') {
-    return (
-      context.swapNodeGroups.length === 1 &&
-      countSwapNodeReferences(context.swapNodeGroups) === 1
-    )
-  }
-
-  if (group.type === 'missing_model') {
-    return hasSingleRowWithAtMostOneReference(
-      getMissingModelRows(context.missingModelGroups)
-    )
-  }
-
-  return hasSingleRowWithAtMostOneReference(
-    getMissingMediaRows(context.missingMediaGroups)
-  )
-}
-
-function shouldUseAggregateCopyForSingleGroup(
-  group: ErrorGroup,
-  context: OverlayGroupContext
-): boolean {
-  if (group.type === 'missing_node') {
-    return context.missingPackGroups.length > 1
-  }
-
-  if (group.type === 'swap_nodes') {
-    return context.swapNodeGroups.length > 1
-  }
-
-  if (group.type === 'missing_model') {
-    return getMissingModelRows(context.missingModelGroups).length > 1
-  }
-
-  if (group.type === 'missing_media') {
-    return getMissingMediaRows(context.missingMediaGroups).length > 1
-  }
-
-  return false
-}
-
 export function useErrorOverlayState() {
   const { t } = useI18n()
   const executionErrorStore = useExecutionErrorStore()
-  const { isErrorOverlayOpen } = storeToRefs(executionErrorStore)
-  const {
-    allErrorGroups,
-    missingPackGroups,
-    missingModelGroups,
-    missingMediaGroups,
-    swapNodeGroups
-  } = useErrorGroups('')
+  const { totalErrorCount, isErrorOverlayOpen } =
+    storeToRefs(executionErrorStore)
+  const { allErrorGroups } = useErrorGroups('')
 
-  const totalErrorCount = computed(() =>
-    allErrorGroups.value.reduce((sum, group) => sum + group.count, 0)
+  const hasExactlyOneError = computed(() => totalErrorCount.value === 1)
+  const hasMultipleErrors = computed(() => totalErrorCount.value > 1)
+  const singleErrorGroup = computed(() =>
+    hasExactlyOneError.value && allErrorGroups.value.length === 1
+      ? allErrorGroups.value[0]
+      : undefined
+  )
+
+  const errorCountLabel = computed(() =>
+    t(
+      'errorOverlay.errorCount',
+      { count: totalErrorCount.value },
+      totalErrorCount.value
+    )
   )
 
   const multipleErrorCountLabel = computed(() =>
@@ -166,38 +68,25 @@ export function useErrorOverlayState() {
     )
   )
 
-  const aggregateOverlayCopy = computed<OverlayCopy>(() => ({
-    title: multipleErrorCountLabel.value,
-    message: t('errorOverlay.multipleErrorsMessage')
-  }))
+  const singleOverlayCopy = computed(() =>
+    singleErrorGroup.value
+      ? resolveSingleOverlayCopy(singleErrorGroup.value)
+      : undefined
+  )
 
-  const overlayCopy = computed<OverlayCopy | undefined>(() => {
-    const groups = allErrorGroups.value
-    if (groups.length === 0) return undefined
-    if (groups.length > 1) return aggregateOverlayCopy.value
-
-    const [group] = groups
-    const context = {
-      missingPackGroups: missingPackGroups.value,
-      missingModelGroups: missingModelGroups.value,
-      missingMediaGroups: missingMediaGroups.value,
-      swapNodeGroups: swapNodeGroups.value
+  const overlayMessage = computed(() => {
+    if (hasMultipleErrors.value) {
+      return t('errorOverlay.multipleErrorsMessage')
     }
 
-    if (shouldUseAggregateCopyForSingleGroup(group, context)) {
-      return aggregateOverlayCopy.value
-    }
-
-    if (isSingleLeafGroup(group, context)) {
-      return resolveSingleOverlayCopy(group) ?? resolveGroupOverlayCopy(group)
-    }
-
-    return resolveGroupOverlayCopy(group)
+    return singleOverlayCopy.value?.message ?? ''
   })
 
-  const overlayMessage = computed(() => overlayCopy.value?.message ?? '')
-
-  const overlayTitle = computed(() => overlayCopy.value?.title ?? '')
+  const overlayTitle = computed(() =>
+    hasMultipleErrors.value
+      ? multipleErrorCountLabel.value
+      : (singleOverlayCopy.value?.title ?? errorCountLabel.value)
+  )
 
   const isVisible = computed(
     () =>

src/components/graph/DomWidgets.test.ts

@@ -57,85 +57,154 @@ function drawFrame(canvas: LGraphCanvas) {
   canvas.onDrawForeground?.({} as CanvasRenderingContext2D, new Rectangle())
 }
 
-describe('DomWidgets positioning', () => {
+describe('DomWidgets transition grace characterization', () => {
   beforeEach(() => {
     setActivePinia(createTestingPinia({ stubActions: false }))
   })
 
-  it('positions an active visible widget relative to its owning node', () => {
+  it('applies transition grace for exactly one frame when override exists but is not active', () => {
     const canvasStore = useCanvasStore()
     const domWidgetStore = useDomWidgetStore()
 
-    const graph = new LGraph()
-    const node = createNode(graph, 1, 'host', [100, 200])
-    const widget = createWidget('widget-pos', node, 14)
+    const graphA = new LGraph()
+    const graphB = new LGraph()
+    const interiorNode = createNode(graphA, 1, 'interior', [100, 200])
+    const overrideNode = createNode(graphB, 2, 'override', [600, 700])
+
+    const widget = createWidget('widget-transition', interiorNode, 14)
+    const overrideWidget = createWidget('override-widget', overrideNode, 22)
 
     domWidgetStore.registerWidget(widget)
-
-    const canvas = createCanvas(graph)
-    canvasStore.canvas = canvas
-
-    render(DomWidgets, {
-      global: { stubs: { DomWidget: true } }
+    domWidgetStore.setPositionOverride(widget.id, {
+      node: overrideNode,
+      widget: overrideWidget
     })
-
-    drawFrame(canvas)
-
-    const widgetState = domWidgetStore.widgetStates.get(widget.id)
-    if (!widgetState) throw new Error('Widget state not registered')
-    expect(widgetState.visible).toBe(true)
-    expect(widgetState.pos).toEqual([110, 224])
-  })
-
-  it('hides a widget whose owning node is in a different graph', () => {
-    const canvasStore = useCanvasStore()
-    const domWidgetStore = useDomWidgetStore()
-
-    const currentGraph = new LGraph()
-    const otherGraph = new LGraph()
-    const node = createNode(otherGraph, 1, 'host', [100, 200])
-    const widget = createWidget('widget-other-graph', node, 14)
-
-    domWidgetStore.registerWidget(widget)
-
-    const canvas = createCanvas(currentGraph)
-    canvasStore.canvas = canvas
-
-    render(DomWidgets, {
-      global: { stubs: { DomWidget: true } }
-    })
-
-    drawFrame(canvas)
-
-    const widgetState = domWidgetStore.widgetStates.get(widget.id)
-    if (!widgetState) throw new Error('Widget state not registered')
-    expect(widgetState.visible).toBe(false)
-  })
-
-  it('hides an inactive widget', () => {
-    const canvasStore = useCanvasStore()
-    const domWidgetStore = useDomWidgetStore()
-
-    const graph = new LGraph()
-    const node = createNode(graph, 1, 'host', [0, 0])
-    const widget = createWidget('widget-inactive', node, 10)
-
-    domWidgetStore.registerWidget(widget)
     domWidgetStore.deactivateWidget(widget.id)
 
     const widgetState = domWidgetStore.widgetStates.get(widget.id)
     if (!widgetState) throw new Error('Widget state not registered')
     widgetState.visible = true
+    widgetState.pos = [321, 654]
 
-    const canvas = createCanvas(graph)
+    const canvas = createCanvas(graphA)
     canvasStore.canvas = canvas
 
     render(DomWidgets, {
-      global: { stubs: { DomWidget: true } }
+      global: {
+        stubs: {
+          DomWidget: true
+        }
+      }
+    })
+
+    drawFrame(canvas)
+    expect(widgetState.visible).toBe(true)
+    expect(widgetState.pos).toEqual([321, 654])
+
+    drawFrame(canvas)
+    expect(widgetState.visible).toBe(false)
+  })
+
+  it('uses override positioning while override node is in current graph even when widget is inactive', () => {
+    const canvasStore = useCanvasStore()
+    const domWidgetStore = useDomWidgetStore()
+
+    const graphA = new LGraph()
+    const graphB = new LGraph()
+    const interiorNode = createNode(graphA, 1, 'interior', [10, 20])
+    const overrideNode = createNode(graphB, 2, 'override', [300, 400])
+
+    const widget = createWidget('widget-override-active', interiorNode, 8)
+    const overrideWidget = createWidget(
+      'override-position-source',
+      overrideNode,
+      18
+    )
+
+    domWidgetStore.registerWidget(widget)
+    domWidgetStore.setPositionOverride(widget.id, {
+      node: overrideNode,
+      widget: overrideWidget
+    })
+    domWidgetStore.deactivateWidget(widget.id)
+
+    const widgetState = domWidgetStore.widgetStates.get(widget.id)
+    if (!widgetState) throw new Error('Widget state not registered')
+
+    const canvas = createCanvas(graphB)
+    canvasStore.canvas = canvas
+
+    render(DomWidgets, {
+      global: {
+        stubs: {
+          DomWidget: true
+        }
+      }
     })
 
     drawFrame(canvas)
 
-    expect(widgetState.visible).toBe(false)
+    expect(widgetState.visible).toBe(true)
+    expect(widgetState.pos).toEqual([310, 428])
+  })
+
+  it('cleans orphaned transition-grace ids after widget removal', () => {
+    const canvasStore = useCanvasStore()
+    const domWidgetStore = useDomWidgetStore()
+
+    const graphA = new LGraph()
+    const graphB = new LGraph()
+    const interiorNode = createNode(graphA, 1, 'interior', [0, 0])
+    const overrideNode = createNode(graphB, 2, 'override', [200, 200])
+
+    const canvas = createCanvas(graphA)
+    canvasStore.canvas = canvas
+
+    render(DomWidgets, {
+      global: {
+        stubs: {
+          DomWidget: true
+        }
+      }
+    })
+
+    const oldWidget = createWidget('shared-widget-id', interiorNode, 10)
+    const overrideWidget = createWidget(
+      'shared-override-widget',
+      overrideNode,
+      14
+    )
+
+    domWidgetStore.registerWidget(oldWidget)
+    domWidgetStore.setPositionOverride(oldWidget.id, {
+      node: overrideNode,
+      widget: overrideWidget
+    })
+    domWidgetStore.deactivateWidget(oldWidget.id)
+
+    drawFrame(canvas)
+    domWidgetStore.unregisterWidget(oldWidget.id)
+
+    drawFrame(canvas)
+
+    const replacementWidget = createWidget('shared-widget-id', interiorNode, 10)
+    domWidgetStore.registerWidget(replacementWidget)
+    domWidgetStore.setPositionOverride(replacementWidget.id, {
+      node: overrideNode,
+      widget: overrideWidget
+    })
+    domWidgetStore.deactivateWidget(replacementWidget.id)
+
+    const replacementState = domWidgetStore.widgetStates.get(
+      replacementWidget.id
+    )
+    if (!replacementState) throw new Error('Replacement widget missing state')
+    replacementState.visible = true
+    replacementState.pos = [999, 999]
+
+    drawFrame(canvas)
+
+    expect(replacementState.visible).toBe(true)
+    expect(replacementState.pos).toEqual([999, 999])
   })
 })

src/components/graph/DomWidgets.vue

@@ -21,6 +21,7 @@ import { useCanvasStore } from '@/renderer/core/canvas/canvasStore'
 import { useDomWidgetStore } from '@/stores/domWidgetStore'
 
 const domWidgetStore = useDomWidgetStore()
+const overrideTransitionGrace = new Set<string>()
 
 const widgetStates = computed(() => [...domWidgetStore.widgetStates.values()])
 
@@ -30,16 +31,47 @@ const updateWidgets = () => {
 
   const lowQuality = lgCanvas.low_quality
   const currentGraph = lgCanvas.graph
+  const seenWidgetIds = new Set<string>()
 
   for (const widgetState of widgetStates.value) {
     const widget = widgetState.widget
+    seenWidgetIds.add(widget.id)
 
-    if (!widget.isVisible() || !widgetState.active) {
+    // Use position override only when the override node (SubgraphNode) is
+    // in the current graph. When the user enters the subgraph, the override
+    // node is no longer visible — fall back to the widget's own node.
+    // Use graph reference equality (IDs are not unique across graphs).
+    const override = widgetState.positionOverride
+    const useOverride = !!override && currentGraph === override.node.graph
+    const inOverrideTransitionGap =
+      !!override && !useOverride && !widgetState.active
+    const useTransitionGrace =
+      inOverrideTransitionGap && !overrideTransitionGrace.has(widget.id)
+
+    if (useTransitionGrace) {
+      overrideTransitionGrace.add(widget.id)
+    } else if (!inOverrideTransitionGap) {
+      overrideTransitionGrace.delete(widget.id)
+    }
+
+    // Early exit for non-visible widgets.
+    // When a position override is active (widget promoted to SubgraphNode),
+    // the interior widget's `active` flag is false (its node is in the
+    // subgraph, not the current graph) — bypass that check.
+    if (
+      !widget.isVisible() ||
+      (!widgetState.active && !useOverride && !useTransitionGrace)
+    ) {
       widgetState.visible = false
       continue
     }
 
-    const posNode = widget.node
+    // During graph transitions, hold the previous position for one frame
+    // so promoted widgets don't briefly disappear before activation flips.
+    if (useTransitionGrace) continue
+
+    const posNode = useOverride ? override.node : widget.node
+    const posWidget = useOverride ? override.widget : widget
 
     const isInCorrectGraph = posNode.graph === currentGraph
     const nodeVisible = lgCanvas.isNodeVisible(posNode)
@@ -53,16 +85,22 @@ const updateWidgets = () => {
       const margin = widget.margin
       widgetState.pos = [
         posNode.pos[0] + margin,
-        posNode.pos[1] + margin + widget.y
+        posNode.pos[1] + margin + posWidget.y
       ]
       widgetState.size = [
-        (widget.width ?? posNode.width) - margin * 2,
-        (widget.computedHeight ?? 50) - margin * 2
+        (posWidget.width ?? posNode.width) - margin * 2,
+        (posWidget.computedHeight ?? 50) - margin * 2
       ]
       widgetState.zIndex = getDomWidgetZIndex(posNode, currentGraph)
       widgetState.readonly = lgCanvas.read_only
     }
   }
+
+  for (const widgetId of overrideTransitionGrace) {
+    if (!seenWidgetIds.has(widgetId)) {
+      overrideTransitionGrace.delete(widgetId)
+    }
+  }
 }
 
 const canvasStore = useCanvasStore()

src/components/graph/widgets/DomWidget.test.ts

@@ -54,7 +54,7 @@ vi.mock('@/platform/settings/settingStore', () => ({
   })
 }))
 
-function createWidgetState(disabled: boolean): DomWidgetState {
+function createWidgetState(overrideDisabled: boolean): DomWidgetState {
   const domWidgetStore = useDomWidgetStore()
   const node = createMockLGraphNode({
     id: 1,
@@ -70,10 +70,14 @@ function createWidgetState(disabled: boolean): DomWidgetState {
     value: '',
     options: {},
     node,
-    computedDisabled: disabled
+    computedDisabled: false
   })
 
   domWidgetStore.registerWidget(widget)
+  domWidgetStore.setPositionOverride(widget.id, {
+    node: createMockLGraphNode({ id: 2 }),
+    widget: { computedDisabled: overrideDisabled } as DomWidgetState['widget']
+  })
 
   const state = domWidgetStore.widgetStates.get(widget.id)
   if (!state) throw new Error('Expected registered DomWidgetState')
@@ -94,7 +98,7 @@ describe('DomWidget disabled style', () => {
     vi.clearAllMocks()
   })
 
-  it('uses disabled style when widget is computedDisabled', async () => {
+  it('uses disabled style when promoted override widget is computedDisabled', async () => {
     const widgetState = createWidgetState(true)
     const { container } = render(DomWidget, {
       props: {

src/components/graph/widgets/DomWidget.vue

@@ -69,7 +69,11 @@ const updateDomClipping = () => {
     return
   }
 
-  const isSelected = selectedNode === widgetState.widget.node
+  const override = widgetState.positionOverride
+  const overrideInGraph =
+    override && lgCanvas.graph?.getNodeById(override.node.id)
+  const ownerNode = overrideInGraph ? override.node : widgetState.widget.node
+  const isSelected = selectedNode === ownerNode
   const renderArea = selectedNode?.renderArea
   const offset = lgCanvas.ds.offset
   const scale = lgCanvas.ds.scale
@@ -100,7 +104,10 @@ const updateDomClipping = () => {
 const { left, top } = useElementBounding(canvasStore.getCanvas().canvas)
 
 function composeStyle() {
-  const isDisabled = widget.computedDisabled
+  const override = widgetState.positionOverride
+  const isDisabled = override
+    ? (override.widget.computedDisabled ?? widget.computedDisabled)
+    : widget.computedDisabled
 
   style.value = {
     ...positionStyle.value,
@@ -160,7 +167,13 @@ onMounted(() => {
       const lgCanvas = canvasStore.canvas
       if (!lgCanvas) return
 
-      const ownerNode = widgetState.widget.node
+      const override = widgetState.positionOverride
+      const overrideInGraph =
+        override && lgCanvas.graph?.getNodeById(override.node.id)
+      const ownerNode = overrideInGraph
+        ? override.node
+        : widgetState.widget.node
+
       lgCanvas.selectNode(ownerNode)
       lgCanvas.bringToFront(ownerNode)
     }

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

@@ -333,9 +333,6 @@ describe('TabErrors.vue', () => {
     expect(screen.getAllByText('CLIPTextEncode').length).toBeGreaterThanOrEqual(
       1
     )
-    expect(
-      within(screen.getByTestId('errors-summary-hero')).getByText('1')
-    ).toBeInTheDocument()
     expect(screen.queryByText('KSampler')).not.toBeInTheDocument()
   })
 
@@ -553,73 +550,6 @@ describe('TabErrors.vue', () => {
     expect(mockFocusNode.mock.calls.at(-1)?.[0]).toBe('4')
   })
 
-  it('sums the summary hero count across error types', async () => {
-    const { getNodeByExecutionId } = await import('@/utils/graphTraversalUtil')
-    vi.mocked(getNodeByExecutionId).mockReturnValue({
-      title: 'Node'
-    } as ReturnType<typeof getNodeByExecutionId>)
-
-    renderComponent({
-      executionError: {
-        lastNodeErrors: {
-          '1': {
-            class_type: 'KSampler',
-            errors: [
-              {
-                type: 'required_input_missing',
-                message: 'Required input is missing',
-                details: 'Input: model',
-                extra_info: { input_name: 'model' }
-              },
-              {
-                type: 'required_input_missing',
-                message: 'Required input is missing',
-                details: 'Input: positive',
-                extra_info: { input_name: 'positive' }
-              }
-            ]
-          },
-          '2': {
-            class_type: 'CLIPTextEncode',
-            errors: [
-              {
-                type: 'required_input_missing',
-                message: 'Required input is missing',
-                details: 'Input: clip',
-                extra_info: { input_name: 'clip' }
-              }
-            ]
-          }
-        }
-      },
-      missingMedia: {
-        missingMediaCandidates: [
-          {
-            nodeId: '3',
-            nodeType: 'LoadImage',
-            widgetName: 'image',
-            mediaType: 'image',
-            name: 'a.png',
-            isMissing: true
-          },
-          {
-            nodeId: '4',
-            nodeType: 'LoadImage',
-            widgetName: 'image',
-            mediaType: 'image',
-            name: 'b.png',
-            isMissing: true
-          }
-        ]
-      } satisfies { missingMediaCandidates: MissingMediaCandidate[] }
-    })
-
-    // 3 validation items + 2 missing media references
-    expect(
-      within(screen.getByTestId('errors-summary-hero')).getByText('5')
-    ).toBeInTheDocument()
-  })
-
   it('renders swap node rows below the section display message', () => {
     const swapNode = {
       type: 'OldSampler',

src/components/rightSidePanel/errors/TabErrors.vue

@@ -61,7 +61,7 @@
             :key="group.groupKey"
             :data-testid="'error-group-' + group.type.replaceAll('_', '-')"
             :title="group.displayTitle"
-            :count="group.count"
+            :count="getGroupCount(group)"
             :collapse="isSectionCollapsed(group.groupKey) && !isSearching"
             class="border-t border-secondary-background first:border-t-0"
             @update:collapse="setSectionCollapsed(group.groupKey, $event)"
@@ -328,6 +328,7 @@ import MissingNodeCard from './MissingNodeCard.vue'
 import SwapNodesCard from '@/platform/nodeReplacement/components/SwapNodesCard.vue'
 import MissingModelCard from '@/platform/missingModel/components/MissingModelCard.vue'
 import MissingMediaCard from '@/platform/missingMedia/components/MissingMediaCard.vue'
+import { countMissingMediaReferences } from '@/platform/missingMedia/missingMediaGrouping'
 import { isCloud, isDesktop, isNightly } from '@/platform/distribution/types'
 import Button from '@/components/ui/button/Button.vue'
 import DotSpinner from '@/components/common/DotSpinner.vue'
@@ -338,7 +339,6 @@ import { useErrorActions } from './useErrorActions'
 import { useErrorGroups } from './useErrorGroups'
 import type { SwapNodeGroup } from './useErrorGroups'
 import type { ErrorGroup } from './types'
-import { isExecutionItemListGroup } from './executionItemList'
 import { useNodeReplacement } from '@/platform/nodeReplacement/useNodeReplacement'
 
 interface ExecutionItemListEntry {
@@ -372,6 +372,21 @@ const searchQuery = ref('')
 const expandedExecutionItemDetailKeys = ref(new Set<string>())
 const isSearching = computed(() => searchQuery.value.trim() !== '')
 
+function isExecutionItemListGroup(group: ErrorGroup) {
+  return (
+    group.type === 'execution' &&
+    group.cards.length > 0 &&
+    group.cards.every(
+      (card) =>
+        card.nodeId &&
+        card.errors.length > 0 &&
+        card.errors.every(
+          (error) => !error.isRuntimeError && Boolean(error.displayItemLabel)
+        )
+    )
+  )
+}
+
 function getExecutionItemList(group: ErrorGroup): ExecutionItemListEntry[] {
   if (group.type !== 'execution') return []
 
@@ -403,6 +418,14 @@ function compareExecutionItemListEntry(
   )
 }
 
+function getExecutionGroupCount(group: ErrorGroup) {
+  if (group.type !== 'execution') return 0
+  if (isExecutionItemListGroup(group)) {
+    return group.cards.reduce((count, card) => count + card.errors.length, 0)
+  }
+  return group.cards.length
+}
+
 function isExecutionItemDetailExpanded(key: string) {
   return expandedExecutionItemDetailKeys.value.has(key)
 }
@@ -435,8 +458,26 @@ const {
   swapNodeGroups
 } = useErrorGroups(searchQuery)
 
+function getGroupCount(group: ErrorGroup): number {
+  switch (group.type) {
+    case 'execution':
+      return getExecutionGroupCount(group)
+    case 'missing_node':
+      return missingPackGroups.value.length
+    case 'swap_nodes':
+      return swapNodeGroups.value.length
+    case 'missing_model':
+      return missingModelGroups.value.reduce(
+        (total, modelGroup) => total + modelGroup.models.length,
+        0
+      )
+    case 'missing_media':
+      return countMissingMediaReferences(missingMediaGroups.value)
+  }
+}
+
 const totalErrorCount = computed(() =>
-  filteredGroups.value.reduce((sum, group) => sum + group.count, 0)
+  filteredGroups.value.reduce((sum, group) => sum + getGroupCount(group), 0)
 )
 
 const showMissingModelHeaderRefresh = computed(

src/components/rightSidePanel/errors/executionItemList.ts

@@ -1,21 +0,0 @@
-import type { ErrorCardData, ErrorGroup } from './types'
-
-export function shouldRenderExecutionItemList(cards: ErrorCardData[]): boolean {
-  return (
-    cards.length > 0 &&
-    cards.every(
-      (card) =>
-        card.nodeId &&
-        card.errors.length > 0 &&
-        card.errors.every(
-          (error) => !error.isRuntimeError && Boolean(error.displayItemLabel)
-        )
-    )
-  )
-}
-
-export function isExecutionItemListGroup(group: ErrorGroup): boolean {
-  return (
-    group.type === 'execution' && shouldRenderExecutionItemList(group.cards)
-  )
-}

src/components/rightSidePanel/errors/types.ts

@@ -24,7 +24,6 @@ interface ErrorGroupBase extends Omit<ResolvedErrorMessage, 'displayTitle'> {
   groupKey: string
   /** Human-friendly title resolved for UI display. */
   displayTitle: string
-  count: number
   priority: number
 }
 

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

@@ -793,6 +793,53 @@ describe('useErrorGroups', () => {
     })
   })
 
+  describe('groupedErrorMessages', () => {
+    it('returns empty array when no errors', () => {
+      const { groups } = createErrorGroups()
+      expect(groups.groupedErrorMessages.value).toEqual([])
+    })
+
+    it('collects unique display messages from node errors', async () => {
+      const { store, groups } = createErrorGroups()
+      store.lastNodeErrors = {
+        '1': {
+          class_type: 'KSampler',
+          dependent_outputs: [],
+          errors: [
+            { type: 'err_a', message: 'Error A', details: '' },
+            { type: 'err_b', message: 'Error B', details: '' }
+          ]
+        },
+        '2': {
+          class_type: 'CLIPLoader',
+          dependent_outputs: [],
+          errors: [{ type: 'err_a', message: 'Error A', details: '' }]
+        }
+      }
+      await nextTick()
+
+      const messages = groups.groupedErrorMessages.value
+      expect(messages).toEqual([unknownValidationMessage])
+    })
+
+    it('includes missing node group display message', async () => {
+      const { groups } = createErrorGroups()
+      const missingNodesStore = useMissingNodesErrorStore()
+      missingNodesStore.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!.displayMessage
+      )
+    })
+  })
+
   describe('missingModelGroups', () => {
     it('returns empty array when no missing models', () => {
       const { groups } = createErrorGroups()

src/components/rightSidePanel/errors/useErrorGroups.ts

@@ -25,15 +25,14 @@ import { isGroupNode } from '@/utils/executableGroupNodeDto'
 import { st } from '@/i18n'
 import type { MissingNodeType } from '@/types/comfy'
 import type { ErrorCardData, ErrorGroup, ErrorItem } from './types'
-import { shouldRenderExecutionItemList } from './executionItemList'
 import type { NodeExecutionId } from '@/types/nodeIdentification'
-import type { MissingModelGroup } from '@/platform/missingModel/types'
+import type {
+  MissingModelCandidate,
+  MissingModelGroup
+} from '@/platform/missingModel/types'
 import type { ResolvedCatalogErrorMessage } from '@/platform/errorCatalog/types'
 import type { MissingMediaGroup } from '@/platform/missingMedia/types'
-import {
-  countMissingModels,
-  groupMissingModelCandidates
-} from '@/platform/missingModel/missingModelGrouping'
+import { groupCandidatesByName } from '@/platform/missingModel/missingModelScan'
 import { groupCandidatesByMediaType } from '@/platform/missingMedia/missingMediaScan'
 import { countMissingMediaReferences } from '@/platform/missingMedia/missingMediaGrouping'
 import {
@@ -50,6 +49,9 @@ const PROMPT_CARD_ID = '__prompt__'
 /** Sentinel: distinguishes "fetch in-flight" from "fetch done, pack not found (null)". */
 const RESOLVING = '__RESOLVING__'
 
+/** Sentinel key for grouping non-asset-supported missing models. */
+const UNSUPPORTED = Symbol('unsupported')
+
 export interface MissingPackGroup {
   packId: string | null
   nodeTypes: MissingNodeType[]
@@ -150,28 +152,16 @@ function compareNodeId(a: ErrorCardData, b: ErrorCardData): number {
   return compareExecutionId(a.nodeId, b.nodeId)
 }
 
-function countExecutionCards(cards: ErrorCardData[]): number {
-  if (shouldRenderExecutionItemList(cards)) {
-    return cards.reduce((count, card) => count + card.errors.length, 0)
-  }
-
-  return cards.length
-}
-
 function toSortedGroups(groupsMap: Map<string, GroupEntry>): ErrorGroup[] {
   return Array.from(groupsMap.entries())
-    .map(([rawGroupKey, groupData]) => {
-      const cards = Array.from(groupData.cards.values()).sort(compareNodeId)
-      return {
-        type: 'execution' as const,
-        groupKey: `execution:${rawGroupKey}`,
-        displayTitle: groupData.displayTitle,
-        displayMessage: groupData.displayMessage,
-        count: countExecutionCards(cards),
-        cards,
-        priority: groupData.priority
-      }
-    })
+    .map(([rawGroupKey, groupData]) => ({
+      type: 'execution' as const,
+      groupKey: `execution:${rawGroupKey}`,
+      displayTitle: groupData.displayTitle,
+      displayMessage: groupData.displayMessage,
+      cards: Array.from(groupData.cards.values()).sort(compareNodeId),
+      priority: groupData.priority
+    }))
     .sort((a, b) => {
       if (a.priority !== b.priority) return a.priority - b.priority
       return a.displayTitle.localeCompare(b.displayTitle)
@@ -230,13 +220,11 @@ function searchErrorGroups(groups: ErrorGroup[], query: string) {
   return groups
     .map((group, gi) => {
       if (group.type !== 'execution') return group
-      const cards = group.cards.filter((_: ErrorCardData, ci: number) =>
-        matchedCardKeys.has(`${gi}:${ci}`)
-      )
       return {
         ...group,
-        cards,
-        count: countExecutionCards(cards)
+        cards: group.cards.filter((_: ErrorCardData, ci: number) =>
+          matchedCardKeys.has(`${gi}:${ci}`)
+        )
       }
     })
     .filter((group) => group.type !== 'execution' || group.cards.length > 0)
@@ -603,7 +591,6 @@ export function useErrorGroups(searchQuery: MaybeRefOrGetter<string>) {
       groups.push({
         type: 'swap_nodes' as const,
         groupKey: 'swap_nodes',
-        count: swapNodeGroups.value.length,
         priority: 0,
         ...resolveMissingErrorMessage({
           kind: 'swap_nodes',
@@ -618,7 +605,6 @@ export function useErrorGroups(searchQuery: MaybeRefOrGetter<string>) {
       groups.push({
         type: 'missing_node' as const,
         groupKey: 'missing_node',
-        count: missingPackGroups.value.length,
         priority: 1,
         ...resolveMissingErrorMessage({
           kind: 'missing_node',
@@ -632,21 +618,60 @@ export function useErrorGroups(searchQuery: MaybeRefOrGetter<string>) {
     return groups.sort((a, b) => a.priority - b.priority)
   }
 
+  /** Groups missing models. Asset-supported models group by directory; others go into a separate group.
+   *  Within each group, candidates with the same model name are merged into a single view model. */
   const missingModelGroups = computed<MissingModelGroup[]>(() => {
-    return groupMissingModelCandidates(
-      missingModelStore.missingModelCandidates,
-      isCloud
-    )
+    const candidates = missingModelStore.missingModelCandidates
+    if (!candidates?.length) return []
+
+    type GroupKey = string | null | typeof UNSUPPORTED
+    const map = new Map<
+      GroupKey,
+      { candidates: MissingModelCandidate[]; isAssetSupported: boolean }
+    >()
+
+    for (const c of candidates) {
+      const groupKey: GroupKey =
+        c.isAssetSupported || !isCloud ? c.directory || null : UNSUPPORTED
+
+      const existing = map.get(groupKey)
+      if (existing) {
+        existing.candidates.push(c)
+      } else {
+        // All candidates in the same directory share the same isAssetSupported
+        // value in practice (a directory is either asset-supported or not).
+        map.set(groupKey, {
+          candidates: [c],
+          isAssetSupported: c.isAssetSupported
+        })
+      }
+    }
+
+    return Array.from(map.entries())
+      .sort(([dirA], [dirB]) => {
+        if (dirA === UNSUPPORTED) return 1
+        if (dirB === UNSUPPORTED) return -1
+        if (dirA === null) return 1
+        if (dirB === null) return -1
+        return dirA.localeCompare(dirB)
+      })
+      .map(([key, { candidates: groupCandidates, isAssetSupported }]) => ({
+        directory: typeof key === 'string' ? key : null,
+        models: groupCandidatesByName(groupCandidates),
+        isAssetSupported
+      }))
   })
 
   function buildMissingModelGroups(): ErrorGroup[] {
     if (!missingModelGroups.value.length) return []
-    const count = countMissingModels(missingModelGroups.value)
+    const count = missingModelGroups.value.reduce(
+      (total, group) => total + group.models.length,
+      0
+    )
     return [
       {
         type: 'missing_model' as const,
         groupKey: 'missing_model',
-        count,
         priority: 2,
         ...resolveMissingErrorMessage({
           kind: 'missing_model',
@@ -671,7 +696,6 @@ export function useErrorGroups(searchQuery: MaybeRefOrGetter<string>) {
       {
         type: 'missing_media' as const,
         groupKey: 'missing_media',
-        count: totalRows,
         priority: 3,
         ...resolveMissingErrorMessage({
           kind: 'missing_media',
@@ -713,7 +737,37 @@ export function useErrorGroups(searchQuery: MaybeRefOrGetter<string>) {
       (c) => c.nodeId != null && isAssetErrorInSelection(String(c.nodeId))
     )
     if (!filtered.length) return []
-    return groupMissingModelCandidates(filtered, isCloud)
+
+    const map = new Map<
+      string | null | typeof UNSUPPORTED,
+      { candidates: MissingModelCandidate[]; isAssetSupported: boolean }
+    >()
+    for (const c of filtered) {
+      const groupKey =
+        c.isAssetSupported || !isCloud ? c.directory || null : UNSUPPORTED
+      const existing = map.get(groupKey)
+      if (existing) {
+        existing.candidates.push(c)
+      } else {
+        map.set(groupKey, {
+          candidates: [c],
+          isAssetSupported: c.isAssetSupported
+        })
+      }
+    }
+    return Array.from(map.entries())
+      .sort(([dirA], [dirB]) => {
+        if (dirA === UNSUPPORTED) return 1
+        if (dirB === UNSUPPORTED) return -1
+        if (dirA === null) return 1
+        if (dirB === null) return -1
+        return dirA.localeCompare(dirB)
+      })
+      .map(([key, { candidates: groupCandidates, isAssetSupported }]) => ({
+        directory: typeof key === 'string' ? key : null,
+        models: groupCandidatesByName(groupCandidates),
+        isAssetSupported
+      }))
   })
 
   const filteredMissingMediaGroups = computed(() => {
@@ -729,12 +783,14 @@ export function useErrorGroups(searchQuery: MaybeRefOrGetter<string>) {
 
   function buildMissingModelGroupsFiltered(): ErrorGroup[] {
     if (!filteredMissingModelGroups.value.length) return []
-    const count = countMissingModels(filteredMissingModelGroups.value)
+    const count = filteredMissingModelGroups.value.reduce(
+      (total, group) => total + group.models.length,
+      0
+    )
     return [
       {
         type: 'missing_model' as const,
         groupKey: 'missing_model',
-        count,
         priority: 2,
         ...resolveMissingErrorMessage({
           kind: 'missing_model',
@@ -755,7 +811,6 @@ export function useErrorGroups(searchQuery: MaybeRefOrGetter<string>) {
       {
         type: 'missing_media' as const,
         groupKey: 'missing_media',
-        count: totalRows,
         priority: 3,
         ...resolveMissingErrorMessage({
           kind: 'missing_media',
@@ -810,6 +865,22 @@ export function useErrorGroups(searchQuery: MaybeRefOrGetter<string>) {
     return searchErrorGroups(tabErrorGroups.value, query)
   })
 
+  const groupedErrorMessages = computed<string[]>(() => {
+    const messages = new Set<string>()
+    for (const group of allErrorGroups.value) {
+      if (group.type === 'execution') {
+        for (const card of group.cards) {
+          for (const err of card.errors) {
+            messages.add(err.displayMessage ?? err.message)
+          }
+        }
+      } else {
+        messages.add(group.displayMessage ?? group.displayTitle)
+      }
+    }
+    return Array.from(messages)
+  })
+
   return {
     allErrorGroups,
     tabErrorGroups,
@@ -818,6 +889,7 @@ export function useErrorGroups(searchQuery: MaybeRefOrGetter<string>) {
     isSingleNodeSelected,
     errorNodeCache,
     missingNodeCache,
+    groupedErrorMessages,
     missingPackGroups,
     missingModelGroups,
     missingMediaGroups,

src/components/rightSidePanel/parameters/SectionWidgets.vue

@@ -12,15 +12,14 @@ import {
 import { useI18n } from 'vue-i18n'
 
 import Button from '@/components/ui/button/Button.vue'
-import { widgetPromotedSource } from '@/core/graph/subgraph/promotedInputWidget'
 import { isWidgetPromotedOnSubgraphNode } from '@/core/graph/subgraph/promotionUtils'
+import { isPromotedWidgetView } from '@/core/graph/subgraph/promotedWidgetTypes'
 import type { LGraphGroup, LGraphNode } from '@/lib/litegraph/src/litegraph'
 import { SubgraphNode } from '@/lib/litegraph/src/litegraph'
 import type { IBaseWidget } from '@/lib/litegraph/src/types/widgets'
 import { useCanvasStore } from '@/renderer/core/canvas/canvasStore'
 import { DraggableList } from '@/scripts/ui/draggableList'
 import { useExecutionErrorStore } from '@/stores/executionErrorStore'
-import { useWidgetValueStore } from '@/stores/widgetValueStore'
 import { useRightSidePanelStore } from '@/stores/workspace/rightSidePanelStore'
 import { useSettingStore } from '@/platform/settings/settingStore'
 import { cn } from '@comfyorg/tailwind-utils'
@@ -147,17 +146,16 @@ function isWidgetShownOnParents(
   widgetNode: LGraphNode,
   widget: IBaseWidget
 ): boolean {
-  const source = widgetPromotedSource(widgetNode, widget)
   return parents.some((parent) => {
-    if (source) {
+    if (isPromotedWidgetView(widget)) {
       const interiorNodeId =
         String(widgetNode.id) === String(parent.id)
-          ? source.nodeId
+          ? widget.sourceNodeId
           : String(widgetNode.id)
 
       return isWidgetPromotedOnSubgraphNode(parent, {
         sourceNodeId: interiorNodeId,
-        sourceWidgetName: source.widgetName
+        sourceWidgetName: widget.sourceWidgetName
       })
     }
     return isWidgetPromotedOnSubgraphNode(parent, {
@@ -236,10 +234,7 @@ function navigateToErrorTab() {
   rightSidePanelStore.openPanel('errors')
 }
 
-function setWidgetValue(widget: IBaseWidget, value: WidgetValue) {
-  // Store-backed widgets (interior node widgets and promoted subgraph inputs)
-  // are addressed by widgetId; writing there keeps the displayed value in sync.
-  if (widget.widgetId) useWidgetValueStore().setValue(widget.widgetId, value)
+function writeWidgetValue(widget: IBaseWidget, value: WidgetValue) {
   widget.value = value
   widget.callback?.(value)
   canvasStore.canvas?.setDirty(true, true)
@@ -250,18 +245,18 @@ function handleResetAllWidgets() {
     const spec = nodeDefStore.getInputSpecForWidget(widgetNode, widget.name)
     const defaultValue = getWidgetDefaultValue(spec)
     if (defaultValue !== undefined) {
-      setWidgetValue(widget, defaultValue)
+      writeWidgetValue(widget, defaultValue)
     }
   }
 }
 
 function handleWidgetValueUpdate(widget: IBaseWidget, newValue: WidgetValue) {
   if (newValue === undefined) return
-  setWidgetValue(widget, newValue)
+  writeWidgetValue(widget, newValue)
 }
 
 function handleWidgetReset(widget: IBaseWidget, newValue: WidgetValue) {
-  setWidgetValue(widget, newValue)
+  writeWidgetValue(widget, newValue)
 }
 
 defineExpose({

src/components/rightSidePanel/parameters/TabSubgraphInputs.test.ts

@@ -1,127 +0,0 @@
-import { render } from '@testing-library/vue'
-import { createTestingPinia } from '@pinia/testing'
-import { setActivePinia } from 'pinia'
-import { beforeEach, describe, expect, it, vi } from 'vitest'
-import { createI18n } from 'vue-i18n'
-
-import { promoteValueWidgetViaSubgraphInput } from '@/core/graph/subgraph/promotionUtils'
-import { LGraphNode } from '@/lib/litegraph/src/litegraph'
-import type { LGraph } from '@/lib/litegraph/src/litegraph'
-import type { SubgraphNode } from '@/lib/litegraph/src/subgraph/SubgraphNode'
-import {
-  createTestSubgraph,
-  createTestSubgraphNode
-} from '@/lib/litegraph/src/subgraph/__fixtures__/subgraphHelpers'
-import type { IBaseWidget } from '@/lib/litegraph/src/types/widgets'
-import { useWidgetValueStore } from '@/stores/widgetValueStore'
-import { widgetId } from '@/types/widgetId'
-
-import TabSubgraphInputs from './TabSubgraphInputs.vue'
-
-vi.mock('@/services/litegraphService', () => ({
-  useLitegraphService: () => ({ updatePreviews: vi.fn() })
-}))
-
-const i18n = createI18n({
-  legacy: false,
-  locale: 'en',
-  messages: { en: { rightSidePanel: { inputs: 'Inputs', inputsNone: 'None' } } }
-})
-
-const captured: { rows: { node: LGraphNode; widget: IBaseWidget }[] } = {
-  rows: []
-}
-
-const SectionWidgetsStub = {
-  props: ['widgets', 'node', 'parents'],
-  setup(props: Record<string, unknown>) {
-    captured.rows = props.widgets as {
-      node: LGraphNode
-      widget: IBaseWidget
-    }[]
-    return () => null
-  }
-}
-
-function buildHostWithPromotedSeed(): {
-  host: SubgraphNode
-  sourceNode: LGraphNode
-} {
-  const subgraph = createTestSubgraph()
-  const host = createTestSubgraphNode(subgraph)
-  const graph = host.graph as LGraph
-  graph.add(host)
-
-  const sourceNode = new LGraphNode('Sampler')
-  const input = sourceNode.addInput('seed', 'INT')
-  const seedWidget = sourceNode.addWidget('number', 'seed', 42, () => {})
-  input.widget = { name: seedWidget.name }
-  subgraph.add(sourceNode)
-
-  promoteValueWidgetViaSubgraphInput(host, sourceNode, seedWidget)
-  return { host, sourceNode }
-}
-
-function renderPanel(node: SubgraphNode) {
-  return render(TabSubgraphInputs, {
-    props: { node },
-    global: {
-      plugins: [i18n],
-      stubs: {
-        SectionWidgets: SectionWidgetsStub,
-        AsyncSearchInput: true,
-        CollapseToggleButton: true
-      }
-    }
-  })
-}
-
-describe('TabSubgraphInputs', () => {
-  beforeEach(() => {
-    setActivePinia(createTestingPinia({ stubActions: false }))
-    captured.rows = []
-    vi.clearAllMocks()
-  })
-
-  it('lists a subgraph node promoted widget as a store-backed parameter row', () => {
-    const { host } = buildHostWithPromotedSeed()
-
-    renderPanel(host)
-
-    const seedRow = captured.rows.find((row) => row.widget.name === 'seed')
-    expect(seedRow).toBeDefined()
-    expect(seedRow?.node.id).toBe(host.id)
-    expect(seedRow?.widget.type).toBe('number')
-    expect(seedRow?.widget.widgetId).toBe(
-      widgetId(host.rootGraph.id, host.id, 'seed')
-    )
-    expect(seedRow?.widget.value).toBe(42)
-  })
-
-  it('reflects the current host widget value from the store', () => {
-    const { host } = buildHostWithPromotedSeed()
-    const id = widgetId(host.rootGraph.id, host.id, 'seed')
-    useWidgetValueStore().setValue(id, 7)
-
-    renderPanel(host)
-
-    const seedRow = captured.rows.find((row) => row.widget.name === 'seed')
-    expect(seedRow?.widget.value).toBe(7)
-  })
-
-  it('reflects value changes through the same descriptor without rebuilding it', () => {
-    const { host } = buildHostWithPromotedSeed()
-    renderPanel(host)
-
-    const seedRow = captured.rows.find((row) => row.widget.name === 'seed')!
-    expect(seedRow.widget.value).toBe(42)
-
-    // A value edit must not require a new descriptor object: the same row
-    // reflects the store change via its live getter, keeping render keys stable.
-    useWidgetValueStore().setValue(
-      widgetId(host.rootGraph.id, host.id, 'seed'),
-      100
-    )
-    expect(seedRow.widget.value).toBe(100)
-  })
-})

src/components/rightSidePanel/parameters/TabSubgraphInputs.vue

@@ -3,13 +3,14 @@ import { storeToRefs } from 'pinia'
 import { computed, nextTick, ref, shallowRef, useTemplateRef, watch } from 'vue'
 import { useI18n } from 'vue-i18n'
 
-import { promotedInputWidgets } from '@/core/graph/subgraph/promotedInputWidget'
+import { isPromotedWidgetView } from '@/core/graph/subgraph/promotedWidgetTypes'
 import {
   getWidgetName,
   isWidgetPromotedOnSubgraphNode,
   reorderSubgraphInputsByWidgetOrder
 } from '@/core/graph/subgraph/promotionUtils'
 import type { SubgraphNode } from '@/lib/litegraph/src/subgraph/SubgraphNode'
+import type { IBaseWidget } from '@/lib/litegraph/src/types/widgets'
 import { useCanvasStore } from '@/renderer/core/canvas/canvasStore'
 import AsyncSearchInput from '@/components/ui/search-input/AsyncSearchInput.vue'
 import CollapseToggleButton from '@/components/rightSidePanel/layout/CollapseToggleButton.vue'
@@ -44,6 +45,32 @@ const isAllCollapsed = computed({
 })
 const advancedInputsSectionRef = useTemplateRef('advancedInputsSectionRef')
 
+function isSamePromotedWidget(a: IBaseWidget, b: IBaseWidget): boolean {
+  return (
+    isPromotedWidgetView(a) &&
+    isPromotedWidgetView(b) &&
+    a.sourceNodeId === b.sourceNodeId &&
+    a.sourceWidgetName === b.sourceWidgetName
+  )
+}
+
+function getPromotedWidgets(): IBaseWidget[] {
+  const inputWidgets = node.inputs
+    .map((input) => input._widget)
+    .filter((widget): widget is IBaseWidget =>
+      Boolean(widget && isPromotedWidgetView(widget))
+    )
+  const extraWidgets = (node.widgets ?? []).filter(
+    (widget) =>
+      isPromotedWidgetView(widget) &&
+      !inputWidgets.some((inputWidget) =>
+        isSamePromotedWidget(inputWidget, widget)
+      )
+  )
+
+  return [...inputWidgets, ...extraWidgets]
+}
+
 watch(
   focusedSection,
   async (section) => {
@@ -66,7 +93,7 @@ watch(
 )
 
 const widgetsList = computed((): NodeWidgetsList => {
-  return promotedInputWidgets(node).map((widget) => ({ node, widget }))
+  return getPromotedWidgets().map((widget) => ({ node, widget }))
 })
 
 const advancedInputsWidgets = computed((): NodeWidgetsList => {

src/components/rightSidePanel/parameters/WidgetActions.vue

@@ -5,9 +5,8 @@ import { useI18n } from 'vue-i18n'
 
 import MoreButton from '@/components/button/MoreButton.vue'
 import Button from '@/components/ui/button/Button.vue'
-import { widgetPromotedSource } from '@/core/graph/subgraph/promotedInputWidget'
+import { isPromotedWidgetView } from '@/core/graph/subgraph/promotedWidgetTypes'
 import {
-  demotePromotedInput,
   demoteWidget,
   isLinkedPromotion,
   promoteWidget
@@ -17,7 +16,6 @@ import type { SubgraphNode } from '@/lib/litegraph/src/subgraph/SubgraphNode'
 import type { IBaseWidget } from '@/lib/litegraph/src/types/widgets'
 import { useCanvasStore } from '@/renderer/core/canvas/canvasStore'
 import { useNodeDefStore } from '@/stores/nodeDefStore'
-import { useWidgetValueStore } from '@/stores/widgetValueStore'
 import { useFavoritedWidgetsStore } from '@/stores/workspace/favoritedWidgetsStore'
 import { getWidgetDefaultValue, promptWidgetLabel } from '@/utils/widgetUtil'
 import type { WidgetValue } from '@/utils/widgetUtil'
@@ -47,10 +45,8 @@ const { t } = useI18n()
 
 const hasParents = computed(() => parents?.length > 0)
 const isLinked = computed(() => {
-  if (!node.isSubgraphNode()) return false
-  const source = widgetPromotedSource(node, widget)
-  if (!source) return false
-  return isLinkedPromotion(node, source.nodeId, source.widgetName)
+  if (!node.isSubgraphNode() || !isPromotedWidgetView(widget)) return false
+  return isLinkedPromotion(node, widget.sourceNodeId, widget.sourceWidgetName)
 })
 const canToggleVisibility = computed(() => hasParents.value && !isLinked.value)
 const favoriteNode = computed(() =>
@@ -68,16 +64,9 @@ const defaultValue = computed(() => getWidgetDefaultValue(inputSpec.value))
 
 const hasDefault = computed(() => defaultValue.value !== undefined)
 
-const currentValue = computed(
-  () =>
-    (widget.widgetId &&
-      useWidgetValueStore().getWidget(widget.widgetId)?.value) ??
-    widget.value
-)
-
 const isCurrentValueDefault = computed(() => {
   if (!hasDefault.value) return true
-  return isEqual(currentValue.value, defaultValue.value)
+  return isEqual(widget.value, defaultValue.value)
 })
 
 async function handleRename() {
@@ -88,15 +77,21 @@ async function handleRename() {
 function handleHideInput() {
   if (!parents?.length) return
 
-  const source = widgetPromotedSource(node, widget)
-  if (source) {
+  if (isPromotedWidgetView(widget)) {
     for (const parent of parents) {
       const sourceNodeId =
-        String(node.id) === String(parent.id) ? source.nodeId : String(node.id)
-      demotePromotedInput(parent, {
-        sourceNodeId,
-        sourceWidgetName: source.widgetName
-      })
+        String(node.id) === String(parent.id)
+          ? widget.sourceNodeId
+          : String(node.id)
+      demoteWidget(
+        {
+          id: sourceNodeId,
+          title: node.title,
+          type: node.type
+        },
+        widget,
+        [parent]
+      )
     }
     canvasStore.canvas?.setDirty(true, true)
   } else {

src/components/rightSidePanel/parameters/WidgetItem.test.ts

@@ -7,8 +7,6 @@ import { createI18n } from 'vue-i18n'
 
 import type { LGraphNode } from '@/lib/litegraph/src/litegraph'
 import type { IBaseWidget } from '@/lib/litegraph/src/types/widgets'
-import { useWidgetValueStore } from '@/stores/widgetValueStore'
-import { widgetId } from '@/types/widgetId'
 import WidgetItem from './WidgetItem.vue'
 
 const { mockGetInputSpecForWidget, StubWidgetComponent } = vi.hoisted(() => ({
@@ -44,6 +42,10 @@ vi.mock('@/composables/graph/useGraphNodeManager', () => ({
   getControlWidget: vi.fn(() => undefined)
 }))
 
+vi.mock('@/core/graph/subgraph/resolveConcretePromotedWidget', () => ({
+  resolvePromotedWidgetSource: vi.fn(() => undefined)
+}))
+
 vi.mock(
   '@/renderer/extensions/vueNodes/widgets/registry/widgetRegistry',
   () => ({
@@ -94,6 +96,43 @@ function createMockWidget(overrides: Partial<IBaseWidget> = {}): IBaseWidget {
   } as IBaseWidget
 }
 
+/**
+ * Creates a mock PromotedWidgetView that mirrors the real class:
+ * properties like name, type, value, options are prototype getters,
+ * NOT own properties — so object spread loses them.
+ */
+function createMockPromotedWidgetView(
+  sourceOptions: IBaseWidget['options'] = {
+    values: ['model_a.safetensors', 'model_b.safetensors']
+  }
+): IBaseWidget {
+  class MockPromotedWidgetView {
+    readonly sourceNodeId = '42'
+    readonly sourceWidgetName = 'ckpt_name'
+    readonly serialize = false
+
+    get name(): string {
+      return 'ckpt_name'
+    }
+    get type(): string {
+      return 'combo'
+    }
+    get value(): unknown {
+      return 'model_a.safetensors'
+    }
+    get options(): IBaseWidget['options'] {
+      return sourceOptions
+    }
+    get label(): string | undefined {
+      return undefined
+    }
+    get y(): number {
+      return 0
+    }
+  }
+  return fromAny<IBaseWidget, unknown>(new MockPromotedWidgetView())
+}
+
 function renderWidgetItem(
   widget: IBaseWidget,
   node: LGraphNode = createMockNode()
@@ -128,7 +167,7 @@ describe('WidgetItem', () => {
     vi.clearAllMocks()
   })
 
-  describe('widget state rendering', () => {
+  describe('promoted widget options', () => {
     it('passes options from a regular widget to the widget component', () => {
       const widget = createMockWidget({
         options: { values: ['a', 'b', 'c'] }
@@ -141,63 +180,35 @@ describe('WidgetItem', () => {
       })
     })
 
-    it('passes options from widget state to the widget component', () => {
+    it('passes options from a PromotedWidgetView to the widget component', () => {
       const expectedOptions = {
         values: ['model_a.safetensors', 'model_b.safetensors']
       }
-      const id = widgetId('test-graph-id', 1, 'ckpt_name')
-      const widget = createMockWidget({ widgetId: id, name: 'ckpt_name' })
-      useWidgetValueStore().registerWidget(id, {
-        type: 'combo',
-        value: 'model_a.safetensors',
-        options: expectedOptions
-      })
-
+      const widget = createMockPromotedWidgetView(expectedOptions)
       const { container } = renderWidgetItem(widget)
       const stub = getStubWidget(container)
 
       expect(stub.options).toEqual(expectedOptions)
     })
 
-    it('passes type from widget state to the widget component', () => {
-      const id = widgetId('test-graph-id', 1, 'ckpt_name')
-      const widget = createMockWidget({ widgetId: id, type: 'string' })
-      useWidgetValueStore().registerWidget(id, {
-        type: 'combo',
-        value: 'model_a.safetensors',
-        options: { values: ['model_a.safetensors'] }
-      })
-
+    it('passes type from a PromotedWidgetView to the widget component', () => {
+      const widget = createMockPromotedWidgetView()
       const { container } = renderWidgetItem(widget)
       const stub = getStubWidget(container)
 
       expect(stub.type).toBe('combo')
     })
 
-    it('passes name from widget state to the widget component', () => {
-      const id = widgetId('test-graph-id', 1, 'ckpt_name')
-      const widget = createMockWidget({ widgetId: id, name: 'source_name' })
-      useWidgetValueStore().registerWidget(id, {
-        type: 'combo',
-        value: 'model_a.safetensors',
-        options: { values: ['model_a.safetensors'] }
-      })
-
+    it('passes name from a PromotedWidgetView to the widget component', () => {
+      const widget = createMockPromotedWidgetView()
       const { container } = renderWidgetItem(widget)
       const stub = getStubWidget(container)
 
       expect(stub.name).toBe('ckpt_name')
     })
 
-    it('passes value from widget state to the widget component', () => {
-      const id = widgetId('test-graph-id', 1, 'ckpt_name')
-      const widget = createMockWidget({ widgetId: id, value: 'source value' })
-      useWidgetValueStore().registerWidget(id, {
-        type: 'combo',
-        value: 'model_a.safetensors',
-        options: { values: ['model_a.safetensors'] }
-      })
-
+    it('passes value from a PromotedWidgetView to the widget component', () => {
+      const widget = createMockPromotedWidgetView()
       const { container } = renderWidgetItem(widget)
       const stub = getStubWidget(container)
 

src/components/rightSidePanel/parameters/WidgetItem.vue

@@ -4,7 +4,7 @@ import { useI18n } from 'vue-i18n'
 
 import EditableText from '@/components/common/EditableText.vue'
 import { getControlWidget } from '@/composables/graph/useGraphNodeManager'
-import { useVueNodeLifecycle } from '@/composables/graph/useVueNodeLifecycle'
+import { resolvePromotedWidgetSource } from '@/core/graph/subgraph/resolveConcretePromotedWidget'
 import { st } from '@/i18n'
 import type { LGraphNode } from '@/lib/litegraph/src/litegraph'
 import type { SubgraphNode } from '@/lib/litegraph/src/subgraph/SubgraphNode'
@@ -17,12 +17,11 @@ import {
 } from '@/renderer/extensions/vueNodes/widgets/registry/widgetRegistry'
 import { useNodeDefStore } from '@/stores/nodeDefStore'
 import {
-  stripGraphPrefix,
-  useWidgetValueStore
+  useWidgetValueStore,
+  stripGraphPrefix
 } from '@/stores/widgetValueStore'
 import { useFavoritedWidgetsStore } from '@/stores/workspace/favoritedWidgetsStore'
 import type { SimplifiedWidget } from '@/types/simplifiedWidget'
-import { widgetId } from '@/types/widgetId'
 import { resolveNodeDisplayName } from '@/utils/nodeTitleUtil'
 import { cn } from '@comfyorg/tailwind-utils'
 import { renameWidget } from '@/utils/widgetUtil'
@@ -68,43 +67,35 @@ const widgetComponent = computed(() => {
   return component || WidgetLegacy
 })
 
-const isLinked = computed(() => {
-  const safeWidget = useVueNodeLifecycle()
-    .nodeManager.value?.vueNodeData.get(String(node.id))
-    ?.widgets?.find((w) => w.name === widget.name)
-  return safeWidget?.slotMetadata
-    ? !!safeWidget.slotMetadata.linked
-    : !!node.inputs?.find((inp) => inp.widget?.name === widget.name)?.link
-})
+function resolveSourceWidget(): { node: LGraphNode; widget: IBaseWidget } {
+  const source = resolvePromotedWidgetSource(node, widget)
+  return source ?? { node, widget }
+}
 
 const simplifiedWidget = computed((): SimplifiedWidget => {
+  const { node: sourceNode, widget: sourceWidget } = resolveSourceWidget()
   const graphId = node.graph?.rootGraph?.id
-  const bareNodeId = stripGraphPrefix(String(node.id))
-  const widgetState = widget.widgetId
-    ? useWidgetValueStore().getWidget(widget.widgetId)
-    : graphId
-      ? widgetValueStore.getWidget(widgetId(graphId, bareNodeId, widget.name))
-      : undefined
-  const widgetName = widgetState?.name ?? widget.name
-  const widgetType = widgetState?.type ?? widget.type
+  const bareNodeId = stripGraphPrefix(String(sourceNode.id))
+  const widgetState = graphId
+    ? widgetValueStore.getWidget(graphId, bareNodeId, sourceWidget.name)
+    : undefined
 
-  const baseOptions = widgetState?.options ?? widget.options
-  const disabled = isLinked.value || !!widget.disabled || undefined
   return {
-    name: widgetName,
-    type: widgetType,
+    name: widget.name,
+    type: widget.type,
     value: widgetState?.value ?? widget.value,
     label: widgetState?.label ?? widget.label,
-    options: { ...baseOptions, disabled },
-    spec: nodeDefStore.getInputSpecForWidget(node, widgetName),
-    controlWidget: getControlWidget(widget)
+    options: widgetState?.options ?? widget.options,
+    spec: nodeDefStore.getInputSpecForWidget(sourceNode, sourceWidget.name),
+    controlWidget: getControlWidget(sourceWidget)
   }
 })
 
-const displayNodeName = computed((): string | null => {
-  if (!node) return null
+const sourceNodeName = computed((): string | null => {
+  const sourceNode = resolvePromotedWidgetSource(node, widget)?.node ?? node
+  if (!sourceNode) return null
   const fallbackNodeTitle = t('rightSidePanel.fallbackNodeTitle')
-  return resolveNodeDisplayName(node, {
+  return resolveNodeDisplayName(sourceNode, {
     emptyLabel: fallbackNodeTitle,
     untitledLabel: fallbackNodeTitle,
     st
@@ -176,10 +167,10 @@ const displayLabel = customRef((track, trigger) => {
       />
 
       <span
-        v-if="(showNodeName || hasParents) && displayNodeName"
+        v-if="(showNodeName || hasParents) && sourceNodeName"
         class="mx-1 my-0 min-w-10 flex-1 truncate p-0 text-right text-xs text-muted-foreground"
       >
-        {{ displayNodeName }}
+        {{ sourceNodeName }}
       </span>
       <div
         v-if="!hiddenWidgetActions"

src/components/rightSidePanel/subgraph/SubgraphEditor.test.ts

@@ -14,9 +14,8 @@ import { LGraphNode } from '@/lib/litegraph/src/litegraph'
 import { useCanvasStore } from '@/renderer/core/canvas/canvasStore'
 import { usePreviewExposureStore } from '@/stores/previewExposureStore'
 
-import { promotedInputWidget } from '@/core/graph/subgraph/promotedInputWidget'
+import { isPromotedWidgetView } from '@/core/graph/subgraph/promotedWidgetTypes'
 import { promoteValueWidgetViaSubgraphInput } from '@/core/graph/subgraph/promotionUtils'
-import { resolveSubgraphInputTarget } from '@/core/graph/subgraph/resolveSubgraphInputTarget'
 import SubgraphEditor from './SubgraphEditor.vue'
 import type { ComponentProps } from 'vue-component-type-helpers'
 import type DraggableList from '@/components/common/DraggableList.vue'
@@ -168,20 +167,11 @@ describe('SubgraphEditor', () => {
         .map((el) => el.textContent?.trim())
     ).toEqual(['first', 'second'])
 
-    const rowFor = (sourceNode: LGraphNode) => {
-      const input = host.inputs.find((input) => {
-        if (!input.widgetId) return false
-        const target = resolveSubgraphInputTarget(host, input.name)
-        return target?.nodeId === String(sourceNode.id)
-      })!
-      return {
-        kind: 'promoted',
-        node: sourceNode,
-        input,
-        widget: promotedInputWidget(input)!
-      }
-    }
-    const reversed = [rowFor(secondNode), rowFor(firstNode)] as PromotedRow[]
+    const promotedWidgets = host.widgets.filter(isPromotedWidgetView)
+    const reversed = [
+      { kind: 'promoted', node: secondNode, widget: promotedWidgets[1] },
+      { kind: 'promoted', node: firstNode, widget: promotedWidgets[0] }
+    ] as PromotedRow[]
     listSetter?.(reversed)
     await nextTick()
 
@@ -192,42 +182,6 @@ describe('SubgraphEditor', () => {
     ).toEqual(['second', 'first'])
   })
 
-  it('moves a widget to shown when promoted from the hidden section', async () => {
-    const subgraph = createTestSubgraph()
-    const host = createTestSubgraphNode(subgraph)
-    const sourceNode = new LGraphNode('SourceNode')
-    subgraph.add(sourceNode)
-
-    const sourceInput = sourceNode.addInput('first', 'STRING')
-    const sourceWidget = sourceNode.addWidget('text', 'first', '', () => {})
-    sourceInput.widget = { name: sourceWidget.name }
-    useCanvasStore().selectedItems = [host]
-
-    render(SubgraphEditor, {
-      container: document.body.appendChild(document.createElement('div')),
-      global: {
-        plugins: [i18n],
-        stubs: {
-          DraggableList: {
-            template:
-              '<div data-testid="draggable-list"><slot drag-class="draggable-item" /></div>'
-          }
-        }
-      }
-    })
-
-    const hidden = screen.getByTestId('subgraph-editor-hidden-section')
-    await userEvent.click(within(hidden).getByTestId('subgraph-widget-toggle'))
-    await nextTick()
-
-    const shown = screen.getByTestId('subgraph-editor-shown-section')
-    expect(
-      within(shown)
-        .getAllByTestId('subgraph-widget-label')
-        .map((el) => el.textContent?.trim())
-    ).toEqual(['first'])
-  })
-
   it('demotes linked promoted widgets when "Hide all" is clicked', async () => {
     const subgraph = createTestSubgraph()
     const host = createTestSubgraphNode(subgraph)
@@ -259,13 +213,13 @@ describe('SubgraphEditor', () => {
       }
     })
 
-    expect(host.inputs.filter((input) => input.widgetId)).toHaveLength(2)
+    expect(host.widgets.filter(isPromotedWidgetView)).toHaveLength(2)
 
     const shown = screen.getByTestId('subgraph-editor-shown-section')
     const hideAllLink = within(shown).getByText('Hide all')
     await userEvent.click(hideAllLink)
 
-    expect(host.inputs.filter((input) => input.widgetId)).toHaveLength(0)
+    expect(host.widgets.filter(isPromotedWidgetView)).toHaveLength(0)
   })
 
   it('removes the exposure when a preview row without a real source widget is demoted', async () => {

src/components/rightSidePanel/subgraph/SubgraphEditor.vue

@@ -5,8 +5,9 @@ import { computed, onMounted, shallowRef, watch } from 'vue'
 
 import DraggableList from '@/components/common/DraggableList.vue'
 import Button from '@/components/ui/button/Button.vue'
+import { isPromotedWidgetView } from '@/core/graph/subgraph/promotedWidgetTypes'
+import type { PromotedWidgetView } from '@/core/graph/subgraph/promotedWidgetTypes'
 import {
-  demotePromotedInput,
   demoteWidget,
   getPromotableWidgets,
   isLinkedPromotion,
@@ -15,14 +16,8 @@ import {
   pruneDisconnected,
   reorderSubgraphInputsByWidgetOrder
 } from '@/core/graph/subgraph/promotionUtils'
-import {
-  promotedInputSource,
-  promotedInputWidget
-} from '@/core/graph/subgraph/promotedInputWidget'
-import type { PromotedSource } from '@/core/graph/subgraph/promotedInputWidget'
 import type { WidgetItem } from '@/core/graph/subgraph/promotionUtils'
 import type { PreviewExposure } from '@/core/schemas/previewExposureSchema'
-import type { INodeInputSlot } from '@/lib/litegraph/src/interfaces'
 import type { LGraphNode } from '@/lib/litegraph/src/litegraph'
 import { SubgraphNode } from '@/lib/litegraph/src/subgraph/SubgraphNode'
 import type { IBaseWidget } from '@/lib/litegraph/src/types/widgets'
@@ -38,8 +33,7 @@ import SubgraphNodeWidget from './SubgraphNodeWidget.vue'
 type PromotedRow = {
   kind: 'promoted'
   node: LGraphNode
-  input: INodeInputSlot
-  widget: IBaseWidget
+  widget: PromotedWidgetView
 }
 type PreviewRow = {
   kind: 'preview'
@@ -60,23 +54,11 @@ const activeNode = computed(() => {
   return undefined
 })
 
-const promotedRows = shallowRef<readonly PromotedRow[]>([])
-function buildPromotedRows(node: SubgraphNode): PromotedRow[] {
-  return node.inputs.flatMap((input): PromotedRow[] => {
-    const widget = promotedInputWidget(input)
-    if (!widget) return []
-    const source = promotedInputSource(node, input)
-    if (!source) return []
-    const sourceNode = node.subgraph._nodes_by_id[source.nodeId]
-    if (!sourceNode) return []
-    return [{ kind: 'promoted', node: sourceNode, input, widget }]
-  })
+const promotedWidgets = shallowRef<readonly IBaseWidget[]>([])
+function refreshPromotedWidgets() {
+  promotedWidgets.value = activeNode.value?.widgets ?? []
 }
-function refreshPromotedRows() {
-  const node = activeNode.value
-  promotedRows.value = node ? buildPromotedRows(node) : []
-}
-watch(activeNode, refreshPromotedRows, { immediate: true })
+watch(activeNode, refreshPromotedWidgets, { immediate: true })
 useEventListener(
   () => activeNode.value?.subgraph.events,
   [
@@ -86,29 +68,34 @@ useEventListener(
     'removing-input',
     'inputs-reordered'
   ],
-  refreshPromotedRows
+  refreshPromotedWidgets
 )
 
-function promotedRowSource(row: PromotedRow): PromotedSource | undefined {
-  const node = activeNode.value
-  return node ? promotedInputSource(node, row.input) : undefined
-}
-
 const activeRows = computed<ActiveRow[]>(() => {
   const node = activeNode.value
   if (!node) return []
-  return [...promotedRows.value, ...getActivePreviewRows(node)]
+  return [...getActivePromotedRows(node), ...getActivePreviewRows(node)]
 })
 
 const activePromotedRows = computed<PromotedRow[]>({
   get() {
-    return [...promotedRows.value]
+    const node = activeNode.value
+    return node ? getActivePromotedRows(node) : []
   },
   set(value: PromotedRow[]) {
     updateActivePromotedRows(value, activePromotedRows.value)
   }
 })
 
+function getActivePromotedRows(node: SubgraphNode): PromotedRow[] {
+  return promotedWidgets.value.flatMap((widget): PromotedRow[] => {
+    if (!isPromotedWidgetView(widget)) return []
+    const sourceNode = node.subgraph._nodes_by_id[widget.sourceNodeId]
+    if (!sourceNode) return []
+    return [{ kind: 'promoted', node: sourceNode, widget }]
+  })
+}
+
 function getActivePreviewRows(node: SubgraphNode): PreviewRow[] {
   const hostLocator = String(node.id)
   const rootGraphId = node.rootGraph.id
@@ -143,7 +130,7 @@ function updateActivePromotedRows(
   if (currentKeys.size === nextKeys.size) {
     reorderSubgraphInputsByWidgetOrder(
       node,
-      value.map((row) => ({ widgetId: row.widget.widgetId }))
+      value.map((row) => row.widget)
     )
   }
   refreshPromotedWidgetRendering()
@@ -164,11 +151,9 @@ const interiorWidgets = computed<WidgetItem[]>(() => {
 })
 
 function activeRowSourceKey(row: ActiveRow): string {
-  if (row.kind !== 'promoted')
-    return `${row.exposure.sourceNodeId}:${row.exposure.sourcePreviewName}`
-
-  const source = promotedRowSource(row)
-  return `${source?.nodeId ?? row.node.id}:${source?.widgetName ?? ''}`
+  return row.kind === 'promoted'
+    ? `${row.widget.sourceNodeId}:${row.widget.sourceWidgetName}`
+    : `${row.exposure.sourceNodeId}:${row.exposure.sourcePreviewName}`
 }
 
 const candidateWidgets = computed<WidgetItem[]>(() => {
@@ -243,16 +228,18 @@ function rowDisplayName(row: ActiveRow): string {
 function isRowLinked(row: ActiveRow): boolean {
   if (row.kind !== 'promoted') return false
   if (row.node.id === -1) return true
-  const source = promotedRowSource(row)
   return (
     !!activeNode.value &&
-    !!source &&
-    isLinkedPromotion(activeNode.value, String(row.node.id), source.widgetName)
+    isLinkedPromotion(
+      activeNode.value,
+      String(row.node.id),
+      row.widget.sourceWidgetName
+    )
   )
 }
 
 function promotedRowKey(row: PromotedRow): string {
-  return `${row.node.id}: ${row.widget.name}`
+  return `${row.node.id}: ${row.widget.name}:${row.widget.sourceNodeId}`
 }
 
 function rowKey(row: ActiveRow): string {
@@ -269,14 +256,7 @@ function demoteRow(row: ActiveRow) {
   const subgraphNode = activeNode.value
   if (!subgraphNode) return
   if (row.kind === 'promoted') {
-    const source = promotedRowSource(row)
-    if (source) {
-      demotePromotedInput(subgraphNode, {
-        sourceNodeId: source.nodeId,
-        sourceWidgetName: source.widgetName
-      })
-    }
-    refreshPromotedWidgetRendering()
+    demoteWidget(row.node, row.widget, [subgraphNode])
     return
   }
   if (row.realWidget) {
@@ -294,18 +274,13 @@ function demoteRow(row: ActiveRow) {
 function promotePromotedRow(row: PromotedRow) {
   const subgraphNode = activeNode.value
   if (!subgraphNode) return
-  const source = promotedRowSource(row)
-  const sourceWidget = source
-    ? row.node.widgets?.find((widget) => widget.name === source.widgetName)
-    : undefined
-  if (sourceWidget) promoteWidget(row.node, sourceWidget, [subgraphNode])
+  promoteWidget(row.node, row.widget, [subgraphNode])
 }
 
 function promoteCandidate([node, widget]: WidgetItem) {
   const subgraphNode = activeNode.value
   if (!subgraphNode) return
   promoteWidget(node, widget, [subgraphNode])
-  refreshPromotedRows()
 }
 
 function showAll() {

src/components/searchbox/LinkReleaseContextMenu.test.ts

@@ -0,0 +1,180 @@
+import { createTestingPinia } from '@pinia/testing'
+import { render, screen } from '@testing-library/vue'
+import userEvent from '@testing-library/user-event'
+import { beforeEach, describe, expect, it, vi } from 'vitest'
+import { createI18n } from 'vue-i18n'
+
+import type { ComfyNodeDefImpl } from '@/stores/nodeDefStore'
+
+import LinkReleaseContextMenu from './LinkReleaseContextMenu.vue'
+import type {
+  LinkReleaseNodeCategory,
+  LinkReleaseSearchResultGroup
+} from './linkReleaseMenuModel'
+
+const { groups } = vi.hoisted(() => ({
+  groups: {
+    suggestions: [] as ComfyNodeDefImpl[],
+    categories: [] as LinkReleaseNodeCategory[],
+    searchResultGroups: [] as LinkReleaseSearchResultGroup[]
+  }
+}))
+
+vi.mock('./linkReleaseMenuModel', () => ({
+  getLinkReleaseHeaderLabel: () => '',
+  getLinkReleaseSuggestions: () => groups.suggestions,
+  buildLinkReleaseNodeCategories: () => groups.categories,
+  groupLinkReleaseSearchResults: () => groups.searchResultGroups,
+  searchLinkReleaseNodes: () =>
+    groups.searchResultGroups.flatMap((group) =>
+      group.nodes.map((node) => ({ category: group.category, node }))
+    ),
+  filterNodesByName: () => []
+}))
+
+const i18n = createI18n({ legacy: false, locale: 'en', messages: { en: {} } })
+
+const stubs = {
+  DropdownMenuRoot: { template: '<div><slot /></div>' },
+  DropdownMenuTrigger: { template: '<div><slot /></div>' },
+  DropdownMenuPortal: { template: '<div><slot /></div>' },
+  DropdownMenuContent: { template: '<div role="menu"><slot /></div>' },
+  DropdownMenuLabel: { template: '<div><slot /></div>' },
+  DropdownMenuItem: {
+    emits: ['select'],
+    template:
+      '<div role="menuitem" tabindex="-1" @click="$emit(\'select\')"><slot /></div>'
+  },
+  DropdownMenuSeparator: { template: '<hr data-testid="menu-separator" />' },
+  LinkReleaseNodeSubmenu: { template: '<div data-testid="submenu" />' },
+  MiddleTruncate: { template: '<span>{{ text }}</span>', props: ['text'] }
+}
+
+function suggestion(name: string): ComfyNodeDefImpl {
+  return { name, display_name: name } as ComfyNodeDefImpl
+}
+
+function nodeCategory(
+  key: 'comfy' | 'extensions' | 'partner',
+  labelKey: string = key
+): LinkReleaseNodeCategory {
+  return { key, labelKey, icon: '', nodes: [suggestion('Node')] }
+}
+
+function renderMenu() {
+  return render(LinkReleaseContextMenu, {
+    props: { context: null },
+    global: { plugins: [i18n, createTestingPinia()], stubs }
+  })
+}
+
+describe('LinkReleaseContextMenu group divider', () => {
+  beforeEach(() => {
+    groups.suggestions = []
+    groups.categories = []
+    groups.searchResultGroups = []
+  })
+
+  it('renders a divider between the suggestions and categories groups', () => {
+    groups.suggestions = [suggestion('KSampler')]
+    groups.categories = [nodeCategory('comfy')]
+    renderMenu()
+
+    expect(screen.getAllByTestId('menu-separator')).toHaveLength(3)
+  })
+
+  it('omits the group divider when only one group is present', () => {
+    groups.suggestions = []
+    groups.categories = [nodeCategory('comfy')]
+    renderMenu()
+
+    expect(screen.getAllByTestId('menu-separator')).toHaveLength(2)
+  })
+
+  it('renders a divider between search result groups', async () => {
+    groups.suggestions = []
+    groups.categories = []
+    groups.searchResultGroups = [
+      {
+        category: nodeCategory('extensions', 'contextMenu.Extensions'),
+        nodes: [suggestion('Ext Node')]
+      },
+      {
+        category: nodeCategory('partner', 'contextMenu.Partner Nodes'),
+        nodes: [suggestion('Partner Node')]
+      }
+    ]
+    renderMenu()
+
+    await userEvent.type(screen.getByRole('textbox'), 'na')
+
+    expect(screen.getAllByTestId('menu-separator')).toHaveLength(2)
+  })
+})
+
+describe('LinkReleaseContextMenu selection', () => {
+  beforeEach(() => {
+    groups.suggestions = []
+    groups.categories = []
+    groups.searchResultGroups = []
+  })
+
+  function renderMenuWith(handlers: Record<string, unknown>) {
+    return render(LinkReleaseContextMenu, {
+      props: { context: null, ...handlers },
+      global: { plugins: [i18n, createTestingPinia()], stubs }
+    })
+  }
+
+  it('emits selectNode when a suggestion is chosen', async () => {
+    groups.suggestions = [suggestion('KSampler')]
+    const onSelectNode = vi.fn()
+    renderMenuWith({ onSelectNode })
+
+    await userEvent.click(screen.getByText('KSampler'))
+
+    expect(onSelectNode).toHaveBeenCalledWith(
+      expect.objectContaining({ name: 'KSampler' })
+    )
+  })
+
+  it('emits addReroute when the reroute item is chosen', async () => {
+    groups.suggestions = [suggestion('KSampler')]
+    const onAddReroute = vi.fn()
+    renderMenuWith({ onAddReroute })
+
+    await userEvent.click(screen.getByText('contextMenu.Add Reroute'))
+
+    expect(onAddReroute).toHaveBeenCalled()
+  })
+
+  it('selects the first search result on Enter in the search field', async () => {
+    groups.searchResultGroups = [
+      {
+        category: nodeCategory('comfy', 'contextMenu.Comfy Nodes'),
+        nodes: [suggestion('Found Node')]
+      }
+    ]
+    const onSelectNode = vi.fn()
+    renderMenuWith({ onSelectNode })
+
+    const search = screen.getByRole('textbox')
+    await userEvent.type(search, 'fo')
+    await userEvent.keyboard('{Enter}')
+
+    expect(onSelectNode).toHaveBeenCalledWith(
+      expect.objectContaining({ name: 'Found Node' })
+    )
+  })
+
+  it('moves focus to the first item on ArrowDown from the search', async () => {
+    groups.suggestions = [suggestion('KSampler')]
+    renderMenu()
+
+    const search = screen.getByRole('textbox')
+    search.focus()
+    await userEvent.keyboard('{ArrowDown}')
+
+    expect(screen.getAllByRole('menuitem')[0]).toHaveFocus()
+  })
+})

src/components/searchbox/LinkReleaseContextMenu.vue

@@ -0,0 +1,384 @@
+<template>
+  <DropdownMenuRoot :open="open" :modal="false" @update:open="onOpenChange">
+    <DropdownMenuTrigger as-child>
+      <div
+        aria-hidden="true"
+        class="pointer-events-none fixed size-0"
+        :style="{ left: `${position.x}px`, top: `${position.y}px` }"
+      />
+    </DropdownMenuTrigger>
+    <DropdownMenuPortal>
+      <DropdownMenuContent
+        side="bottom"
+        align="start"
+        :side-offset="SIDE_OFFSET"
+        :collision-padding="VIEWPORT_MARGIN"
+        :avoid-collisions="false"
+        :class="contentClass"
+        :style="menuMaxHeight ? { maxHeight: `${menuMaxHeight}px` } : undefined"
+        data-testid="link-release-context-menu"
+        @open-auto-focus.prevent="focusSearch"
+        @close-auto-focus.prevent
+        @entry-focus="onEntryFocus"
+        @keydown.capture="redirectTypingToSearch"
+      >
+        <DropdownMenuLabel
+          v-if="headerLabel"
+          class="flex shrink-0 items-center gap-2 p-2 text-xs font-medium text-muted-foreground uppercase"
+        >
+          <span class="flex size-4 shrink-0 items-center justify-center">
+            <span
+              class="size-4 rounded-full"
+              :style="{ backgroundColor: slotColor }"
+            />
+          </span>
+          <span class="truncate">{{ headerLabel }}</span>
+        </DropdownMenuLabel>
+        <div data-search-field class="shrink-0 p-0.5">
+          <div
+            class="flex h-9 items-center gap-2 rounded-lg bg-secondary-background px-2"
+          >
+            <i
+              class="icon-[lucide--search] size-4 shrink-0 text-muted-foreground"
+            />
+            <input
+              ref="searchInput"
+              v-model="query"
+              type="text"
+              data-testid="link-release-search"
+              :placeholder="t('contextMenu.Search')"
+              class="size-full min-w-0 appearance-none border-none bg-transparent text-sm text-base-foreground outline-none placeholder:text-muted-foreground"
+              @keydown="onRootSearchKeydown"
+            />
+          </div>
+        </div>
+        <DropdownMenuSeparator
+          class="-mx-1 my-1 h-px shrink-0 bg-border-subtle"
+        />
+
+        <div :class="scrollClass">
+          <template v-if="trimmedQuery">
+            <template
+              v-for="(group, groupIndex) in searchResultGroups"
+              :key="group.category.key"
+            >
+              <DropdownMenuSeparator
+                v-if="groupIndex > 0"
+                class="-mx-1 my-1 h-px shrink-0 bg-border-subtle"
+              />
+              <DropdownMenuItem
+                v-for="node in group.nodes"
+                :key="node.name"
+                :class="itemClass"
+                @select="selectNode(node)"
+              >
+                <i
+                  :class="cn(group.category.icon, 'size-4 shrink-0 opacity-80')"
+                />
+                <span class="flex min-w-0 flex-1 items-center gap-1">
+                  <span class="shrink-0 text-muted-foreground">
+                    {{ t(group.category.labelKey) }}:
+                  </span>
+                  <MiddleTruncate
+                    :text="node.display_name"
+                    class="min-w-0 flex-1"
+                  />
+                </span>
+              </DropdownMenuItem>
+            </template>
+            <div
+              v-if="searchResults.length === 0"
+              class="p-2 text-sm text-muted-foreground"
+            >
+              {{ t('g.noResults') }}
+            </div>
+          </template>
+
+          <template v-else>
+            <template v-if="suggestions.length">
+              <DropdownMenuLabel
+                class="block truncate p-2 text-xs font-medium text-muted-foreground uppercase"
+              >
+                {{ t('contextMenu.Most Relevant') }}
+              </DropdownMenuLabel>
+              <DropdownMenuItem
+                v-for="nodeDef in suggestions"
+                :key="nodeDef.name"
+                :class="itemClass"
+                @select="selectNode(nodeDef)"
+              >
+                <MiddleTruncate
+                  :text="nodeDef.display_name"
+                  class="min-w-0 flex-1"
+                />
+              </DropdownMenuItem>
+            </template>
+
+            <DropdownMenuSeparator
+              v-if="suggestions.length && categories.length"
+              class="-mx-1 my-1 h-px shrink-0 bg-border-subtle"
+            />
+
+            <template v-if="categories.length">
+              <DropdownMenuLabel
+                class="block truncate p-2 text-xs font-medium text-muted-foreground uppercase"
+              >
+                {{ t('contextMenu.Compatible Nodes') }}
+              </DropdownMenuLabel>
+              <LinkReleaseNodeSubmenu
+                v-for="category in categories"
+                :key="category.key"
+                :category
+                :item-class="itemClass"
+                :content-class="submenuContentClass"
+                :scroll-class="submenuScrollClass"
+                @select="selectNode"
+              />
+            </template>
+          </template>
+        </div>
+
+        <template v-if="!trimmedQuery">
+          <DropdownMenuSeparator
+            class="-mx-1 my-1 h-px shrink-0 bg-border-subtle"
+          />
+          <DropdownMenuItem
+            :class="cn(itemClass, 'shrink-0')"
+            @select="addReroute"
+          >
+            <i class="icon-[lucide--git-fork] size-4 shrink-0 opacity-80" />
+            <span class="flex-1 truncate">
+              {{ t('contextMenu.Add Reroute') }}
+            </span>
+          </DropdownMenuItem>
+        </template>
+      </DropdownMenuContent>
+    </DropdownMenuPortal>
+  </DropdownMenuRoot>
+</template>
+
+<script setup lang="ts">
+import { cn } from '@comfyorg/tailwind-utils'
+import {
+  DropdownMenuContent,
+  DropdownMenuItem,
+  DropdownMenuLabel,
+  DropdownMenuPortal,
+  DropdownMenuRoot,
+  DropdownMenuSeparator,
+  DropdownMenuTrigger
+} from 'reka-ui'
+import { computed, nextTick, ref } from 'vue'
+import { useI18n } from 'vue-i18n'
+
+import { getSlotColor } from '@/constants/slotColors'
+import { LiteGraph } from '@/lib/litegraph/src/litegraph'
+import type { ComfyNodeDefImpl } from '@/stores/nodeDefStore'
+import { useNodeDefStore } from '@/stores/nodeDefStore'
+
+import LinkReleaseNodeSubmenu from './LinkReleaseNodeSubmenu.vue'
+import MiddleTruncate from './MiddleTruncate.vue'
+import {
+  buildLinkReleaseNodeCategories,
+  computeContextMenuTop,
+  estimateLinkReleaseMenuHeight,
+  getLinkReleaseHeaderLabel,
+  getLinkReleaseSuggestions,
+  groupLinkReleaseSearchResults,
+  searchLinkReleaseNodes
+} from './linkReleaseMenuModel'
+import type {
+  LinkReleaseContext,
+  LinkReleaseNodeMatch
+} from './linkReleaseMenuModel'
+
+const { context } = defineProps<{ context: LinkReleaseContext | null }>()
+
+const emit = defineEmits<{
+  selectNode: [nodeDef: ComfyNodeDefImpl]
+  addReroute: []
+  dismiss: []
+}>()
+
+const { t } = useI18n()
+const nodeDefStore = useNodeDefStore()
+
+const open = ref(false)
+const position = ref({ x: 0, y: 0 })
+const searchInput = ref<HTMLInputElement>()
+const query = ref('')
+const menuMaxHeight = ref<number>()
+let actionTaken = false
+
+const VIEWPORT_MARGIN = 8
+const SIDE_OFFSET = 4
+const MENU_WIDTH = 384
+
+const contentClass =
+  'z-1700 flex min-w-[260px] max-w-sm flex-col overflow-hidden rounded-lg border border-interface-menu-stroke bg-interface-menu-surface p-1 shadow-interface'
+const scrollClass =
+  'flex-1 min-h-0 overflow-y-auto overflow-x-hidden scrollbar-custom'
+const submenuContentClass =
+  'z-1700 flex w-sm flex-col overflow-hidden rounded-lg border border-interface-menu-stroke bg-interface-menu-surface p-1 shadow-interface'
+const submenuScrollClass =
+  'flex-1 min-h-0 overflow-y-auto overflow-x-hidden scrollbar-custom'
+const itemClass =
+  'flex cursor-pointer items-center gap-2 rounded-lg px-2 py-2 text-sm text-base-foreground outline-none select-none data-disabled:pointer-events-none data-disabled:opacity-50 data-highlighted:bg-interface-menu-component-surface-hovered'
+
+const headerLabel = computed(() =>
+  context ? getLinkReleaseHeaderLabel(context) : ''
+)
+
+const slotColor = computed(() => getSlotColor(context?.dataType?.split(',')[0]))
+
+const trimmedQuery = computed(() => query.value.trim())
+
+const typeFilter = computed(() => {
+  if (!context) return null
+  const svc = nodeDefStore.nodeSearchService
+  return {
+    filterDef: context.isFromOutput
+      ? svc.inputTypeFilter
+      : svc.outputTypeFilter,
+    value: context.dataType
+  }
+})
+
+const compatibleNodes = computed<ComfyNodeDefImpl[]>(() => {
+  if (!typeFilter.value) return []
+  return nodeDefStore.nodeSearchService.searchNode('', [typeFilter.value], {
+    limit: 500
+  })
+})
+
+const defaultNodeDefs = computed<ComfyNodeDefImpl[]>(() => {
+  if (!context?.dataType) return []
+  const table = context.isFromOutput
+    ? LiteGraph.slot_types_default_out
+    : LiteGraph.slot_types_default_in
+  const types = table?.[context.dataType] ?? []
+  return types
+    .map((type) => nodeDefStore.allNodeDefsByName[type])
+    .filter((nodeDef): nodeDef is ComfyNodeDefImpl => Boolean(nodeDef))
+})
+
+const suggestions = computed(() =>
+  getLinkReleaseSuggestions(defaultNodeDefs.value)
+)
+const categories = computed(() =>
+  buildLinkReleaseNodeCategories(compatibleNodes.value)
+)
+
+const searchResultGroups = computed(() =>
+  groupLinkReleaseSearchResults(categories.value, trimmedQuery.value)
+)
+const searchResults = computed<LinkReleaseNodeMatch[]>(() =>
+  searchLinkReleaseNodes(categories.value, trimmedQuery.value)
+)
+
+function selectNode(nodeDef: ComfyNodeDefImpl) {
+  actionTaken = true
+  emit('selectNode', nodeDef)
+  hide()
+}
+
+function addReroute() {
+  actionTaken = true
+  emit('addReroute')
+  hide()
+}
+
+function focusSearch() {
+  searchInput.value?.focus()
+}
+
+function isPrintableKey(event: KeyboardEvent) {
+  return (
+    event.key.length === 1 &&
+    event.key !== ' ' &&
+    !event.ctrlKey &&
+    !event.metaKey &&
+    !event.altKey
+  )
+}
+
+// When the keyboard focus is on a menu item, funnel printable keystrokes into
+// the search field instead of letting Reka run its item type-ahead.
+function redirectTypingToSearch(event: KeyboardEvent) {
+  if (event.target === searchInput.value || !isPrintableKey(event)) return
+  event.preventDefault()
+  event.stopPropagation()
+  query.value += event.key
+  focusSearch()
+}
+
+// Reka refocuses the first item (scrolling the list to the top) whenever the
+// menu regains focus, which fires as the pointer leaves an item while scrolling.
+function onEntryFocus(event: Event) {
+  event.preventDefault()
+}
+
+function focusFirstItem(target: HTMLElement) {
+  const menu = target.closest<HTMLElement>('[role="menu"]')
+  menu
+    ?.querySelector<HTMLElement>('[role="menuitem"]:not([data-disabled])')
+    ?.focus()
+}
+
+function onRootSearchKeydown(event: KeyboardEvent) {
+  // Let Reka close the menu natively on Escape.
+  if (event.key === 'Escape') return
+  event.stopPropagation()
+  if (event.key === 'ArrowDown') {
+    event.preventDefault()
+    focusFirstItem(event.currentTarget as HTMLElement)
+  } else if (event.key === 'Enter' && trimmedQuery.value) {
+    const first = searchResults.value[0]
+    if (first) selectNode(first.node)
+  }
+}
+
+function show(event: MouseEvent) {
+  actionTaken = false
+  query.value = ''
+  const menuHeight = estimateLinkReleaseMenuHeight({
+    hasHeader: Boolean(headerLabel.value),
+    suggestionCount: suggestions.value.length,
+    categoryCount: categories.value.length,
+    searchResultCount: 0,
+    showReroute: true
+  })
+  const menuTop = computeContextMenuTop({
+    cursorY: event.clientY,
+    menuHeight,
+    viewportHeight: window.innerHeight,
+    margin: VIEWPORT_MARGIN,
+    sideOffset: SIDE_OFFSET
+  })
+  menuMaxHeight.value = window.innerHeight - menuTop - VIEWPORT_MARGIN
+  const maxX = Math.max(
+    VIEWPORT_MARGIN,
+    window.innerWidth - MENU_WIDTH - VIEWPORT_MARGIN
+  )
+  position.value = {
+    x: Math.min(maxX, Math.max(VIEWPORT_MARGIN, event.clientX)),
+    y: menuTop - SIDE_OFFSET
+  }
+  void nextTick(() => {
+    open.value = true
+  })
+}
+
+function hide() {
+  open.value = false
+}
+
+function onOpenChange(value: boolean) {
+  open.value = value
+  if (value) return
+  if (!actionTaken) emit('dismiss')
+  actionTaken = false
+}
+
+defineExpose({ show, hide })
+</script>

src/components/searchbox/LinkReleaseNodeSubmenu.stories.ts

@@ -0,0 +1,120 @@
+import type { Meta, StoryObj } from '@storybook/vue3-vite'
+
+import {
+  DropdownMenuContent,
+  DropdownMenuLabel,
+  DropdownMenuPortal,
+  DropdownMenuRoot,
+  DropdownMenuTrigger
+} from 'reka-ui'
+
+import type { ComfyNodeDefImpl } from '@/stores/nodeDefStore'
+
+import LinkReleaseNodeSubmenu from './LinkReleaseNodeSubmenu.vue'
+import type { LinkReleaseNodeCategory } from './linkReleaseMenuModel'
+
+const contentClass =
+  'z-1700 flex max-h-[min(80vh,var(--reka-dropdown-menu-content-available-height))] min-w-[260px] max-w-sm flex-col overflow-hidden rounded-lg border border-interface-menu-stroke bg-interface-menu-surface p-1 shadow-interface'
+const submenuContentClass =
+  'z-1700 flex w-sm max-h-[min(80vh,var(--reka-dropdown-menu-content-available-height))] flex-col overflow-hidden rounded-lg border border-interface-menu-stroke bg-interface-menu-surface p-1 shadow-interface'
+const submenuScrollClass =
+  'overflow-y-auto scrollbar-custom max-h-[min(calc(var(--reka-dropdown-menu-content-available-height)-3.5rem),80vh)]'
+const itemClass =
+  'flex cursor-pointer items-center gap-2 rounded-lg px-3 py-1.5 text-sm text-base-foreground outline-none select-none data-disabled:pointer-events-none data-disabled:opacity-50 data-highlighted:bg-interface-menu-component-surface-hovered'
+
+function node(name: string, display_name = name): ComfyNodeDefImpl {
+  return { name, display_name } as ComfyNodeDefImpl
+}
+
+const category: LinkReleaseNodeCategory = {
+  key: 'comfy',
+  labelKey: 'contextMenu.Comfy Nodes',
+  icon: 'icon-[lucide--box]',
+  nodes: [
+    node('KSampler'),
+    node('VAEDecode', 'VAE Decode'),
+    node('VAEEncode', 'VAE Encode'),
+    node('CLIPTextEncode', 'CLIP Text Encode'),
+    node('LoadImage', 'Load Image'),
+    node('SaveImage', 'Save Image'),
+    node('EmptyLatentImage', 'Empty Latent Image'),
+    node(
+      'StableCascade_StageB_Conditioning',
+      'StableCascade_StageB_Conditioning'
+    )
+  ]
+}
+
+const meta: Meta<typeof LinkReleaseNodeSubmenu> = {
+  title: 'Components/Searchbox/LinkReleaseNodeSubmenu',
+  component: LinkReleaseNodeSubmenu
+}
+
+export default meta
+type Story = StoryObj<typeof meta>
+
+function renderAnchored(side: 'left' | 'right'): Story['render'] {
+  return () => ({
+    components: {
+      DropdownMenuRoot,
+      DropdownMenuTrigger,
+      DropdownMenuPortal,
+      DropdownMenuContent,
+      DropdownMenuLabel,
+      LinkReleaseNodeSubmenu
+    },
+    setup() {
+      const anchorStyle =
+        side === 'right'
+          ? 'position: fixed; top: 64px; right: 16px;'
+          : 'position: fixed; top: 64px; left: 16px;'
+      return {
+        anchorStyle,
+        contentClass,
+        submenuContentClass,
+        submenuScrollClass,
+        itemClass,
+        category,
+        side
+      }
+    },
+    template: `
+      <div style="height: 480px;">
+        <DropdownMenuRoot default-open>
+          <DropdownMenuTrigger as-child>
+            <button :style="anchorStyle" class="rounded-md border border-interface-menu-stroke bg-interface-menu-surface px-3 py-1.5 text-sm text-base-foreground">
+              Compatible Nodes
+            </button>
+          </DropdownMenuTrigger>
+          <DropdownMenuPortal>
+            <DropdownMenuContent
+              :class="contentClass"
+              :side="side === 'right' ? 'bottom' : 'bottom'"
+              :align="side === 'right' ? 'end' : 'start'"
+              :side-offset="4"
+            >
+              <DropdownMenuLabel class="block truncate px-3 pt-2 pb-1 text-xs font-medium text-muted-foreground uppercase">
+                Compatible Nodes
+              </DropdownMenuLabel>
+              <LinkReleaseNodeSubmenu
+                :category="category"
+                :item-class="itemClass"
+                :content-class="submenuContentClass"
+                :scroll-class="submenuScrollClass"
+              />
+            </DropdownMenuContent>
+          </DropdownMenuPortal>
+        </DropdownMenuRoot>
+      </div>
+    `
+  })
+}
+
+/** Anchored near the LEFT edge: the submenu opens to the RIGHT (normal). */
+export const OpensRight: Story = { render: renderAnchored('left') }
+
+/**
+ * Anchored near the RIGHT edge: with no room on the right, Floating UI flips the
+ * submenu to the LEFT, landing flush against the parent menu's left edge.
+ */
+export const FlipsLeft: Story = { render: renderAnchored('right') }

src/components/searchbox/LinkReleaseNodeSubmenu.test.ts

@@ -0,0 +1,138 @@
+import { render, screen } from '@testing-library/vue'
+import userEvent from '@testing-library/user-event'
+import { describe, expect, it, vi } from 'vitest'
+import type { Slots } from 'vue'
+import { computed, h, inject, nextTick, provide } from 'vue'
+import { createI18n } from 'vue-i18n'
+
+import type { ComfyNodeDefImpl } from '@/stores/nodeDefStore'
+
+import LinkReleaseNodeSubmenu from './LinkReleaseNodeSubmenu.vue'
+import type { LinkReleaseNodeCategory } from './linkReleaseMenuModel'
+
+const i18n = createI18n({ legacy: false, locale: 'en', messages: { en: {} } })
+
+const category: LinkReleaseNodeCategory = {
+  key: 'comfy',
+  labelKey: 'Comfy Nodes',
+  icon: 'icon-[lucide--box]',
+  nodes: [{ name: 'KSampler', display_name: 'KSampler' } as ComfyNodeDefImpl]
+}
+
+const SUB_OPEN = Symbol('subOpen')
+
+const stubs = {
+  DropdownMenuSub: {
+    props: ['open'],
+    setup(props: { open?: boolean }, { slots }: { slots: Slots }) {
+      provide(
+        SUB_OPEN,
+        computed(() => props.open ?? false)
+      )
+      return () => h('div', slots.default?.())
+    }
+  },
+  DropdownMenuSubTrigger: {
+    template: '<button data-testid="sub-trigger"><slot /></button>'
+  },
+  DropdownMenuPortal: { template: '<div><slot /></div>' },
+  DropdownMenuSubContent: {
+    setup(_: unknown, { slots }: { slots: Slots }) {
+      const open = inject<{ value: boolean }>(SUB_OPEN)
+      return () =>
+        open?.value ? h('div', { role: 'menu' }, slots.default?.()) : null
+    }
+  },
+  DropdownMenuSeparator: { template: '<hr />' },
+  DropdownMenuItem: {
+    template: '<div role="menuitem" tabindex="-1"><slot /></div>'
+  },
+  MiddleTruncate: { template: '<span>{{ text }}</span>', props: ['text'] }
+}
+
+function renderSubmenu() {
+  return render(LinkReleaseNodeSubmenu, {
+    props: { category, itemClass: '', contentClass: '', scrollClass: '' },
+    global: { plugins: [i18n], stubs }
+  })
+}
+
+describe('LinkReleaseNodeSubmenu keyboard handling', () => {
+  it('steps into the submenu search on ArrowRight', async () => {
+    renderSubmenu()
+    await userEvent.click(screen.getByTestId('sub-trigger'))
+    await userEvent.keyboard('{ArrowRight}')
+    await nextTick()
+
+    expect(screen.getByRole('textbox')).toHaveFocus()
+  })
+
+  it('steps into the submenu search on Enter', async () => {
+    renderSubmenu()
+    await userEvent.click(screen.getByTestId('sub-trigger'))
+    await userEvent.keyboard('{Enter}')
+    await nextTick()
+
+    expect(screen.getByRole('textbox')).toHaveFocus()
+  })
+
+  it('does not move focus to the search on other keys', async () => {
+    renderSubmenu()
+    await userEvent.click(screen.getByTestId('sub-trigger'))
+    await userEvent.keyboard('a')
+    await nextTick()
+
+    expect(screen.getByRole('textbox')).not.toHaveFocus()
+  })
+
+  async function stepIntoSearch() {
+    await userEvent.click(screen.getByTestId('sub-trigger'))
+    await userEvent.keyboard('{ArrowRight}')
+    await nextTick()
+  }
+
+  it('selects the first filtered node on Enter in the search', async () => {
+    const onSelect = vi.fn()
+    render(LinkReleaseNodeSubmenu, {
+      props: {
+        category,
+        itemClass: '',
+        contentClass: '',
+        scrollClass: '',
+        onSelect
+      },
+      global: { plugins: [i18n], stubs }
+    })
+    await stepIntoSearch()
+    expect(screen.getByRole('textbox')).toHaveFocus()
+
+    await userEvent.keyboard('{Enter}')
+    expect(onSelect).toHaveBeenCalledWith(category.nodes[0])
+  })
+
+  it('does not select on Escape in the search', async () => {
+    const onSelect = vi.fn()
+    render(LinkReleaseNodeSubmenu, {
+      props: {
+        category,
+        itemClass: '',
+        contentClass: '',
+        scrollClass: '',
+        onSelect
+      },
+      global: { plugins: [i18n], stubs }
+    })
+    await stepIntoSearch()
+
+    await userEvent.keyboard('{Escape}')
+    expect(onSelect).not.toHaveBeenCalled()
+  })
+
+  it('moves focus to the first node on ArrowDown from the search', async () => {
+    renderSubmenu()
+    await stepIntoSearch()
+
+    await userEvent.keyboard('{ArrowDown}')
+    expect(screen.getByRole('menuitem')).toHaveFocus()
+  })
+})

src/components/searchbox/LinkReleaseNodeSubmenu.vue

@@ -0,0 +1,242 @@
+<template>
+  <DropdownMenuSub v-model:open="open">
+    <DropdownMenuSubTrigger
+      ref="triggerRef"
+      :class="triggerClass"
+      @focus="open = true"
+      @keydown="onTriggerKeydown"
+      @blur="onTriggerBlur"
+    >
+      <i :class="cn(category.icon, 'size-4 shrink-0 opacity-80')" />
+      <span class="flex-1 truncate">{{ t(category.labelKey) }}</span>
+      <span
+        class="rounded-full bg-interface-menu-keybind-surface-default px-1.5 text-xs text-muted-foreground"
+      >
+        {{ category.nodes.length }}
+      </span>
+      <i class="icon-[lucide--chevron-right] size-4 shrink-0 opacity-60" />
+    </DropdownMenuSubTrigger>
+    <DropdownMenuPortal>
+      <!--
+        Opens to the right of the trigger; when there's no room, Floating UI
+        flips it to the LEFT. align-offset is computed per-open
+        (alignToContextMenu) so the submenu's search field lines up with the
+        root search field instead of the hovered trigger row. The height is also
+        pinned per-open: maxHeight grows into the viewport space below the
+        submenu top but never drops under the context menu height, so the panel
+        scrolls internally instead of letting Floating UI shift it upward.
+      -->
+      <DropdownMenuSubContent
+        :class="contentClass"
+        :style="maxHeight ? { maxHeight: `${maxHeight}px` } : undefined"
+        side="right"
+        align="start"
+        :side-offset="-2"
+        :align-offset="alignOffset"
+        :collision-padding="8"
+        update-position-strategy="optimized"
+        @open-auto-focus.prevent
+        @entry-focus="onEntryFocus"
+        @keydown.capture="redirectTypingToSearch"
+      >
+        <div class="shrink-0 p-0.5">
+          <div
+            class="flex h-9 items-center gap-2 rounded-lg bg-secondary-background px-2"
+          >
+            <i
+              class="icon-[lucide--search] size-4 shrink-0 text-muted-foreground"
+            />
+            <input
+              ref="searchInput"
+              v-model="query"
+              type="text"
+              :aria-label="
+                t('g.searchPlaceholder', { subject: t(category.labelKey) })
+              "
+              :placeholder="
+                t('g.searchPlaceholder', { subject: t(category.labelKey) })
+              "
+              class="size-full min-w-0 appearance-none border-none bg-transparent text-sm text-base-foreground outline-none placeholder:text-muted-foreground"
+              @keydown="onSearchKeydown"
+            />
+          </div>
+        </div>
+        <DropdownMenuSeparator
+          class="-mx-1 my-1 h-px shrink-0 bg-border-subtle"
+        />
+        <div :class="scrollClass">
+          <DropdownMenuItem
+            v-for="nodeDef in filteredNodes"
+            :key="nodeDef.name"
+            :class="itemClass"
+            @select="emit('select', nodeDef)"
+          >
+            <MiddleTruncate
+              :text="nodeDef.display_name"
+              class="min-w-0 flex-1 self-stretch"
+            />
+          </DropdownMenuItem>
+          <div
+            v-if="filteredNodes.length === 0"
+            class="px-3 py-2 text-sm text-muted-foreground"
+          >
+            {{ t('g.noResults') }}
+          </div>
+        </div>
+      </DropdownMenuSubContent>
+    </DropdownMenuPortal>
+  </DropdownMenuSub>
+</template>
+
+<script setup lang="ts">
+import { cn } from '@comfyorg/tailwind-utils'
+import {
+  DropdownMenuItem,
+  DropdownMenuPortal,
+  DropdownMenuSeparator,
+  DropdownMenuSub,
+  DropdownMenuSubContent,
+  DropdownMenuSubTrigger
+} from 'reka-ui'
+import { computed, nextTick, ref, watch } from 'vue'
+import { useI18n } from 'vue-i18n'
+
+import type { ComfyNodeDefImpl } from '@/stores/nodeDefStore'
+
+import MiddleTruncate from './MiddleTruncate.vue'
+import {
+  computeSubmenuAlignOffset,
+  computeSubmenuMaxHeight,
+  filterNodesByName
+} from './linkReleaseMenuModel'
+import type { LinkReleaseNodeCategory } from './linkReleaseMenuModel'
+
+const { category, itemClass, contentClass, scrollClass } = defineProps<{
+  category: LinkReleaseNodeCategory
+  itemClass: string
+  contentClass: string
+  scrollClass: string
+}>()
+
+const emit = defineEmits<{
+  select: [nodeDef: ComfyNodeDefImpl]
+}>()
+
+const { t } = useI18n()
+
+const open = ref(false)
+const query = ref('')
+const searchInput = ref<HTMLInputElement>()
+const triggerRef = ref<InstanceType<typeof DropdownMenuSubTrigger>>()
+// Pin the submenu's search field to the root search field rather than to the
+// hovered trigger row; both recomputed each time the submenu opens.
+const alignOffset = ref(-5)
+const maxHeight = ref<number>()
+
+const VIEWPORT_MARGIN = 8
+
+const triggerClass = computed(() =>
+  cn(itemClass, 'data-[state=open]:bg-interface-menu-component-surface-hovered')
+)
+
+const filteredNodes = computed(() =>
+  filterNodesByName(category.nodes, query.value)
+)
+
+function alignToContextMenu() {
+  const triggerEl = triggerRef.value?.$el as HTMLElement | undefined
+  const rootMenu = triggerEl?.closest<HTMLElement>('[role="menu"]')
+  const rootSearch = rootMenu?.querySelector<HTMLElement>('[data-search-field]')
+  if (!triggerEl || !rootMenu || !rootSearch) return
+  const triggerTop = triggerEl.getBoundingClientRect().top
+  const rootRect = rootMenu.getBoundingClientRect()
+  const rootSearchTop = rootSearch.getBoundingClientRect().top
+  const contentPaddingTop = parseFloat(getComputedStyle(rootMenu).paddingTop)
+  alignOffset.value = computeSubmenuAlignOffset({
+    triggerTop,
+    rootSearchTop,
+    contentPaddingTop
+  })
+  maxHeight.value = computeSubmenuMaxHeight({
+    submenuTop: rootSearchTop - contentPaddingTop,
+    contextMenuHeight: rootRect.height,
+    viewportHeight: window.innerHeight,
+    margin: VIEWPORT_MARGIN
+  })
+}
+
+watch(open, (isOpen) => {
+  if (isOpen) alignToContextMenu()
+  else query.value = ''
+})
+
+function focusSearch() {
+  searchInput.value?.focus()
+}
+
+function submenuContent() {
+  return searchInput.value?.closest<HTMLElement>('[role="menu"]') ?? null
+}
+
+// Step into the open submenu, landing on its search field.
+function onTriggerKeydown(event: KeyboardEvent) {
+  if (event.key !== 'ArrowRight' && event.key !== 'Enter') return
+  event.preventDefault()
+  open.value = true
+  void nextTick(focusSearch)
+}
+
+// Close the preview when focus leaves the trigger to a sibling item rather
+// than into the submenu content.
+function onTriggerBlur(event: FocusEvent) {
+  const next = event.relatedTarget
+  if (next instanceof Node && submenuContent()?.contains(next)) return
+  open.value = false
+}
+
+function isPrintableKey(event: KeyboardEvent) {
+  return (
+    event.key.length === 1 &&
+    event.key !== ' ' &&
+    !event.ctrlKey &&
+    !event.metaKey &&
+    !event.altKey
+  )
+}
+
+// When the keyboard focus is on a submenu item, funnel printable keystrokes
+// into this submenu's search field instead of Reka's item type-ahead.
+function redirectTypingToSearch(event: KeyboardEvent) {
+  if (event.target === searchInput.value || !isPrintableKey(event)) return
+  event.preventDefault()
+  event.stopPropagation()
+  query.value += event.key
+  focusSearch()
+}
+
+// Reka refocuses the first item (scrolling the list to the top) whenever the
+// menu regains focus, which fires as the pointer leaves an item while scrolling.
+function onEntryFocus(event: Event) {
+  event.preventDefault()
+}
+
+function focusFirstNode(target: HTMLElement) {
+  const panel = target.closest<HTMLElement>('[role="menu"]')
+  panel
+    ?.querySelector<HTMLElement>('[role="menuitem"]:not([data-disabled])')
+    ?.focus()
+}
+
+function onSearchKeydown(event: KeyboardEvent) {
+  // Let Reka handle submenu/menu navigation keys natively.
+  if (event.key === 'Escape' || event.key === 'ArrowLeft') return
+  event.stopPropagation()
+  if (event.key === 'ArrowDown') {
+    event.preventDefault()
+    focusFirstNode(event.currentTarget as HTMLElement)
+  } else if (event.key === 'Enter') {
+    const first = filteredNodes.value[0]
+    if (first) emit('select', first)
+  }
+}
+</script>

src/components/searchbox/MiddleTruncate.test.ts

@@ -0,0 +1,182 @@
+import { render, screen } from '@testing-library/vue'
+import userEvent from '@testing-library/user-event'
+import { afterEach, beforeEach, describe, expect, it, vi } from 'vitest'
+
+import MiddleTruncate from './MiddleTruncate.vue'
+import * as overflow from './isTextOverflowing'
+
+function stubRect(el: HTMLElement, rect: Partial<DOMRect>) {
+  el.getBoundingClientRect = () =>
+    ({
+      left: 0,
+      top: 0,
+      right: 0,
+      bottom: 0,
+      width: 0,
+      height: 0,
+      x: 0,
+      y: 0,
+      toJSON: () => ({}),
+      ...rect
+    }) as DOMRect
+}
+
+describe('MiddleTruncate', () => {
+  beforeEach(() => {
+    Object.defineProperty(document.documentElement, 'clientWidth', {
+      configurable: true,
+      value: 1024
+    })
+  })
+
+  afterEach(() => {
+    vi.restoreAllMocks()
+    Reflect.deleteProperty(document.documentElement, 'clientWidth')
+  })
+
+  it('renders the full text inline', () => {
+    render(MiddleTruncate, { props: { text: 'KSampler' } })
+    expect(screen.getByText('KSampler')).toBeInTheDocument()
+  })
+
+  it('does not reveal a tooltip when the text fits', async () => {
+    vi.spyOn(overflow, 'measureTextWidth').mockReturnValue(0)
+    render(MiddleTruncate, { props: { text: 'KSampler' } })
+    await userEvent.hover(screen.getByText('KSampler'))
+    expect(screen.queryByRole('tooltip')).toBeNull()
+  })
+
+  it('reveals the full text on hover when truncated', async () => {
+    vi.spyOn(overflow, 'measureTextWidth').mockReturnValue(500)
+    const longName = 'ONNX Detector (SEGS/legacy) - use BBOXDetector'
+    render(MiddleTruncate, { props: { text: longName } })
+    const el = screen.getByText(longName)
+    stubRect(el, { left: 10, top: 20, width: 100, height: 20 })
+    await userEvent.hover(el)
+    expect(screen.getByRole('tooltip')).toHaveTextContent(longName)
+  })
+
+  it('reveals when hovering anywhere on the parent menu item', async () => {
+    vi.spyOn(overflow, 'measureTextWidth').mockReturnValue(500)
+    const longName = 'ONNX Detector (SEGS/legacy) - use BBOXDetector'
+    render({
+      components: { MiddleTruncate },
+      template: `<div role="menuitem"><MiddleTruncate text="${longName}" /></div>`
+    })
+    stubRect(screen.getByText(longName), {
+      left: 10,
+      top: 20,
+      width: 120,
+      height: 20
+    })
+    await userEvent.hover(screen.getByRole('menuitem'))
+    expect(screen.getByRole('tooltip')).toHaveTextContent(longName)
+  })
+
+  it('sizes the reveal to the parent menu item height', async () => {
+    vi.spyOn(overflow, 'measureTextWidth').mockReturnValue(500)
+    const nodeName = 'A long truncated node name'
+    render({
+      components: { MiddleTruncate },
+      template: `<div role="menuitem"><MiddleTruncate text="${nodeName}" /></div>`
+    })
+    stubRect(screen.getByText(nodeName), {
+      left: 10,
+      top: 20,
+      width: 100,
+      height: 20
+    })
+    stubRect(screen.getByRole('menuitem'), {
+      left: 0,
+      top: 10,
+      right: 200,
+      width: 200,
+      height: 36
+    })
+    await userEvent.hover(screen.getByText(nodeName))
+    expect(screen.getByRole('tooltip')).toHaveStyle({ height: '36px' })
+  })
+
+  it('anchors the reveal to the left when it fits to the right', async () => {
+    vi.spyOn(overflow, 'measureTextWidth').mockReturnValue(50)
+    const nodeName = 'Fits To The Right'
+    render({
+      components: { MiddleTruncate },
+      template: `<div role="menuitem"><MiddleTruncate text="${nodeName}" /></div>`
+    })
+    stubRect(screen.getByText(nodeName), {
+      left: 10,
+      top: 20,
+      width: 100,
+      height: 20
+    })
+    stubRect(screen.getByRole('menuitem'), {
+      left: 0,
+      top: 10,
+      right: 200,
+      width: 200,
+      height: 36
+    })
+    await userEvent.hover(screen.getByText(nodeName))
+    expect(screen.getByRole('tooltip')).toHaveStyle({ left: '10px' })
+  })
+
+  it('flips to a right anchor when revealing rightward would overflow', async () => {
+    vi.spyOn(overflow, 'measureTextWidth').mockReturnValue(600)
+    const nodeName = 'A very long node name near the right edge'
+    render({
+      components: { MiddleTruncate },
+      template: `<div role="menuitem" style="padding-right: 16px"><MiddleTruncate text="${nodeName}" /></div>`
+    })
+    stubRect(screen.getByText(nodeName), {
+      left: 850,
+      top: 20,
+      width: 150,
+      height: 20
+    })
+    stubRect(screen.getByRole('menuitem'), {
+      left: 840,
+      top: 10,
+      right: 1000,
+      width: 160,
+      height: 36
+    })
+    await userEvent.hover(screen.getByText(nodeName))
+    const tooltip = screen.getByRole('tooltip')
+    // Anchored to the item's right edge (1024 - 1000), independent of its padding.
+    expect(tooltip).toHaveStyle({ right: '24px' })
+    expect(tooltip).not.toHaveStyle({ left: '850px' })
+  })
+
+  it('hides the reveal when the pointer leaves the menu item', async () => {
+    vi.spyOn(overflow, 'measureTextWidth').mockReturnValue(500)
+    const nodeName = 'A long truncated node name'
+    render({
+      components: { MiddleTruncate },
+      template: `<div role="menuitem"><MiddleTruncate text="${nodeName}" /></div>`
+    })
+    const el = screen.getByText(nodeName)
+    stubRect(el, { left: 10, top: 20, width: 100, height: 20 })
+    await userEvent.hover(el)
+    expect(screen.getByRole('tooltip')).toBeInTheDocument()
+
+    await userEvent.unhover(el)
+    expect(screen.queryByRole('tooltip')).toBeNull()
+  })
+
+  it('keeps the reveal while the pointer moves within the menu item', async () => {
+    vi.spyOn(overflow, 'measureTextWidth').mockReturnValue(500)
+    const nodeName = 'A long truncated node name'
+    render({
+      components: { MiddleTruncate },
+      template: `<div role="menuitem"><MiddleTruncate text="${nodeName}" /><span data-testid="sibling">x</span></div>`
+    })
+    const el = screen.getByText(nodeName)
+    stubRect(el, { left: 10, top: 20, width: 100, height: 20 })
+    await userEvent.hover(el)
+    expect(screen.getByRole('tooltip')).toBeInTheDocument()
+
+    await userEvent.pointer({ target: screen.getByTestId('sibling') })
+    expect(screen.getByRole('tooltip')).toBeInTheDocument()
+  })
+})

src/components/searchbox/MiddleTruncate.vue

@@ -0,0 +1,156 @@
+<template>
+  <span
+    ref="elRef"
+    v-bind="$attrs"
+    :class="cn('block min-w-0 truncate', revealed && 'text-transparent')"
+    @pointerenter="reveal"
+    @pointermove="reveal"
+    @pointerleave="onPointerLeave"
+    @focusin="reveal"
+    @focusout="hide"
+  >
+    {{ text }}
+  </span>
+  <Teleport to="body">
+    <span
+      v-if="revealed && revealStyle"
+      role="tooltip"
+      :class="
+        cn(
+          'pointer-events-none fixed z-99999 inline-flex items-center rounded-lg bg-interface-menu-component-surface-hovered pr-3 text-sm whitespace-nowrap text-base-foreground shadow-interface',
+          revealRect?.anchor === 'right' && 'pl-3'
+        )
+      "
+      :style="revealStyle"
+    >
+      {{ text }}
+    </span>
+  </Teleport>
+</template>
+
+<script setup lang="ts">
+import { useEventListener } from '@vueuse/core'
+import { cn } from '@comfyorg/tailwind-utils'
+import { computed, ref } from 'vue'
+
+import { measureTextWidth } from './isTextOverflowing'
+
+defineOptions({ inheritAttrs: false })
+
+const { text } = defineProps<{ text: string }>()
+
+// Gap kept between the reveal and the viewport edge (mirrors the menu's
+// collision-padding) and the reveal's own far-side padding (`pl-3`/`pr-3`).
+const VIEWPORT_MARGIN = 8
+const REVEAL_PADDING = 12
+
+type RevealRect = {
+  top: number
+  height: number
+  minWidth: number
+  maxWidth: number
+  anchor: 'left' | 'right'
+  offset: number
+}
+
+const elRef = ref<HTMLElement>()
+const revealed = ref(false)
+const revealRect = ref<RevealRect>()
+
+const revealStyle = computed(() => {
+  const rect = revealRect.value
+  if (!rect) return undefined
+  return {
+    top: `${rect.top}px`,
+    height: `${rect.height}px`,
+    minWidth: `${rect.minWidth}px`,
+    maxWidth: `${rect.maxWidth}px`,
+    width: 'max-content',
+    [rect.anchor]: `${rect.offset}px`
+  }
+})
+
+const menuItem = computed(
+  () =>
+    elRef.value?.closest<HTMLElement>('[role="menuitem"]') ??
+    elRef.value?.parentElement ??
+    null
+)
+
+function getRevealRect(el: HTMLElement, textWidth: number): RevealRect {
+  const textRect = el.getBoundingClientRect()
+  const item = menuItem.value
+  const itemRect = item?.getBoundingClientRect()
+  const paddingRight = item
+    ? Number.parseFloat(getComputedStyle(item).paddingRight) || 0
+    : 0
+  const rightInset = itemRect ? itemRect.right - paddingRight : textRect.right
+  const itemRight = itemRect ? itemRect.right : textRect.right
+  const viewportWidth = document.documentElement.clientWidth
+  const top = itemRect?.top ?? textRect.top
+  const height = itemRect?.height ?? textRect.height
+  const minWidth = Math.max(textRect.width, rightInset - textRect.left)
+  const neededWidth = Math.max(minWidth, textWidth + REVEAL_PADDING)
+  const fitsRight =
+    textRect.left + neededWidth <= viewportWidth - VIEWPORT_MARGIN
+
+  if (fitsRight) {
+    return {
+      top,
+      height,
+      minWidth,
+      maxWidth: viewportWidth - VIEWPORT_MARGIN - textRect.left,
+      anchor: 'left',
+      offset: textRect.left
+    }
+  }
+  return {
+    top,
+    height,
+    minWidth,
+    maxWidth: itemRight - VIEWPORT_MARGIN,
+    anchor: 'right',
+    offset: Math.max(VIEWPORT_MARGIN, viewportWidth - itemRight)
+  }
+}
+
+function reveal() {
+  const el = elRef.value
+  if (!el) {
+    revealed.value = false
+    return
+  }
+  const textWidth = measureTextWidth(el)
+  if (textWidth <= el.clientWidth + 0.5) {
+    revealed.value = false
+    return
+  }
+  revealRect.value = getRevealRect(el, textWidth)
+  revealed.value = true
+}
+
+function hide() {
+  revealed.value = false
+}
+
+function isStillOverMenuItem(related: EventTarget | null) {
+  const item = menuItem.value
+  return (
+    related instanceof Node &&
+    item != null &&
+    (item === related || item.contains(related))
+  )
+}
+
+function onPointerLeave(event: PointerEvent) {
+  if (isStillOverMenuItem(event.relatedTarget)) return
+  hide()
+}
+
+useEventListener(menuItem, 'pointerenter', reveal)
+useEventListener(menuItem, 'pointermove', reveal)
+useEventListener(menuItem, 'pointerleave', (event: PointerEvent) => {
+  if (isStillOverMenuItem(event.relatedTarget)) return
+  hide()
+})
+</script>

src/components/searchbox/NodeSearchBoxPopover.test.ts

@@ -6,10 +6,14 @@ import { computed, defineComponent, nextTick } from 'vue'
 import { createI18n } from 'vue-i18n'
 
 import { CORE_SETTINGS } from '@/platform/settings/constants/coreSettings'
+import { useCanvasStore } from '@/renderer/core/canvas/canvasStore'
 import type { Settings } from '@/schemas/apiSchema'
 import type { ComfyNodeDefImpl } from '@/stores/nodeDefStore'
+import { useSearchBoxStore } from '@/stores/workspace/searchBoxStore'
 import type { FuseFilter, FuseFilterWithValue } from '@/utils/fuseUtil'
 
+import { RootCategory } from '@/components/searchbox/v2/rootCategories'
+
 import NodeSearchBoxPopover from './NodeSearchBoxPopover.vue'
 
 const coreSettingsById = Object.fromEntries(CORE_SETTINGS.map((s) => [s.id, s]))
@@ -51,6 +55,7 @@ describe('NodeSearchBoxPopover', () => {
     let emitAddFilter: EmitAddFilter | null = null
     let emitAddNodeV1: EmitAddNode | null = null
     let emitAddNodeV2: EmitAddNode | null = null
+    let emitSelectNode: ((nodeDef: ComfyNodeDefImpl) => void) | null = null
 
     const NodeSearchBoxStub = defineComponent({
       name: 'NodeSearchBox',
@@ -82,6 +87,17 @@ describe('NodeSearchBoxPopover', () => {
       template: '<div data-testid="search-content-v2"></div>'
     })
 
+    const LinkReleaseContextMenuStub = defineComponent({
+      name: 'LinkReleaseContextMenu',
+      props: { context: { type: Object, default: null } },
+      emits: ['selectNode', 'addReroute', 'dismiss'],
+      setup(_, { emit }) {
+        emitSelectNode = (nodeDef) => emit('selectNode', nodeDef)
+        return {}
+      },
+      template: '<div data-testid="link-release-menu" />'
+    })
+
     const pinia = createTestingPinia({
       stubActions: false,
       initialState: {
@@ -99,6 +115,7 @@ describe('NodeSearchBoxPopover', () => {
         stubs: {
           NodeSearchBox: NodeSearchBoxStub,
           NodeSearchContent: NodeSearchContentStub,
+          LinkReleaseContextMenu: LinkReleaseContextMenuStub,
           NodePreviewCard: true,
           Dialog: {
             template: '<div><slot name="container" /></div>',
@@ -122,6 +139,11 @@ describe('NodeSearchBoxPopover', () => {
         if (!emitAddNodeV2)
           throw new Error('NodeSearchContent stub did not mount')
         return emitAddNodeV2
+      },
+      get emitSelectNode() {
+        if (!emitSelectNode)
+          throw new Error('LinkReleaseContextMenu stub did not mount')
+        return emitSelectNode
       }
     }
   }
@@ -276,4 +298,122 @@ describe('NodeSearchBoxPopover', () => {
       )
     })
   })
+
+  describe('selecting a node from the link-release menu', () => {
+    function setupCanvas() {
+      const selectNode = vi.fn()
+      const canvasStore = useCanvasStore()
+      canvasStore.canvas = {
+        graph: { nodes: [] },
+        allow_searchbox: false,
+        setDirty: vi.fn(),
+        selectNode,
+        linkConnector: {
+          events: new EventTarget(),
+          reset: vi.fn(),
+          disconnectLinks: vi.fn(),
+          connectToNode: vi.fn()
+        }
+      } as unknown as ReturnType<typeof useCanvasStore>['canvas']
+      return { selectNode }
+    }
+
+    it('auto-selects the placed node on the canvas', async () => {
+      const node = { id: 7 }
+      const { emitSelectNode } = renderComponent({
+        'Comfy.NodeSearchBoxImpl': 'default'
+      })
+      const { selectNode } = setupCanvas()
+      addNodeOnGraph.mockReturnValue(node)
+
+      emitSelectNode({ name: 'KSampler' } as ComfyNodeDefImpl)
+      await nextTick()
+
+      expect(selectNode).toHaveBeenCalledWith(node)
+    })
+
+    it('does not select when the node could not be created', async () => {
+      const { emitSelectNode } = renderComponent({
+        'Comfy.NodeSearchBoxImpl': 'default'
+      })
+      const { selectNode } = setupCanvas()
+      addNodeOnGraph.mockReturnValue(null)
+
+      emitSelectNode({ name: 'KSampler' } as ComfyNodeDefImpl)
+      await nextTick()
+
+      expect(selectNode).not.toHaveBeenCalled()
+    })
+  })
+
+  describe('defaultRootFilter on dialog open', () => {
+    function setGraphNodes(nodes: unknown[]) {
+      const canvasStore = useCanvasStore()
+      canvasStore.canvas = {
+        graph: { nodes },
+        allow_searchbox: false,
+        setDirty: vi.fn(),
+        linkConnector: {
+          events: new EventTarget(),
+          reset: vi.fn(),
+          disconnectLinks: vi.fn()
+        }
+      } as unknown as ReturnType<typeof useCanvasStore>['canvas']
+    }
+
+    async function openSearch() {
+      useSearchBoxStore().visible = true
+      await nextTick()
+    }
+
+    it('defaults to Essentials when the graph is empty', async () => {
+      renderComponent({ 'Comfy.NodeSearchBoxImpl': 'default' })
+      setGraphNodes([])
+      await openSearch()
+
+      expect(screen.getByTestId('search-content-v2')).toHaveAttribute(
+        'data-default-root-filter',
+        RootCategory.Essentials
+      )
+    })
+
+    it('defaults to Essentials when the canvas is not yet available', async () => {
+      renderComponent({ 'Comfy.NodeSearchBoxImpl': 'default' })
+      await openSearch()
+
+      expect(screen.getByTestId('search-content-v2')).toHaveAttribute(
+        'data-default-root-filter',
+        RootCategory.Essentials
+      )
+    })
+
+    it('defaults to null when the graph has nodes', async () => {
+      renderComponent({ 'Comfy.NodeSearchBoxImpl': 'default' })
+      setGraphNodes([{ id: 1 }])
+      await openSearch()
+
+      expect(screen.getByTestId('search-content-v2')).not.toHaveAttribute(
+        'data-default-root-filter'
+      )
+    })
+
+    it('re-evaluates each time the dialog opens', async () => {
+      renderComponent({ 'Comfy.NodeSearchBoxImpl': 'default' })
+
+      setGraphNodes([])
+      await openSearch()
+      expect(screen.getByTestId('search-content-v2')).toHaveAttribute(
+        'data-default-root-filter',
+        RootCategory.Essentials
+      )
+
+      useSearchBoxStore().visible = false
+      await nextTick()
+      setGraphNodes([{ id: 1 }])
+      await openSearch()
+      expect(screen.getByTestId('search-content-v2')).not.toHaveAttribute(
+        'data-default-root-filter'
+      )
+    })
+  })
 })

src/components/searchbox/NodeSearchBoxPopover.vue

@@ -27,6 +27,8 @@
         <div v-if="useSearchBoxV2" role="search" class="relative">
           <NodeSearchContent
             :filters="nodeFilters"
+            :default-root-filter="defaultRootFilter"
+            :data-default-root-filter="defaultRootFilter"
             @add-filter="addFilter"
             @remove-filter="removeFilter"
             @add-node="addNode"
@@ -51,6 +53,13 @@
         />
       </template>
     </Dialog>
+    <LinkReleaseContextMenu
+      ref="linkReleaseMenu"
+      :context="linkReleaseContext"
+      @select-node="connectNodeFromMenu"
+      @add-reroute="addRerouteFromMenu"
+      @dismiss="reset"
+    />
   </div>
 </template>
 
@@ -62,7 +71,11 @@ import { computed, ref, toRaw, watch, watchEffect } from 'vue'
 
 import type { Point } from '@/lib/litegraph/src/interfaces'
 import type { LiteGraphCanvasEvent } from '@/lib/litegraph/src/litegraph'
-import { LGraphNode, LiteGraph } from '@/lib/litegraph/src/litegraph'
+import {
+  LGraphNode,
+  LiteGraph,
+  isNodeSlot
+} from '@/lib/litegraph/src/litegraph'
 import type { CanvasPointerEvent } from '@/lib/litegraph/src/types/events'
 import { useSettingStore } from '@/platform/settings/settingStore'
 import { useSurveyFeatureTracking } from '@/platform/surveys/useSurveyFeatureTracking'
@@ -78,11 +91,14 @@ import type { FuseFilterWithValue } from '@/utils/fuseUtil'
 
 import NodePreviewCard from '@/components/node/NodePreviewCard.vue'
 
+import LinkReleaseContextMenu from './LinkReleaseContextMenu.vue'
+import type { LinkReleaseContext } from './linkReleaseMenuModel'
 import NodeSearchContent from './v2/NodeSearchContent.vue'
+import { RootCategory } from './v2/rootCategories'
+import type { RootCategoryId } from './v2/rootCategories'
 import NodeSearchBox from './NodeSearchBox.vue'
 
 let triggerEvent: CanvasPointerEvent | null = null
-let listenerController: AbortController | null = null
 let disconnectOnReset = false
 
 const settingStore = useSettingStore()
@@ -103,6 +119,8 @@ const enableNodePreview = computed(
     settingStore.get('Comfy.NodeSearchBoxImpl.NodePreview') &&
     windowWidth.value >= MIN_WIDTH_FOR_PREVIEW
 )
+const linkReleaseMenu = ref<InstanceType<typeof LinkReleaseContextMenu>>()
+const linkReleaseContext = ref<LinkReleaseContext | null>(null)
 function getNewNodeLocation(): Point {
   return triggerEvent
     ? [triggerEvent.canvasX, triggerEvent.canvasY]
@@ -129,16 +147,26 @@ function closeDialog() {
 }
 const canvasStore = useCanvasStore()
 
-function addNode(nodeDef: ComfyNodeDefImpl, dragEvent?: MouseEvent) {
-  const followCursor = settingStore.get('Comfy.NodeSearchBoxImpl.FollowCursor')
+// Pre-select the Essentials category when opening search on an empty graph,
+// where new users benefit most from a curated starting set.
+const defaultRootFilter = computed<RootCategoryId | null>(() => {
+  const graph = canvasStore.canvas?.graph
+  return graph && graph.nodes.length > 0 ? null : RootCategory.Essentials
+})
+
+function connectNewNode(
+  nodeDef: ComfyNodeDefImpl,
+  options: { ghost?: boolean; dragEvent?: MouseEvent } = {}
+): LGraphNode | null {
+  const { ghost = false, dragEvent } = options
   const node = withNodeAddSource('search_modal', () =>
     litegraphService.addNodeOnGraph(
       nodeDef,
       { pos: getNewNodeLocation() },
-      { ghost: useSearchBoxV2.value && followCursor, dragEvent }
+      { ghost, dragEvent }
     )
   )
-  if (!node) return
+  if (!node) return null
 
   if (disconnectOnReset && triggerEvent) {
     canvasStore.getCanvas().linkConnector.connectToNode(node, triggerEvent)
@@ -150,6 +178,16 @@ function addNode(nodeDef: ComfyNodeDefImpl, dragEvent?: MouseEvent) {
 
   // Notify changeTracker - new step should be added
   useWorkflowStore().activeWorkflow?.changeTracker?.captureCanvasState()
+
+  return node
+}
+
+function addNode(nodeDef: ComfyNodeDefImpl, dragEvent?: MouseEvent) {
+  const followCursor = settingStore.get('Comfy.NodeSearchBoxImpl.FollowCursor')
+  connectNewNode(nodeDef, {
+    ghost: useSearchBoxV2.value && followCursor,
+    dragEvent
+  })
   window.requestAnimationFrame(closeDialog)
 }
 
@@ -202,62 +240,46 @@ function showContextMenu(e: CanvasPointerEvent) {
   const firstLink = getFirstLink()
   if (!firstLink) return
 
-  const { node, fromSlot, toType } = firstLink
-  const commonOptions = {
-    e,
-    allow_searchbox: true,
-    showSearchBox: () => {
-      cancelResetOnContextClose()
-      showSearchBox(e)
-    }
+  const { fromSlot, toType } = firstLink
+  linkReleaseContext.value = {
+    dataType: fromSlot.type?.toString() ?? '',
+    slotName: fromSlot.name ?? '',
+    isFromOutput: toType === 'input'
   }
-  const afterRerouteId = firstLink.fromReroute?.id
-  const connectionOptions =
-    toType === 'input'
-      ? { nodeFrom: node, slotFrom: fromSlot, afterRerouteId }
-      : { nodeTo: node, slotTo: fromSlot, afterRerouteId }
-
-  const canvas = canvasStore.getCanvas()
-  const menu = canvas.showConnectionMenu({
-    ...connectionOptions,
-    ...commonOptions
-  })
-
-  if (!menu) {
-    console.warn('No menu was returned from showConnectionMenu')
-    return
-  }
-
   triggerEvent = e
-  listenerController = new AbortController()
-  const { signal } = listenerController
-  const options = { once: true, signal }
 
-  // Connect the node after it is created via context menu
-  useEventListener(
-    canvas.canvas,
-    'connect-new-default-node',
-    (createEvent) => {
-      if (!(createEvent instanceof CustomEvent))
-        throw new Error('Invalid event')
+  // Hide the dangling link while the menu holds the connection open; the real
+  // edge reappears once a node is committed (reset clears this flag).
+  const canvas = canvasStore.getCanvas()
+  canvas.linkConnector.renderLinksHidden = true
+  canvas.setDirty(true, true)
 
-      const node: unknown = createEvent.detail?.node
-      if (!(node instanceof LGraphNode)) throw new Error('Invalid node')
+  linkReleaseMenu.value?.show(e)
+}
 
-      disconnectOnReset = false
-      createEvent.preventDefault()
-      canvas.linkConnector.connectToNode(node, e)
-    },
-    options
-  )
+function connectNodeFromMenu(nodeDef: ComfyNodeDefImpl) {
+  const node = connectNewNode(nodeDef)
+  if (node) canvasStore.getCanvas().selectNode(node)
+  reset()
+}
 
-  // Reset when the context menu is closed
-  const cancelResetOnContextClose = useEventListener(
-    menu.controller.signal,
-    'abort',
-    reset,
-    options
-  )
+function addRerouteFromMenu() {
+  const firstLink = getFirstLink()
+  const node = firstLink?.node
+  if (
+    firstLink &&
+    triggerEvent &&
+    node instanceof LGraphNode &&
+    isNodeSlot(firstLink.fromSlot)
+  ) {
+    node.connectFloatingReroute(
+      [triggerEvent.canvasX, triggerEvent.canvasY],
+      firstLink.fromSlot,
+      firstLink.fromReroute?.id
+    )
+    useWorkflowStore().activeWorkflow?.changeTracker?.captureCanvasState()
+  }
+  reset()
 }
 
 // Disable litegraph's default behavior of release link and search box.
@@ -333,25 +355,32 @@ function handleDroppedOnCanvas(e: CustomEvent<CanvasPointerEvent>) {
 
 // Resets litegraph state
 function reset() {
-  listenerController?.abort()
-  listenerController = null
   triggerEvent = null
 
   const canvas = canvasStore.getCanvas()
   canvas.linkConnector.events.removeEventListener('reset', preventDefault)
   if (disconnectOnReset) canvas.linkConnector.disconnectLinks()
+  disconnectOnReset = false
 
   canvas.linkConnector.reset()
   canvas.setDirty(true, true)
 }
 
+// Tears down a held link-release session synchronously so a new link drag can
+// take over without hitting LinkConnector's "Already dragging links" guard.
+function cancelLinkRelease() {
+  linkReleaseMenu.value?.hide()
+  visible.value = false
+  reset()
+}
+
 // Reset connecting links when the search box is closed
 watch(visible, () => {
   if (!visible.value) reset()
 })
 
 useEventListener(document, 'litegraph:canvas', canvasEventHandler)
-defineExpose({ showSearchBox })
+defineExpose({ showSearchBox, cancelLinkRelease })
 </script>
 
 <style>

src/components/searchbox/isTextOverflowing.test.ts

@@ -0,0 +1,45 @@
+import { afterEach, describe, expect, it, vi } from 'vitest'
+
+import { isTextOverflowing } from './isTextOverflowing'
+
+const CHAR_WIDTH = 10
+
+function setup(text: string, contentWidth: number) {
+  const el = document.createElement('span')
+  el.textContent = text
+  Object.defineProperty(el, 'clientWidth', {
+    configurable: true,
+    value: contentWidth
+  })
+  vi.spyOn(window, 'getComputedStyle').mockReturnValue(
+    {} as CSSStyleDeclaration
+  )
+  vi.spyOn(
+    HTMLSpanElement.prototype,
+    'getBoundingClientRect'
+  ).mockImplementation(function (this: HTMLSpanElement) {
+    return { width: (this.textContent?.length ?? 0) * CHAR_WIDTH } as DOMRect
+  })
+  return el
+}
+
+describe('isTextOverflowing', () => {
+  afterEach(() => {
+    vi.restoreAllMocks()
+  })
+
+  it('returns false when the text fits the content width', () => {
+    const el = setup('KSampler', 200)
+    expect(isTextOverflowing(el)).toBe(false)
+  })
+
+  it('returns true when the full text is wider than the content width', () => {
+    const el = setup('ONNX Detector (SEGS/legacy) - use BBOXDetector', 120)
+    expect(isTextOverflowing(el)).toBe(true)
+  })
+
+  it('returns false for a zero-width element', () => {
+    const el = setup('anything', 0)
+    expect(isTextOverflowing(el)).toBe(false)
+  })
+})

src/components/searchbox/isTextOverflowing.ts

@@ -0,0 +1,46 @@
+const FONT_PROPS = [
+  'fontStyle',
+  'fontVariant',
+  'fontWeight',
+  'fontStretch',
+  'fontSize',
+  'fontFamily',
+  'letterSpacing',
+  'textTransform',
+  'wordSpacing'
+] as const
+
+/**
+ * Measures the full, unclipped width of an element's text by rendering it in a
+ * hidden clone that copies the element's font metrics. `scrollWidth` is
+ * unreliable for `text-overflow: ellipsis` in Chrome (it often reports equal to
+ * `clientWidth`), so the clone is the source of truth.
+ */
+export function measureTextWidth(el: HTMLElement): number {
+  const style = getComputedStyle(el)
+  const clone = document.createElement('span')
+  clone.textContent = el.textContent ?? ''
+  clone.style.position = 'fixed'
+  clone.style.top = '-9999px'
+  clone.style.left = '-9999px'
+  clone.style.visibility = 'hidden'
+  clone.style.whiteSpace = 'nowrap'
+  for (const prop of FONT_PROPS) clone.style[prop] = style[prop]
+
+  document.body.appendChild(clone)
+  const textWidth = clone.getBoundingClientRect().width
+  clone.remove()
+
+  return textWidth
+}
+
+/**
+ * Detects whether a single-line, ellipsis-truncated element is actually
+ * clipping its text by comparing its full text width against the available
+ * content width.
+ */
+export function isTextOverflowing(el: HTMLElement): boolean {
+  const contentWidth = el.clientWidth
+  if (contentWidth <= 0) return false
+  return measureTextWidth(el) > contentWidth + 0.5
+}

src/components/searchbox/linkReleaseMenuModel.test.ts

@@ -0,0 +1,317 @@
+import { describe, expect, it } from 'vitest'
+
+import type { ComfyNodeDefImpl } from '@/stores/nodeDefStore'
+import { NodeSourceType } from '@/types/nodeSource'
+
+import {
+  buildLinkReleaseNodeCategories,
+  computeContextMenuTop,
+  computeSubmenuAlignOffset,
+  computeSubmenuMaxHeight,
+  estimateLinkReleaseMenuHeight,
+  filterNodesByName,
+  getLinkReleaseHeaderLabel,
+  getLinkReleaseSuggestions,
+  groupLinkReleaseSearchResults,
+  searchLinkReleaseNodes
+} from './linkReleaseMenuModel'
+import type { LinkReleaseContext } from './linkReleaseMenuModel'
+
+function coreNode(name: string, display_name = name): ComfyNodeDefImpl {
+  return {
+    name,
+    display_name,
+    nodeSource: { type: NodeSourceType.Core },
+    api_node: false
+  } as ComfyNodeDefImpl
+}
+
+function customNode(name: string, display_name = name): ComfyNodeDefImpl {
+  return {
+    name,
+    display_name,
+    nodeSource: { type: NodeSourceType.CustomNodes },
+    api_node: false
+  } as ComfyNodeDefImpl
+}
+
+function partnerNode(name: string, display_name = name): ComfyNodeDefImpl {
+  return {
+    name,
+    display_name,
+    nodeSource: { type: NodeSourceType.Core },
+    api_node: true
+  } as ComfyNodeDefImpl
+}
+
+const ksampler = coreNode('KSampler')
+const vaeDecode = coreNode('VAEDecode', 'VAE Decode')
+const rerouteNode = coreNode('Reroute')
+
+function createContext(
+  overrides: Partial<LinkReleaseContext> = {}
+): LinkReleaseContext {
+  return {
+    dataType: 'MODEL',
+    slotName: 'model',
+    isFromOutput: true,
+    ...overrides
+  }
+}
+
+describe('getLinkReleaseHeaderLabel', () => {
+  it('combines slot name and data type', () => {
+    const label = getLinkReleaseHeaderLabel(
+      createContext({ slotName: 'model', dataType: 'MODEL' })
+    )
+    expect(label).toBe('model | MODEL')
+  })
+
+  it('falls back to whichever value is present', () => {
+    const onlyType = getLinkReleaseHeaderLabel(
+      createContext({ slotName: '', dataType: 'IMAGE' })
+    )
+    const onlyName = getLinkReleaseHeaderLabel(
+      createContext({ slotName: 'clip', dataType: '' })
+    )
+    expect(onlyType).toBe('IMAGE')
+    expect(onlyName).toBe('clip')
+  })
+})
+
+describe('getLinkReleaseSuggestions', () => {
+  it('excludes the Reroute node', () => {
+    const suggestions = getLinkReleaseSuggestions([rerouteNode, vaeDecode])
+    expect(suggestions.map((n) => n.name)).toEqual(['VAEDecode'])
+  })
+
+  it('preserves the incoming order of remaining nodes', () => {
+    const suggestions = getLinkReleaseSuggestions([vaeDecode, ksampler])
+    expect(suggestions.map((n) => n.name)).toEqual(['VAEDecode', 'KSampler'])
+  })
+})
+
+describe('buildLinkReleaseNodeCategories', () => {
+  it('groups nodes by source into comfy, extensions and partner buckets', () => {
+    const ext = customNode('ExtNode', 'Ext Node')
+    const partner = partnerNode('PartnerNode', 'Partner Node')
+
+    const categories = buildLinkReleaseNodeCategories([ksampler, ext, partner])
+    const byKey = Object.fromEntries(categories.map((c) => [c.key, c]))
+
+    expect(byKey.comfy.nodes.map((n) => n.name)).toContain('KSampler')
+    expect(byKey.extensions.nodes.map((n) => n.name)).toContain('ExtNode')
+    expect(byKey.partner.nodes.map((n) => n.name)).toContain('PartnerNode')
+  })
+
+  it('omits empty buckets', () => {
+    const categories = buildLinkReleaseNodeCategories([ksampler])
+    expect(categories.map((c) => c.key)).toEqual(['comfy'])
+  })
+
+  it('orders buckets comfy, extensions, partner', () => {
+    const categories = buildLinkReleaseNodeCategories([
+      partnerNode('P'),
+      customNode('E'),
+      coreNode('C')
+    ])
+    expect(categories.map((c) => c.key)).toEqual([
+      'comfy',
+      'extensions',
+      'partner'
+    ])
+  })
+
+  it('sorts nodes alphabetically by display name within a bucket', () => {
+    const categories = buildLinkReleaseNodeCategories([
+      coreNode('B'),
+      coreNode('A')
+    ])
+    expect(categories[0].nodes.map((n) => n.display_name)).toEqual(['A', 'B'])
+  })
+
+  it('classifies api-category nodes as partner', () => {
+    const apiNode = {
+      name: 'ApiThing',
+      display_name: 'Api Thing',
+      nodeSource: { type: NodeSourceType.Core },
+      api_node: false,
+      category: 'api node/openai'
+    } as ComfyNodeDefImpl
+
+    const categories = buildLinkReleaseNodeCategories([apiNode])
+    expect(categories.map((c) => c.key)).toEqual(['partner'])
+  })
+})
+
+describe('filterNodesByName', () => {
+  it('returns all nodes when query is blank', () => {
+    expect(filterNodesByName([ksampler, vaeDecode], '  ')).toHaveLength(2)
+  })
+
+  it('matches display name case-insensitively', () => {
+    const result = filterNodesByName([ksampler, vaeDecode], 'vae')
+    expect(result.map((n) => n.name)).toEqual(['VAEDecode'])
+  })
+})
+
+describe('groupLinkReleaseSearchResults', () => {
+  const categories = buildLinkReleaseNodeCategories([
+    coreNode('LoadImage', 'Load Image'),
+    customNode('ImageBlend', 'Image Blend'),
+    partnerNode('ImageGen', 'Image Gen'),
+    coreNode('KSampler')
+  ])
+
+  it('returns no groups for a blank query', () => {
+    expect(groupLinkReleaseSearchResults(categories, '   ')).toEqual([])
+  })
+
+  it('groups matching nodes by category', () => {
+    const groups = groupLinkReleaseSearchResults(categories, 'image')
+    expect(groups.map((g) => g.category.key)).toEqual([
+      'comfy',
+      'extensions',
+      'partner'
+    ])
+    expect(groups.map((g) => g.nodes.map((n) => n.name))).toEqual([
+      ['LoadImage'],
+      ['ImageBlend'],
+      ['ImageGen']
+    ])
+  })
+
+  it('omits categories with no matches', () => {
+    const groups = groupLinkReleaseSearchResults(categories, 'ksampler')
+    expect(groups.map((g) => g.category.key)).toEqual(['comfy'])
+    expect(groups[0].nodes.map((n) => n.name)).toEqual(['KSampler'])
+  })
+})
+
+describe('searchLinkReleaseNodes', () => {
+  const categories = buildLinkReleaseNodeCategories([
+    coreNode('LoadImage', 'Load Image'),
+    customNode('ImageBlend', 'Image Blend'),
+    partnerNode('ImageGen', 'Image Gen'),
+    coreNode('KSampler')
+  ])
+
+  it('returns no matches for a blank query', () => {
+    expect(searchLinkReleaseNodes(categories, '   ')).toEqual([])
+  })
+
+  it('flattens matching nodes across categories, tagged with their category', () => {
+    const matches = searchLinkReleaseNodes(categories, 'image')
+    expect(matches.map((m) => m.node.name)).toEqual([
+      'LoadImage',
+      'ImageBlend',
+      'ImageGen'
+    ])
+    expect(matches.map((m) => m.category.key)).toEqual([
+      'comfy',
+      'extensions',
+      'partner'
+    ])
+  })
+
+  it('matches display name case-insensitively', () => {
+    const matches = searchLinkReleaseNodes(categories, 'ksampler')
+    expect(matches.map((m) => m.node.name)).toEqual(['KSampler'])
+    expect(matches[0].category.key).toBe('comfy')
+  })
+
+  it('returns an empty list when nothing matches', () => {
+    expect(searchLinkReleaseNodes(categories, 'zzz')).toEqual([])
+  })
+})
+
+describe('computeSubmenuAlignOffset', () => {
+  it('lifts the submenu up to the root search field for a trigger below it', () => {
+    const offset = computeSubmenuAlignOffset({
+      triggerTop: 200,
+      rootSearchTop: 48,
+      contentPaddingTop: 4
+    })
+    expect(offset).toBe(-156)
+  })
+
+  it('offsets only by the content padding when the trigger sits at the search field', () => {
+    const offset = computeSubmenuAlignOffset({
+      triggerTop: 48,
+      rootSearchTop: 48,
+      contentPaddingTop: 4
+    })
+    expect(offset).toBe(-4)
+  })
+})
+
+describe('computeSubmenuMaxHeight', () => {
+  it('grows to the space below when there is ample room', () => {
+    const height = computeSubmenuMaxHeight({
+      submenuTop: 100,
+      contextMenuHeight: 420,
+      viewportHeight: 1000,
+      margin: 8
+    })
+    expect(height).toBe(892)
+  })
+
+  it('floors at the context menu height when room below is smaller', () => {
+    const height = computeSubmenuMaxHeight({
+      submenuTop: 600,
+      contextMenuHeight: 420,
+      viewportHeight: 1000,
+      margin: 8
+    })
+    expect(height).toBe(420)
+  })
+})
+
+describe('estimateLinkReleaseMenuHeight', () => {
+  it('estimates a typical default layout with header, suggestions, categories and reroute', () => {
+    const height = estimateLinkReleaseMenuHeight({
+      hasHeader: true,
+      suggestionCount: 4,
+      categoryCount: 3,
+      searchResultCount: 0,
+      showReroute: true
+    })
+    expect(height).toBe(468)
+  })
+
+  it('estimates search results instead of the default sections', () => {
+    const height = estimateLinkReleaseMenuHeight({
+      hasHeader: true,
+      suggestionCount: 4,
+      categoryCount: 3,
+      searchResultCount: 5,
+      searchResultGroupCount: 2,
+      showReroute: false
+    })
+    expect(height).toBe(280)
+  })
+})
+
+describe('computeContextMenuTop', () => {
+  const base = {
+    menuHeight: 468,
+    viewportHeight: 1000,
+    margin: 8,
+    sideOffset: 4
+  }
+
+  it('bottom-anchors when the cursor is near the viewport bottom', () => {
+    const top = computeContextMenuTop({ ...base, cursorY: 900 })
+    expect(top).toBe(524)
+  })
+
+  it('opens at the cursor when there is room below', () => {
+    const top = computeContextMenuTop({ ...base, cursorY: 100 })
+    expect(top).toBe(104)
+  })
+
+  it('pins to the top margin when the cursor is above the viewport', () => {
+    const top = computeContextMenuTop({ ...base, cursorY: -10 })
+    expect(top).toBe(8)
+  })
+})

src/components/searchbox/linkReleaseMenuModel.ts

@@ -0,0 +1,264 @@
+import type { ComfyNodeDefImpl } from '@/stores/nodeDefStore'
+import { NodeSourceType } from '@/types/nodeSource'
+
+export interface LinkReleaseContext {
+  /** The data type of the slot the link was dragged from (e.g. "MODEL"). */
+  dataType: string
+  /** The name of the slot the link was dragged from (e.g. "model"). */
+  slotName: string
+  /**
+   * Whether the released link originates from an output slot, meaning the new
+   * node will be connected to via one of its inputs.
+   */
+  isFromOutput: boolean
+}
+
+type LinkReleaseCategoryKey = 'comfy' | 'extensions' | 'partner'
+
+export interface LinkReleaseNodeCategory {
+  key: LinkReleaseCategoryKey
+  /** i18n key for the group heading. */
+  labelKey: string
+  /** Iconify class shown beside the group label. */
+  icon: string
+  /** Nodes in the group, sorted alphabetically by display name. */
+  nodes: ComfyNodeDefImpl[]
+}
+
+const CATEGORY_META: Record<
+  LinkReleaseCategoryKey,
+  { labelKey: string; icon: string }
+> = {
+  comfy: { labelKey: 'contextMenu.Comfy Nodes', icon: 'icon-[lucide--box]' },
+  extensions: {
+    labelKey: 'contextMenu.Extensions',
+    icon: 'icon-[lucide--puzzle]'
+  },
+  partner: {
+    labelKey: 'contextMenu.Partner Nodes',
+    icon: 'icon-[lucide--handshake]'
+  }
+}
+
+const CATEGORY_ORDER: LinkReleaseCategoryKey[] = [
+  'comfy',
+  'extensions',
+  'partner'
+]
+
+export function getLinkReleaseHeaderLabel(context: LinkReleaseContext): string {
+  const { slotName, dataType } = context
+  if (slotName && dataType) return `${slotName} | ${dataType}`
+  return slotName || dataType
+}
+
+function classifyNode(node: ComfyNodeDefImpl): LinkReleaseCategoryKey {
+  if (node.api_node || node.category?.startsWith('api node')) return 'partner'
+  if (
+    node.nodeSource.type === NodeSourceType.Core ||
+    node.nodeSource.type === NodeSourceType.Essentials
+  ) {
+    return 'comfy'
+  }
+  return 'extensions'
+}
+
+function byDisplayName(a: ComfyNodeDefImpl, b: ComfyNodeDefImpl): number {
+  return a.display_name.localeCompare(b.display_name)
+}
+
+/**
+ * Group slot-compatible nodes into source buckets for the cascading menu.
+ * Empty buckets are omitted and each bucket's nodes are sorted by display name.
+ */
+export function buildLinkReleaseNodeCategories(
+  compatibleNodes: ComfyNodeDefImpl[]
+): LinkReleaseNodeCategory[] {
+  const buckets: Record<LinkReleaseCategoryKey, ComfyNodeDefImpl[]> = {
+    comfy: [],
+    extensions: [],
+    partner: []
+  }
+
+  for (const node of compatibleNodes) {
+    buckets[classifyNode(node)].push(node)
+  }
+
+  return CATEGORY_ORDER.filter((key) => buckets[key].length > 0).map((key) => ({
+    key,
+    labelKey: CATEGORY_META[key].labelKey,
+    icon: CATEGORY_META[key].icon,
+    nodes: [...buckets[key]].sort(byDisplayName)
+  }))
+}
+
+/** Quick-add suggestions for the released slot, excluding the Reroute node. */
+export function getLinkReleaseSuggestions(
+  defaultNodeDefs: ComfyNodeDefImpl[]
+): ComfyNodeDefImpl[] {
+  return defaultNodeDefs.filter((nodeDef) => nodeDef.name !== 'Reroute')
+}
+
+/** Case-insensitive filter of a node list by display name. */
+export function filterNodesByName(
+  nodes: ComfyNodeDefImpl[],
+  query: string
+): ComfyNodeDefImpl[] {
+  const trimmed = query.trim().toLowerCase()
+  if (!trimmed) return nodes
+  return nodes.filter((nodeDef) =>
+    nodeDef.display_name.toLowerCase().includes(trimmed)
+  )
+}
+
+/** A node surfaced by the root flat-value search, tagged with its category. */
+export interface LinkReleaseNodeMatch {
+  category: LinkReleaseNodeCategory
+  node: ComfyNodeDefImpl
+}
+
+export interface LinkReleaseSearchResultGroup {
+  category: LinkReleaseNodeCategory
+  nodes: ComfyNodeDefImpl[]
+}
+
+/**
+ * Group matching nodes by category for the root flat-value search. Empty
+ * categories are omitted; category order and per-category display-name order
+ * are preserved.
+ */
+export function groupLinkReleaseSearchResults(
+  categories: LinkReleaseNodeCategory[],
+  query: string
+): LinkReleaseSearchResultGroup[] {
+  const trimmed = query.trim().toLowerCase()
+  if (!trimmed) return []
+  return categories
+    .map((category) => ({
+      category,
+      nodes: category.nodes.filter((node) =>
+        node.display_name.toLowerCase().includes(trimmed)
+      )
+    }))
+    .filter((group) => group.nodes.length > 0)
+}
+
+/**
+ * Flat-value search across every category submenu: when the root search has
+ * text we surface matching nodes inline (tagged with their category) so a node
+ * can be picked straight from the root without first drilling into a submenu.
+ * Results preserve category order, then per-category display-name order.
+ */
+export function searchLinkReleaseNodes(
+  categories: LinkReleaseNodeCategory[],
+  query: string
+): LinkReleaseNodeMatch[] {
+  const matches: LinkReleaseNodeMatch[] = []
+  for (const group of groupLinkReleaseSearchResults(categories, query)) {
+    for (const node of group.nodes) {
+      matches.push({ category: group.category, node })
+    }
+  }
+  return matches
+}
+
+/**
+ * Vertical `alignOffset` (px) that makes a category submenu open level with the
+ * root menu rather than with the hovered trigger row. Positioning the submenu's
+ * top one content-padding above the root search field lines the submenu's own
+ * search field up with the root search field, since both menus share the same
+ * content padding and search-field markup.
+ */
+export function computeSubmenuAlignOffset(metrics: {
+  triggerTop: number
+  rootSearchTop: number
+  contentPaddingTop: number
+}): number {
+  const { triggerTop, rootSearchTop, contentPaddingTop } = metrics
+  return rootSearchTop - contentPaddingTop - triggerTop
+}
+
+/**
+ * Max height (px) for a category submenu pinned level with the root menu. The
+ * panel grows into the viewport space below its top, but never shrinks below
+ * the root menu's height so it can always be at least as tall as the context
+ * menu even when there is little room beneath it.
+ */
+export function computeSubmenuMaxHeight(metrics: {
+  submenuTop: number
+  contextMenuHeight: number
+  viewportHeight: number
+  margin: number
+}): number {
+  const { submenuTop, contextMenuHeight, viewportHeight, margin } = metrics
+  return Math.max(contextMenuHeight, viewportHeight - submenuTop - margin)
+}
+
+const CONTENT_PADDING_Y = 8
+const HEADER_HEIGHT = 36
+const SEARCH_HEIGHT = 40
+const SEPARATOR_HEIGHT = 8
+const SECTION_LABEL_HEIGHT = 36
+const MENU_ITEM_HEIGHT = 36
+
+/**
+ * Rough pixel height of the link-release context menu from its Tailwind layout.
+ * Used once on open to bottom-anchor the panel without relying on Reka's 80vh
+ * collision sizing.
+ */
+export function estimateLinkReleaseMenuHeight(layout: {
+  hasHeader: boolean
+  suggestionCount: number
+  categoryCount: number
+  searchResultCount: number
+  searchResultGroupCount?: number
+  showReroute: boolean
+}): number {
+  const {
+    hasHeader,
+    suggestionCount,
+    categoryCount,
+    searchResultCount,
+    searchResultGroupCount = 0,
+    showReroute
+  } = layout
+
+  let height = CONTENT_PADDING_Y + SEARCH_HEIGHT + SEPARATOR_HEIGHT
+  if (hasHeader) height += HEADER_HEIGHT
+
+  if (searchResultCount > 0) {
+    height += searchResultCount * MENU_ITEM_HEIGHT
+    if (searchResultGroupCount > 1) {
+      height += (searchResultGroupCount - 1) * SEPARATOR_HEIGHT
+    }
+    return height
+  }
+
+  if (suggestionCount > 0) {
+    height += SECTION_LABEL_HEIGHT + suggestionCount * MENU_ITEM_HEIGHT
+  }
+  if (suggestionCount > 0 && categoryCount > 0) {
+    height += SEPARATOR_HEIGHT
+  }
+  if (categoryCount > 0) {
+    height += SECTION_LABEL_HEIGHT + categoryCount * MENU_ITEM_HEIGHT
+  }
+  if (showReroute) {
+    height += SEPARATOR_HEIGHT + MENU_ITEM_HEIGHT
+  }
+  return height
+}
+
+/** Bottom-anchor the context menu top edge within the viewport. */
+export function computeContextMenuTop(metrics: {
+  cursorY: number
+  menuHeight: number
+  viewportHeight: number
+  margin: number
+  sideOffset: number
+}): number {
+  const { cursorY, menuHeight, viewportHeight, margin, sideOffset } = metrics
+  const menuTopAtCursor = cursorY + sideOffset
+  const maxMenuTop = Math.max(margin, viewportHeight - margin - menuHeight)
+  return Math.min(Math.max(margin, menuTopAtCursor), maxMenuTop)
+}

src/components/searchbox/v2/NodeSearchContent.vue

@@ -142,8 +142,9 @@ const sourceCategoryFilters: Record<string, (n: ComfyNodeDefImpl) => boolean> =
     [RootCategory.Custom]: isCustomNode
   }
 
-const { filters } = defineProps<{
+const { filters, defaultRootFilter = null } = defineProps<{
   filters: FuseFilterWithValue<ComfyNodeDefImpl, string>[]
+  defaultRootFilter?: RootCategoryId | null
 }>()
 
 const emit = defineEmits<{
@@ -195,7 +196,7 @@ function onSearchFocus() {
 }
 
 // Root filter from filter bar category buttons (radio toggle)
-const rootFilter = ref<RootCategoryId | null>(null)
+const rootFilter = ref<RootCategoryId | null>(defaultRootFilter)
 
 const rootFilterLabel = computed(() => {
   switch (rootFilter.value) {

src/composables/graph/useErrorClearingHooks.test.ts

@@ -4,8 +4,12 @@ import { setActivePinia } from 'pinia'
 import { beforeEach, describe, expect, it, vi } from 'vitest'
 
 import { installErrorClearingHooks } from '@/composables/graph/useErrorClearingHooks'
-import { promoteValueWidgetViaSubgraphInput } from '@/core/graph/subgraph/promotionUtils'
 import { LGraph, LGraphNode } from '@/lib/litegraph/src/litegraph'
+import type {
+  CanvasPointer,
+  CanvasPointerEvent,
+  LGraphCanvas
+} from '@/lib/litegraph/src/litegraph'
 import {
   createTestSubgraph,
   createTestSubgraphNode
@@ -252,6 +256,273 @@ describe('Widget change error clearing via onWidgetChanged', () => {
     expect(store.lastNodeErrors).toBeNull()
     expect(mediaStore.missingMediaCandidates).toBeNull()
   })
+
+  it('uses interior node execution ID for promoted widget error clearing', () => {
+    const subgraph = createTestSubgraph({
+      inputs: [{ name: 'ckpt_input', type: '*' }]
+    })
+    const interiorNode = new LGraphNode('CheckpointLoaderSimple')
+    const interiorInput = interiorNode.addInput('ckpt_input', '*')
+    interiorNode.addWidget(
+      'combo',
+      'ckpt_name',
+      'model.safetensors',
+      () => undefined,
+      { values: ['model.safetensors'] }
+    )
+    interiorInput.widget = { name: 'ckpt_name' }
+    subgraph.add(interiorNode)
+    subgraph.inputNode.slots[0].connect(interiorInput, interiorNode)
+
+    const subgraphNode = createTestSubgraphNode(subgraph, { id: 65 })
+    subgraphNode._internalConfigureAfterSlots()
+    const graph = subgraphNode.graph as LGraph
+    graph.add(subgraphNode)
+
+    vi.spyOn(app, 'rootGraph', 'get').mockReturnValue(graph)
+    installErrorClearingHooks(graph)
+
+    const store = useExecutionErrorStore()
+    const interiorExecId = `${subgraphNode.id}:${interiorNode.id}`
+
+    const promotedWidget = subgraphNode.widgets?.find(
+      (w) => 'sourceWidgetName' in w && w.sourceWidgetName === 'ckpt_name'
+    )
+    expect(promotedWidget).toBeDefined()
+
+    seedRequiredInputMissingNodeError(store, interiorExecId, 'ckpt_name')
+
+    subgraphNode.onWidgetChanged!.call(
+      subgraphNode,
+      'ckpt_name',
+      'other_model.safetensors',
+      'model.safetensors',
+      promotedWidget!
+    )
+
+    expect(store.lastNodeErrors).toBeNull()
+  })
+
+  it('clears range errors for promoted widgets by interior widget name', () => {
+    const subgraph = createTestSubgraph({
+      inputs: [{ name: 'steps_input', type: 'INT' }]
+    })
+    const interiorNode = new LGraphNode('KSampler')
+    const interiorInput = interiorNode.addInput('steps_input', 'INT')
+    interiorNode.addWidget('number', 'steps', 150, () => undefined, {
+      min: 1,
+      max: 100
+    })
+    interiorInput.widget = { name: 'steps' }
+    subgraph.add(interiorNode)
+    subgraph.inputNode.slots[0].connect(interiorInput, interiorNode)
+
+    const subgraphNode = createTestSubgraphNode(subgraph, { id: 65 })
+    subgraphNode._internalConfigureAfterSlots()
+    const graph = subgraphNode.graph as LGraph
+    graph.add(subgraphNode)
+
+    vi.spyOn(app, 'rootGraph', 'get').mockReturnValue(graph)
+    installErrorClearingHooks(graph)
+
+    const store = useExecutionErrorStore()
+    const interiorExecId = `${subgraphNode.id}:${interiorNode.id}`
+    store.lastNodeErrors = {
+      [interiorExecId]: {
+        errors: [
+          {
+            type: 'value_bigger_than_max',
+            message: 'Too big',
+            details: '',
+            extra_info: { input_name: 'steps' }
+          }
+        ],
+        dependent_outputs: [],
+        class_type: 'KSampler'
+      }
+    }
+
+    const promotedWidget = subgraphNode.widgets?.find(
+      (w) => 'sourceWidgetName' in w && w.sourceWidgetName === 'steps'
+    )
+    expect(promotedWidget).toBeDefined()
+
+    subgraphNode.onWidgetChanged!.call(
+      subgraphNode,
+      'steps',
+      50,
+      150,
+      promotedWidget!
+    )
+
+    expect(store.lastNodeErrors).toBeNull()
+  })
+
+  it('clears missing model state when a promoted widget changes through the legacy canvas path', () => {
+    const subgraph = createTestSubgraph({
+      inputs: [{ name: 'ckpt_input', type: '*' }]
+    })
+    const interiorNode = new LGraphNode('CheckpointLoaderSimple')
+    interiorNode.type = 'CheckpointLoaderSimple'
+    const interiorInput = interiorNode.addInput('ckpt_input', '*')
+    interiorNode.addWidget(
+      'combo',
+      'ckpt_name',
+      'missing.safetensors',
+      () => undefined,
+      { values: ['missing.safetensors', 'present.safetensors'] }
+    )
+    interiorInput.widget = { name: 'ckpt_name' }
+    subgraph.add(interiorNode)
+    subgraph.inputNode.slots[0].connect(interiorInput, interiorNode)
+
+    const subgraphNode = createTestSubgraphNode(subgraph, {
+      id: 65,
+      pos: [0, 0],
+      size: [200, 100]
+    })
+    subgraphNode._internalConfigureAfterSlots()
+    const graph = subgraphNode.graph as LGraph
+    graph.add(subgraphNode)
+
+    vi.spyOn(app, 'rootGraph', 'get').mockReturnValue(graph)
+    installErrorClearingHooks(graph)
+
+    const missingModelStore = useMissingModelStore()
+    const interiorExecId = `${subgraphNode.id}:${interiorNode.id}`
+    missingModelStore.setMissingModels([
+      {
+        nodeId: interiorExecId,
+        nodeType: 'CheckpointLoaderSimple',
+        widgetName: 'ckpt_name',
+        isAssetSupported: false,
+        name: 'missing.safetensors',
+        isMissing: true
+      } satisfies MissingModelCandidate
+    ])
+
+    const promotedWidget = subgraphNode.widgets?.find(
+      (widget) =>
+        'sourceWidgetName' in widget && widget.sourceWidgetName === 'ckpt_name'
+    )
+    expect(promotedWidget).toBeDefined()
+
+    const clickEvent = fromAny<CanvasPointerEvent, unknown>({
+      canvasX: 190,
+      canvasY: 20,
+      deltaX: 0
+    })
+    const pointer = fromAny<CanvasPointer, unknown>({
+      eDown: clickEvent
+    })
+    const canvas = fromAny<LGraphCanvas, unknown>({
+      graph_mouse: [190, 20],
+      last_mouseclick: 0
+    })
+
+    const handled = promotedWidget!.onPointerDown?.(
+      pointer,
+      subgraphNode,
+      canvas
+    )
+    expect(handled).toBe(true)
+    expect(pointer.onClick).toBeDefined()
+
+    pointer.onClick?.(clickEvent)
+
+    expect(missingModelStore.missingModelCandidates).toBeNull()
+  })
+
+  it('keeps unchanged same-named promoted model targets on the canvas path', () => {
+    const subgraph = createTestSubgraph({
+      inputs: [
+        { name: 'first_ckpt', type: '*' },
+        { name: 'second_ckpt', type: '*' }
+      ]
+    })
+    const firstNode = new LGraphNode('CheckpointLoaderSimple')
+    firstNode.type = 'CheckpointLoaderSimple'
+    const firstInput = firstNode.addInput('first_ckpt', '*')
+    const firstWidget = firstNode.addWidget(
+      'combo',
+      'ckpt_name',
+      'missing.safetensors',
+      () => undefined,
+      { values: ['missing.safetensors', 'present.safetensors'] }
+    )
+    firstInput.widget = { name: 'ckpt_name' }
+    subgraph.add(firstNode)
+    subgraph.inputNode.slots[0].connect(firstInput, firstNode)
+
+    const secondNode = new LGraphNode('CheckpointLoaderSimple')
+    secondNode.type = 'CheckpointLoaderSimple'
+    const secondInput = secondNode.addInput('second_ckpt', '*')
+    secondNode.addWidget(
+      'combo',
+      'ckpt_name',
+      'missing.safetensors',
+      () => undefined,
+      { values: ['missing.safetensors', 'present.safetensors'] }
+    )
+    secondInput.widget = { name: 'ckpt_name' }
+    subgraph.add(secondNode)
+    subgraph.inputNode.slots[1].connect(secondInput, secondNode)
+
+    const subgraphNode = createTestSubgraphNode(subgraph, { id: 65 })
+    subgraphNode._internalConfigureAfterSlots()
+    const graph = subgraphNode.graph as LGraph
+    graph.add(subgraphNode)
+
+    vi.spyOn(app, 'rootGraph', 'get').mockReturnValue(graph)
+    installErrorClearingHooks(graph)
+
+    const promotedWidgets =
+      subgraphNode.widgets?.filter(
+        (widget) =>
+          'sourceWidgetName' in widget &&
+          widget.sourceWidgetName === 'ckpt_name'
+      ) ?? []
+    expect(promotedWidgets).toHaveLength(2)
+
+    const missingModelStore = useMissingModelStore()
+    const firstExecId = `${subgraphNode.id}:${firstNode.id}`
+    const secondExecId = `${subgraphNode.id}:${secondNode.id}`
+    missingModelStore.setMissingModels([
+      {
+        nodeId: firstExecId,
+        nodeType: 'CheckpointLoaderSimple',
+        widgetName: 'ckpt_name',
+        isAssetSupported: false,
+        name: 'missing.safetensors',
+        isMissing: true
+      } satisfies MissingModelCandidate,
+      {
+        nodeId: secondExecId,
+        nodeType: 'CheckpointLoaderSimple',
+        widgetName: 'ckpt_name',
+        isAssetSupported: false,
+        name: 'missing.safetensors',
+        isMissing: true
+      } satisfies MissingModelCandidate
+    ])
+
+    firstWidget.value = 'present.safetensors'
+    subgraphNode.onWidgetChanged!.call(
+      subgraphNode,
+      'ckpt_name',
+      'present.safetensors',
+      'missing.safetensors',
+      firstWidget
+    )
+
+    expect(missingModelStore.missingModelCandidates).toEqual([
+      expect.objectContaining({
+        nodeId: secondExecId,
+        widgetName: 'ckpt_name',
+        name: 'missing.safetensors'
+      })
+    ])
+  })
 })
 
 describe('installErrorClearingHooks lifecycle', () => {
@@ -978,54 +1249,4 @@ describe('clearWidgetRelatedErrors parameter routing', () => {
 
     clearSpy.mockRestore()
   })
-
-  it('clears promoted widget errors by interior execution id', () => {
-    const subgraph = createTestSubgraph()
-    const graph = subgraph.rootGraph
-    const host = createTestSubgraphNode(subgraph, { id: 2 })
-    graph.add(host)
-
-    const interiorNode = new LGraphNode('CheckpointLoaderSimple')
-    interiorNode.id = 1
-    subgraph.add(interiorNode)
-    const input = interiorNode.addInput('ckpt_name', 'COMBO')
-    const widget = interiorNode.addWidget(
-      'combo',
-      'ckpt_name',
-      'fake_model.safetensors',
-      () => undefined,
-      { values: ['fake_model.safetensors', 'real_model.safetensors'] }
-    )
-    input.widget = { name: widget.name }
-
-    expect(
-      promoteValueWidgetViaSubgraphInput(host, interiorNode, widget).ok
-    ).toBe(true)
-    installErrorClearingHooks(graph)
-
-    vi.spyOn(app, 'rootGraph', 'get').mockReturnValue(graph)
-    const missingModelStore = useMissingModelStore()
-    missingModelStore.setMissingModels([
-      {
-        nodeId: '2:1',
-        nodeType: 'CheckpointLoaderSimple',
-        widgetName: 'ckpt_name',
-        isAssetSupported: false,
-        name: 'fake_model.safetensors',
-        directory: 'checkpoints',
-        isMissing: true
-      }
-    ])
-
-    const promotedWidget = host.widgets[0]
-    host.onWidgetChanged!.call(
-      host,
-      promotedWidget.name,
-      'real_model.safetensors',
-      'fake_model.safetensors',
-      promotedWidget
-    )
-
-    expect(missingModelStore.hasMissingModels).toBe(false)
-  })
 })

src/composables/graph/useErrorClearingHooks.ts

@@ -6,9 +6,12 @@
  * works in legacy canvas mode as well.
  */
 import { useChainCallback } from '@/composables/functional/useChainCallback'
-import { widgetPromotedSource } from '@/core/graph/subgraph/promotedInputWidget'
+import { isPromotedWidgetView } from '@/core/graph/subgraph/promotedWidgetTypes'
+import type { PromotedWidgetView } from '@/core/graph/subgraph/promotedWidgetTypes'
+import { resolveConcretePromotedWidget } from '@/core/graph/subgraph/resolveConcretePromotedWidget'
 import { LiteGraph } from '@/lib/litegraph/src/litegraph'
 import type { LGraph, LGraphNode } from '@/lib/litegraph/src/litegraph'
+import type { IBaseWidget } from '@/lib/litegraph/src/types/widgets'
 import {
   LGraphEventMode,
   NodeSlotType
@@ -43,6 +46,130 @@ import {
   isAncestorPathActive
 } from '@/utils/graphTraversalUtil'
 
+interface WidgetErrorClearingTarget {
+  executionId: string
+  validationInputName: string
+  assetWidgetName: string
+  currentValue: unknown
+  options?: { min?: number; max?: number }
+}
+
+function getWidgetRangeOptions(widget: IBaseWidget): {
+  min?: number
+  max?: number
+} {
+  return {
+    min: widget.options?.min,
+    max: widget.options?.max
+  }
+}
+
+function plainWidgetToErrorTarget(
+  widget: IBaseWidget,
+  hostExecId: string
+): WidgetErrorClearingTarget {
+  return {
+    executionId: hostExecId,
+    validationInputName: widget.name,
+    assetWidgetName: widget.name,
+    currentValue: widget.value,
+    options: getWidgetRangeOptions(widget)
+  }
+}
+
+function promotedWidgetToErrorTarget(
+  rootGraph: LGraph,
+  hostNode: LGraphNode,
+  widget: PromotedWidgetView,
+  hostExecId: string
+): WidgetErrorClearingTarget {
+  const result = resolveConcretePromotedWidget(
+    hostNode,
+    widget.sourceNodeId,
+    widget.sourceWidgetName
+  )
+  const execId =
+    result.status === 'resolved' && result.resolved.node
+      ? (getExecutionIdByNode(rootGraph, result.resolved.node) ?? hostExecId)
+      : hostExecId
+  const resolvedWidget =
+    result.status === 'resolved' ? result.resolved.widget : widget
+
+  return {
+    executionId: execId,
+    validationInputName: resolvedWidget.name,
+    assetWidgetName: widget.sourceWidgetName,
+    currentValue: resolvedWidget.value,
+    options: getWidgetRangeOptions(resolvedWidget)
+  }
+}
+
+function resolveCanvasPathPromotedWidgetTargets(
+  rootGraph: LGraph,
+  hostNode: LGraphNode,
+  widget: IBaseWidget,
+  hostExecId: string,
+  newValue: unknown
+): WidgetErrorClearingTarget[] {
+  if (!hostNode.isSubgraphNode?.() || isPromotedWidgetView(widget)) return []
+
+  // Canvas-path events lose promoted identity, so the post-write value
+  // disambiguates same-named promoted widgets.
+  return (hostNode.widgets ?? [])
+    .filter(isPromotedWidgetView)
+    .filter((promotedWidget) => promotedWidget.sourceWidgetName === widget.name)
+    .map((promotedWidget) =>
+      promotedWidgetToErrorTarget(
+        rootGraph,
+        hostNode,
+        promotedWidget,
+        hostExecId
+      )
+    )
+    .filter((target) => Object.is(target.currentValue, newValue))
+}
+
+function resolveWidgetErrorTargets(
+  rootGraph: LGraph,
+  hostNode: LGraphNode,
+  widget: IBaseWidget,
+  hostExecId: string,
+  newValue: unknown
+): WidgetErrorClearingTarget[] {
+  if (isPromotedWidgetView(widget)) {
+    return [
+      promotedWidgetToErrorTarget(rootGraph, hostNode, widget, hostExecId)
+    ]
+  }
+
+  const canvasPathTargets = resolveCanvasPathPromotedWidgetTargets(
+    rootGraph,
+    hostNode,
+    widget,
+    hostExecId,
+    newValue
+  )
+  return canvasPathTargets.length
+    ? canvasPathTargets
+    : [plainWidgetToErrorTarget(widget, hostExecId)]
+}
+
+function clearWidgetErrorTargets(
+  targets: WidgetErrorClearingTarget[],
+  newValue: unknown
+): void {
+  const store = useExecutionErrorStore()
+  for (const target of targets) {
+    store.clearWidgetRelatedErrors(
+      target.executionId,
+      target.validationInputName,
+      target.assetWidgetName,
+      newValue,
+      target.options
+    )
+  }
+}
+
 const hookedNodes = new WeakSet<LGraphNode>()
 
 type OriginalCallbacks = {
@@ -76,24 +203,21 @@ function installNodeHooks(node: LGraphNode): void {
 
   node.onWidgetChanged = useChainCallback(
     node.onWidgetChanged,
+    // _name is the LiteGraph callback arg; re-derive from the widget
+    // object to handle promoted widgets where sourceWidgetName differs.
     function (_name, newValue, _oldValue, widget) {
       if (!app.rootGraph) return
       const hostExecId = getExecutionIdByNode(app.rootGraph, node)
       if (!hostExecId) return
 
-      const promotedSource = widgetPromotedSource(node, widget)
-      const executionId = promotedSource
-        ? `${hostExecId}:${promotedSource.nodeId}`
-        : hostExecId
-      const widgetName = promotedSource?.widgetName ?? widget.name
-
-      useExecutionErrorStore().clearWidgetRelatedErrors(
-        executionId,
-        widgetName,
-        widgetName,
-        newValue,
-        { min: widget.options?.min, max: widget.options?.max }
+      const targets = resolveWidgetErrorTargets(
+        app.rootGraph,
+        node,
+        widget,
+        hostExecId,
+        newValue
       )
+      clearWidgetErrorTargets(targets, newValue)
     }
   )
 }

src/composables/graph/useGraphNodeManager.test.ts

@@ -1,11 +1,13 @@
 import { createTestingPinia } from '@pinia/testing'
+import { fromAny } from '@total-typescript/shoehorn'
 import { setActivePinia } from 'pinia'
 import { beforeEach, describe, expect, it, vi } from 'vitest'
 import { computed, nextTick, watch } from 'vue'
 
 import { useGraphNodeManager } from '@/composables/graph/useGraphNodeManager'
+import { createPromotedWidgetView } from '@/core/graph/subgraph/promotedWidgetView'
 import { BaseWidget, LGraph, LGraphNode } from '@/lib/litegraph/src/litegraph'
-import { widgetId } from '@/types/widgetId'
+import { widgetEntityId } from '@/world/entityIds'
 import {
   createTestSubgraph,
   createTestSubgraphNode
@@ -45,10 +47,9 @@ describe('Node Reactivity', () => {
     expect((widget as BaseWidget).node.id).toBe(node.id)
 
     // Initial value should be in store after setNodeId was called
-    const id = widgetId(graph.id, node.id, 'testnum')
-    expect(store.getWidget(id)?.value).toBe(2)
+    expect(store.getWidget(graph.id, node.id, 'testnum')?.value).toBe(2)
 
-    const state = store.getWidget(id)
+    const state = store.getWidget(graph.id, node.id, 'testnum')
     if (!state) throw new Error('Expected widget state to exist')
 
     const onValueChange = vi.fn()
@@ -73,7 +74,7 @@ describe('Node Reactivity', () => {
     })
     await nextTick()
 
-    const state = store.getWidget(widgetId(graph.id, node.id, 'testnum'))
+    const state = store.getWidget(graph.id, node.id, 'testnum')
     if (!state) throw new Error('Expected widget state to exist')
 
     const widgetValue = computed(() => state.value)
@@ -210,32 +211,105 @@ describe('Widget slotMetadata reactivity on link disconnect', () => {
     expect(widgetData?.slotMetadata?.linked).toBe(true)
   })
 
-  it('names promoted widgets after the subgraph input slot and exposes the interior source name', () => {
-    // Subgraph input named "value" promotes an interior "prompt" widget. The
-    // projected widget's name is the input slot name "value"; the interior
-    // source widget name "prompt" is carried separately for backend lookups.
-    const subgraph = createTestSubgraph({
-      inputs: [{ name: 'value', type: 'STRING' }]
-    })
+  it('resolves slotMetadata for promoted widgets where SafeWidgetData.name differs from input.widget.name', () => {
+    // Set up a subgraph with an interior node that has a "prompt" widget.
+    // createPromotedWidgetView resolves against this interior node.
+    const subgraph = createTestSubgraph()
     const interiorNode = new LGraphNode('interior')
-    const interiorInput = interiorNode.addInput('value', 'STRING')
+    interiorNode.id = 10
     interiorNode.addWidget('string', 'prompt', 'hello', () => undefined, {})
-    interiorInput.widget = { name: 'prompt' }
     subgraph.add(interiorNode)
-    subgraph.inputNode.slots[0].connect(interiorInput, interiorNode)
 
     const subgraphNode = createTestSubgraphNode(subgraph, { id: 123 })
-    subgraphNode._internalConfigureAfterSlots()
-    const graph = subgraphNode.graph as LGraph
+
+    // Create a PromotedWidgetView with identityName="value" (subgraph input
+    // slot name) and sourceWidgetName="prompt" (interior widget name).
+    // PromotedWidgetView.name returns "value" (identity), safeWidgetMapper
+    // sets SafeWidgetData.name to sourceWidgetName ("prompt").
+    const promotedView = createPromotedWidgetView(
+      subgraphNode,
+      '10',
+      'prompt',
+      'value',
+      'value'
+    )
+
+    // Host the promoted view on a regular node so we can control widgets
+    // directly (SubgraphNode.widgets is a synthetic getter).
+    const graph = new LGraph()
+    const hostNode = new LGraphNode('host')
+    hostNode.widgets = [promotedView]
+    const input = hostNode.addInput('value', 'STRING')
+    input.widget = { name: 'value' }
+    graph.add(hostNode)
+
+    const { vueNodeData } = useGraphNodeManager(graph)
+    const nodeData = vueNodeData.get(String(hostNode.id))
+
+    // SafeWidgetData.name is "prompt" (sourceWidgetName), but the
+    // input slot widget name is "value" — slotName bridges this gap.
+    const widgetData = nodeData?.widgets?.find((w) => w.name === 'prompt')
+    expect(widgetData).toBeDefined()
+    expect(widgetData?.slotName).toBe('value')
+    expect(widgetData?.slotMetadata).toBeDefined()
+  })
+
+  it('prefers exact _widget input matches before same-name fallbacks for promoted widgets', () => {
+    const subgraph = createTestSubgraph({
+      inputs: [
+        { name: 'seed', type: '*' },
+        { name: 'seed', type: '*' }
+      ]
+    })
+
+    const firstNode = new LGraphNode('FirstNode')
+    const firstInput = firstNode.addInput('seed', '*')
+    firstNode.addWidget('number', 'seed', 1, () => undefined, {})
+    firstInput.widget = { name: 'seed' }
+    subgraph.add(firstNode)
+
+    const secondNode = new LGraphNode('SecondNode')
+    const secondInput = secondNode.addInput('seed', '*')
+    secondNode.addWidget('number', 'seed', 2, () => undefined, {})
+    secondInput.widget = { name: 'seed' }
+    subgraph.add(secondNode)
+
+    subgraph.inputNode.slots[0].connect(firstInput, firstNode)
+    subgraph.inputNode.slots[1].connect(secondInput, secondNode)
+
+    const subgraphNode = createTestSubgraphNode(subgraph, { id: 124 })
+    const graph = subgraphNode.graph
+    if (!graph) throw new Error('Expected subgraph node graph')
     graph.add(subgraphNode)
 
+    const promotedViews = subgraphNode.widgets
+    const secondPromotedView = promotedViews[1]
+    if (!secondPromotedView) throw new Error('Expected second promoted view')
+
+    fromAny<
+      {
+        sourceNodeId: string
+        sourceWidgetName: string
+      },
+      unknown
+    >(secondPromotedView).sourceNodeId = '9999'
+    fromAny<
+      {
+        sourceNodeId: string
+        sourceWidgetName: string
+      },
+      unknown
+    >(secondPromotedView).sourceWidgetName = 'stale_widget'
+
     const { vueNodeData } = useGraphNodeManager(graph)
     const nodeData = vueNodeData.get(String(subgraphNode.id))
+    const secondMappedWidget = nodeData?.widgets?.find(
+      (widget) => widget.slotMetadata?.index === 1
+    )
+    if (!secondMappedWidget)
+      throw new Error('Expected mapped widget for slot 1')
 
-    const widgetData = nodeData?.widgets?.find((w) => w.name === 'value')
-    expect(widgetData).toBeDefined()
-    expect(widgetData?.sourceWidgetName).toBe('prompt')
-    expect(widgetData?.slotMetadata).toBeDefined()
+    expect(secondMappedWidget.name).not.toBe('stale_widget')
   })
 
   it('clears stale slotMetadata when input no longer matches widget', async () => {
@@ -374,8 +448,8 @@ describe('Nested promoted widget mapping', () => {
 
     expect(mappedWidget).toBeDefined()
     expect(mappedWidget?.type).toBe('combo')
-    expect(mappedWidget?.widgetId).toBe(
-      widgetId(graph.id, subgraphNodeB.id, 'b_input')
+    expect(mappedWidget?.entityId).toBe(
+      widgetEntityId(graph.id, subgraphNodeB.id, 'b_input')
     )
   })
 
@@ -410,13 +484,13 @@ describe('Nested promoted widget mapping', () => {
     const widgets = nodeData?.widgets
 
     expect(widgets).toHaveLength(2)
-    expect(widgets?.[0]?.widgetId).toBe(
-      widgetId(graph.id, subgraphNode.id, 'first_seed')
+    expect(widgets?.[0]?.entityId).toBe(
+      widgetEntityId(graph.id, subgraphNode.id, 'first_seed')
     )
-    expect(widgets?.[1]?.widgetId).toBe(
-      widgetId(graph.id, subgraphNode.id, 'second_seed')
+    expect(widgets?.[1]?.entityId).toBe(
+      widgetEntityId(graph.id, subgraphNode.id, 'second_seed')
     )
-    expect(widgets?.[0]?.widgetId).not.toBe(widgets?.[1]?.widgetId)
+    expect(widgets?.[0]?.entityId).not.toBe(widgets?.[1]?.entityId)
   })
 })
 
@@ -454,11 +528,10 @@ describe('Promoted widget sourceExecutionId', () => {
     const { vueNodeData } = useGraphNodeManager(graph)
     const nodeData = vueNodeData.get(String(subgraphNode.id))
     const promotedWidget = nodeData?.widgets?.find(
-      (w) => w.name === 'ckpt_input'
+      (w) => w.name === 'ckpt_name'
     )
 
     expect(promotedWidget).toBeDefined()
-    expect(promotedWidget?.sourceWidgetName).toBe('ckpt_name')
     // The interior node is inside subgraphNode (id=65),
     // so its execution ID should be "65:<interiorNodeId>"
     expect(promotedWidget?.sourceExecutionId).toBe(

src/composables/graph/useGraphNodeManager.ts

@@ -3,16 +3,17 @@
  * Provides event-driven reactivity with performance optimizations
  */
 import { reactiveComputed } from '@vueuse/core'
-import cloneDeep from 'es-toolkit/compat/cloneDeep'
 import { reactive, shallowReactive } from 'vue'
 
 import { useChainCallback } from '@/composables/functional/useChainCallback'
+import type { PromotedWidgetSource } from '@/core/graph/subgraph/promotedWidgetTypes'
+import { isPromotedWidgetView } from '@/core/graph/subgraph/promotedWidgetTypes'
+import { matchPromotedInput } from '@/core/graph/subgraph/matchPromotedInput'
 import {
-  inputForWidget,
-  promotedInputSource,
-  promotedInputWidgets
-} from '@/core/graph/subgraph/promotedInputWidget'
-import { resolveConcretePromotedWidget } from '@/core/graph/subgraph/resolveConcretePromotedWidget'
+  resolveConcretePromotedWidget,
+  resolvePromotedWidgetSource
+} from '@/core/graph/subgraph/resolveConcretePromotedWidget'
+import { resolveSubgraphInputTarget } from '@/core/graph/subgraph/resolveSubgraphInputTarget'
 import type {
   INodeInputSlot,
   INodeOutputSlot
@@ -26,11 +27,10 @@ import type { InputSpec } from '@/schemas/nodeDef/nodeDefSchemaV2'
 import { isDOMWidget } from '@/scripts/domWidget'
 import { IS_CONTROL_WIDGET } from '@/scripts/widgets'
 import { useNodeDefStore } from '@/stores/nodeDefStore'
-import { useWidgetValueStore } from '@/stores/widgetValueStore'
 import type { WidgetValue, SafeControlWidget } from '@/types/simplifiedWidget'
 import { normalizeControlOption } from '@/types/simplifiedWidget'
-import { getWidgetIdForNode } from '@/utils/litegraphUtil'
-import type { WidgetId } from '@/types/widgetId'
+import { getWidgetEntityIdForNode } from '@/utils/litegraphUtil'
+import type { WidgetEntityId } from '@/world/entityIds'
 
 import type {
   LGraph,
@@ -38,8 +38,7 @@ import type {
   LGraphNode,
   LGraphTriggerAction,
   LGraphTriggerEvent,
-  LGraphTriggerParam,
-  SubgraphNode
+  LGraphTriggerParam
 } from '@/lib/litegraph/src/litegraph'
 import type { TitleMode } from '@/lib/litegraph/src/types/globalEnums'
 import { NodeSlotType } from '@/lib/litegraph/src/types/globalEnums'
@@ -61,7 +60,7 @@ type Badges = (LGraphBadge | (() => LGraphBadge))[]
  * Value and metadata (label, hidden, disabled, etc.) are accessed via widgetValueStore.
  */
 export interface SafeWidgetData {
-  widgetId?: WidgetId
+  entityId?: WidgetEntityId
   nodeId?: NodeId
   name: string
   type: string
@@ -82,12 +81,17 @@ export interface SafeWidgetData {
     advanced?: boolean
     hidden?: boolean
     read_only?: boolean
-    values?: unknown
   }
   /** Input specification from node definition */
   spec?: InputSpec
   /** Input slot metadata (index and link status) */
   slotMetadata?: WidgetSlotMetadata
+  /**
+   * Original LiteGraph widget name used for slot metadata matching.
+   * For promoted widgets, `name` is `sourceWidgetName` (interior widget name)
+   * which differs from the subgraph node's input slot widget name.
+   */
+  slotName?: string
   /**
    * Execution ID of the interior node that owns the source widget.
    * Only set for promoted widgets where the source node differs from the
@@ -95,14 +99,10 @@ export interface SafeWidgetData {
    * execution ID (e.g. `"65:42"` vs the host node's `"65"`).
    */
   sourceExecutionId?: string
-  /**
-   * Interior source widget name. Only set for promoted widgets, where `name`
-   * is the host input slot name; missing-model lookups key by the interior
-   * widget name, which can differ from the slot name (e.g. after a rename).
-   */
-  sourceWidgetName?: 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 {
@@ -143,6 +143,18 @@ export interface GraphNodeManager {
   cleanup(): void
 }
 
+function isPromotedDOMWidget(widget: IBaseWidget): boolean {
+  if (!isPromotedWidgetView(widget)) return false
+  const sourceWidget = resolvePromotedWidgetSource(widget.node, widget)
+  if (!sourceWidget) return false
+
+  const innerWidget = sourceWidget.widget
+  return (
+    ('element' in innerWidget && !!innerWidget.element) ||
+    ('component' in innerWidget && !!innerWidget.component)
+  )
+}
+
 export function getControlWidget(
   widget: IBaseWidget
 ): SafeControlWidget | undefined {
@@ -202,83 +214,73 @@ function normalizeWidgetValue(value: unknown): WidgetValue {
   return undefined
 }
 
-function extractWidgetDisplayOptions(
-  widget: IBaseWidget
-): SafeWidgetData['options'] {
-  if (!widget.options) return undefined
-
-  return {
-    canvasOnly: widget.options.canvasOnly,
-    advanced: widget.options?.advanced ?? widget.advanced,
-    hidden: widget.options.hidden,
-    read_only: widget.options.read_only
-  }
-}
-
-function isDOMBackedWidget(widget: IBaseWidget): boolean {
-  return (
-    ('element' in widget && !!widget.element) ||
-    ('component' in widget && !!widget.component)
-  )
-}
-
-interface PromotedWidgetMetadata {
-  controlWidget?: SafeControlWidget
-  isDOMWidget: boolean
-  sourceExecutionId?: string
-  sourceWidgetName?: string
-}
-
-/**
- * Resolves the interior source of a promoted subgraph input to derive the
- * metadata that backend lookups key by (execution ID, interior widget name)
- * plus the source widget's control + DOM nature. Also seeds host widget state
- * if it is somehow missing. Returns undefined when the widget is not promoted.
- */
-function resolvePromotedMetadata(
-  node: SubgraphNode,
-  widget: IBaseWidget
-): PromotedWidgetMetadata | undefined {
-  const input = inputForWidget(node, widget)
-  if (!input?.widgetId) return undefined
-  const source = promotedInputSource(node, input)
-  if (!source) return undefined
-
-  const resolution = resolveConcretePromotedWidget(
-    node,
-    source.nodeId,
-    source.widgetName
-  )
-  const resolved =
-    resolution.status === 'resolved' ? resolution.resolved : undefined
-  const sourceWidget = resolved?.widget
-  const sourceNode = resolved?.node
-
-  ensurePromotedHostWidgetState(input.widgetId, input, sourceWidget)
-
-  return {
-    controlWidget: sourceWidget ? getControlWidget(sourceWidget) : undefined,
-    isDOMWidget: sourceWidget ? isDOMBackedWidget(sourceWidget) : false,
-    sourceExecutionId:
-      sourceNode && app.rootGraph
-        ? (getExecutionIdByNode(app.rootGraph, sourceNode) ?? undefined)
-        : undefined,
-    sourceWidgetName: sourceWidget?.name
-  }
-}
-
 function safeWidgetMapper(
   node: LGraphNode,
   slotMetadata: Map<string, WidgetSlotMetadata>
 ): (widget: IBaseWidget) => SafeWidgetData {
-  const duplicateIndexByKey = new Map<string, number>()
+  function extractWidgetDisplayOptions(
+    widget: IBaseWidget
+  ): SafeWidgetData['options'] {
+    if (!widget.options) return undefined
+
+    return {
+      canvasOnly: widget.options.canvasOnly,
+      advanced: widget.options?.advanced ?? widget.advanced,
+      hidden: widget.options.hidden,
+      read_only: widget.options.read_only
+    }
+  }
+
+  function resolvePromotedSourceByInputName(
+    inputName: string
+  ): PromotedWidgetSource | null {
+    const resolvedTarget = resolveSubgraphInputTarget(node, inputName)
+    if (!resolvedTarget) return null
+
+    return {
+      sourceNodeId: resolvedTarget.nodeId,
+      sourceWidgetName: resolvedTarget.widgetName
+    }
+  }
+
+  function resolvePromotedWidgetIdentity(widget: IBaseWidget): {
+    displayName: string
+    promotedSource: PromotedWidgetSource | null
+  } {
+    if (!isPromotedWidgetView(widget)) {
+      return {
+        displayName: widget.name,
+        promotedSource: null
+      }
+    }
+
+    const matchedInput = matchPromotedInput(node.inputs, widget)
+    const promotedInputName = matchedInput?.name
+    const displayName = promotedInputName ?? widget.name
+    const directSource: PromotedWidgetSource = {
+      sourceNodeId: widget.sourceNodeId,
+      sourceWidgetName: widget.sourceWidgetName
+    }
+    const promotedSource =
+      matchedInput?._widget === widget
+        ? (resolvePromotedSourceByInputName(displayName) ?? directSource)
+        : directSource
+
+    return {
+      displayName,
+      promotedSource
+    }
+  }
 
   return function (widget) {
     try {
-      const duplicateKey = `${widget.name}:${widget.type}`
-      const duplicateIndex = duplicateIndexByKey.get(duplicateKey) ?? 0
-      duplicateIndexByKey.set(duplicateKey, duplicateIndex + 1)
-      const slotInfo = slotMetadata.get(widget.name)
+      const { displayName, promotedSource } =
+        resolvePromotedWidgetIdentity(widget)
+
+      // Get shared enhancements (controlWidget, spec, nodeType)
+      const sharedEnhancements = getSharedWidgetEnhancements(node, widget)
+      const slotInfo =
+        slotMetadata.get(displayName) ?? slotMetadata.get(widget.name)
 
       // Wrapper callback specific to Nodes 2.0 rendering
       const callback = (v: unknown) => {
@@ -292,26 +294,67 @@ function safeWidgetMapper(
         node.widgets?.forEach((w) => w.triggerDraw?.())
       }
 
-      const promoted = node.isSubgraphNode()
-        ? resolvePromotedMetadata(node, widget)
+      const isPromotedPseudoWidget =
+        isPromotedWidgetView(widget) && widget.sourceWidgetName.startsWith('$$')
+
+      // Extract only render-critical options (canvasOnly, advanced, read_only)
+      const options = extractWidgetDisplayOptions(widget)
+      const subgraphId = node.isSubgraphNode() && node.subgraph.id
+
+      const resolvedSourceResult =
+        isPromotedWidgetView(widget) && promotedSource
+          ? resolveConcretePromotedWidget(
+              node,
+              promotedSource.sourceNodeId,
+              promotedSource.sourceWidgetName
+            )
+          : null
+      const resolvedSource =
+        resolvedSourceResult?.status === 'resolved'
+          ? resolvedSourceResult.resolved
+          : undefined
+      const sourceWidget = resolvedSource?.widget
+      const sourceNode = resolvedSource?.node
+
+      const effectiveWidget = sourceWidget ?? widget
+
+      const localId = isPromotedWidgetView(widget)
+        ? String(sourceNode?.id ?? promotedSource?.sourceNodeId)
         : undefined
+      const nodeId =
+        subgraphId && localId ? `${subgraphId}:${localId}` : undefined
+      const sourceWidgetName = isPromotedWidgetView(widget)
+        ? (sourceWidget?.name ?? promotedSource?.sourceWidgetName)
+        : undefined
+      const name = sourceWidgetName ?? displayName
+
+      if (isPromotedWidgetView(widget)) widget.ensureHostWidgetState()
 
       return {
-        widgetId: getWidgetIdForNode(node, widget, duplicateIndex),
-        name: widget.name,
-        type: widget.type,
-        ...getSharedWidgetEnhancements(node, widget),
-        ...(promoted?.controlWidget && {
-          controlWidget: promoted.controlWidget
-        }),
+        entityId: getWidgetEntityIdForNode(node, widget),
+        nodeId,
+        name,
+        type: effectiveWidget.type,
+        ...sharedEnhancements,
         callback,
-        hasLayoutSize: typeof widget.computeLayoutSize === 'function',
-        isDOMWidget: promoted?.isDOMWidget ?? isDOMWidget(widget),
-        options: extractWidgetDisplayOptions(widget),
+        hasLayoutSize: typeof effectiveWidget.computeLayoutSize === 'function',
+        isDOMWidget: isDOMWidget(widget) || isPromotedDOMWidget(widget),
+        options: isPromotedPseudoWidget
+          ? {
+              ...(extractWidgetDisplayOptions(effectiveWidget) ?? options),
+              canvasOnly: true
+            }
+          : (extractWidgetDisplayOptions(effectiveWidget) ?? options),
         slotMetadata: slotInfo,
-        sourceExecutionId: promoted?.sourceExecutionId,
-        sourceWidgetName: promoted?.sourceWidgetName,
-        tooltip: widget.tooltip
+        // For promoted widgets, name is sourceWidgetName while widget.name
+        // is the subgraph input slot name — store the slot name for lookups.
+        slotName: name !== widget.name ? widget.name : undefined,
+        sourceExecutionId:
+          sourceNode && app.rootGraph
+            ? (getExecutionIdByNode(app.rootGraph, sourceNode) ?? undefined)
+            : undefined,
+        tooltip: widget.tooltip,
+        promotedLabel: isPromotedWidgetView(widget) ? widget.label : undefined
       }
     } catch (error) {
       console.warn(
@@ -327,24 +370,6 @@ function safeWidgetMapper(
   }
 }
 
-function ensurePromotedHostWidgetState(
-  id: WidgetId,
-  input: INodeInputSlot,
-  sourceWidget: IBaseWidget | undefined
-): void {
-  if (!sourceWidget) return
-  const store = useWidgetValueStore()
-  if (store.getWidget(id)) return
-  store.registerWidget(id, {
-    type: sourceWidget.type,
-    value: sourceWidget.value,
-    options: cloneDeep(sourceWidget.options ?? {}),
-    label: input.label ?? input.name,
-    serialize: sourceWidget.serialize,
-    disabled: sourceWidget.disabled
-  })
-}
-
 function buildSlotMetadata(
   inputs: INodeInputSlot[] | undefined,
   graphRef: LGraph | null | undefined
@@ -446,16 +471,14 @@ export function extractVueNodeData(node: LGraphNode): VueNodeData {
   })
 
   const safeWidgets = reactiveComputed<SafeWidgetData[]>(() => {
+    const widgetsSnapshot = node.widgets ?? []
+
     const freshMetadata = buildSlotMetadata(node.inputs, node.graph)
     slotMetadata.clear()
     for (const [key, value] of freshMetadata) {
       slotMetadata.set(key, value)
     }
-
-    const widgets = node.isSubgraphNode()
-      ? promotedInputWidgets(node)
-      : (node.widgets ?? [])
-    return widgets.map(safeWidgetMapper(node, slotMetadata))
+    return widgetsSnapshot.map(safeWidgetMapper(node, slotMetadata))
   })
 
   const nodeType =
@@ -511,7 +534,7 @@ export function useGraphNodeManager(graph: LGraph): GraphNodeManager {
 
     // Update only widgets with new slot metadata, keeping other widget data intact
     for (const widget of currentData.widgets ?? []) {
-      widget.slotMetadata = slotMetadata.get(widget.name)
+      widget.slotMetadata = slotMetadata.get(widget.slotName ?? widget.name)
     }
   }
 
@@ -789,7 +812,7 @@ export function useGraphNodeManager(graph: LGraph): GraphNodeManager {
         if (slotLabelEvent.slotType !== NodeSlotType.INPUT && nodeRef.outputs) {
           nodeRef.outputs = [...nodeRef.outputs]
         }
-        // Re-extract widget data so the label reflects the rename
+        // Re-extract widget data so promotedLabel reflects the rename
         vueNodeData.set(nodeId, extractVueNodeData(nodeRef))
       }
     }

src/composables/graph/useMoreOptionsMenu.ts

@@ -1,6 +1,7 @@
 import { computed, ref } from 'vue'
 import type { Ref } from 'vue'
 
+import { isPromotedWidgetView } from '@/core/graph/subgraph/promotedWidgetTypes'
 import type {
   LGraphGroup,
   LGraphNode,
@@ -264,8 +265,16 @@ export function useMoreOptionsMenu() {
       options.push(...getImageMenuOptions(selectedNodes.value[0]))
       options.push({ type: 'divider' })
     }
-    const [widgetName] = hoveredWidget.value ?? []
-    const widget = node?.widgets?.find((w) => w.name === widgetName)
+    const [widgetName, nodeId] = hoveredWidget.value ?? []
+    const widget =
+      nodeId !== undefined
+        ? node?.widgets?.find(
+            (w) =>
+              isPromotedWidgetView(w) &&
+              w.sourceWidgetName === widgetName &&
+              w.sourceNodeId === nodeId
+          )
+        : node?.widgets?.find((w) => w.name === widgetName)
     if (widget) {
       const widgetOptions = convertContextMenuToOptions(
         getExtraOptionsForWidget(node, widget)

src/composables/node/usePriceBadge.test.ts

@@ -1,21 +1,11 @@
 import { describe, expect, vi } from 'vitest'
 
 import { LGraphNode } from '@/lib/litegraph/src/litegraph'
-import { useWidgetValueStore } from '@/stores/widgetValueStore'
 
 import { subgraphTest } from '@/lib/litegraph/src/subgraph/__fixtures__/subgraphFixtures'
 
 import { usePriceBadge } from '@/composables/node/usePriceBadge'
 
-const getNodeDisplayPrice = vi.fn(
-  (_node: LGraphNode, overrides?: ReadonlyMap<string, unknown>) =>
-    String(overrides?.get('prompt') ?? 'missing override')
-)
-
-vi.mock('@/composables/node/useNodePricing', () => ({
-  useNodePricing: () => ({ getNodeDisplayPrice })
-}))
-
 vi.mock('@/stores/workspace/colorPaletteStore', () => ({
   useColorPaletteStore: () => ({
     completedActivePalette: {
@@ -64,43 +54,4 @@ describe('subgraph pricing', () => {
       expect(getBadgeText(subgraphNode)).toBe('Partner Nodes x 5')
     }
   )
-
-  subgraphTest(
-    'uses promoted widget override from any matching internal link',
-    ({ subgraphWithNode }) => {
-      const { subgraphNode, subgraph } = subgraphWithNode
-      class ApiNode extends LGraphNode {
-        static override nodeData = { name: 'ApiNode', api_node: true }
-      }
-      const apiNode = new ApiNode('api node')
-      apiNode.badges = [getCreditsBadge('$0.05/Run')]
-      const apiInput = apiNode.addInput('prompt', 'STRING')
-      apiInput.widget = { name: 'prompt' }
-      apiNode.addWidget('string', 'prompt', 'inner value', () => undefined, {})
-
-      const decoyNode = new LGraphNode('decoy node')
-      const decoyInput = decoyNode.addInput('prompt', 'STRING')
-      decoyInput.widget = { name: 'prompt' }
-      decoyNode.addWidget(
-        'string',
-        'prompt',
-        'decoy value',
-        () => undefined,
-        {}
-      )
-
-      subgraph.add(decoyNode)
-      subgraph.add(apiNode)
-      subgraph.inputNode.slots[0].connect(decoyInput, decoyNode)
-      subgraph.inputNode.slots[0].connect(apiInput, apiNode)
-      subgraphNode._internalConfigureAfterSlots()
-      const inputWidgetId = subgraphNode.inputs[0].widgetId
-      if (!inputWidgetId) throw new Error('Missing promoted input widgetId')
-      useWidgetValueStore().setValue(inputWidgetId, 'outer value')
-
-      updateSubgraphCredits(subgraphNode)
-
-      expect(getBadgeText(subgraphNode)).toBe('outer value')
-    }
-  )
 })

src/composables/node/usePriceBadge.ts

@@ -2,14 +2,9 @@ import type { LGraph, LGraphNode } from '@/lib/litegraph/src/litegraph'
 import { LGraphBadge } from '@/lib/litegraph/src/litegraph'
 
 import { useNodePricing } from '@/composables/node/useNodePricing'
-import type { INodeInputSlot } from '@/lib/litegraph/src/interfaces'
+import { isPromotedWidgetView } from '@/core/graph/subgraph/promotedWidgetTypes'
 import { useColorPaletteStore } from '@/stores/workspace/colorPaletteStore'
 import { adjustColor } from '@/utils/colorUtil'
-import { useWidgetValueStore } from '@/stores/widgetValueStore'
-
-type LinkedWidgetInput = INodeInputSlot & {
-  _subgraphSlot?: { linkIds?: number[] }
-}
 
 const componentIconSvg = new Image()
 componentIconSvg.src =
@@ -100,20 +95,11 @@ export const usePriceBadge = () => {
   ): ReadonlyMap<string, unknown> {
     const overrides = new Map<string, unknown>()
     if (!wrapper.isSubgraphNode()) return overrides
-
-    for (const input of wrapper.inputs as LinkedWidgetInput[]) {
-      if (!input.widgetId) continue
-      for (const linkId of input._subgraphSlot?.linkIds ?? []) {
-        const link = wrapper.subgraph.getLink(linkId)
-        if (link?.target_id !== innerNode.id) continue
-        const targetInput = innerNode.inputs[link.target_slot]
-        const widgetName = targetInput?.widget?.name
-        if (!widgetName) continue
-        overrides.set(
-          widgetName,
-          useWidgetValueStore().getWidget(input.widgetId)?.value
-        )
-      }
+    const innerId = String(innerNode.id)
+    for (const w of wrapper.widgets ?? []) {
+      if (!isPromotedWidgetView(w)) continue
+      if (w.sourceNodeId !== innerId) continue
+      overrides.set(w.sourceWidgetName, w.value)
     }
     return overrides
   }

src/composables/queue/useJobList.test.ts

@@ -2,7 +2,6 @@ import { render } from '@testing-library/vue'
 import { describe, it, expect, beforeEach, afterEach, vi } from 'vitest'
 import { nextTick, reactive, ref } from 'vue'
 import type { Ref } from 'vue'
-import { createI18n } from 'vue-i18n'
 
 import { useJobList } from '@/composables/queue/useJobList'
 import type { JobState } from '@/types/queue'
@@ -20,24 +19,32 @@ type TestTask = {
   workflowId?: string
 }
 
-const createTestI18n = () =>
-  createI18n({
-    legacy: false,
-    locale: 'en-US',
-    messages: {
-      'en-US': {
-        queue: {
-          jobList: {
-            undated: 'Undated'
-          }
-        },
-        g: {
-          emDash: '--',
-          untitled: 'Untitled'
-        }
-      }
+const translations: Record<string, string> = {
+  'queue.jobList.undated': 'Undated',
+  'g.emDash': '--',
+  'g.untitled': 'Untitled'
+}
+let localeRef: Ref<string>
+let tMock: ReturnType<typeof vi.fn>
+const ensureLocaleMocks = () => {
+  if (!localeRef) {
+    localeRef = ref('en-US') as Ref<string>
+  }
+  if (!tMock) {
+    tMock = vi.fn((key: string) => translations[key] ?? key)
+  }
+  return { localeRef, tMock }
+}
+
+vi.mock('vue-i18n', () => ({
+  useI18n: () => {
+    ensureLocaleMocks()
+    return {
+      t: tMock,
+      locale: localeRef
     }
-  })
+  }
+}))
 
 vi.mock('@/i18n', () => ({
   st: vi.fn((key: string, fallback?: string) => `i18n(${key})-${fallback}`)
@@ -177,20 +184,13 @@ const createTask = (
 
 const mountUseJobList = () => {
   let composable: ReturnType<typeof useJobList>
-  const result = render(
-    {
-      template: '<div />',
-      setup() {
-        composable = useJobList()
-        return {}
-      }
-    },
-    {
-      global: {
-        plugins: [createTestI18n()]
-      }
+  const result = render({
+    template: '<div />',
+    setup() {
+      composable = useJobList()
+      return {}
     }
-  )
+  })
   return { ...result, composable: composable! }
 }
 
@@ -215,6 +215,10 @@ const resetStores = () => {
   totalPercent.value = 0
   currentNodePercent.value = 0
 
+  ensureLocaleMocks()
+  localeRef.value = 'en-US'
+  tMock.mockClear()
+
   if (isJobInitializingMock) {
     vi.mocked(isJobInitializingMock).mockReset()
     vi.mocked(isJobInitializingMock).mockReturnValue(false)
@@ -557,35 +561,6 @@ describe('useJobList', () => {
     )
   })
 
-  it('groups terminal jobs without an execution end timestamp by create time', async () => {
-    vi.useFakeTimers()
-    vi.setSystemTime(new Date('2024-01-10T12:00:00Z'))
-    queueStoreMock.historyTasks = [
-      createTask({
-        jobId: 'failed-before-execution',
-        job: { priority: 1 },
-        mockState: 'failed',
-        createTime: Date.now()
-      }),
-      createTask({
-        jobId: 'completed-without-end-time',
-        job: { priority: 1 },
-        mockState: 'completed',
-        createTime: Date.now() - 1_000
-      })
-    ]
-
-    const instance = initComposable()
-    await flush()
-
-    const groups = instance.groupedJobItems.value
-    expect(groups.map((g) => g.label)).toEqual(['Today'])
-    expect(groups[0].items.map((item) => item.id)).toEqual([
-      'failed-before-execution',
-      'completed-without-end-time'
-    ])
-  })
-
   it('groups job items by date label and sorts by total generation time when requested', async () => {
     vi.useFakeTimers()
     vi.setSystemTime(new Date('2024-01-10T12:00:00Z'))

src/composables/queue/useJobList.ts

@@ -341,7 +341,7 @@ export function useJobList() {
     for (const { task, state } of searchableTaskEntries.value) {
       let ts: number | undefined
       if (state === 'completed' || state === 'failed') {
-        ts = task.executionEndTimestamp ?? task.createTime
+        ts = task.executionEndTimestamp
       } else {
         ts = task.createTime
       }

src/composables/useUpstreamValue.test.ts

@@ -1,19 +1,12 @@
 import { describe, expect, it } from 'vitest'
 
+import type { WidgetState } from '@/stores/widgetValueStore'
 import type { NodeId } from '@/platform/workflow/validation/schemas/workflowSchema'
-import type { WidgetState } from '@/types/widgetState'
 
 import { boundsExtractor, singleValueExtractor } from './useUpstreamValue'
 
 function widget(name: string, value: unknown): WidgetState {
-  return {
-    name,
-    type: 'INPUT',
-    value,
-    nodeId: '1' as NodeId,
-    options: {},
-    y: 0
-  }
+  return { name, type: 'INPUT', value, nodeId: '1' as NodeId, options: {} }
 }
 
 const isNumber = (v: unknown): v is number => typeof v === 'number'

src/composables/useUpstreamValue.ts

@@ -2,9 +2,9 @@ import { computed } from 'vue'
 
 import { useCanvasStore } from '@/renderer/core/canvas/canvasStore'
 import { useWidgetValueStore } from '@/stores/widgetValueStore'
+import type { WidgetState } from '@/stores/widgetValueStore'
 import type { Bounds } from '@/renderer/core/layout/types'
 import type { LinkedUpstreamInfo } from '@/types/simplifiedWidget'
-import type { WidgetState } from '@/types/widgetState'
 
 type ValueExtractor<T = unknown> = (
   widgets: WidgetState[],

src/core/graph/subgraph/migration/proxyWidgetMigration.test.ts

@@ -1,4 +1,5 @@
 import { createTestingPinia } from '@pinia/testing'
+import { fromPartial } from '@total-typescript/shoehorn'
 import { setActivePinia } from 'pinia'
 import { beforeEach, describe, expect, it, vi } from 'vitest'
 
@@ -20,8 +21,8 @@ import {
   normalizeLegacyProxyWidgetEntry,
   readHostQuarantine
 } from '@/core/graph/subgraph/migration/proxyWidgetMigration'
+import type { PromotedWidgetView } from '@/core/graph/subgraph/promotedWidgetTypes'
 import { usePreviewExposureStore } from '@/stores/previewExposureStore'
-import { useWidgetValueStore } from '@/stores/widgetValueStore'
 
 vi.mock('@/renderer/core/canvas/canvasStore', () => ({
   useCanvasStore: () => ({})
@@ -54,15 +55,39 @@ function addInnerNode(
   return node
 }
 
-function getPromotedInputValue(
+function addPromotedHostInput(
   host: SubgraphNode,
-  name: string
-): TWidgetValue | undefined {
-  const input = host.inputs.find((input) => input.name === name)
-  if (!input?.widgetId) return undefined
-  return useWidgetValueStore().getWidget(input.widgetId)?.value as
-    | TWidgetValue
-    | undefined
+  args: {
+    inputName: string
+    promotedName: string
+    sourceNodeId: string
+    sourceWidgetName: string
+    initialValue?: TWidgetValue
+  }
+): { setValue: (v: TWidgetValue) => void; getValue: () => TWidgetValue } {
+  let widgetValue: TWidgetValue = args.initialValue ?? 0
+  const slot = host.addInput(args.inputName, '*')
+  slot._widget = fromPartial<PromotedWidgetView>({
+    node: host,
+    name: args.promotedName,
+    sourceNodeId: args.sourceNodeId,
+    sourceWidgetName: args.sourceWidgetName,
+    get value() {
+      return widgetValue
+    },
+    set value(v: TWidgetValue) {
+      widgetValue = v
+    },
+    hydrateHostValue(v: TWidgetValue) {
+      widgetValue = v
+    }
+  })
+  return {
+    setValue: (v) => {
+      widgetValue = v
+    },
+    getValue: () => widgetValue
+  }
 }
 
 function addPrimitiveWithTargets(
@@ -116,6 +141,29 @@ describe('flushProxyWidgetMigration', () => {
   })
 
   describe('value-widget repair', () => {
+    it('alreadyLinked: applies host value to the matching promoted widget', () => {
+      const host = buildHost()
+      const inner = addInnerNode(host, 'Inner', (n) => {
+        n.addWidget('number', 'seed', 0, () => {})
+      })
+      const handle = addPromotedHostInput(host, {
+        inputName: 'seed_link',
+        promotedName: 'seed',
+        sourceNodeId: String(inner.id),
+        sourceWidgetName: 'seed',
+        initialValue: 0
+      })
+
+      host.properties.proxyWidgets = [[String(inner.id), 'seed']]
+      flushProxyWidgetMigration({
+        hostNode: host,
+        hostWidgetValues: [99]
+      })
+
+      expect(handle.getValue()).toBe(99)
+      expect(host.properties.proxyWidgets).toBeUndefined()
+    })
+
     it('alreadyLinked: hydrates real promoted widget without mutating the interior widget', () => {
       const subgraph = createTestSubgraph({
         inputs: [{ name: 'seed', type: 'INT' }]
@@ -135,61 +183,23 @@ describe('flushProxyWidgetMigration', () => {
         hostWidgetValues: [99]
       })
 
-      expect(getPromotedInputValue(host, 'seed')).toBe(99)
+      expect(host.widgets[0].value).toBe(99)
       const innerWidget = inner.widgets!.find((w) => w.name === 'seed')!
       expect(innerWidget.value).toBe(0)
     })
 
-    it('createSubgraphInput: uses disambiguator for duplicate nested widget names', () => {
-      const rootGraph = new LGraph()
-      const innerSubgraph = createTestSubgraph({ rootGraph })
-      const firstText = new LGraphNode('CLIPTextEncode')
-      const firstSlot = firstText.addInput('text', 'STRING')
-      firstSlot.widget = { name: 'text' }
-      firstText.addWidget('text', 'text', '11111111111', () => {})
-      innerSubgraph.add(firstText)
-
-      const secondText = new LGraphNode('CLIPTextEncode')
-      const secondSlot = secondText.addInput('text', 'STRING')
-      secondSlot.widget = { name: 'text' }
-      secondText.addWidget('text', 'text', '22222222222', () => {})
-      innerSubgraph.add(secondText)
-
-      const nestedHost = createTestSubgraphNode(innerSubgraph, {
-        parentGraph: rootGraph
-      })
-      nestedHost.properties.proxyWidgets = [
-        [String(firstText.id), 'text'],
-        [String(secondText.id), 'text']
-      ]
-      flushProxyWidgetMigration({ hostNode: nestedHost })
-
-      const outerSubgraph = createTestSubgraph({ rootGraph })
-      outerSubgraph.add(nestedHost)
-      const outerHost = createTestSubgraphNode(outerSubgraph, {
-        parentGraph: rootGraph
-      })
-      outerHost.properties.proxyWidgets = [
-        [String(nestedHost.id), 'text', String(secondText.id)]
-      ]
-
-      flushProxyWidgetMigration({ hostNode: outerHost })
-
-      expect(getPromotedInputValue(outerHost, 'text')).toBe('22222222222')
-    })
-
     it('alreadyLinked: leaves widget value unchanged when host value is a sparse hole', () => {
-      const subgraph = createTestSubgraph({
-        inputs: [{ name: 'seed', type: 'INT' }]
-      })
-      const host = createTestSubgraphNode(subgraph)
-      host.graph!.add(host)
+      const host = buildHost()
       const inner = addInnerNode(host, 'Inner', (n) => {
-        const slot = n.addInput('seed', 'INT')
-        const innerWidget = n.addWidget('number', 'seed', 7, () => {})
-        slot.widget = { name: innerWidget.name }
+        n.addWidget('number', 'seed', 0, () => {})
+      })
+      const handle = addPromotedHostInput(host, {
+        inputName: 'seed_link',
+        promotedName: 'seed',
+        sourceNodeId: String(inner.id),
+        sourceWidgetName: 'seed',
+        initialValue: 7
       })
-      subgraph.inputNode.slots[0].connect(inner.inputs[0], inner)
 
       host.properties.proxyWidgets = [[String(inner.id), 'seed']]
       const sparse: unknown[] = []
@@ -198,7 +208,43 @@ describe('flushProxyWidgetMigration', () => {
         hostWidgetValues: sparse
       })
 
-      expect(getPromotedInputValue(host, 'seed')).toBe(7)
+      expect(handle.getValue()).toBe(7)
+    })
+
+    it('alreadyLinked: ambiguous matching inputs quarantine without applying host value', () => {
+      const host = buildHost()
+      const inner = addInnerNode(host, 'Inner', (n) => {
+        n.addWidget('number', 'seed', 0, () => {})
+      })
+      const a = addPromotedHostInput(host, {
+        inputName: 'first_seed',
+        promotedName: 'seed',
+        sourceNodeId: String(inner.id),
+        sourceWidgetName: 'seed',
+        initialValue: 1
+      })
+      const b = addPromotedHostInput(host, {
+        inputName: 'second_seed',
+        promotedName: 'seed',
+        sourceNodeId: String(inner.id),
+        sourceWidgetName: 'seed',
+        initialValue: 2
+      })
+
+      host.properties.proxyWidgets = [[String(inner.id), 'seed']]
+      flushProxyWidgetMigration({
+        hostNode: host,
+        hostWidgetValues: [99]
+      })
+
+      expect(a.getValue()).toBe(1)
+      expect(b.getValue()).toBe(2)
+      expect(readHostQuarantine(host)).toEqual([
+        expect.objectContaining({
+          originalEntry: [String(inner.id), 'seed'],
+          reason: 'ambiguousSubgraphInput'
+        })
+      ])
     })
 
     it('createSubgraphInput: creates exactly one new SubgraphInput linked to the source widget', () => {
@@ -218,25 +264,29 @@ describe('flushProxyWidgetMigration', () => {
       expect(created?._widget).toBeDefined()
     })
 
-    it('createSubgraphInput: preserves the source slot label', () => {
+    it('createSubgraphInput: honors disambiguatingSourceNodeId when source widget name has been deduplicated', () => {
       const host = buildHost()
-      const inner = addInnerNode(host, 'Inner', (n) => {
-        const slot = n.addInput('text', 'STRING')
-        slot.label = 'renamed_from_sidepanel'
-        slot.widget = { name: 'text' }
-        n.addWidget('text', 'text', '', () => {})
+      const inner = addInnerNode(host, 'InnerWithDedupedPromotion', (n) => {
+        const slot1 = n.addInput('text', 'STRING')
+        slot1.widget = { name: 'text' }
+        const w1 = n.addWidget('text', 'text', '11111111111', () => {})
+        Object.assign(w1, { sourceNodeId: '1', sourceWidgetName: 'text' })
+
+        const slot2 = n.addInput('text_1', 'STRING')
+        slot2.widget = { name: 'text_1' }
+        const w2 = n.addWidget('text', 'text_1', '22222222222', () => {})
+        Object.assign(w2, { sourceNodeId: '2', sourceWidgetName: 'text' })
       })
 
-      host.properties.proxyWidgets = [[String(inner.id), 'text']]
+      host.properties.proxyWidgets = [[String(inner.id), 'text', '2']]
       flushProxyWidgetMigration({ hostNode: host })
 
-      const promotedInput = host.inputs.find((input) => input.name === 'text')
-      expect(promotedInput?.label).toBe('renamed_from_sidepanel')
-      expect(
-        promotedInput?.widgetId
-          ? useWidgetValueStore().getWidget(promotedInput.widgetId)?.label
-          : undefined
-      ).toBe('renamed_from_sidepanel')
+      const created = host.subgraph.inputs.at(-1)
+      expect(created?._widget).toBeDefined()
+      const linkedSlot = inner.inputs.find(
+        (slot) => slot.link === created?.linkIds[0]
+      )
+      expect(linkedSlot?.name).toBe('text_1')
     })
 
     it('createSubgraphInput: quarantines missingSubgraphInput when source widget has no backing input slot', () => {
@@ -311,7 +361,8 @@ describe('flushProxyWidgetMigration', () => {
         hostWidgetValues: [123]
       })
 
-      expect(getPromotedInputValue(host, 'value')).toBe(123)
+      const hostInput = host.inputs.at(-1)
+      expect(hostInput?._widget?.value).toBe(123)
     })
 
     it('seeds value from the primitive widget when no host value is supplied', () => {
@@ -324,7 +375,8 @@ describe('flushProxyWidgetMigration', () => {
       host.properties.proxyWidgets = [[String(primitive.id), 'value']]
       flushProxyWidgetMigration({ hostNode: host })
 
-      expect(getPromotedInputValue(host, 'value')).toBe(11)
+      const hostInput = host.inputs.at(-1)
+      expect(hostInput?._widget?.value).toBe(11)
     })
 
     it('quarantines an unlinked primitive node with no fan-out', () => {
@@ -422,8 +474,10 @@ describe('flushProxyWidgetMigration', () => {
       expect(hostA.properties.proxyWidgetErrorQuarantine).toBeUndefined()
       expect(hostB.properties.proxyWidgetErrorQuarantine).toBeUndefined()
 
-      expect(getPromotedInputValue(hostA, 'value')).toBe(11)
-      expect(getPromotedInputValue(hostB, 'value')).toBe(22)
+      const widgetA = hostA.inputs.at(-1)?._widget
+      const widgetB = hostB.inputs.at(-1)?._widget
+      expect(widgetA?.value).toBe(11)
+      expect(widgetB?.value).toBe(22)
     })
   })
 

src/core/graph/subgraph/migration/proxyWidgetMigration.ts

@@ -1,6 +1,6 @@
 import { isEqual } from 'es-toolkit/compat'
 
-import { promotedInputWidget } from '@/core/graph/subgraph/promotedInputWidget'
+import { isPromotedWidgetView } from '@/core/graph/subgraph/promotedWidgetTypes'
 import type { PromotedWidgetSource } from '@/core/graph/subgraph/promotedWidgetTypes'
 import {
   findHostInputForPromotion,
@@ -8,7 +8,6 @@ import {
   isPreviewPseudoWidget
 } from '@/core/graph/subgraph/promotionUtils'
 import { resolveConcretePromotedWidget } from '@/core/graph/subgraph/resolveConcretePromotedWidget'
-import { resolveSubgraphInputTarget } from '@/core/graph/subgraph/resolveSubgraphInputTarget'
 import type { SerializedProxyWidgetTuple } from '@/core/schemas/promotionSchema'
 import { parseProxyWidgets } from '@/core/schemas/promotionSchema'
 import type {
@@ -28,7 +27,6 @@ import type {
 } from '@/lib/litegraph/src/types/widgets'
 import { isWidgetValue } from '@/lib/litegraph/src/types/widgets'
 import { usePreviewExposureStore } from '@/stores/previewExposureStore'
-import { useWidgetValueStore } from '@/stores/widgetValueStore'
 
 interface LegacyProxyEntrySource extends PromotedWidgetSource {
   disambiguatingSourceNodeId?: string
@@ -95,24 +93,23 @@ function resolveSourceWidget(
   sourceWidgetName: string,
   disambiguatingSourceNodeId?: string
 ): IBaseWidget | undefined {
-  if (sourceNode.isSubgraphNode()) {
-    const input = sourceNode.inputs.find((input) => {
-      const target = resolveSubgraphInputTarget(sourceNode, input.name)
-      if (disambiguatingSourceNodeId) {
-        return (
-          target?.widgetName === sourceWidgetName &&
-          target.nodeId === disambiguatingSourceNodeId
-        )
-      }
-      if (input.name === sourceWidgetName) return true
-      return target?.widgetName === sourceWidgetName
-    })
-    // Store-backed projection for a promoted input on a nested subgraph node:
-    // getSlotFromWidget locates the backing slot by widgetId.
-    if (input?.widgetId) return promotedInputWidget(input) ?? undefined
+  const widgets = sourceNode.widgets
+  if (widgets && disambiguatingSourceNodeId !== undefined) {
+    const byDisambiguator = widgets.find(
+      (w) =>
+        isPromotedWidgetView(w) &&
+        w.sourceNodeId === disambiguatingSourceNodeId &&
+        w.sourceWidgetName === sourceWidgetName
+    )
+    if (byDisambiguator) return byDisambiguator
+    // Disambiguator missed: fall back only to non-promoted same-name widgets.
+    // A sibling PromotedWidgetView would re-introduce the cross-binding bug.
+    const byName = widgets.find(
+      (w) => !isPromotedWidgetView(w) && w.name === sourceWidgetName
+    )
+    if (byName) return byName
   }
 
-  const widgets = sourceNode.widgets
   return (
     widgets?.find((w) => w.name === sourceWidgetName) ??
     getPromotableWidgets(sourceNode).find((w) => w.name === sourceWidgetName)
@@ -303,6 +300,19 @@ function classify(
     normalized.sourceWidgetName
   )
   if (linkedInput) {
+    const ambiguous =
+      hostNode.inputs.filter((input) => {
+        const w = input._widget
+        return (
+          !!w &&
+          isPromotedWidgetView(w) &&
+          w.sourceNodeId === normalized.sourceNodeId &&
+          w.sourceWidgetName === normalized.sourceWidgetName
+        )
+      }).length > 1
+    if (ambiguous) {
+      return { kind: 'quarantine', reason: 'ambiguousSubgraphInput' }
+    }
     return { kind: 'alreadyLinked', subgraphInputName: linkedInput.name }
   }
 
@@ -363,23 +373,19 @@ function classify(
   }
 }
 
-function applyHostValueToInput(
-  input: INodeInputSlot,
-  entry: PendingEntry
-): boolean {
-  if (!input.widgetId || entry.isHole) return Boolean(input.widgetId)
-  return useWidgetValueStore().setValue(input.widgetId, entry.hostValue)
-}
-
-function applyHostLabelToInput(
-  input: INodeInputSlot,
-  label: string | undefined
-): void {
-  if (label === undefined) return
-  input.label = label
-  if (!input.widgetId) return
-  const state = useWidgetValueStore().getWidget(input.widgetId)
-  if (state) state.label = label
+function applyHostValue(widget: IBaseWidget, entry: PendingEntry): void {
+  if (entry.isHole) return
+  if (
+    isPromotedWidgetView(widget) &&
+    typeof widget.hydrateHostValue === 'function'
+  ) {
+    widget.hydrateHostValue(entry.hostValue)
+    return
+  }
+  console.error(
+    '[proxyWidgetMigration] applyHostValue called with non-promoted widget; refusing to write to shared interior',
+    { widgetName: widget.name, type: widget.type }
+  )
 }
 
 function addUniqueSubgraphInput(
@@ -416,9 +422,10 @@ function repairAlreadyLinked(
     return { ok: false, reason: 'ambiguousSubgraphInput' }
   }
   const hostInput = matches[0]
-  if (!applyHostValueToInput(hostInput, entry)) {
+  if (!hostInput._widget) {
     return { ok: false, reason: 'missingSubgraphInput' }
   }
+  applyHostValue(hostInput._widget, entry)
   return { ok: true, subgraphInputName: hostInput.name }
 }
 
@@ -473,10 +480,11 @@ function repairCreateSubgraphInput(
   const hostInput = hostNode.inputs.find(
     (input) => input.name === newSubgraphInput.name
   )
-  if (hostInput) {
-    applyHostLabelToInput(hostInput, slot.label)
-    applyHostValueToInput(hostInput, entry)
+  if (!hostInput?._widget) {
+    return { ok: true, subgraphInputName: newSubgraphInput.name }
   }
+
+  applyHostValue(hostInput._widget, entry)
   return { ok: true, subgraphInputName: newSubgraphInput.name }
 }
 
@@ -641,19 +649,22 @@ function repairPrimitive(
     return failPrimitive('mutation failed; rolled back', { error: e })
   }
 
+  // Apply through the host's input mirror (PromotedWidgetView), NOT
+  // `newSubgraphInput._widget`: the interior is shared across hosts.
   const hostInput = hostNode.inputs.find(
     (input) => input.name === newSubgraphInput.name
   )
-  if (hostInput) {
+  const hostInputWidget = hostInput?._widget
+  if (hostInputWidget) {
     const valueEntry = validated.uniqueEntries.find((e) => !e.isHole)
     if (valueEntry) {
-      applyHostValueToInput(hostInput, valueEntry)
+      applyHostValue(hostInputWidget, valueEntry)
     } else {
       const primitiveValue = primitiveNode.widgets?.find(
         (w) => w.name === validated.sourceWidgetName
       )?.value as TWidgetValue | undefined
       if (primitiveValue !== undefined) {
-        applyHostValueToInput(hostInput, {
+        applyHostValue(hostInputWidget, {
           ...validated.uniqueEntries[0],
           hostValue: primitiveValue,
           isHole: false