[automated] Apply ESLint and Oxfmt fixes

Amp-Thread-ID: https://ampcode.com/threads/T-019c3047-baa8-757f-b271-4be924f4cde3

.claude/skills/writing-playwright-tests/SKILL.md

@@ -1,200 +0,0 @@
----
-name: writing-playwright-tests
-description: 'Writes Playwright e2e tests for ComfyUI_frontend. Use when creating, modifying, or debugging browser tests. Triggers on: playwright, e2e test, browser test, spec file.'
----
-
-# Writing Playwright Tests for ComfyUI_frontend
-
-## Golden Rules
-
-1. **ALWAYS look at existing tests first.** Search `browser_tests/tests/` for similar patterns before writing new tests.
-
-2. **ALWAYS read the fixture code.** The APIs are in `browser_tests/fixtures/` - read them directly instead of guessing.
-
-3. **Use premade JSON workflow assets** instead of building workflows programmatically.
-   - Assets live in `browser_tests/assets/`
-   - Load with `await comfyPage.workflow.loadWorkflow('feature/my_workflow')`
-   - Create new assets by starting with `browser_tests/assets/default.json` and manually editing the JSON to match your desired graph state
-
-## Vue Nodes vs LiteGraph: Decision Guide
-
-Choose based on **what you're testing**, not personal preference:
-
-| Testing...                                     | Use                              | Why                                      |
-| ---------------------------------------------- | -------------------------------- | ---------------------------------------- |
-| Vue-rendered node UI, DOM widgets, CSS states  | `comfyPage.vueNodes.*`           | Nodes are DOM elements, use locators     |
-| Canvas interactions, connections, legacy nodes | `comfyPage.nodeOps.*`            | Canvas-based, use coordinates/references |
-| Both in same test                              | Pick primary, minimize switching | Avoid confusion                          |
-
-**Vue Nodes requires explicit opt-in:**
-
-```typescript
-await comfyPage.settings.setSetting('Comfy.VueNodes.Enabled', true)
-await comfyPage.vueNodes.waitForNodes()
-```
-
-**Vue Node state uses CSS classes:**
-
-```typescript
-const BYPASS_CLASS = /before:bg-bypass\/60/
-await expect(node).toHaveClass(BYPASS_CLASS)
-```
-
-## Common Issues
-
-These are frequent causes of flaky tests - check them first, but investigate if they don't apply:
-
-| Symptom                            | Common Cause              | Typical Fix                                                                            |
-| ---------------------------------- | ------------------------- | -------------------------------------------------------------------------------------- |
-| Test passes locally, fails in CI   | Missing nextFrame()       | Add `await comfyPage.nextFrame()` after canvas ops (not needed after `loadWorkflow()`) |
-| Keyboard shortcuts don't work      | Missing focus             | Add `await comfyPage.canvas.click()` first                                             |
-| Double-click doesn't trigger       | Timing too fast           | Add `{ delay: 5 }` option                                                              |
-| Elements end up in wrong position  | Drag animation incomplete | Use `{ steps: 10 }` not `{ steps: 1 }`                                                 |
-| Widget value wrong after drag-drop | Upload incomplete         | Add `{ waitForUpload: true }`                                                          |
-| Test fails when run with others    | Test pollution            | Add `afterEach` with `resetView()`                                                     |
-| Local screenshots don't match CI   | Platform differences      | Screenshots are Linux-only, use PR label                                               |
-
-## Test Tags
-
-Add appropriate tags to every test:
-
-| Tag           | When to Use                               |
-| ------------- | ----------------------------------------- |
-| `@smoke`      | Quick essential tests                     |
-| `@slow`       | Tests > 10 seconds                        |
-| `@screenshot` | Visual regression tests                   |
-| `@canvas`     | Canvas interactions                       |
-| `@node`       | Node-related                              |
-| `@widget`     | Widget-related                            |
-| `@mobile`     | Mobile viewport (runs on Pixel 5 project) |
-| `@2x`         | HiDPI tests (runs on 2x scale project)    |
-
-```typescript
-test.describe('Feature', { tag: ['@screenshot', '@canvas'] }, () => {
-```
-
-## Retry Patterns
-
-**Never use `waitForTimeout`** - it's always wrong.
-
-| Pattern                  | Use Case                                             |
-| ------------------------ | ---------------------------------------------------- |
-| Auto-retrying assertions | `toBeVisible()`, `toHaveText()`, etc. (prefer these) |
-| `expect.poll()`          | Single value polling                                 |
-| `expect().toPass()`      | Multiple assertions that must all pass               |
-
-```typescript
-// Prefer auto-retrying assertions when possible
-await expect(node).toBeVisible()
-
-// Single value polling
-await expect.poll(() => widget.getValue(), { timeout: 2000 }).toBe(100)
-
-// Multiple conditions
-await expect(async () => {
-  expect(await node1.getValue()).toBe('foo')
-  expect(await node2.getValue()).toBe('bar')
-}).toPass({ timeout: 2000 })
-```
-
-## Screenshot Baselines
-
-- **Screenshots are Linux-only.** Don't commit local screenshots.
-- **To update baselines:** Add PR label `New Browser Test Expectations`
-- **Mask dynamic content:**
-  ```typescript
-  await expect(comfyPage.canvas).toHaveScreenshot('page.png', {
-    mask: [page.locator('.timestamp')]
-  })
-  ```
-
-## CI Debugging
-
-1. Download artifacts from failed CI run
-2. Extract and view trace: `npx playwright show-trace trace.zip`
-3. CI deploys HTML report to Cloudflare Pages (link in PR comment)
-4. Reproduce CI: `CI=true pnpm test:browser`
-5. Local runs: `pnpm test:browser:local`
-
-## Anti-Patterns
-
-Avoid these common mistakes:
-
-1. **Arbitrary waits** - Use retrying assertions instead
-
-   ```typescript
-   // ❌ await page.waitForTimeout(500)
-   // ✅ await expect(element).toBeVisible()
-   ```
-
-2. **Implementation-tied selectors** - Use test IDs or semantic selectors
-
-   ```typescript
-   // ❌ page.locator('div.container > button.btn-primary')
-   // ✅ page.getByTestId('submit-button')
-   ```
-
-3. **Missing nextFrame after canvas ops** - Canvas needs sync time
-
-   ```typescript
-   await node.drag({ x: 50, y: 50 })
-   await comfyPage.nextFrame() // Required
-   ```
-
-4. **Shared state between tests** - Tests must be independent
-   ```typescript
-   // ❌ let sharedData  // Outside test
-   // ✅ Define state inside each test
-   ```
-
-## Quick Start Template
-
-```typescript
-// Path depends on test file location - adjust '../' segments accordingly
-import {
-  comfyPageFixture as test,
-  comfyExpect as expect
-} from '../fixtures/ComfyPage'
-
-test.describe('FeatureName', { tag: ['@canvas'] }, () => {
-  test.afterEach(async ({ comfyPage }) => {
-    await comfyPage.canvasOps.resetView()
-  })
-
-  test('should do something', async ({ comfyPage }) => {
-    await comfyPage.workflow.loadWorkflow('myWorkflow')
-
-    const node = (await comfyPage.nodeOps.getNodeRefsByTitle('KSampler'))[0]
-    // ... test logic
-
-    await expect(comfyPage.canvas).toHaveScreenshot('expected.png')
-  })
-})
-```
-
-## Finding Patterns
-
-```bash
-# Find similar tests
-grep -r "KSampler" browser_tests/tests/
-
-# Find usage of a fixture method
-grep -r "loadWorkflow" browser_tests/tests/
-
-# Find tests with specific tag
-grep -r '@screenshot' browser_tests/tests/
-```
-
-## Key Files to Read
-
-| Purpose           | Path                                       |
-| ----------------- | ------------------------------------------ |
-| Main fixture      | `browser_tests/fixtures/ComfyPage.ts`      |
-| Helper classes    | `browser_tests/fixtures/helpers/`          |
-| Component objects | `browser_tests/fixtures/components/`       |
-| Test selectors    | `browser_tests/fixtures/selectors.ts`      |
-| Vue Node helpers  | `browser_tests/fixtures/VueNodeHelpers.ts` |
-| Test assets       | `browser_tests/assets/`                    |
-| Existing tests    | `browser_tests/tests/`                     |
-
-**Read the fixture code directly** - it's the source of truth for available methods.

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

@@ -1,81 +0,0 @@
-name: 'CI: Dist Telemetry Scan'
-
-on:
-  pull_request:
-    branches-ignore: [wip/*, draft/*, temp/*]
-
-concurrency:
-  group: ${{ github.workflow }}-${{ github.ref }}
-  cancel-in-progress: true
-
-permissions:
-  contents: read
-
-jobs:
-  scan:
-    runs-on: ubuntu-latest
-
-    steps:
-      - uses: actions/checkout@8e8c483db84b4bee98b60c0593521ed34d9990e8 # v6.0.1
-
-      - name: Install pnpm
-        uses: pnpm/action-setup@41ff72655975bd51cab0327fa583b6e92b6d3061 # v4.2.0
-        with:
-          version: 10
-
-      - name: Use Node.js
-        uses: actions/setup-node@6044e13b5dc448c55e2357c09f80417699197238 # v6.2.0
-        with:
-          node-version: 'lts/*'
-          cache: 'pnpm'
-
-      - name: Install dependencies
-        run: pnpm install --frozen-lockfile
-
-      - name: Build project
-        run: pnpm build
-        env:
-          DISTRIBUTION: localhost
-
-      - name: Scan dist for GTM telemetry references
-        run: |
-          set -euo pipefail
-          echo '🔍 Scanning for Google Tag Manager references...'
-          if rg --no-ignore -n \
-            -g '*.html' \
-            -g '*.js' \
-            -e 'Google Tag Manager' \
-            -e '(?i)\bgtm\.js\b' \
-            -e '(?i)googletagmanager\.com/gtm\.js\\?id=' \
-            -e '(?i)googletagmanager\.com/ns\.html\\?id=' \
-            dist; then
-            echo '❌ ERROR: Google Tag Manager references found in dist assets!'
-            echo 'GTM must be properly tree-shaken from OSS builds.'
-            exit 1
-          fi
-          echo '✅ No GTM references found'
-
-      - name: Scan dist for Mixpanel telemetry references
-        run: |
-          set -euo pipefail
-          echo '🔍 Scanning for Mixpanel references...'
-          if rg --no-ignore -n \
-            -g '*.html' \
-            -g '*.js' \
-            -e '(?i)mixpanel\.init' \
-            -e '(?i)mixpanel\.identify' \
-            -e 'MixpanelTelemetryProvider' \
-            -e 'mp\.comfy\.org' \
-            -e 'mixpanel-browser' \
-            -e '(?i)mixpanel\.track\(' \
-            dist; then
-            echo '❌ ERROR: Mixpanel references found in dist assets!'
-            echo 'Mixpanel 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 Mixpanel references found'

.github/workflows/ci-lint-format.yaml

@@ -21,7 +21,7 @@ jobs:
         uses: actions/checkout@v6
         with:
           ref: ${{ !github.event.pull_request.head.repo.fork && github.head_ref || github.ref }}
-          token: ${{ !github.event.pull_request.head.repo.fork && secrets.PR_GH_TOKEN || github.token }}
+          token: ${{ secrets.PR_GH_TOKEN }}
 
       - name: Setup frontend
         uses: ./.github/actions/setup-frontend

.github/workflows/pr-update-playwright-expectations.yaml

@@ -109,7 +109,7 @@ jobs:
       # Run sharded tests with snapshot updates (browsers pre-installed in container)
       - name: Update snapshots (Shard ${{ matrix.shardIndex }}/${{ matrix.shardTotal }})
         id: playwright-tests
-        run: pnpm exec playwright test --update-snapshots --grep @screenshot --shard=${{ matrix.shardIndex }}/${{ matrix.shardTotal }}
+        run: pnpm exec playwright test --update-snapshots --shard=${{ matrix.shardIndex }}/${{ matrix.shardTotal }}
         continue-on-error: true
 
       - name: Stage changed snapshot files

.github/workflows/release-draft-create.yaml

@@ -53,13 +53,7 @@ jobs:
           IS_NIGHTLY: ${{  case(github.ref == 'refs/heads/main', 'true', 'false') }}
         run: |
           pnpm install --frozen-lockfile
-
-          # Desktop-specific release artifact with desktop distribution flags.
-          DISTRIBUTION=desktop pnpm build
-          pnpm zipdist ./dist ./dist-desktop.zip
-
-          # Default release artifact for core/PyPI.
-          NX_SKIP_NX_CACHE=true pnpm build
+          pnpm build
           pnpm zipdist
       - name: Upload dist artifact
         uses: actions/upload-artifact@v6
@@ -68,7 +62,6 @@ jobs:
           path: |
             dist/
             dist.zip
-            dist-desktop.zip
 
   draft_release:
     needs: build
@@ -86,7 +79,6 @@ jobs:
         with:
           files: |
             dist.zip
-            dist-desktop.zip
           tag_name: v${{ needs.build.outputs.version }}
           target_commitish: ${{ github.event.pull_request.base.ref }}
           make_latest: >-

.gitignore

@@ -96,5 +96,3 @@ vitest.config.*.timestamp*
 
 # Weekly docs check output
 /output.txt
-
-.amp

.oxlintrc.json

@@ -35,7 +35,7 @@
       }
     ],
     "no-control-regex": "off",
-    "no-eval": "error",
+    "no-eval": "off",
     "no-redeclare": "error",
     "no-restricted-imports": [
       "error",
@@ -60,6 +60,11 @@
           {
             "name": "primevue/sidebar",
             "message": "Sidebar is deprecated in PrimeVue 4+. Use Drawer instead: import Drawer from 'primevue/drawer'"
+          },
+          {
+            "name": "@/i18n--to-enable",
+            "importNames": ["st", "t", "te", "d"],
+            "message": "Don't import `@/i18n` directly, prefer `useI18n()`"
           }
         ]
       }
@@ -96,7 +101,6 @@
     "typescript/restrict-template-expressions": "off",
     "typescript/unbound-method": "off",
     "typescript/no-floating-promises": "error",
-    "typescript/no-explicit-any": "error",
     "vue/no-import-compiler-macros": "error",
     "vue/no-dupe-keys": "error"
   },

.storybook/main.ts

@@ -98,10 +98,12 @@ const config: StorybookConfig = {
       },
       build: {
         rolldownOptions: {
+          experimental: {
+            strictExecutionOrder: true
+          },
           treeshake: false,
           output: {
-            keepNames: true,
-            strictExecutionOrder: true
+            keepNames: true
           },
           onwarn: (warning, warn) => {
             // Suppress specific warnings

.stylelintrc.json

@@ -52,15 +52,14 @@
           "reference",
           "plugin",
           "custom-variant",
-          "utility",
-          "source"
+          "utility"
         ]
       }
     ],
     "function-no-unknown": [
       true,
       {
-        "ignoreFunctions": ["theme", "v-bind", "from-folder", "from-json"]
+        "ignoreFunctions": ["theme", "v-bind"]
       }
     ]
   },

CODEOWNERS

@@ -2,57 +2,57 @@
 *                                                 @Comfy-org/comfy_frontend_devs
 
 # Desktop/Electron
-/apps/desktop-ui/                                 @benceruleanlu @Comfy-org/comfy_frontend_devs
-/src/stores/electronDownloadStore.ts              @benceruleanlu @Comfy-org/comfy_frontend_devs
-/src/extensions/core/electronAdapter.ts           @benceruleanlu @Comfy-org/comfy_frontend_devs
-/vite.electron.config.mts                         @benceruleanlu @Comfy-org/comfy_frontend_devs
+/apps/desktop-ui/                                 @benceruleanlu
+/src/stores/electronDownloadStore.ts              @benceruleanlu
+/src/extensions/core/electronAdapter.ts           @benceruleanlu
+/vite.electron.config.mts                         @benceruleanlu
 
 # Common UI Components
-/src/components/chip/                             @viva-jinyi @Comfy-org/comfy_frontend_devs
-/src/components/card/                             @viva-jinyi @Comfy-org/comfy_frontend_devs
-/src/components/button/                           @viva-jinyi @Comfy-org/comfy_frontend_devs
-/src/components/input/                            @viva-jinyi @Comfy-org/comfy_frontend_devs
+/src/components/chip/                             @viva-jinyi
+/src/components/card/                             @viva-jinyi
+/src/components/button/                           @viva-jinyi
+/src/components/input/                            @viva-jinyi
 
 # Topbar
-/src/components/topbar/                           @pythongosssss @Comfy-org/comfy_frontend_devs
+/src/components/topbar/                           @pythongosssss
 
 # Thumbnail
-/src/renderer/core/thumbnail/                     @pythongosssss @Comfy-org/comfy_frontend_devs
+/src/renderer/core/thumbnail/                     @pythongosssss
 
 # Legacy UI
-/scripts/ui/                                      @pythongosssss @Comfy-org/comfy_frontend_devs
+/scripts/ui/                                      @pythongosssss
 
 # Link rendering
-/src/renderer/core/canvas/links/                  @benceruleanlu @Comfy-org/comfy_frontend_devs
+/src/renderer/core/canvas/links/                  @benceruleanlu
 
 # Partner Nodes
-/src/composables/node/useNodePricing.ts           @jojodecayz @bigcat88 @Comfy-org/comfy_frontend_devs
+/src/composables/node/useNodePricing.ts           @jojodecayz @bigcat88
 
 # Node help system
-/src/utils/nodeHelpUtil.ts                        @benceruleanlu @Comfy-org/comfy_frontend_devs
-/src/stores/workspace/nodeHelpStore.ts            @benceruleanlu @Comfy-org/comfy_frontend_devs
-/src/services/nodeHelpService.ts                  @benceruleanlu @Comfy-org/comfy_frontend_devs
+/src/utils/nodeHelpUtil.ts                        @benceruleanlu
+/src/stores/workspace/nodeHelpStore.ts            @benceruleanlu
+/src/services/nodeHelpService.ts                  @benceruleanlu
 
 # Selection toolbox
-/src/components/graph/selectionToolbox/           @Myestery @Comfy-org/comfy_frontend_devs
+/src/components/graph/selectionToolbox/           @Myestery
 
 # Minimap
-/src/renderer/extensions/minimap/                 @jtydhr88 @Myestery @Comfy-org/comfy_frontend_devs
+/src/renderer/extensions/minimap/                 @jtydhr88 @Myestery
 
 # Workflow Templates
-/src/platform/workflow/templates/                 @Myestery @christian-byrne @comfyui-wiki @Comfy-org/comfy_frontend_devs
-/src/components/templates/                        @Myestery @christian-byrne @comfyui-wiki @Comfy-org/comfy_frontend_devs
+/src/platform/workflow/templates/                 @Myestery @christian-byrne @comfyui-wiki
+/src/components/templates/                        @Myestery @christian-byrne @comfyui-wiki
 
 # Mask Editor
-/src/extensions/core/maskeditor.ts                @trsommer @brucew4yn3rp @Comfy-org/comfy_frontend_devs
-/src/extensions/core/maskEditorLayerFilenames.ts  @trsommer @brucew4yn3rp @Comfy-org/comfy_frontend_devs
+/src/extensions/core/maskeditor.ts                @trsommer @brucew4yn3rp
+/src/extensions/core/maskEditorLayerFilenames.ts  @trsommer @brucew4yn3rp
 
 # 3D
-/src/extensions/core/load3d.ts                    @jtydhr88 @Comfy-org/comfy_frontend_devs
-/src/components/load3d/                           @jtydhr88 @Comfy-org/comfy_frontend_devs
+/src/extensions/core/load3d.ts                    @jtydhr88
+/src/components/load3d/                           @jtydhr88
 
 # Manager
-/src/workbench/extensions/manager/                @viva-jinyi @christian-byrne @ltdrdata @Comfy-org/comfy_frontend_devs
+/src/workbench/extensions/manager/                @viva-jinyi @christian-byrne @ltdrdata
 
 # Translations
 /src/locales/                                     @Comfy-Org/comfy_maintainer @Comfy-org/comfy_frontend_devs

CONTRIBUTING.md

@@ -201,7 +201,7 @@ The project supports three types of icons, all with automatic imports (no manual
 2. **Iconify Icons** - 200,000+ icons from various libraries: `<i class="icon-[lucide--settings]" />`, `<i class="icon-[mdi--folder]" />`
 3. **Custom Icons** - Your own SVG icons: `<i-comfy:workflow />`
 
-Icons are powered by the unplugin-icons system, which automatically discovers and imports icons as Vue components. Tailwind CSS icon classes (`icon-[comfy--template]`) are provided by `@iconify/tailwind4`, configured in `packages/design-system/src/css/style.css`. Custom icons are stored in `packages/design-system/src/icons/` and loaded via `from-folder` at build time.
+Icons are powered by the unplugin-icons system, which automatically discovers and imports icons as Vue components. Custom icons are stored in `packages/design-system/src/icons/` and processed by `packages/design-system/src/iconCollection.ts` with automatic validation.
 
 For detailed instructions and code examples, see [packages/design-system/src/icons/README.md](packages/design-system/src/icons/README.md).
 

apps/desktop-ui/package.json

@@ -61,7 +61,8 @@
           "^build"
         ],
         "options": {
-          "command": "vite build --config apps/desktop-ui/vite.config.mts"
+          "cwd": "apps/desktop-ui",
+          "command": "vite build --config vite.config.mts"
         },
         "outputs": [
           "{projectRoot}/dist"

apps/desktop-ui/src/components/bottomPanel/tabs/terminal/BaseTerminal.vue

@@ -1,7 +1,10 @@
 <template>
-  <div ref="rootEl" class="relative size-full overflow-hidden bg-neutral-900">
-    <div class="p-terminal size-full rounded-none p-2">
-      <div ref="terminalEl" class="terminal-host h-full" />
+  <div
+    ref="rootEl"
+    class="relative overflow-hidden h-full w-full bg-neutral-900"
+  >
+    <div class="p-terminal rounded-none h-full w-full p-2">
+      <div ref="terminalEl" class="h-full terminal-host" />
     </div>
     <Button
       v-tooltip.left="{
@@ -13,7 +16,7 @@
       size="small"
       :class="
         cn('absolute top-2 right-8 transition-opacity', {
-          'pointer-events-none opacity-0 select-none': !isHovered
+          'opacity-0 pointer-events-none select-none': !isHovered
         })
       "
       :aria-label="tooltipText"

apps/desktop-ui/src/components/install/InstallLocationPicker.vue

@@ -1,12 +1,12 @@
 <template>
-  <div class="mx-auto flex w-full max-w-3xl flex-col gap-8 select-none">
+  <div class="flex flex-col gap-8 w-full max-w-3xl mx-auto select-none">
     <!-- Installation Path Section -->
-    <div class="flex grow flex-col gap-6 text-neutral-300">
-      <h2 class="text-center font-inter text-3xl font-bold text-neutral-100">
+    <div class="grow flex flex-col gap-6 text-neutral-300">
+      <h2 class="font-inter font-bold text-3xl text-neutral-100 text-center">
         {{ $t('install.locationPicker.title') }}
       </h2>
 
-      <p class="px-12 text-center text-neutral-400">
+      <p class="text-center text-neutral-400 px-12">
         {{ $t('install.locationPicker.subtitle') }}
       </p>
 
@@ -15,7 +15,7 @@
         <InputText
           v-model="installPath"
           :placeholder="$t('install.locationPicker.pathPlaceholder')"
-          class="flex-1 border-neutral-700 bg-neutral-800/50 text-neutral-200 placeholder:text-neutral-500"
+          class="flex-1 bg-neutral-800/50 border-neutral-700 text-neutral-200 placeholder:text-neutral-500"
           :class="{ 'p-invalid': pathError }"
           @update:model-value="validatePath"
           @focus="onFocus"
@@ -23,7 +23,7 @@
         <Button
           icon="pi pi-folder-open"
           severity="secondary"
-          class="border-0 bg-neutral-700 hover:bg-neutral-600"
+          class="bg-neutral-700 hover:bg-neutral-600 border-0"
           @click="browsePath"
         />
       </div>
@@ -33,7 +33,7 @@
         <Message
           v-if="pathError"
           severity="error"
-          class="w-full whitespace-pre-line"
+          class="whitespace-pre-line w-full"
         >
           {{ pathError }}
         </Message>

apps/desktop-ui/src/components/maintenance/TaskCard.vue

@@ -17,7 +17,7 @@
         <img
           v-if="task.headerImg"
           :src="task.headerImg"
-          class="size-full object-contain px-4 pt-4 opacity-25"
+          class="h-full w-full object-contain px-4 pt-4 opacity-25"
         />
       </template>
       <template #title>
@@ -43,7 +43,7 @@
 
     <i
       v-if="!isLoading && runner.state === 'OK'"
-      class="pi pi-check pointer-events-none absolute -right-4 -bottom-4 z-10 col-span-full row-span-full text-[4rem] text-green-500 opacity-100 transition-opacity [text-shadow:0.25rem_0_0.5rem_black] group-hover/task-card:opacity-20"
+      class="task-card-ok pi pi-check"
     />
   </div>
 </template>

apps/desktop-ui/src/components/maintenance/TaskListPanel.vue

@@ -4,7 +4,7 @@
     <template v-if="filter.tasks.length === 0">
       <!-- Empty filter -->
       <Divider />
-      <p class="w-full text-center text-neutral-400">
+      <p class="text-neutral-400 w-full text-center">
         {{ $t('maintenance.allOk') }}
       </p>
     </template>
@@ -25,7 +25,7 @@
 
       <!-- Display: Cards -->
       <template v-else>
-        <div class="pad-y my-4 flex flex-wrap justify-evenly gap-8">
+        <div class="flex flex-wrap justify-evenly gap-8 pad-y my-4">
           <TaskCard
             v-for="task in filter.tasks"
             :key="task.id"
@@ -45,8 +45,7 @@ import { useConfirm, useToast } from 'primevue'
 import ConfirmPopup from 'primevue/confirmpopup'
 import Divider from 'primevue/divider'
 
-import { useI18n } from 'vue-i18n'
-
+import { t } from '@/i18n'
 import { useMaintenanceTaskStore } from '@/stores/maintenanceTaskStore'
 import type {
   MaintenanceFilter,
@@ -56,7 +55,6 @@ import type {
 import TaskCard from './TaskCard.vue'
 import TaskListItem from './TaskListItem.vue'
 
-const { t } = useI18n()
 const toast = useToast()
 const confirm = useConfirm()
 const taskStore = useMaintenanceTaskStore()
@@ -82,7 +80,8 @@ const executeTask = async (task: MaintenanceTask) => {
   toast.add({
     severity: 'error',
     summary: t('maintenance.error.toastTitle'),
-    detail: message ?? t('maintenance.error.defaultDescription')
+    detail: message ?? t('maintenance.error.defaultDescription'),
+    life: 10_000
   })
 }
 

apps/desktop-ui/src/views/DesktopDialogView.vue

@@ -1,7 +1,7 @@
 <template>
-  <div class="flex size-full flex-col justify-between rounded-lg p-6">
-    <h1 class="m-0 font-inter text-xl font-semibold italic">
-      {{ $t(`desktopDialogs.${id}.title`, title) }}
+  <div class="w-full h-full flex flex-col rounded-lg p-6 justify-between">
+    <h1 class="font-inter font-semibold text-xl m-0 italic">
+      {{ t(`desktopDialogs.${id}.title`, title) }}
     </h1>
     <p class="whitespace-pre-wrap">
       {{ t(`desktopDialogs.${id}.message`, message) }}

apps/desktop-ui/src/views/DesktopUpdateView.vue

@@ -1,7 +1,7 @@
 <template>
   <BaseViewTemplate dark>
     <div
-      class="grid h-screen w-screen items-center justify-around overflow-y-auto"
+      class="h-screen w-screen grid items-center justify-around overflow-y-auto"
     >
       <div class="relative m-8 text-center">
         <!-- Header -->
@@ -13,7 +13,7 @@
           <span>{{ t('desktopUpdate.description') }}</span>
         </div>
 
-        <ProgressSpinner class="m-8 size-48" />
+        <ProgressSpinner class="m-8 w-48 h-48" />
 
         <!-- Console button -->
         <Button

apps/desktop-ui/src/views/InstallView.stories.ts

@@ -1,8 +1,6 @@
 // eslint-disable-next-line storybook/no-renderer-packages
 import type { Meta, StoryObj } from '@storybook/vue3'
-import type { ElectronAPI } from '@comfyorg/comfyui-electron-types'
 import { nextTick, provide } from 'vue'
-import type { ElectronWindow } from '@/utils/envUtil'
 import { createMemoryHistory, createRouter } from 'vue-router'
 
 import InstallView from './InstallView.vue'
@@ -44,21 +42,16 @@ const meta: Meta<typeof InstallView> = {
       const router = createMockRouter()
 
       // Mock electron API
-      ;(window as ElectronWindow).electronAPI = {
+      ;(window as any).electronAPI = {
         getPlatform: () => 'darwin',
         Config: {
           getDetectedGpu: () => Promise.resolve('mps')
         },
         Events: {
-          trackEvent: (
-            _eventName: string,
-            _data?: Record<string, unknown>
-          ) => {}
+          trackEvent: (_eventName: string, _data?: any) => {}
         },
-        installComfyUI: (
-          _options: Parameters<ElectronAPI['installComfyUI']>[0]
-        ) => {},
-        changeTheme: (_theme: Parameters<ElectronAPI['changeTheme']>[0]) => {},
+        installComfyUI: (_options: any) => {},
+        changeTheme: (_theme: any) => {},
         getSystemPaths: () =>
           Promise.resolve({
             defaultInstallPath: '/Users/username/ComfyUI'
@@ -247,8 +240,8 @@ export const DesktopSettings: Story = {
 export const WindowsPlatform: Story = {
   render: () => {
     // Override the platform to Windows
-    ;(window as ElectronWindow).electronAPI.getPlatform = () => 'win32'
-    ;(window as ElectronWindow).electronAPI.Config.getDetectedGpu = () =>
+    ;(window as any).electronAPI.getPlatform = () => 'win32'
+    ;(window as any).electronAPI.Config.getDetectedGpu = () =>
       Promise.resolve('nvidia')
 
     return {
@@ -266,8 +259,8 @@ export const MacOSPlatform: Story = {
   name: 'macOS Platform',
   render: () => {
     // Override the platform to macOS
-    ;(window as ElectronWindow).electronAPI.getPlatform = () => 'darwin'
-    ;(window as ElectronWindow).electronAPI.Config.getDetectedGpu = () =>
+    ;(window as any).electronAPI.getPlatform = () => 'darwin'
+    ;(window as any).electronAPI.Config.getDetectedGpu = () =>
       Promise.resolve('mps')
 
     return {
@@ -334,7 +327,7 @@ export const ManualInstall: Story = {
 export const ErrorState: Story = {
   render: () => {
     // Override validation to return an error
-    ;(window as ElectronWindow).electronAPI.validateInstallPath = () =>
+    ;(window as any).electronAPI.validateInstallPath = () =>
       Promise.resolve({
         isValid: false,
         exists: false,
@@ -382,7 +375,7 @@ export const ErrorState: Story = {
 export const WarningState: Story = {
   render: () => {
     // Override validation to return a warning about non-default drive
-    ;(window as ElectronWindow).electronAPI.validateInstallPath = () =>
+    ;(window as any).electronAPI.validateInstallPath = () =>
       Promise.resolve({
         isValid: true,
         exists: false,

apps/desktop-ui/src/views/InstallView.vue

@@ -1,10 +1,10 @@
 <template>
   <BaseViewTemplate dark>
     <!-- Fixed height container with flexbox layout for proper content management -->
-    <div class="flex size-full flex-col">
+    <div class="w-full h-full flex flex-col">
       <Stepper
         v-model:value="currentStep"
-        class="flex h-full flex-col"
+        class="flex flex-col h-full"
         @update:value="handleStepChange"
       >
         <!-- Main content area that grows to fill available space -->
@@ -37,7 +37,7 @@
 
         <!-- Install footer with navigation -->
         <InstallFooter
-          class="mx-auto my-6 w-full max-w-2xl"
+          class="w-full max-w-2xl my-6 mx-auto"
           :current-step
           :can-proceed
           :disable-location-step="noGpu"

apps/desktop-ui/src/views/MaintenanceView.vue

@@ -1,21 +1,21 @@
 <template>
   <BaseViewTemplate dark>
     <div
-      class="dark-theme grid h-screen min-h-full w-screen min-w-full justify-around overflow-y-auto bg-neutral-900 font-sans text-neutral-300"
+      class="min-w-full min-h-full font-sans w-screen h-screen grid justify-around text-neutral-300 bg-neutral-900 dark-theme overflow-y-auto"
     >
-      <div class="relative m-8 w-screen max-w-(--breakpoint-sm)">
+      <div class="max-w-(--breakpoint-sm) w-screen m-8 relative">
         <!-- Header -->
         <h1 class="backspan pi-wrench text-4xl font-bold">
           {{ t('maintenance.title') }}
         </h1>
 
         <!-- Toolbar -->
-        <div class="flex w-full flex-wrap items-center gap-4">
+        <div class="w-full flex flex-wrap gap-4 items-center">
           <span class="grow">
             {{ t('maintenance.status') }}:
             <StatusTag :refreshing="isRefreshing" :error="anyErrors" />
           </span>
-          <div class="flex items-center gap-4">
+          <div class="flex gap-4 items-center">
             <SelectButton
               v-model="displayAsList"
               :options="[PrimeIcons.LIST, PrimeIcons.TH_LARGE]"
@@ -56,10 +56,10 @@
               :value="t('icon.exclamation-triangle')"
             />
             <span>
-              <strong class="mb-1 block">
+              <strong class="block mb-1">
                 {{ t('maintenance.unsafeMigration.title') }}
               </strong>
-              <span class="mb-1 block">
+              <span class="block mb-1">
                 {{ unsafeReasonText }}
               </span>
               <span class="block text-sm text-neutral-400">
@@ -71,13 +71,13 @@
 
         <!-- Tasks -->
         <TaskListPanel
-          class="border-x-0 border-y border-solid border-neutral-700"
+          class="border-neutral-700 border-solid border-x-0 border-y"
           :filter
           :display-as-list
         />
 
         <!-- Actions -->
-        <div class="flex flex-row justify-between gap-4">
+        <div class="flex justify-between gap-4 flex-row">
           <Button
             :label="t('maintenance.consoleLogs')"
             icon="pi pi-desktop"
@@ -188,7 +188,8 @@ const completeValidation = async () => {
     toast.add({
       severity: 'error',
       summary: t('g.error'),
-      detail: t('maintenance.error.cannotContinue')
+      detail: t('maintenance.error.cannotContinue'),
+      life: 5_000
     })
   }
 }

apps/desktop-ui/src/views/MetricsConsentView.vue

@@ -1,8 +1,8 @@
 <template>
   <BaseViewTemplate dark hide-language-selector>
-    <div class="flex h-full flex-col items-center justify-center p-8 2xl:p-16">
+    <div class="h-full p-8 2xl:p-16 flex flex-col items-center justify-center">
       <div
-        class="flex w-full max-w-[600px] flex-col gap-6 rounded-lg bg-neutral-800 p-6 shadow-lg"
+        class="bg-neutral-800 rounded-lg shadow-lg p-6 w-full max-w-[600px] flex flex-col gap-6"
       >
         <h2 class="text-3xl font-semibold text-neutral-100">
           {{ $t('install.helpImprove') }}
@@ -15,7 +15,7 @@
           <a
             href="https://comfy.org/privacy"
             target="_blank"
-            class="text-blue-400 underline hover:text-blue-300"
+            class="text-blue-400 hover:text-blue-300 underline"
           >
             {{ $t('install.privacyPolicy') }} </a
           >.
@@ -33,7 +33,7 @@
             }}
           </span>
         </div>
-        <div class="flex justify-end pt-6">
+        <div class="flex pt-6 justify-end">
           <Button
             :label="$t('g.ok')"
             icon="pi pi-check"
@@ -72,7 +72,8 @@ const updateConsent = async () => {
     toast.add({
       severity: 'error',
       summary: t('install.settings.errorUpdatingConsent'),
-      detail: t('install.settings.errorUpdatingConsentDetail')
+      detail: t('install.settings.errorUpdatingConsentDetail'),
+      life: 3000
     })
   } finally {
     isUpdating.value = false

apps/desktop-ui/src/views/NotSupportedView.vue

@@ -9,7 +9,7 @@
       />
 
       <div class="no-drag sad-text flex items-center">
-        <div class="flex min-w-110 flex-col gap-8 p-8">
+        <div class="flex flex-col gap-8 p-8 min-w-110">
           <!-- Header -->
           <h1 class="text-4xl font-bold text-red-500">
             {{ $t('notSupported.title') }}
@@ -20,7 +20,7 @@
             <p class="text-xl">
               {{ $t('notSupported.message') }}
             </p>
-            <ul class="list-inside list-disc space-y-1 text-neutral-800">
+            <ul class="list-disc list-inside space-y-1 text-neutral-800">
               <li>{{ $t('notSupported.supportedDevices.macos') }}</li>
               <li>{{ $t('notSupported.supportedDevices.windows') }}</li>
             </ul>

apps/desktop-ui/src/views/ServerStartView.vue

@@ -2,14 +2,14 @@
   <BaseViewTemplate dark>
     <div class="relative min-h-screen">
       <!-- Terminal Background Layer (always visible during loading) -->
-      <div v-if="!isError" class="fixed inset-0 z-0 overflow-hidden">
-        <div class="size-full">
+      <div v-if="!isError" class="fixed inset-0 overflow-hidden z-0">
+        <div class="h-full w-full">
           <BaseTerminal @created="terminalCreated" />
         </div>
       </div>
 
       <!-- Semi-transparent overlay -->
-      <div v-if="!isError" class="fixed inset-0 z-5 bg-neutral-900/80"></div>
+      <div v-if="!isError" class="fixed inset-0 bg-neutral-900/80 z-5"></div>
 
       <!-- Smooth radial gradient overlay -->
       <div
@@ -45,9 +45,9 @@
         <!-- Error Section (positioned at bottom) -->
         <div
           v-if="isError"
-          class="absolute inset-x-0 bottom-20 flex flex-col items-center gap-4"
+          class="absolute bottom-20 left-0 right-0 flex flex-col items-center gap-4"
         >
-          <div class="flex justify-center gap-4">
+          <div class="flex gap-4 justify-center">
             <Button
               icon="pi pi-flag"
               :label="$t('serverStart.reportIssue')"
@@ -71,10 +71,10 @@
         <!-- Terminal Output (positioned at bottom when manually toggled in error state) -->
         <div
           v-if="terminalVisible && isError"
-          class="absolute inset-x-4 bottom-4 z-10 mx-auto max-w-4xl"
+          class="absolute bottom-4 left-4 right-4 max-w-4xl mx-auto z-10"
         >
           <div
-            class="h-[300px] rounded-lg border border-neutral-700 bg-neutral-900/95 p-4"
+            class="bg-neutral-900/95 rounded-lg p-4 border border-neutral-700 h-[300px]"
           >
             <BaseTerminal @created="terminalCreated" />
           </div>

browser_tests/AGENTS.md

@@ -4,40 +4,11 @@ See `@docs/guidance/playwright.md` for Playwright best practices (auto-loaded fo
 
 ## Directory Structure
 
-```text
-browser_tests/
-├── assets/           - Test data (JSON workflows, images)
-├── fixtures/
-│   ├── ComfyPage.ts      - Main fixture (delegates to helpers)
-│   ├── ComfyMouse.ts     - Mouse interaction helper
-│   ├── VueNodeHelpers.ts - Vue Nodes 2.0 helpers
-│   ├── selectors.ts      - Centralized TestIds
-│   ├── components/       - Page object components
-│   │   ├── ContextMenu.ts
-│   │   ├── SettingDialog.ts
-│   │   ├── SidebarTab.ts
-│   │   └── Topbar.ts
-│   ├── helpers/          - Focused helper classes
-│   │   ├── CanvasHelper.ts
-│   │   ├── CommandHelper.ts
-│   │   ├── KeyboardHelper.ts
-│   │   ├── NodeOperationsHelper.ts
-│   │   ├── SettingsHelper.ts
-│   │   ├── WorkflowHelper.ts
-│   │   └── ...
-│   └── utils/            - Utility functions
-├── helpers/          - Test-specific utilities
-└── tests/            - Test files (*.spec.ts)
-```
+- `assets/` - Test data (JSON workflows, fixtures)
+- Tests use premade JSON workflows to load desired graph state
 
 ## After Making Changes
 
 - Run `pnpm typecheck:browser` after modifying TypeScript files in this directory
 - Run `pnpm exec eslint browser_tests/path/to/file.ts` to lint specific files
 - Run `pnpm exec oxlint browser_tests/path/to/file.ts` to check with oxlint
-
-## Skill Documentation
-
-A Playwright test-writing skill exists at `.claude/skills/writing-playwright-tests/SKILL.md`.
-
-The skill documents **meta-level guidance only** (gotchas, anti-patterns, decision guides). It does **not** duplicate fixture APIs - agents should read the fixture code directly in `browser_tests/fixtures/`.

browser_tests/assets/missing/deprecated_nodes_complex.json

@@ -1,205 +0,0 @@
-{
-  "last_node_id": 7,
-  "last_link_id": 5,
-  "nodes": [
-    {
-      "id": 1,
-      "type": "T2IAdapterLoader",
-      "pos": [100, 100],
-      "size": [300, 80],
-      "flags": {},
-      "order": 0,
-      "mode": 0,
-      "inputs": [],
-      "outputs": [
-        {
-          "name": "CONTROL_NET",
-          "type": "CONTROL_NET",
-          "links": [],
-          "slot_index": 0
-        }
-      ],
-      "properties": {
-        "Node name for S&R": "T2IAdapterLoader"
-      },
-      "widgets_values": ["t2iadapter_model.safetensors"]
-    },
-    {
-      "id": 2,
-      "type": "CheckpointLoaderSimple",
-      "pos": [100, 300],
-      "size": [315, 98],
-      "flags": {},
-      "order": 1,
-      "mode": 0,
-      "outputs": [
-        {
-          "name": "MODEL",
-          "type": "MODEL",
-          "links": [],
-          "slot_index": 0
-        },
-        {
-          "name": "CLIP",
-          "type": "CLIP",
-          "links": [],
-          "slot_index": 1
-        },
-        {
-          "name": "VAE",
-          "type": "VAE",
-          "links": [],
-          "slot_index": 2
-        }
-      ],
-      "properties": {
-        "Node name for S&R": "CheckpointLoaderSimple"
-      },
-      "widgets_values": ["v1-5-pruned-emaonly-fp16.safetensors"]
-    },
-    {
-      "id": 3,
-      "type": "ResizeImagesByLongerEdge",
-      "pos": [500, 100],
-      "size": [300, 80],
-      "flags": {},
-      "order": 2,
-      "mode": 0,
-      "inputs": [
-        {
-          "name": "images",
-          "type": "IMAGE",
-          "link": null
-        }
-      ],
-      "outputs": [
-        {
-          "name": "IMAGE",
-          "type": "IMAGE",
-          "links": [1],
-          "slot_index": 0
-        }
-      ],
-      "properties": {
-        "Node name for S&R": "ResizeImagesByLongerEdge"
-      },
-      "widgets_values": [1024]
-    },
-    {
-      "id": 4,
-      "type": "ImageScaleBy",
-      "pos": [500, 280],
-      "size": [300, 80],
-      "flags": {},
-      "order": 3,
-      "mode": 0,
-      "inputs": [
-        {
-          "name": "image",
-          "type": "IMAGE",
-          "link": 1
-        }
-      ],
-      "outputs": [
-        {
-          "name": "IMAGE",
-          "type": "IMAGE",
-          "links": [2, 3],
-          "slot_index": 0
-        }
-      ],
-      "properties": {
-        "Node name for S&R": "ImageScaleBy"
-      },
-      "widgets_values": ["lanczos", 1.5]
-    },
-    {
-      "id": 5,
-      "type": "ImageBatch",
-      "pos": [900, 100],
-      "size": [300, 80],
-      "flags": {},
-      "order": 4,
-      "mode": 0,
-      "inputs": [
-        {
-          "name": "image1",
-          "type": "IMAGE",
-          "link": 2
-        },
-        {
-          "name": "image2",
-          "type": "IMAGE",
-          "link": null
-        }
-      ],
-      "outputs": [
-        {
-          "name": "IMAGE",
-          "type": "IMAGE",
-          "links": [4],
-          "slot_index": 0
-        }
-      ],
-      "properties": {
-        "Node name for S&R": "ImageBatch"
-      },
-      "widgets_values": []
-    },
-    {
-      "id": 6,
-      "type": "SaveImage",
-      "pos": [900, 300],
-      "size": [300, 80],
-      "flags": {},
-      "order": 5,
-      "mode": 0,
-      "inputs": [
-        {
-          "name": "images",
-          "type": "IMAGE",
-          "link": 3
-        }
-      ],
-      "properties": {
-        "Node name for S&R": "SaveImage"
-      },
-      "widgets_values": ["ComfyUI"]
-    },
-    {
-      "id": 7,
-      "type": "PreviewImage",
-      "pos": [1250, 100],
-      "size": [300, 250],
-      "flags": {},
-      "order": 6,
-      "mode": 0,
-      "inputs": [
-        {
-          "name": "images",
-          "type": "IMAGE",
-          "link": 4
-        }
-      ],
-      "properties": {
-        "Node name for S&R": "PreviewImage"
-      },
-      "widgets_values": []
-    }
-  ],
-  "links": [
-    [1, 3, 0, 4, 0, "IMAGE"],
-    [2, 4, 0, 5, 0, "IMAGE"],
-    [3, 4, 0, 6, 0, "IMAGE"],
-    [4, 5, 0, 7, 0, "IMAGE"]
-  ],
-  "groups": [],
-  "config": {},
-  "extra": {
-    "ds": {
-      "scale": 1,
-      "offset": [0, 0]
-    }
-  },
-  "version": 0.4
-}

browser_tests/assets/missing/deprecated_nodes_simple.json

@@ -1,186 +0,0 @@
-{
-  "last_node_id": 5,
-  "last_link_id": 2,
-  "nodes": [
-    {
-      "id": 1,
-      "type": "Load3DAnimation",
-      "pos": [100, 100],
-      "size": [300, 100],
-      "flags": {},
-      "order": 0,
-      "mode": 0,
-      "outputs": [
-        {
-          "name": "MESH",
-          "type": "MESH",
-          "links": [],
-          "slot_index": 0
-        }
-      ],
-      "properties": {
-        "Node name for S&R": "Load3DAnimation"
-      },
-      "widgets_values": ["model.glb"]
-    },
-    {
-      "id": 2,
-      "type": "Preview3DAnimation",
-      "pos": [450, 100],
-      "size": [300, 100],
-      "flags": {},
-      "order": 1,
-      "mode": 0,
-      "inputs": [
-        {
-          "name": "mesh",
-          "type": "MESH",
-          "link": null
-        }
-      ],
-      "properties": {
-        "Node name for S&R": "Preview3DAnimation"
-      },
-      "widgets_values": []
-    },
-    {
-      "id": 3,
-      "type": "ConditioningAverage ",
-      "pos": [100, 300],
-      "size": [300, 100],
-      "flags": {},
-      "order": 2,
-      "mode": 0,
-      "inputs": [
-        {
-          "name": "conditioning_to",
-          "type": "CONDITIONING",
-          "link": null
-        },
-        {
-          "name": "conditioning_from",
-          "type": "CONDITIONING",
-          "link": null
-        }
-      ],
-      "outputs": [
-        {
-          "name": "CONDITIONING",
-          "type": "CONDITIONING",
-          "links": [1],
-          "slot_index": 0
-        }
-      ],
-      "properties": {
-        "Node name for S&R": "ConditioningAverage "
-      },
-      "widgets_values": [1]
-    },
-    {
-      "id": 4,
-      "type": "SDV_img2vid_Conditioning",
-      "pos": [450, 300],
-      "size": [300, 150],
-      "flags": {},
-      "order": 3,
-      "mode": 0,
-      "inputs": [
-        {
-          "name": "clip_vision",
-          "type": "CLIP_VISION",
-          "link": null
-        },
-        {
-          "name": "init_image",
-          "type": "IMAGE",
-          "link": null
-        },
-        {
-          "name": "vae",
-          "type": "VAE",
-          "link": null
-        }
-      ],
-      "outputs": [
-        {
-          "name": "positive",
-          "type": "CONDITIONING",
-          "links": [],
-          "slot_index": 0
-        },
-        {
-          "name": "negative",
-          "type": "CONDITIONING",
-          "links": [],
-          "slot_index": 1
-        },
-        {
-          "name": "latent",
-          "type": "LATENT",
-          "links": [2],
-          "slot_index": 2
-        }
-      ],
-      "properties": {
-        "Node name for S&R": "SDV_img2vid_Conditioning"
-      },
-      "widgets_values": [1024, 576, 14, 127, 25, 0.02]
-    },
-    {
-      "id": 5,
-      "type": "KSampler",
-      "pos": [800, 300],
-      "size": [300, 262],
-      "flags": {},
-      "order": 4,
-      "mode": 0,
-      "inputs": [
-        {
-          "name": "model",
-          "type": "MODEL",
-          "link": null
-        },
-        {
-          "name": "positive",
-          "type": "CONDITIONING",
-          "link": 1
-        },
-        {
-          "name": "negative",
-          "type": "CONDITIONING",
-          "link": null
-        },
-        {
-          "name": "latent_image",
-          "type": "LATENT",
-          "link": 2
-        }
-      ],
-      "outputs": [
-        {
-          "name": "LATENT",
-          "type": "LATENT",
-          "links": [],
-          "slot_index": 0
-        }
-      ],
-      "properties": {
-        "Node name for S&R": "KSampler"
-      },
-      "widgets_values": [42, "fixed", 20, 8, "euler", "normal", 1]
-    }
-  ],
-  "links": [
-    [1, 3, 0, 5, 1, "CONDITIONING"],
-    [2, 4, 2, 5, 3, "LATENT"]
-  ],
-  "groups": [],
-  "config": {},
-  "extra": {
-    "ds": {
-      "scale": 1,
-      "offset": [0, 0]
-    }
-  },
-  "version": 0.4
-}

browser_tests/assets/missing/replaceable_nodes.json

@@ -0,0 +1,59 @@
+{
+  "last_node_id": 3,
+  "last_link_id": 1,
+  "nodes": [
+    {
+      "id": 1,
+      "type": "T2IAdapterLoader",
+      "pos": [100, 100],
+      "size": { "0": 300, "1": 58 },
+      "flags": {},
+      "order": 0,
+      "mode": 0,
+      "inputs": [],
+      "outputs": [
+        {
+          "name": "CONTROL_NET",
+          "type": "CONTROL_NET",
+          "links": null
+        }
+      ],
+      "properties": { "Node name for S&R": "T2IAdapterLoader" },
+      "widgets_values": ["t2iadapter_model.safetensors"]
+    },
+    {
+      "id": 2,
+      "type": "ImageBatch",
+      "pos": [100, 200],
+      "size": { "0": 210, "1": 46 },
+      "flags": {},
+      "order": 1,
+      "mode": 0,
+      "inputs": [
+        { "name": "image1", "type": "IMAGE", "link": null },
+        { "name": "image2", "type": "IMAGE", "link": null }
+      ],
+      "outputs": [{ "name": "IMAGE", "type": "IMAGE", "links": [1] }],
+      "properties": { "Node name for S&R": "ImageBatch" }
+    },
+    {
+      "id": 3,
+      "type": "UNKNOWN_NO_REPLACEMENT",
+      "pos": [100, 300],
+      "size": { "0": 210, "1": 46 },
+      "flags": {},
+      "order": 2,
+      "mode": 0,
+      "inputs": [{ "name": "image", "type": "IMAGE", "link": 1 }],
+      "outputs": [{ "name": "IMAGE", "type": "IMAGE", "links": null }],
+      "properties": { "Node name for S&R": "UNKNOWN_NO_REPLACEMENT" }
+    }
+  ],
+  "links": [[1, 2, 0, 3, 0, "IMAGE"]],
+  "groups": [],
+  "config": {},
+  "extra": {
+    "ds": { "scale": 1, "offset": [0, 0] }
+  },
+  "version": 0.4
+}

browser_tests/assets/subgraphs/subgraph-duplicate-links.json

@@ -1,183 +0,0 @@
-{
-  "id": "a1b2c3d4-e5f6-7890-abcd-ef1234567890",
-  "revision": 0,
-  "last_node_id": 2,
-  "last_link_id": 0,
-  "nodes": [
-    {
-      "id": 2,
-      "type": "e5fb1765-aaaa-bbbb-cccc-ddddeeee0001",
-      "pos": [600, 400],
-      "size": [200, 100],
-      "flags": {},
-      "order": 0,
-      "mode": 0,
-      "inputs": [],
-      "outputs": [
-        {
-          "name": "LATENT",
-          "type": "LATENT",
-          "links": null
-        }
-      ],
-      "properties": {},
-      "widgets_values": []
-    }
-  ],
-  "links": [],
-  "groups": [],
-  "definitions": {
-    "subgraphs": [
-      {
-        "id": "e5fb1765-aaaa-bbbb-cccc-ddddeeee0001",
-        "version": 1,
-        "state": {
-          "lastGroupId": 0,
-          "lastNodeId": 2,
-          "lastLinkId": 5,
-          "lastRerouteId": 0
-        },
-        "revision": 0,
-        "config": {},
-        "name": "Subgraph With Duplicate Links",
-        "inputNode": {
-          "id": -10,
-          "bounding": [200, 400, 120, 60]
-        },
-        "outputNode": {
-          "id": -20,
-          "bounding": [900, 400, 120, 60]
-        },
-        "inputs": [],
-        "outputs": [
-          {
-            "id": "out-latent-1",
-            "name": "LATENT",
-            "type": "LATENT",
-            "linkIds": [2],
-            "pos": [920, 420]
-          }
-        ],
-        "widgets": [],
-        "nodes": [
-          {
-            "id": 1,
-            "type": "KSampler",
-            "pos": [400, 100],
-            "size": [270, 262],
-            "flags": {},
-            "order": 1,
-            "mode": 0,
-            "inputs": [
-              {
-                "name": "model",
-                "type": "MODEL",
-                "link": null
-              },
-              {
-                "name": "positive",
-                "type": "CONDITIONING",
-                "link": null
-              },
-              {
-                "name": "negative",
-                "type": "CONDITIONING",
-                "link": null
-              },
-              {
-                "name": "latent_image",
-                "type": "LATENT",
-                "link": 1
-              }
-            ],
-            "outputs": [
-              {
-                "name": "LATENT",
-                "type": "LATENT",
-                "links": [2]
-              }
-            ],
-            "properties": {
-              "Node name for S&R": "KSampler"
-            },
-            "widgets_values": [0, "randomize", 20, 8, "euler", "simple", 1]
-          },
-          {
-            "id": 2,
-            "type": "EmptyLatentImage",
-            "pos": [100, 200],
-            "size": [200, 106],
-            "flags": {},
-            "order": 0,
-            "mode": 0,
-            "inputs": [],
-            "outputs": [
-              {
-                "name": "LATENT",
-                "type": "LATENT",
-                "links": [1, 3, 4, 5]
-              }
-            ],
-            "properties": {
-              "Node name for S&R": "EmptyLatentImage"
-            },
-            "widgets_values": [512, 512, 1]
-          }
-        ],
-        "groups": [],
-        "links": [
-          {
-            "id": 1,
-            "origin_id": 2,
-            "origin_slot": 0,
-            "target_id": 1,
-            "target_slot": 3,
-            "type": "LATENT"
-          },
-          {
-            "id": 2,
-            "origin_id": 1,
-            "origin_slot": 0,
-            "target_id": -20,
-            "target_slot": 0,
-            "type": "LATENT"
-          },
-          {
-            "id": 3,
-            "origin_id": 2,
-            "origin_slot": 0,
-            "target_id": 1,
-            "target_slot": 3,
-            "type": "LATENT"
-          },
-          {
-            "id": 4,
-            "origin_id": 2,
-            "origin_slot": 0,
-            "target_id": 1,
-            "target_slot": 3,
-            "type": "LATENT"
-          },
-          {
-            "id": 5,
-            "origin_id": 2,
-            "origin_slot": 0,
-            "target_id": 1,
-            "target_slot": 3,
-            "type": "LATENT"
-          }
-        ],
-        "extra": {}
-      }
-    ]
-  },
-  "config": {},
-  "extra": {
-    "ds": {
-      "scale": 1,
-      "offset": [0, 0]
-    },
-    "frontendVersion": "1.38.14"
-  },
-  "version": 0.4
-}

browser_tests/assets/subgraphs/subgraph-nested-duplicate-ids.json

@@ -1,599 +0,0 @@
-{
-  "id": "9a37f747-e96b-4304-9212-7abcaad7bdac",
-  "revision": 0,
-  "last_node_id": 5,
-  "last_link_id": 5,
-  "nodes": [
-    {
-      "id": 5,
-      "type": "1e38d8ea-45e1-48a5-aa20-966584201867",
-      "pos": [788, 433.5],
-      "size": [210, 108],
-      "flags": {},
-      "order": 1,
-      "mode": 0,
-      "inputs": [
-        {
-          "name": "string_a",
-          "type": "STRING",
-          "widget": {
-            "name": "string_a"
-          },
-          "link": 4
-        }
-      ],
-      "outputs": [
-        {
-          "name": "STRING",
-          "type": "STRING",
-          "links": [5]
-        }
-      ],
-      "properties": {
-        "proxyWidgets": [["-1", "string_a"]]
-      },
-      "widgets_values": [""]
-    },
-    {
-      "id": 2,
-      "type": "PreviewAny",
-      "pos": [1135, 429],
-      "size": [250, 145.5],
-      "flags": {},
-      "order": 2,
-      "mode": 0,
-      "inputs": [
-        {
-          "name": "source",
-          "type": "*",
-          "link": 5
-        }
-      ],
-      "outputs": [],
-      "properties": {
-        "Node name for S&R": "PreviewAny"
-      },
-      "widgets_values": [null, null, false]
-    },
-    {
-      "id": 1,
-      "type": "PrimitiveStringMultiline",
-      "pos": [456, 450],
-      "size": [225, 121.5],
-      "flags": {},
-      "order": 0,
-      "mode": 0,
-      "inputs": [],
-      "outputs": [
-        {
-          "name": "STRING",
-          "type": "STRING",
-          "links": [4]
-        }
-      ],
-      "properties": {
-        "Node name for S&R": "PrimitiveStringMultiline"
-      },
-      "widgets_values": ["Outer\n"]
-    }
-  ],
-  "links": [
-    [4, 1, 0, 5, 0, "STRING"],
-    [5, 5, 0, 2, 0, "STRING"]
-  ],
-  "groups": [],
-  "definitions": {
-    "subgraphs": [
-      {
-        "id": "1e38d8ea-45e1-48a5-aa20-966584201867",
-        "version": 1,
-        "state": {
-          "lastGroupId": 0,
-          "lastNodeId": 6,
-          "lastLinkId": 9,
-          "lastRerouteId": 0
-        },
-        "revision": 0,
-        "config": {},
-        "name": "New Subgraph",
-        "inputNode": {
-          "id": -10,
-          "bounding": [351, 432.5, 120, 60]
-        },
-        "outputNode": {
-          "id": -20,
-          "bounding": [1315, 432.5, 120, 60]
-        },
-        "inputs": [
-          {
-            "id": "7bf3e1d4-0521-4b5c-92f5-47ca598b7eb4",
-            "name": "string_a",
-            "type": "STRING",
-            "linkIds": [1],
-            "localized_name": "string_a",
-            "pos": [451, 452.5]
-          }
-        ],
-        "outputs": [
-          {
-            "id": "fbe975ba-d7c2-471e-a99a-a1e2c6ab466d",
-            "name": "STRING",
-            "type": "STRING",
-            "linkIds": [9],
-            "localized_name": "STRING",
-            "pos": [1335, 452.5]
-          }
-        ],
-        "widgets": [],
-        "nodes": [
-          {
-            "id": 3,
-            "type": "StringConcatenate",
-            "pos": [815, 373],
-            "size": [347, 231],
-            "flags": {},
-            "order": 2,
-            "mode": 0,
-            "inputs": [
-              {
-                "localized_name": "string_a",
-                "name": "string_a",
-                "type": "STRING",
-                "widget": {
-                  "name": "string_a"
-                },
-                "link": 1
-              },
-              {
-                "localized_name": "string_b",
-                "name": "string_b",
-                "type": "STRING",
-                "widget": {
-                  "name": "string_b"
-                },
-                "link": 2
-              }
-            ],
-            "outputs": [
-              {
-                "localized_name": "STRING",
-                "name": "STRING",
-                "type": "STRING",
-                "links": [7]
-              }
-            ],
-            "properties": {
-              "Node name for S&R": "StringConcatenate"
-            },
-            "widgets_values": ["", "", ""]
-          },
-          {
-            "id": 6,
-            "type": "9be42452-056b-4c99-9f9f-7381d11c4454",
-            "pos": [955, 775],
-            "size": [210, 88],
-            "flags": {},
-            "order": 1,
-            "mode": 0,
-            "inputs": [
-              {
-                "localized_name": "string_a",
-                "name": "string_a",
-                "type": "STRING",
-                "widget": {
-                  "name": "string_a"
-                },
-                "link": 7
-              }
-            ],
-            "outputs": [
-              {
-                "localized_name": "STRING",
-                "name": "STRING",
-                "type": "STRING",
-                "links": [9]
-              }
-            ],
-            "properties": {
-              "proxyWidgets": [["-1", "string_a"]]
-            },
-            "widgets_values": [""]
-          },
-          {
-            "id": 4,
-            "type": "PrimitiveStringMultiline",
-            "pos": [313, 685],
-            "size": [325, 109],
-            "flags": {},
-            "order": 0,
-            "mode": 0,
-            "inputs": [],
-            "outputs": [
-              {
-                "localized_name": "STRING",
-                "name": "STRING",
-                "type": "STRING",
-                "links": [2]
-              }
-            ],
-            "properties": {
-              "Node name for S&R": "PrimitiveStringMultiline"
-            },
-            "widgets_values": ["Inner 1\n"]
-          }
-        ],
-        "groups": [],
-        "links": [
-          {
-            "id": 2,
-            "origin_id": 4,
-            "origin_slot": 0,
-            "target_id": 3,
-            "target_slot": 1,
-            "type": "STRING"
-          },
-          {
-            "id": 1,
-            "origin_id": -10,
-            "origin_slot": 0,
-            "target_id": 3,
-            "target_slot": 0,
-            "type": "STRING"
-          },
-          {
-            "id": 7,
-            "origin_id": 3,
-            "origin_slot": 0,
-            "target_id": 6,
-            "target_slot": 0,
-            "type": "STRING"
-          },
-          {
-            "id": 6,
-            "origin_id": 6,
-            "origin_slot": 0,
-            "target_id": -20,
-            "target_slot": 1,
-            "type": "STRING"
-          },
-          {
-            "id": 9,
-            "origin_id": 6,
-            "origin_slot": 0,
-            "target_id": -20,
-            "target_slot": 0,
-            "type": "STRING"
-          }
-        ],
-        "extra": {}
-      },
-      {
-        "id": "9be42452-056b-4c99-9f9f-7381d11c4454",
-        "version": 1,
-        "state": {
-          "lastGroupId": 0,
-          "lastNodeId": 9,
-          "lastLinkId": 12,
-          "lastRerouteId": 0
-        },
-        "revision": 0,
-        "config": {},
-        "name": "New Subgraph",
-        "inputNode": {
-          "id": -10,
-          "bounding": [680, 774, 120, 60]
-        },
-        "outputNode": {
-          "id": -20,
-          "bounding": [1320, 774, 120, 60]
-        },
-        "inputs": [
-          {
-            "id": "01c05c51-86b5-4bad-b32f-9c911683a13d",
-            "name": "string_a",
-            "type": "STRING",
-            "linkIds": [4],
-            "localized_name": "string_a",
-            "pos": [780, 794]
-          }
-        ],
-        "outputs": [
-          {
-            "id": "a8bcf3bf-a66a-4c71-8d92-17a2a4d03686",
-            "name": "STRING",
-            "type": "STRING",
-            "linkIds": [12],
-            "localized_name": "STRING",
-            "pos": [1340, 794]
-          }
-        ],
-        "widgets": [],
-        "nodes": [
-          {
-            "id": 5,
-            "type": "StringConcatenate",
-            "pos": [860, 719],
-            "size": [400, 200],
-            "flags": {},
-            "order": 2,
-            "mode": 0,
-            "inputs": [
-              {
-                "localized_name": "string_a",
-                "name": "string_a",
-                "type": "STRING",
-                "widget": {
-                  "name": "string_a"
-                },
-                "link": 4
-              },
-              {
-                "localized_name": "string_b",
-                "name": "string_b",
-                "type": "STRING",
-                "widget": {
-                  "name": "string_b"
-                },
-                "link": 7
-              }
-            ],
-            "outputs": [
-              {
-                "localized_name": "STRING",
-                "name": "STRING",
-                "type": "STRING",
-                "links": [11]
-              }
-            ],
-            "properties": {
-              "Node name for S&R": "StringConcatenate"
-            },
-            "widgets_values": ["", "", ""]
-          },
-          {
-            "id": 6,
-            "type": "PrimitiveStringMultiline",
-            "pos": [401, 973],
-            "size": [400, 200],
-            "flags": {},
-            "order": 0,
-            "mode": 0,
-            "inputs": [],
-            "outputs": [
-              {
-                "localized_name": "STRING",
-                "name": "STRING",
-                "type": "STRING",
-                "links": [7]
-              }
-            ],
-            "properties": {
-              "Node name for S&R": "PrimitiveStringMultiline"
-            },
-            "widgets_values": ["Inner 2\n"]
-          },
-          {
-            "id": 9,
-            "type": "7c2915a5-5eb8-4958-a8fd-4beb30f370ce",
-            "pos": [1046, 985],
-            "size": [210, 88],
-            "flags": {},
-            "order": 1,
-            "mode": 0,
-            "inputs": [
-              {
-                "localized_name": "string_a",
-                "name": "string_a",
-                "type": "STRING",
-                "widget": {
-                  "name": "string_a"
-                },
-                "link": 11
-              }
-            ],
-            "outputs": [
-              {
-                "localized_name": "STRING",
-                "name": "STRING",
-                "type": "STRING",
-                "links": [12]
-              }
-            ],
-            "properties": {
-              "proxyWidgets": [["-1", "string_a"]]
-            },
-            "widgets_values": [""]
-          }
-        ],
-        "groups": [],
-        "links": [
-          {
-            "id": 4,
-            "origin_id": -10,
-            "origin_slot": 0,
-            "target_id": 5,
-            "target_slot": 0,
-            "type": "STRING"
-          },
-          {
-            "id": 7,
-            "origin_id": 6,
-            "origin_slot": 0,
-            "target_id": 5,
-            "target_slot": 1,
-            "type": "STRING"
-          },
-          {
-            "id": 11,
-            "origin_id": 5,
-            "origin_slot": 0,
-            "target_id": 9,
-            "target_slot": 0,
-            "type": "STRING"
-          },
-          {
-            "id": 10,
-            "origin_id": 9,
-            "origin_slot": 0,
-            "target_id": -20,
-            "target_slot": 0,
-            "type": "STRING"
-          },
-          {
-            "id": 12,
-            "origin_id": 9,
-            "origin_slot": 0,
-            "target_id": -20,
-            "target_slot": 0,
-            "type": "STRING"
-          }
-        ],
-        "extra": {}
-      },
-      {
-        "id": "7c2915a5-5eb8-4958-a8fd-4beb30f370ce",
-        "version": 1,
-        "state": {
-          "lastGroupId": 0,
-          "lastNodeId": 8,
-          "lastLinkId": 10,
-          "lastRerouteId": 0
-        },
-        "revision": 0,
-        "config": {},
-        "name": "New Subgraph",
-        "inputNode": {
-          "id": -10,
-          "bounding": [262, 1222, 120, 60]
-        },
-        "outputNode": {
-          "id": -20,
-          "bounding": [1330, 1222, 120, 60]
-        },
-        "inputs": [
-          {
-            "id": "934a8baa-d79c-428c-8ec9-814ad437d7c7",
-            "name": "string_a",
-            "type": "STRING",
-            "linkIds": [9],
-            "localized_name": "string_a",
-            "pos": [362, 1242]
-          }
-        ],
-        "outputs": [
-          {
-            "id": "4c3d243b-9ff6-4dcd-9dbf-e4ec8e1fc879",
-            "name": "STRING",
-            "type": "STRING",
-            "linkIds": [10],
-            "localized_name": "STRING",
-            "pos": [1350, 1242]
-          }
-        ],
-        "widgets": [],
-        "nodes": [
-          {
-            "id": 7,
-            "type": "StringConcatenate",
-            "pos": [870, 1038],
-            "size": [400, 200],
-            "flags": {},
-            "order": 1,
-            "mode": 0,
-            "inputs": [
-              {
-                "localized_name": "string_a",
-                "name": "string_a",
-                "type": "STRING",
-                "widget": {
-                  "name": "string_a"
-                },
-                "link": 9
-              },
-              {
-                "localized_name": "string_b",
-                "name": "string_b",
-                "type": "STRING",
-                "widget": {
-                  "name": "string_b"
-                },
-                "link": 8
-              }
-            ],
-            "outputs": [
-              {
-                "localized_name": "STRING",
-                "name": "STRING",
-                "type": "STRING",
-                "links": [10]
-              }
-            ],
-            "properties": {
-              "Node name for S&R": "StringConcatenate"
-            },
-            "widgets_values": ["", "", ""]
-          },
-          {
-            "id": 8,
-            "type": "PrimitiveStringMultiline",
-            "pos": [442, 1296],
-            "size": [400, 200],
-            "flags": {},
-            "order": 0,
-            "mode": 0,
-            "inputs": [],
-            "outputs": [
-              {
-                "localized_name": "STRING",
-                "name": "STRING",
-                "type": "STRING",
-                "links": [8]
-              }
-            ],
-            "properties": {
-              "Node name for S&R": "PrimitiveStringMultiline"
-            },
-            "widgets_values": ["Inner 3\n"]
-          }
-        ],
-        "groups": [],
-        "links": [
-          {
-            "id": 8,
-            "origin_id": 8,
-            "origin_slot": 0,
-            "target_id": 7,
-            "target_slot": 1,
-            "type": "STRING"
-          },
-          {
-            "id": 9,
-            "origin_id": -10,
-            "origin_slot": 0,
-            "target_id": 7,
-            "target_slot": 0,
-            "type": "STRING"
-          },
-          {
-            "id": 10,
-            "origin_id": 7,
-            "origin_slot": 0,
-            "target_id": -20,
-            "target_slot": 0,
-            "type": "STRING"
-          }
-        ],
-        "extra": {}
-      }
-    ]
-  },
-  "config": {},
-  "extra": {
-    "ds": {
-      "scale": 1,
-      "offset": [-7, 144]
-    },
-    "frontendVersion": "1.38.13"
-  },
-  "version": 0.4
-}

browser_tests/assets/subgraphs/subgraph-nested-promotion.json

@@ -1,760 +0,0 @@
-{
-  "id": "9a37f747-e96b-4304-9212-7abcaad7bdac",
-  "revision": 0,
-  "last_node_id": 11,
-  "last_link_id": 18,
-  "nodes": [
-    {
-      "id": 2,
-      "type": "PreviewAny",
-      "pos": [1031, 434],
-      "size": [250, 178],
-      "flags": {},
-      "order": 2,
-      "mode": 0,
-      "inputs": [
-        {
-          "name": "source",
-          "type": "*",
-          "link": 5
-        }
-      ],
-      "outputs": [],
-      "properties": {
-        "Node name for S&R": "PreviewAny"
-      },
-      "widgets_values": [null, null, null]
-    },
-    {
-      "id": 5,
-      "type": "1e38d8ea-45e1-48a5-aa20-966584201867",
-      "pos": [788, 433.5],
-      "size": [225, 380],
-      "flags": {},
-      "order": 1,
-      "mode": 0,
-      "inputs": [
-        {
-          "name": "string_a",
-          "type": "STRING",
-          "widget": {
-            "name": "string_a"
-          },
-          "link": 4
-        }
-      ],
-      "outputs": [
-        {
-          "name": "STRING",
-          "type": "STRING",
-          "links": [5]
-        }
-      ],
-      "properties": {
-        "proxyWidgets": [
-          ["3", "string_a"],
-          ["4", "value"],
-          ["6", "value"],
-          ["6", "value_1"]
-        ]
-      },
-      "widgets_values": []
-    },
-    {
-      "id": 1,
-      "type": "PrimitiveStringMultiline",
-      "pos": [548, 451],
-      "size": [225, 142],
-      "flags": {},
-      "order": 0,
-      "mode": 0,
-      "inputs": [],
-      "outputs": [
-        {
-          "name": "STRING",
-          "type": "STRING",
-          "links": [4]
-        }
-      ],
-      "title": "Outer",
-      "properties": {
-        "Node name for S&R": "PrimitiveStringMultiline"
-      },
-      "widgets_values": ["Outer\n"]
-    }
-  ],
-  "links": [
-    [4, 1, 0, 5, 0, "STRING"],
-    [5, 5, 0, 2, 0, "STRING"]
-  ],
-  "groups": [],
-  "definitions": {
-    "subgraphs": [
-      {
-        "id": "1e38d8ea-45e1-48a5-aa20-966584201867",
-        "version": 1,
-        "state": {
-          "lastGroupId": 0,
-          "lastNodeId": 11,
-          "lastLinkId": 18,
-          "lastRerouteId": 0
-        },
-        "revision": 0,
-        "config": {},
-        "name": "Sub 0",
-        "inputNode": {
-          "id": -10,
-          "bounding": [351, 432.5, 120, 120]
-        },
-        "outputNode": {
-          "id": -20,
-          "bounding": [1352, 294.5, 120, 60]
-        },
-        "inputs": [
-          {
-            "id": "7bf3e1d4-0521-4b5c-92f5-47ca598b7eb4",
-            "name": "string_a",
-            "type": "STRING",
-            "linkIds": [1],
-            "localized_name": "string_a",
-            "pos": [451, 452.5]
-          },
-          {
-            "id": "5fb3dcf7-9bfd-4b3c-a1b9-750b4f3edf19",
-            "name": "value",
-            "type": "STRING",
-            "linkIds": [13],
-            "pos": [451, 472.5]
-          },
-          {
-            "id": "55d24b8a-7c82-4b02-8e3d-ff31ffb8aa13",
-            "name": "value_1",
-            "type": "STRING",
-            "linkIds": [16],
-            "pos": [451, 492.5]
-          },
-          {
-            "id": "c1fe7cc3-547e-4fb0-b763-61888558d4bd",
-            "name": "value_1_1",
-            "type": "STRING",
-            "linkIds": [18],
-            "pos": [451, 512.5]
-          }
-        ],
-        "outputs": [
-          {
-            "id": "fbe975ba-d7c2-471e-a99a-a1e2c6ab466d",
-            "name": "STRING",
-            "type": "STRING",
-            "linkIds": [9],
-            "localized_name": "STRING",
-            "pos": [1372, 314.5]
-          }
-        ],
-        "widgets": [],
-        "nodes": [
-          {
-            "id": 4,
-            "type": "PrimitiveStringMultiline",
-            "pos": [504, 437],
-            "size": [210, 88],
-            "flags": {},
-            "order": 1,
-            "mode": 0,
-            "inputs": [
-              {
-                "localized_name": "value",
-                "name": "value",
-                "type": "STRING",
-                "widget": {
-                  "name": "value"
-                },
-                "link": 13
-              }
-            ],
-            "outputs": [
-              {
-                "localized_name": "STRING",
-                "name": "STRING",
-                "type": "STRING",
-                "links": [2]
-              }
-            ],
-            "title": "Inner 1",
-            "properties": {
-              "Node name for S&R": "PrimitiveStringMultiline"
-            },
-            "widgets_values": ["Inner 1\n"]
-          },
-          {
-            "id": 3,
-            "type": "StringConcatenate",
-            "pos": [743, 325],
-            "size": [347, 231],
-            "flags": {},
-            "order": 0,
-            "mode": 0,
-            "inputs": [
-              {
-                "localized_name": "string_a",
-                "name": "string_a",
-                "type": "STRING",
-                "widget": {
-                  "name": "string_a"
-                },
-                "link": 1
-              },
-              {
-                "localized_name": "string_b",
-                "name": "string_b",
-                "type": "STRING",
-                "widget": {
-                  "name": "string_b"
-                },
-                "link": 2
-              }
-            ],
-            "outputs": [
-              {
-                "localized_name": "STRING",
-                "name": "STRING",
-                "type": "STRING",
-                "links": [7]
-              }
-            ],
-            "properties": {
-              "Node name for S&R": "StringConcatenate"
-            },
-            "widgets_values": ["", "", ""]
-          },
-          {
-            "id": 6,
-            "type": "9be42452-056b-4c99-9f9f-7381d11c4454",
-            "pos": [1115, 301],
-            "size": [210, 196],
-            "flags": {},
-            "order": 2,
-            "mode": 0,
-            "inputs": [
-              {
-                "localized_name": "string_a",
-                "name": "string_a",
-                "type": "STRING",
-                "widget": {
-                  "name": "string_a"
-                },
-                "link": 7
-              },
-              {
-                "name": "value",
-                "type": "STRING",
-                "widget": {
-                  "name": "value"
-                },
-                "link": 16
-              },
-              {
-                "name": "value_1",
-                "type": "STRING",
-                "widget": {
-                  "name": "value_1"
-                },
-                "link": 18
-              }
-            ],
-            "outputs": [
-              {
-                "localized_name": "STRING",
-                "name": "STRING",
-                "type": "STRING",
-                "links": [9]
-              }
-            ],
-            "properties": {
-              "proxyWidgets": [
-                ["5", "string_a"],
-                ["11", "value"],
-                ["9", "value"],
-                ["10", "string_a"]
-              ]
-            },
-            "widgets_values": []
-          }
-        ],
-        "groups": [],
-        "links": [
-          {
-            "id": 2,
-            "origin_id": 4,
-            "origin_slot": 0,
-            "target_id": 3,
-            "target_slot": 1,
-            "type": "STRING"
-          },
-          {
-            "id": 1,
-            "origin_id": -10,
-            "origin_slot": 0,
-            "target_id": 3,
-            "target_slot": 0,
-            "type": "STRING"
-          },
-          {
-            "id": 7,
-            "origin_id": 3,
-            "origin_slot": 0,
-            "target_id": 6,
-            "target_slot": 0,
-            "type": "STRING"
-          },
-          {
-            "id": 6,
-            "origin_id": 6,
-            "origin_slot": 0,
-            "target_id": -20,
-            "target_slot": 1,
-            "type": "STRING"
-          },
-          {
-            "id": 9,
-            "origin_id": 6,
-            "origin_slot": 0,
-            "target_id": -20,
-            "target_slot": 0,
-            "type": "STRING"
-          },
-          {
-            "id": 13,
-            "origin_id": -10,
-            "origin_slot": 1,
-            "target_id": 4,
-            "target_slot": 0,
-            "type": "STRING"
-          },
-          {
-            "id": 16,
-            "origin_id": -10,
-            "origin_slot": 2,
-            "target_id": 6,
-            "target_slot": 1,
-            "type": "STRING"
-          },
-          {
-            "id": 18,
-            "origin_id": -10,
-            "origin_slot": 3,
-            "target_id": 6,
-            "target_slot": 2,
-            "type": "STRING"
-          }
-        ],
-        "extra": {}
-      },
-      {
-        "id": "9be42452-056b-4c99-9f9f-7381d11c4454",
-        "version": 1,
-        "state": {
-          "lastGroupId": 0,
-          "lastNodeId": 11,
-          "lastLinkId": 18,
-          "lastRerouteId": 0
-        },
-        "revision": 0,
-        "config": {},
-        "name": "Sub 1",
-        "inputNode": {
-          "id": -10,
-          "bounding": [180, 739, 120, 100]
-        },
-        "outputNode": {
-          "id": -20,
-          "bounding": [1246, 612, 120, 60]
-        },
-        "inputs": [
-          {
-            "id": "01c05c51-86b5-4bad-b32f-9c911683a13d",
-            "name": "string_a",
-            "type": "STRING",
-            "linkIds": [4],
-            "localized_name": "string_a",
-            "pos": [280, 759]
-          },
-          {
-            "id": "d50f6a62-0185-43d4-a174-a8a94bd8f6e7",
-            "name": "value",
-            "type": "STRING",
-            "linkIds": [14],
-            "pos": [280, 779]
-          },
-          {
-            "id": "6b78450e-5986-49cd-b743-c933e5a34a69",
-            "name": "value_1",
-            "type": "STRING",
-            "linkIds": [17],
-            "pos": [280, 799]
-          }
-        ],
-        "outputs": [
-          {
-            "id": "a8bcf3bf-a66a-4c71-8d92-17a2a4d03686",
-            "name": "STRING",
-            "type": "STRING",
-            "linkIds": [12],
-            "localized_name": "STRING",
-            "pos": [1266, 632]
-          }
-        ],
-        "widgets": [],
-        "nodes": [
-          {
-            "id": 11,
-            "type": "PrimitiveStringMultiline",
-            "pos": [334, 742],
-            "size": [210, 88],
-            "flags": {},
-            "order": 2,
-            "mode": 0,
-            "inputs": [
-              {
-                "localized_name": "value",
-                "name": "value",
-                "type": "STRING",
-                "widget": {
-                  "name": "value"
-                },
-                "link": 14
-              }
-            ],
-            "outputs": [
-              {
-                "localized_name": "STRING",
-                "name": "STRING",
-                "type": "STRING",
-                "links": [7]
-              }
-            ],
-            "title": "Inner 2",
-            "properties": {
-              "Node name for S&R": "PrimitiveStringMultiline"
-            },
-            "widgets_values": ["Inner 2\n"]
-          },
-          {
-            "id": 10,
-            "type": "StringConcatenate",
-            "pos": [581, 637],
-            "size": [400, 200],
-            "flags": {},
-            "order": 1,
-            "mode": 0,
-            "inputs": [
-              {
-                "localized_name": "string_a",
-                "name": "string_a",
-                "type": "STRING",
-                "widget": {
-                  "name": "string_a"
-                },
-                "link": 4
-              },
-              {
-                "localized_name": "string_b",
-                "name": "string_b",
-                "type": "STRING",
-                "widget": {
-                  "name": "string_b"
-                },
-                "link": 7
-              }
-            ],
-            "outputs": [
-              {
-                "localized_name": "STRING",
-                "name": "STRING",
-                "type": "STRING",
-                "links": [11]
-              }
-            ],
-            "properties": {
-              "Node name for S&R": "StringConcatenate"
-            },
-            "widgets_values": ["", "", ""]
-          },
-          {
-            "id": 9,
-            "type": "7c2915a5-5eb8-4958-a8fd-4beb30f370ce",
-            "pos": [1004, 613],
-            "size": [210, 142],
-            "flags": {},
-            "order": 0,
-            "mode": 0,
-            "inputs": [
-              {
-                "localized_name": "string_a",
-                "name": "string_a",
-                "type": "STRING",
-                "widget": {
-                  "name": "string_a"
-                },
-                "link": 11
-              },
-              {
-                "name": "value",
-                "type": "STRING",
-                "widget": {
-                  "name": "value"
-                },
-                "link": 17
-              }
-            ],
-            "outputs": [
-              {
-                "localized_name": "STRING",
-                "name": "STRING",
-                "type": "STRING",
-                "links": [12]
-              }
-            ],
-            "properties": {
-              "proxyWidgets": [
-                ["7", "string_a"],
-                ["8", "value"]
-              ]
-            },
-            "widgets_values": []
-          }
-        ],
-        "groups": [],
-        "links": [
-          {
-            "id": 4,
-            "origin_id": -10,
-            "origin_slot": 0,
-            "target_id": 10,
-            "target_slot": 0,
-            "type": "STRING"
-          },
-          {
-            "id": 7,
-            "origin_id": 11,
-            "origin_slot": 0,
-            "target_id": 10,
-            "target_slot": 1,
-            "type": "STRING"
-          },
-          {
-            "id": 11,
-            "origin_id": 10,
-            "origin_slot": 0,
-            "target_id": 9,
-            "target_slot": 0,
-            "type": "STRING"
-          },
-          {
-            "id": 10,
-            "origin_id": 9,
-            "origin_slot": 0,
-            "target_id": -20,
-            "target_slot": 0,
-            "type": "STRING"
-          },
-          {
-            "id": 12,
-            "origin_id": 9,
-            "origin_slot": 0,
-            "target_id": -20,
-            "target_slot": 0,
-            "type": "STRING"
-          },
-          {
-            "id": 14,
-            "origin_id": -10,
-            "origin_slot": 1,
-            "target_id": 11,
-            "target_slot": 0,
-            "type": "STRING"
-          },
-          {
-            "id": 17,
-            "origin_id": -10,
-            "origin_slot": 2,
-            "target_id": 9,
-            "target_slot": 1,
-            "type": "STRING"
-          }
-        ],
-        "extra": {}
-      },
-      {
-        "id": "7c2915a5-5eb8-4958-a8fd-4beb30f370ce",
-        "version": 1,
-        "state": {
-          "lastGroupId": 0,
-          "lastNodeId": 11,
-          "lastLinkId": 18,
-          "lastRerouteId": 0
-        },
-        "revision": 0,
-        "config": {},
-        "name": "Sub 2",
-        "inputNode": {
-          "id": -10,
-          "bounding": [262, 1222, 120, 80]
-        },
-        "outputNode": {
-          "id": -20,
-          "bounding": [1123.089999999999, 1125.1999999999998, 120, 60]
-        },
-        "inputs": [
-          {
-            "id": "934a8baa-d79c-428c-8ec9-814ad437d7c7",
-            "name": "string_a",
-            "type": "STRING",
-            "linkIds": [9],
-            "localized_name": "string_a",
-            "pos": [362, 1242]
-          },
-          {
-            "id": "3a545207-7202-42a9-a82f-3b62e1b0f459",
-            "name": "value",
-            "type": "STRING",
-            "linkIds": [15],
-            "pos": [362, 1262]
-          }
-        ],
-        "outputs": [
-          {
-            "id": "4c3d243b-9ff6-4dcd-9dbf-e4ec8e1fc879",
-            "name": "STRING",
-            "type": "STRING",
-            "linkIds": [10],
-            "localized_name": "STRING",
-            "pos": [1143.089999999999, 1145.1999999999998]
-          }
-        ],
-        "widgets": [],
-        "nodes": [
-          {
-            "id": 8,
-            "type": "PrimitiveStringMultiline",
-            "pos": [412.96000000000004, 1228.2399999999996],
-            "size": [210, 88],
-            "flags": {},
-            "order": 1,
-            "mode": 0,
-            "inputs": [
-              {
-                "localized_name": "value",
-                "name": "value",
-                "type": "STRING",
-                "widget": {
-                  "name": "value"
-                },
-                "link": 15
-              }
-            ],
-            "outputs": [
-              {
-                "localized_name": "STRING",
-                "name": "STRING",
-                "type": "STRING",
-                "links": [8]
-              }
-            ],
-            "title": "Inner 3",
-            "properties": {
-              "Node name for S&R": "PrimitiveStringMultiline"
-            },
-            "widgets_values": ["Inner 3\n"]
-          },
-          {
-            "id": 7,
-            "type": "StringConcatenate",
-            "pos": [686.08, 1132.38],
-            "size": [400, 200],
-            "flags": {},
-            "order": 0,
-            "mode": 0,
-            "inputs": [
-              {
-                "localized_name": "string_a",
-                "name": "string_a",
-                "type": "STRING",
-                "widget": {
-                  "name": "string_a"
-                },
-                "link": 9
-              },
-              {
-                "localized_name": "string_b",
-                "name": "string_b",
-                "type": "STRING",
-                "widget": {
-                  "name": "string_b"
-                },
-                "link": 8
-              }
-            ],
-            "outputs": [
-              {
-                "localized_name": "STRING",
-                "name": "STRING",
-                "type": "STRING",
-                "links": [10]
-              }
-            ],
-            "properties": {
-              "Node name for S&R": "StringConcatenate"
-            },
-            "widgets_values": ["", "", ""]
-          }
-        ],
-        "groups": [],
-        "links": [
-          {
-            "id": 8,
-            "origin_id": 8,
-            "origin_slot": 0,
-            "target_id": 7,
-            "target_slot": 1,
-            "type": "STRING"
-          },
-          {
-            "id": 9,
-            "origin_id": -10,
-            "origin_slot": 0,
-            "target_id": 7,
-            "target_slot": 0,
-            "type": "STRING"
-          },
-          {
-            "id": 10,
-            "origin_id": 7,
-            "origin_slot": 0,
-            "target_id": -20,
-            "target_slot": 0,
-            "type": "STRING"
-          },
-          {
-            "id": 15,
-            "origin_id": -10,
-            "origin_slot": 1,
-            "target_id": 8,
-            "target_slot": 0,
-            "type": "STRING"
-          }
-        ],
-        "extra": {}
-      }
-    ]
-  },
-  "config": {},
-  "extra": {
-    "ds": {
-      "scale": 1,
-      "offset": [-412, 11]
-    },
-    "frontendVersion": "1.41.7"
-  },
-  "version": 0.4
-}

browser_tests/assets/widgets/save_image_and_animated_webp.json

@@ -1,86 +0,0 @@
-{
-  "id": "save-image-and-webm-test",
-  "revision": 0,
-  "last_node_id": 12,
-  "last_link_id": 2,
-  "nodes": [
-    {
-      "id": 10,
-      "type": "LoadImage",
-      "pos": [50, 100],
-      "size": [315, 314],
-      "flags": {},
-      "order": 0,
-      "mode": 0,
-      "inputs": [],
-      "outputs": [
-        {
-          "name": "IMAGE",
-          "type": "IMAGE",
-          "links": [1, 2]
-        },
-        {
-          "name": "MASK",
-          "type": "MASK",
-          "links": null
-        }
-      ],
-      "properties": {
-        "Node name for S&R": "LoadImage"
-      },
-      "widgets_values": ["example.png", "image"]
-    },
-    {
-      "id": 11,
-      "type": "SaveImage",
-      "pos": [450, 100],
-      "size": [210, 270],
-      "flags": {},
-      "order": 1,
-      "mode": 0,
-      "inputs": [
-        {
-          "name": "images",
-          "type": "IMAGE",
-          "link": 1
-        }
-      ],
-      "outputs": [],
-      "properties": {},
-      "widgets_values": ["ComfyUI"]
-    },
-    {
-      "id": 12,
-      "type": "SaveWEBM",
-      "pos": [450, 450],
-      "size": [210, 368],
-      "flags": {},
-      "order": 2,
-      "mode": 0,
-      "inputs": [
-        {
-          "name": "images",
-          "type": "IMAGE",
-          "link": 2
-        }
-      ],
-      "outputs": [],
-      "properties": {},
-      "widgets_values": ["ComfyUI", "vp9", 6, 32]
-    }
-  ],
-  "links": [
-    [1, 10, 0, 11, 0, "IMAGE"],
-    [2, 10, 0, 12, 0, "IMAGE"]
-  ],
-  "groups": [],
-  "config": {},
-  "extra": {
-    "frontendVersion": "1.17.0",
-    "ds": {
-      "offset": [0, 0],
-      "scale": 1
-    }
-  },
-  "version": 0.4
-}

browser_tests/fixtures/ComfyPage.ts

@@ -14,7 +14,6 @@ import { ComfyTemplates } from '../helpers/templates'
 import { ComfyMouse } from './ComfyMouse'
 import { VueNodeHelpers } from './VueNodeHelpers'
 import { ComfyNodeSearchBox } from './components/ComfyNodeSearchBox'
-import { ComfyNodeSearchBoxV2 } from './components/ComfyNodeSearchBoxV2'
 import { ContextMenu } from './components/ContextMenu'
 import { SettingDialog } from './components/SettingDialog'
 import { BottomPanel } from './components/BottomPanel'
@@ -167,7 +166,6 @@ export class ComfyPage {
 
   // Components
   public readonly searchBox: ComfyNodeSearchBox
-  public readonly searchBoxV2: ComfyNodeSearchBoxV2
   public readonly menu: ComfyMenu
   public readonly actionbar: ComfyActionbar
   public readonly templates: ComfyTemplates
@@ -206,11 +204,12 @@ export class ComfyPage {
     this.widgetTextBox = page.getByPlaceholder('text').nth(1)
     this.resetViewButton = page.getByRole('button', { name: 'Reset View' })
     this.queueButton = page.getByRole('button', { name: 'Queue Prompt' })
-    this.runButton = page.getByTestId(TestIds.topbar.queueButton)
+    this.runButton = page
+      .getByTestId(TestIds.topbar.queueButton)
+      .getByRole('button', { name: 'Run' })
     this.workflowUploadInput = page.locator('#comfy-file-input')
 
     this.searchBox = new ComfyNodeSearchBox(page)
-    this.searchBoxV2 = new ComfyNodeSearchBoxV2(page)
     this.menu = new ComfyMenu(page)
     this.actionbar = new ComfyActionbar(page)
     this.templates = new ComfyTemplates(page)

browser_tests/fixtures/components/ComfyNodeSearchBoxV2.ts

@@ -1,29 +0,0 @@
-import type { Locator, Page } from '@playwright/test'
-
-import type { ComfyPage } from '../ComfyPage'
-
-export class ComfyNodeSearchBoxV2 {
-  readonly dialog: Locator
-  readonly input: Locator
-  readonly results: Locator
-  readonly filterOptions: Locator
-
-  constructor(readonly page: Page) {
-    this.dialog = page.getByRole('search')
-    this.input = this.dialog.locator('input[type="text"]')
-    this.results = this.dialog.getByTestId('result-item')
-    this.filterOptions = this.dialog.getByTestId('filter-option')
-  }
-
-  categoryButton(categoryId: string): Locator {
-    return this.dialog.getByTestId(`category-${categoryId}`)
-  }
-
-  filterBarButton(name: string): Locator {
-    return this.dialog.getByRole('button', { name })
-  }
-
-  async reload(comfyPage: ComfyPage) {
-    await comfyPage.settings.setSetting('Comfy.NodeSearchBoxImpl', 'default')
-  }
-}

browser_tests/fixtures/components/SettingDialog.ts

@@ -23,7 +23,9 @@ export class SettingDialog extends BaseDialog {
    * @param value - The value to set
    */
   async setStringSetting(id: string, value: string) {
-    const settingInputDiv = this.root.locator(`div[id="${id}"]`)
+    const settingInputDiv = this.page.locator(
+      `div.settings-container div[id="${id}"]`
+    )
     await settingInputDiv.locator('input').fill(value)
   }
 
@@ -32,31 +34,16 @@ export class SettingDialog extends BaseDialog {
    * @param id - The id of the setting
    */
   async toggleBooleanSetting(id: string) {
-    const settingInputDiv = this.root.locator(`div[id="${id}"]`)
+    const settingInputDiv = this.page.locator(
+      `div.settings-container div[id="${id}"]`
+    )
     await settingInputDiv.locator('input').click()
   }
 
-  get searchBox() {
-    return this.root.getByPlaceholder(/Search/)
-  }
-
-  get categories() {
-    return this.root.locator('nav').getByRole('button')
-  }
-
-  category(name: string) {
-    return this.root.locator('nav').getByRole('button', { name })
-  }
-
-  get contentArea() {
-    return this.root.getByRole('main')
-  }
-
   async goToAboutPanel() {
-    const aboutButton = this.root.locator('nav').getByRole('button', {
-      name: 'About'
-    })
-    await aboutButton.click()
-    await this.page.waitForSelector('.about-container')
+    await this.page.getByTestId(TestIds.dialogs.settingsTabAbout).click()
+    await this.page
+      .getByTestId(TestIds.dialogs.about)
+      .waitFor({ state: 'visible' })
   }
 }

browser_tests/fixtures/selectors.ts

@@ -32,7 +32,6 @@ export const TestIds = {
   },
   topbar: {
     queueButton: 'queue-button',
-    queueModeMenuTrigger: 'queue-mode-menu-trigger',
     saveButton: 'save-workflow-button'
   },
   nodeLibrary: {

browser_tests/fixtures/ws.ts

@@ -1,9 +1,5 @@
 import { test as base } from '@playwright/test'
 
-interface TestWindow extends Window {
-  __ws__?: Record<string, WebSocket>
-}
-
 export const webSocketFixture = base.extend<{
   ws: { trigger(data: unknown, url?: string): Promise<void> }
 }>({

browser_tests/helpers/actionbar.ts

@@ -29,10 +29,8 @@ class ComfyQueueButton {
   public readonly dropdownButton: Locator
   constructor(public readonly actionbar: ComfyActionbar) {
     this.root = actionbar.root.getByTestId(TestIds.topbar.queueButton)
-    this.primaryButton = this.root
-    this.dropdownButton = actionbar.root.getByTestId(
-      TestIds.topbar.queueModeMenuTrigger
-    )
+    this.primaryButton = this.root.locator('.p-splitbutton-button')
+    this.dropdownButton = this.root.locator('.p-splitbutton-dropdown')
   }
 
   public async toggleOptions() {

browser_tests/tests/bottomPanelShortcuts.spec.ts

@@ -226,7 +226,9 @@ test.describe('Bottom Panel Shortcuts', { tag: '@ui' }, () => {
     await expect(bottomPanel.shortcuts.manageButton).toBeVisible()
     await bottomPanel.shortcuts.manageButton.click()
 
-    await expect(comfyPage.settingDialog.root).toBeVisible()
-    await expect(comfyPage.settingDialog.category('Keybinding')).toBeVisible()
+    await expect(comfyPage.page.getByRole('dialog')).toBeVisible()
+    await expect(
+      comfyPage.page.getByRole('option', { name: 'Keybinding' })
+    ).toBeVisible()
   })
 })

browser_tests/tests/colorPalette.spec.ts

@@ -244,9 +244,21 @@ test.describe(
       await comfyPage.settings.setSetting('Comfy.Node.Opacity', 0.5)
       await comfyPage.settings.setSetting('Comfy.ColorPalette', 'light')
       await comfyPage.nextFrame()
-      const parsed = await comfyPage.page.evaluate(() => {
-        return window['app'].graph.serialize()
-      })
+      const parsed = await (
+        await comfyPage.page.waitForFunction(
+          () => {
+            const workflow = localStorage.getItem('workflow')
+            if (!workflow) return null
+            try {
+              const data = JSON.parse(workflow)
+              return Array.isArray(data?.nodes) ? data : null
+            } catch {
+              return null
+            }
+          },
+          { timeout: 3000 }
+        )
+      ).jsonValue()
       expect(parsed.nodes).toBeDefined()
       expect(Array.isArray(parsed.nodes)).toBe(true)
       for (const node of parsed.nodes) {

browser_tests/tests/confirmDialogTextWrap.spec.ts

@@ -1,32 +0,0 @@
-import { expect } from '@playwright/test'
-
-import { comfyPageFixture as test } from '../fixtures/ComfyPage'
-
-test.describe('Confirm dialog text wrapping', { tag: ['@mobile'] }, () => {
-  test('@mobile confirm dialog buttons are visible with long unbreakable text', async ({
-    comfyPage
-  }) => {
-    const longFilename = 'workflow_checkpoint_' + 'a'.repeat(200) + '.json'
-
-    await comfyPage.page.evaluate((msg) => {
-      window
-        .app!.extensionManager.dialog.confirm({
-          title: 'Confirm',
-          type: 'default',
-          message: msg
-        })
-        .catch(() => {})
-    }, longFilename)
-
-    const dialog = comfyPage.page.getByRole('dialog')
-    await expect(dialog).toBeVisible()
-
-    const confirmButton = dialog.getByRole('button', { name: 'Confirm' })
-    await expect(confirmButton).toBeVisible()
-    await expect(confirmButton).toBeInViewport()
-
-    const cancelButton = dialog.getByRole('button', { name: 'Cancel' })
-    await expect(cancelButton).toBeVisible()
-    await expect(cancelButton).toBeInViewport()
-  })
-})

browser_tests/tests/dialog.spec.ts

@@ -34,10 +34,37 @@ test.describe('Load workflow warning', { tag: '@ui' }, () => {
     expect(warningText).toContain('MISSING_NODE_TYPE_IN_SUBGRAPH')
     expect(warningText).toContain('in subgraph')
   })
+
+  test('Should show replacement UI for replaceable missing nodes', async ({
+    comfyPage
+  }) => {
+    await comfyPage.settings.setSetting('Comfy.NodeReplacement.Enabled', true)
+    await comfyPage.workflow.loadWorkflow('missing/replaceable_nodes')
+
+    const missingNodesWarning = comfyPage.page.locator('.comfy-missing-nodes')
+    await expect(missingNodesWarning).toBeVisible()
+
+    // Verify "Replaceable" badges appear for nodes with replacements
+    const replaceableBadges = missingNodesWarning.getByText('Replaceable')
+    await expect(replaceableBadges.first()).toBeVisible()
+    expect(await replaceableBadges.count()).toBeGreaterThanOrEqual(2)
+
+    // Verify individual "Replace" buttons appear
+    const replaceButtons = missingNodesWarning.getByRole('button', {
+      name: 'Replace'
+    })
+    expect(await replaceButtons.count()).toBeGreaterThanOrEqual(2)
+
+    // Verify "Replace All" button appears in footer
+    const replaceAllButton = comfyPage.page.getByRole('button', {
+      name: 'Replace All'
+    })
+    await expect(replaceAllButton).toBeVisible()
+  })
 })
 
 test('Does not report warning on undo/redo', async ({ comfyPage }) => {
-  await comfyPage.settings.setSetting('Comfy.NodeSearchBoxImpl', 'v1 (legacy)')
+  await comfyPage.settings.setSetting('Comfy.NodeSearchBoxImpl', 'default')
 
   await comfyPage.workflow.loadWorkflow('missing/missing_nodes')
   await comfyPage.page
@@ -61,21 +88,16 @@ test('Does not report warning on undo/redo', async ({ comfyPage }) => {
 })
 
 test.describe('Execution error', () => {
-  test.beforeEach(async ({ comfyPage }) => {
-    await comfyPage.settings.setSetting('Comfy.UseNewMenu', 'Top')
-    await comfyPage.setup()
-  })
-
   test('Should display an error message when an execution error occurs', async ({
     comfyPage
   }) => {
     await comfyPage.workflow.loadWorkflow('nodes/execution_error')
-    await comfyPage.command.executeCommand('Comfy.QueuePrompt')
+    await comfyPage.queueButton.click()
     await comfyPage.nextFrame()
 
-    // Wait for the error overlay to be visible
-    const errorOverlay = comfyPage.page.locator('[data-testid="error-overlay"]')
-    await expect(errorOverlay).toBeVisible()
+    // Wait for the element with the .comfy-execution-error selector to be visible
+    const executionError = comfyPage.page.locator('.comfy-error-report')
+    await expect(executionError).toBeVisible()
   })
 })
 
@@ -249,13 +271,9 @@ test.describe('Missing models warning', () => {
 test.describe('Settings', () => {
   test('@mobile Should be visible on mobile', async ({ comfyPage }) => {
     await comfyPage.page.keyboard.press('Control+,')
-    const settingsDialog = comfyPage.page.locator(
-      '[data-testid="settings-dialog"]'
-    )
-    await expect(settingsDialog).toBeVisible()
-    const contentArea = settingsDialog.locator('main')
-    await expect(contentArea).toBeVisible()
-    const isUsableHeight = await contentArea.evaluate(
+    const settingsContent = comfyPage.page.locator('.settings-content')
+    await expect(settingsContent).toBeVisible()
+    const isUsableHeight = await settingsContent.evaluate(
       (el) => el.clientHeight > 30
     )
     expect(isUsableHeight).toBeTruthy()
@@ -265,9 +283,7 @@ test.describe('Settings', () => {
     await comfyPage.page.keyboard.down('ControlOrMeta')
     await comfyPage.page.keyboard.press(',')
     await comfyPage.page.keyboard.up('ControlOrMeta')
-    const settingsLocator = comfyPage.page.locator(
-      '[data-testid="settings-dialog"]'
-    )
+    const settingsLocator = comfyPage.page.locator('.settings-container')
     await expect(settingsLocator).toBeVisible()
     await comfyPage.page.keyboard.press('Escape')
     await expect(settingsLocator).not.toBeVisible()
@@ -286,15 +302,10 @@ test.describe('Settings', () => {
   test('Should persist keybinding setting', async ({ comfyPage }) => {
     // Open the settings dialog
     await comfyPage.page.keyboard.press('Control+,')
-    await comfyPage.page.waitForSelector('[data-testid="settings-dialog"]')
+    await comfyPage.page.waitForSelector('.settings-container')
 
     // Open the keybinding tab
-    const settingsDialog = comfyPage.page.locator(
-      '[data-testid="settings-dialog"]'
-    )
-    await settingsDialog
-      .locator('nav [role="button"]', { hasText: 'Keybinding' })
-      .click()
+    await comfyPage.page.getByLabel('Keybinding').click()
     await comfyPage.page.waitForSelector(
       '[placeholder="Search Keybindings..."]'
     )
@@ -314,10 +325,7 @@ test.describe('Settings', () => {
     await input.press('Alt+n')
 
     const requestPromise = comfyPage.page.waitForRequest(
-      (req) =>
-        req.url().includes('/api/settings') &&
-        !req.url().includes('/api/settings/') &&
-        req.method() === 'POST'
+      '**/api/settings/Comfy.Keybinding.NewBindings'
     )
 
     // Save keybinding
@@ -345,23 +353,17 @@ test.describe('Support', () => {
     comfyPage
   }) => {
     await comfyPage.settings.setSetting('Comfy.UseNewMenu', 'Top')
-
-    // Prevent loading the external page
-    await comfyPage.page
-      .context()
-      .route('https://support.comfy.org/**', (route) =>
-        route.fulfill({ body: '<html></html>', contentType: 'text/html' })
-      )
-
-    const popupPromise = comfyPage.page.waitForEvent('popup')
+    const pagePromise = comfyPage.page.context().waitForEvent('page')
     await comfyPage.menu.topbar.triggerTopbarCommand(['Help', 'Support'])
-    const popup = await popupPromise
+    const newPage = await pagePromise
 
-    const url = new URL(popup.url())
-    expect(url.hostname).toBe('support.comfy.org')
+    await newPage.waitForLoadState('networkidle')
+    await expect(newPage).toHaveURL(/.*support\.comfy\.org.*/)
+
+    const url = new URL(newPage.url())
     expect(url.searchParams.get('tf_42243568391700')).toBe('oss')
 
-    await popup.close()
+    await newPage.close()
   })
 })
 

browser_tests/tests/execution.spec.ts

@@ -7,29 +7,22 @@ test.beforeEach(async ({ comfyPage }) => {
 })
 
 test.describe('Execution', { tag: ['@smoke', '@workflow'] }, () => {
-  test.beforeEach(async ({ comfyPage }) => {
-    await comfyPage.settings.setSetting('Comfy.UseNewMenu', 'Top')
-    await comfyPage.setup()
-  })
-
   test(
     'Report error on unconnected slot',
     { tag: '@screenshot' },
     async ({ comfyPage }) => {
       await comfyPage.canvasOps.disconnectEdge()
-      await comfyPage.page.keyboard.press('Escape')
+      await comfyPage.canvasOps.clickEmptySpace()
 
       await comfyPage.command.executeCommand('Comfy.QueuePrompt')
-      await expect(
-        comfyPage.page.locator('[data-testid="error-overlay"]')
-      ).toBeVisible()
+      await expect(comfyPage.page.locator('.comfy-error-report')).toBeVisible()
       await comfyPage.page
-        .locator('[data-testid="error-overlay"]')
-        .getByRole('button', { name: 'Dismiss' })
+        .locator('.p-dialog')
+        .getByRole('button', { name: 'Close' })
         .click()
-      await comfyPage.page
-        .locator('[data-testid="error-overlay"]')
-        .waitFor({ state: 'hidden' })
+      await comfyPage.page.locator('.comfy-error-report').waitFor({
+        state: 'hidden'
+      })
       await expect(comfyPage.canvas).toHaveScreenshot(
         'execution-error-unconnected-slot.png'
       )

browser_tests/tests/featureFlags.spec.ts

@@ -37,9 +37,12 @@ test.describe('Feature Flags', { tag: ['@slow', '@settings'] }, () => {
 
       // Monitor for server feature flags
       const checkInterval = setInterval(() => {
-        const flags = window.app?.api?.serverFeatureFlags?.value
-        if (flags && Object.keys(flags).length > 0) {
-          window.__capturedMessages!.serverFeatureFlags = flags
+        if (
+          window.app?.api?.serverFeatureFlags &&
+          Object.keys(window.app.api.serverFeatureFlags).length > 0
+        ) {
+          window.__capturedMessages!.serverFeatureFlags =
+            window.app.api.serverFeatureFlags
           clearInterval(checkInterval)
         }
       }, 100)
@@ -93,7 +96,7 @@ test.describe('Feature Flags', { tag: ['@slow', '@settings'] }, () => {
   }) => {
     // Get the actual server feature flags from the backend
     const serverFlags = await comfyPage.page.evaluate(() => {
-      return window.app!.api.serverFeatureFlags.value
+      return window.app!.api.serverFeatureFlags
     })
 
     // Verify we received real feature flags from the backend
@@ -126,8 +129,8 @@ test.describe('Feature Flags', { tag: ['@slow', '@settings'] }, () => {
     // Test that the method only returns true for boolean true values
     const testResults = await comfyPage.page.evaluate(() => {
       // Temporarily modify serverFeatureFlags to test behavior
-      const original = window.app!.api.serverFeatureFlags.value
-      window.app!.api.serverFeatureFlags.value = {
+      const original = window.app!.api.serverFeatureFlags
+      window.app!.api.serverFeatureFlags = {
         bool_true: true,
         bool_false: false,
         string_value: 'yes',
@@ -144,7 +147,7 @@ test.describe('Feature Flags', { tag: ['@slow', '@settings'] }, () => {
       }
 
       // Restore original
-      window.app!.api.serverFeatureFlags.value = original
+      window.app!.api.serverFeatureFlags = original
       return results
     })
 
@@ -279,8 +282,8 @@ test.describe('Feature Flags', { tag: ['@slow', '@settings'] }, () => {
       // Monitor when feature flags arrive by checking periodically
       const checkFeatureFlags = setInterval(() => {
         if (
-          window.app?.api?.serverFeatureFlags?.value
-            ?.supports_preview_metadata !== undefined
+          window.app?.api?.serverFeatureFlags?.supports_preview_metadata !==
+          undefined
         ) {
           window.__appReadiness!.featureFlagsReceived = true
           clearInterval(checkFeatureFlags)
@@ -317,8 +320,8 @@ test.describe('Feature Flags', { tag: ['@slow', '@settings'] }, () => {
     // Wait for feature flags to be received
     await newPage.waitForFunction(
       () =>
-        window.app?.api?.serverFeatureFlags?.value
-          ?.supports_preview_metadata !== undefined,
+        window.app?.api?.serverFeatureFlags?.supports_preview_metadata !==
+        undefined,
       {
         timeout: 10000
       }
@@ -328,7 +331,7 @@ test.describe('Feature Flags', { tag: ['@slow', '@settings'] }, () => {
     const readiness = await newPage.evaluate(() => {
       return {
         ...window.__appReadiness,
-        currentFlags: window.app!.api.serverFeatureFlags.value
+        currentFlags: window.app!.api.serverFeatureFlags
       }
     })
 

browser_tests/tests/groupNode.spec.ts

@@ -10,8 +10,6 @@ import type { NodeReference } from '../fixtures/utils/litegraphUtils'
 
 test.beforeEach(async ({ comfyPage }) => {
   await comfyPage.settings.setSetting('Comfy.UseNewMenu', 'Disabled')
-  await comfyPage.settings.setSetting('Comfy.NodeLibrary.NewDesign', false)
-  await comfyPage.settings.setSetting('Comfy.NodeSearchBoxImpl', 'v1 (legacy)')
 })
 
 test.describe('Group Node', { tag: '@node' }, () => {

browser_tests/tests/interaction.spec.ts

@@ -13,9 +13,6 @@ import type { NodeReference } from '../fixtures/utils/litegraphUtils'
 
 test.beforeEach(async ({ comfyPage }) => {
   await comfyPage.settings.setSetting('Comfy.UseNewMenu', 'Disabled')
-  // Wait for the legacy menu to appear and canvas to settle after layout shift.
-  await comfyPage.page.locator('.comfy-menu').waitFor({ state: 'visible' })
-  await comfyPage.nextFrame()
 })
 
 test.describe('Item Interaction', { tag: ['@screenshot', '@node'] }, () => {
@@ -171,7 +168,6 @@ test.describe('Node Interaction', () => {
 
   test('Can drag node', { tag: '@screenshot' }, async ({ comfyPage }) => {
     await comfyPage.nodeOps.dragTextEncodeNode2()
-    await comfyPage.nextFrame()
     await expect(comfyPage.canvas).toHaveScreenshot('dragged-node1.png')
   })
 
@@ -737,25 +733,6 @@ test.describe('Load workflow', { tag: '@screenshot' }, () => {
     await expect(comfyPage.canvas).toHaveScreenshot(
       'single_ksampler_modified.png'
     )
-    // Wait for V2 persistence debounce to save the modified workflow
-    const start = Date.now()
-    await comfyPage.page.waitForFunction((since) => {
-      for (let i = 0; i < window.localStorage.length; i++) {
-        const key = window.localStorage.key(i)
-        if (!key?.startsWith('Comfy.Workflow.DraftIndex.v2:')) continue
-        const json = window.localStorage.getItem(key)
-        if (!json) continue
-        try {
-          const index = JSON.parse(json)
-          if (typeof index.updatedAt === 'number' && index.updatedAt >= since) {
-            return true
-          }
-        } catch {
-          // ignore
-        }
-      }
-      return false
-    }, start)
     await comfyPage.setup({ clearStorage: false })
     await expect(comfyPage.canvas).toHaveScreenshot(
       'single_ksampler_modified.png'
@@ -778,17 +755,10 @@ test.describe('Load workflow', { tag: '@screenshot' }, () => {
       await comfyPage.menu.topbar.triggerTopbarCommand(['New'])
       await comfyPage.menu.topbar.saveWorkflow(workflowB)
 
-      // Wait for sessionStorage to persist the workflow paths before reloading
-      // V2 persistence uses sessionStorage with client-scoped keys
-      await comfyPage.page.waitForFunction(() => {
-        for (let i = 0; i < window.sessionStorage.length; i++) {
-          const key = window.sessionStorage.key(i)
-          if (key?.startsWith('Comfy.Workflow.OpenPaths:')) {
-            return true
-          }
-        }
-        return false
-      })
+      // Wait for localStorage to persist the workflow paths before reloading
+      await comfyPage.page.waitForFunction(
+        () => !!window.localStorage.getItem('Comfy.OpenWorkflowsPaths')
+      )
       await comfyPage.setup({ clearStorage: false })
     })
 

browser_tests/tests/nodeGhostPlacement.spec.ts

@@ -1,162 +0,0 @@
-import {
-  comfyExpect as expect,
-  comfyPageFixture as test
-} from '../fixtures/ComfyPage'
-
-type ComfyPage = Parameters<Parameters<typeof test>[2]>[0]['comfyPage']
-
-async function setVueMode(comfyPage: ComfyPage, enabled: boolean) {
-  await comfyPage.settings.setSetting('Comfy.VueNodes.Enabled', enabled)
-  if (enabled) {
-    await comfyPage.vueNodes.waitForNodes()
-  }
-}
-
-async function addGhostAtCenter(comfyPage: ComfyPage) {
-  await comfyPage.command.executeCommand('Comfy.NewBlankWorkflow')
-  await comfyPage.nextFrame()
-
-  const viewport = comfyPage.page.viewportSize()!
-  const centerX = Math.round(viewport.width / 2)
-  const centerY = Math.round(viewport.height / 2)
-
-  await comfyPage.page.mouse.move(centerX, centerY)
-  await comfyPage.nextFrame()
-
-  const nodeId = await comfyPage.page.evaluate(
-    ([clientX, clientY]) => {
-      const node = window.LiteGraph!.createNode('VAEDecode')!
-      const event = new MouseEvent('click', { clientX, clientY })
-      window.app!.graph.add(node, { ghost: true, dragEvent: event })
-      return node.id
-    },
-    [centerX, centerY] as const
-  )
-  await comfyPage.nextFrame()
-
-  return { nodeId, centerX, centerY }
-}
-
-function getNodeById(comfyPage: ComfyPage, nodeId: number | string) {
-  return comfyPage.page.evaluate((id) => {
-    const node = window.app!.graph.getNodeById(id)
-    if (!node) return null
-    return { ghost: !!node.flags.ghost }
-  }, nodeId)
-}
-
-for (const mode of ['litegraph', 'vue'] as const) {
-  test.describe(`Ghost node placement (${mode} mode)`, () => {
-    test.beforeEach(async ({ comfyPage }) => {
-      await setVueMode(comfyPage, mode === 'vue')
-    })
-
-    test('positions ghost node at cursor', async ({ comfyPage }) => {
-      await comfyPage.command.executeCommand('Comfy.NewBlankWorkflow')
-      await comfyPage.nextFrame()
-
-      const viewport = comfyPage.page.viewportSize()!
-      const centerX = Math.round(viewport.width / 2)
-      const centerY = Math.round(viewport.height / 2)
-
-      await comfyPage.page.mouse.move(centerX, centerY)
-      await comfyPage.nextFrame()
-
-      const result = await comfyPage.page.evaluate(
-        ([clientX, clientY]) => {
-          const node = window.LiteGraph!.createNode('VAEDecode')!
-          const event = new MouseEvent('click', { clientX, clientY })
-          window.app!.graph.add(node, { ghost: true, dragEvent: event })
-
-          const canvas = window.app!.canvas
-          const rect = canvas.canvas.getBoundingClientRect()
-          const cursorCanvasX =
-            (clientX - rect.left) / canvas.ds.scale - canvas.ds.offset[0]
-          const cursorCanvasY =
-            (clientY - rect.top) / canvas.ds.scale - canvas.ds.offset[1]
-
-          return {
-            diffX: node.pos[0] + node.size[0] / 2 - cursorCanvasX,
-            diffY: node.pos[1] - 10 - cursorCanvasY
-          }
-        },
-        [centerX, centerY] as const
-      )
-      await comfyPage.nextFrame()
-
-      expect(Math.abs(result.diffX)).toBeLessThan(5)
-      expect(Math.abs(result.diffY)).toBeLessThan(5)
-    })
-
-    test('left-click confirms ghost placement', async ({ comfyPage }) => {
-      const { nodeId, centerX, centerY } = await addGhostAtCenter(comfyPage)
-
-      const before = await getNodeById(comfyPage, nodeId)
-      expect(before).not.toBeNull()
-      expect(before!.ghost).toBe(true)
-
-      await comfyPage.page.mouse.click(centerX, centerY)
-      await comfyPage.nextFrame()
-
-      const after = await getNodeById(comfyPage, nodeId)
-      expect(after).not.toBeNull()
-      expect(after!.ghost).toBe(false)
-    })
-
-    test('Escape cancels ghost placement', async ({ comfyPage }) => {
-      const { nodeId } = await addGhostAtCenter(comfyPage)
-
-      const before = await getNodeById(comfyPage, nodeId)
-      expect(before).not.toBeNull()
-      expect(before!.ghost).toBe(true)
-
-      await comfyPage.page.keyboard.press('Escape')
-      await comfyPage.nextFrame()
-
-      const after = await getNodeById(comfyPage, nodeId)
-      expect(after).toBeNull()
-    })
-
-    test('Delete cancels ghost placement', async ({ comfyPage }) => {
-      const { nodeId } = await addGhostAtCenter(comfyPage)
-
-      const before = await getNodeById(comfyPage, nodeId)
-      expect(before).not.toBeNull()
-      expect(before!.ghost).toBe(true)
-
-      await comfyPage.page.keyboard.press('Delete')
-      await comfyPage.nextFrame()
-
-      const after = await getNodeById(comfyPage, nodeId)
-      expect(after).toBeNull()
-    })
-
-    test('Backspace cancels ghost placement', async ({ comfyPage }) => {
-      const { nodeId } = await addGhostAtCenter(comfyPage)
-
-      const before = await getNodeById(comfyPage, nodeId)
-      expect(before).not.toBeNull()
-      expect(before!.ghost).toBe(true)
-
-      await comfyPage.page.keyboard.press('Backspace')
-      await comfyPage.nextFrame()
-
-      const after = await getNodeById(comfyPage, nodeId)
-      expect(after).toBeNull()
-    })
-
-    test('right-click cancels ghost placement', async ({ comfyPage }) => {
-      const { nodeId, centerX, centerY } = await addGhostAtCenter(comfyPage)
-
-      const before = await getNodeById(comfyPage, nodeId)
-      expect(before).not.toBeNull()
-      expect(before!.ghost).toBe(true)
-
-      await comfyPage.page.mouse.click(centerX, centerY, { button: 'right' })
-      await comfyPage.nextFrame()
-
-      const after = await getNodeById(comfyPage, nodeId)
-      expect(after).toBeNull()
-    })
-  })
-}

browser_tests/tests/nodeHelp.spec.ts

@@ -27,7 +27,6 @@ test.describe('Node Help', { tag: ['@slow', '@ui'] }, () => {
   test.beforeEach(async ({ comfyPage }) => {
     await comfyPage.setup()
     await comfyPage.settings.setSetting('Comfy.UseNewMenu', 'Top')
-    await comfyPage.settings.setSetting('Comfy.NodeLibrary.NewDesign', false)
   })
 
   test.describe('Selection Toolbox', () => {

browser_tests/tests/nodeSearchBox.spec.ts

@@ -18,10 +18,7 @@ test.describe('Node search box', { tag: '@node' }, () => {
       'Comfy.LinkRelease.ActionShift',
       'search box'
     )
-    await comfyPage.settings.setSetting(
-      'Comfy.NodeSearchBoxImpl',
-      'v1 (legacy)'
-    )
+    await comfyPage.settings.setSetting('Comfy.NodeSearchBoxImpl', 'default')
   })
 
   test(`Can trigger on empty canvas double click`, async ({ comfyPage }) => {
@@ -48,10 +45,7 @@ test.describe('Node search box', { tag: '@node' }, () => {
     await comfyPage.setup({ clearStorage: true })
     // Simulate new user with 1.24.1+ installed version
     await comfyPage.settings.setSetting('Comfy.InstalledVersion', '1.24.1')
-    await comfyPage.settings.setSetting(
-      'Comfy.NodeSearchBoxImpl',
-      'v1 (legacy)'
-    )
+    await comfyPage.settings.setSetting('Comfy.NodeSearchBoxImpl', 'default')
     // Don't set LinkRelease settings explicitly to test versioned defaults
 
     await comfyPage.canvasOps.disconnectEdge()
@@ -221,14 +215,6 @@ test.describe('Node search box', { tag: '@node' }, () => {
       await expectFilterChips(comfyPage, ['MODEL', 'CLIP'])
     })
 
-    test('Does not add duplicate filter with same type and value', async ({
-      comfyPage
-    }) => {
-      await comfyPage.searchBox.addFilter('MODEL', 'Input Type')
-      await comfyPage.searchBox.addFilter('MODEL', 'Input Type')
-      await expectFilterChips(comfyPage, ['MODEL'])
-    })
-
     test('Can remove filter', async ({ comfyPage }) => {
       await comfyPage.searchBox.addFilter('MODEL', 'Input Type')
       await comfyPage.searchBox.removeFilter(0)
@@ -291,10 +277,7 @@ test.describe('Release context menu', { tag: '@node' }, () => {
       'Comfy.LinkRelease.ActionShift',
       'search box'
     )
-    await comfyPage.settings.setSetting(
-      'Comfy.NodeSearchBoxImpl',
-      'v1 (legacy)'
-    )
+    await comfyPage.settings.setSetting('Comfy.NodeSearchBoxImpl', 'default')
   })
 
   test(
@@ -338,10 +321,7 @@ test.describe('Release context menu', { tag: '@node' }, () => {
     await comfyPage.setup({ clearStorage: true })
     // Simulate existing user with pre-1.24.1 version
     await comfyPage.settings.setSetting('Comfy.InstalledVersion', '1.23.0')
-    await comfyPage.settings.setSetting(
-      'Comfy.NodeSearchBoxImpl',
-      'v1 (legacy)'
-    )
+    await comfyPage.settings.setSetting('Comfy.NodeSearchBoxImpl', 'default')
     // Don't set LinkRelease settings explicitly to test versioned defaults
 
     await comfyPage.canvasOps.disconnectEdge()
@@ -362,10 +342,7 @@ test.describe('Release context menu', { tag: '@node' }, () => {
       'Comfy.LinkRelease.Action',
       'context menu'
     )
-    await comfyPage.settings.setSetting(
-      'Comfy.NodeSearchBoxImpl',
-      'v1 (legacy)'
-    )
+    await comfyPage.settings.setSetting('Comfy.NodeSearchBoxImpl', 'default')
 
     await comfyPage.canvasOps.disconnectEdge()
     // Context menu should appear due to explicit setting, not search box

browser_tests/tests/nodeSearchBoxV2.spec.ts

@@ -1,149 +0,0 @@
-import {
-  comfyExpect as expect,
-  comfyPageFixture as test
-} from '../fixtures/ComfyPage'
-
-test.describe('Node search box V2', { tag: '@node' }, () => {
-  test.beforeEach(async ({ comfyPage }) => {
-    await comfyPage.settings.setSetting('Comfy.UseNewMenu', 'Disabled')
-    await comfyPage.settings.setSetting('Comfy.NodeSearchBoxImpl', 'default')
-    await comfyPage.settings.setSetting(
-      'Comfy.LinkRelease.Action',
-      'search box'
-    )
-    await comfyPage.settings.setSetting(
-      'Comfy.LinkRelease.ActionShift',
-      'search box'
-    )
-    await comfyPage.searchBoxV2.reload(comfyPage)
-  })
-
-  test('Can open search and add node', async ({ comfyPage }) => {
-    const { searchBoxV2 } = comfyPage
-    const initialCount = await comfyPage.nodeOps.getGraphNodesCount()
-
-    await comfyPage.canvasOps.doubleClick()
-    await expect(searchBoxV2.input).toBeVisible()
-
-    await searchBoxV2.input.fill('KSampler')
-    await expect(searchBoxV2.results.first()).toBeVisible()
-
-    await comfyPage.page.keyboard.press('Enter')
-    await expect(searchBoxV2.input).not.toBeVisible()
-
-    const newCount = await comfyPage.nodeOps.getGraphNodesCount()
-    expect(newCount).toBe(initialCount + 1)
-  })
-
-  test('Can add first default result with Enter', async ({ comfyPage }) => {
-    const { searchBoxV2 } = comfyPage
-    const initialCount = await comfyPage.nodeOps.getGraphNodesCount()
-
-    await comfyPage.canvasOps.doubleClick()
-    await expect(searchBoxV2.input).toBeVisible()
-
-    // Default results should be visible without typing
-    await expect(searchBoxV2.results.first()).toBeVisible()
-
-    // Enter should add the first (selected) result
-    await comfyPage.page.keyboard.press('Enter')
-    await expect(searchBoxV2.input).not.toBeVisible()
-
-    const newCount = await comfyPage.nodeOps.getGraphNodesCount()
-    expect(newCount).toBe(initialCount + 1)
-  })
-
-  test.describe('Category navigation', () => {
-    test('Favorites shows only bookmarked nodes', async ({ comfyPage }) => {
-      const { searchBoxV2 } = comfyPage
-      await comfyPage.settings.setSetting('Comfy.NodeLibrary.Bookmarks.V2', [
-        'KSampler'
-      ])
-      await searchBoxV2.reload(comfyPage)
-
-      await comfyPage.canvasOps.doubleClick()
-      await expect(searchBoxV2.input).toBeVisible()
-
-      await searchBoxV2.categoryButton('favorites').click()
-
-      await expect(searchBoxV2.results).toHaveCount(1)
-      await expect(searchBoxV2.results.first()).toContainText('KSampler')
-    })
-
-    test('Category filters results to matching nodes', async ({
-      comfyPage
-    }) => {
-      const { searchBoxV2 } = comfyPage
-
-      await comfyPage.canvasOps.doubleClick()
-      await expect(searchBoxV2.input).toBeVisible()
-
-      await searchBoxV2.categoryButton('sampling').click()
-
-      await expect(searchBoxV2.results.first()).toBeVisible()
-      const count = await searchBoxV2.results.count()
-      expect(count).toBeGreaterThan(0)
-    })
-  })
-
-  test.describe('Filter workflow', () => {
-    test('Can filter by input type via filter bar', async ({ comfyPage }) => {
-      const { searchBoxV2 } = comfyPage
-
-      await comfyPage.canvasOps.doubleClick()
-      await expect(searchBoxV2.input).toBeVisible()
-
-      // Click "Input" filter chip in the filter bar
-      await searchBoxV2.filterBarButton('Input').click()
-
-      // Filter options should appear
-      await expect(searchBoxV2.filterOptions.first()).toBeVisible()
-
-      // Type to narrow and select MODEL
-      await searchBoxV2.input.fill('MODEL')
-      await searchBoxV2.filterOptions
-        .filter({ hasText: 'MODEL' })
-        .first()
-        .click()
-
-      // Filter chip should appear and results should be filtered
-      await expect(
-        searchBoxV2.dialog.getByText('Input:', { exact: false }).locator('..')
-      ).toContainText('MODEL')
-      await expect(searchBoxV2.results.first()).toBeVisible()
-    })
-  })
-
-  test.describe('Keyboard navigation', () => {
-    test('Can navigate and select with keyboard', async ({ comfyPage }) => {
-      const { searchBoxV2 } = comfyPage
-      const initialCount = await comfyPage.nodeOps.getGraphNodesCount()
-
-      await comfyPage.canvasOps.doubleClick()
-      await expect(searchBoxV2.input).toBeVisible()
-
-      await searchBoxV2.input.fill('KSampler')
-      const results = searchBoxV2.results
-      await expect(results.first()).toBeVisible()
-
-      // First result selected by default
-      await expect(results.first()).toHaveAttribute('aria-selected', 'true')
-
-      // ArrowDown moves selection
-      await comfyPage.page.keyboard.press('ArrowDown')
-      await expect(results.nth(1)).toHaveAttribute('aria-selected', 'true')
-      await expect(results.first()).toHaveAttribute('aria-selected', 'false')
-
-      // ArrowUp moves back
-      await comfyPage.page.keyboard.press('ArrowUp')
-      await expect(results.first()).toHaveAttribute('aria-selected', 'true')
-
-      // Enter selects and adds node
-      await comfyPage.page.keyboard.press('Enter')
-      await expect(searchBoxV2.input).not.toBeVisible()
-
-      const newCount = await comfyPage.nodeOps.getGraphNodesCount()
-      expect(newCount).toBe(initialCount + 1)
-    })
-  })
-})

browser_tests/tests/propertiesPanel/propertiesPanelPosition.spec.ts

@@ -5,7 +5,6 @@ import { TestIds } from '../../fixtures/selectors'
 
 test.describe('Properties panel position', () => {
   test.beforeEach(async ({ comfyPage }) => {
-    await comfyPage.settings.setSetting('Comfy.NodeLibrary.NewDesign', false)
     // Open a sidebar tab to ensure sidebar is visible
     await comfyPage.menu.nodeLibraryTab.open()
     await comfyPage.actionbar.propertiesButton.click()

browser_tests/tests/recordAudio.spec.ts

@@ -4,7 +4,6 @@ import { comfyPageFixture as test } from '../fixtures/ComfyPage'
 
 test.beforeEach(async ({ comfyPage }) => {
   await comfyPage.settings.setSetting('Comfy.UseNewMenu', 'Disabled')
-  await comfyPage.settings.setSetting('Comfy.NodeSearchBoxImpl', 'v1 (legacy)')
 })
 
 test.describe('Record Audio Node', { tag: '@screenshot' }, () => {

browser_tests/tests/remoteWidgets.spec.ts

@@ -53,11 +53,6 @@ test.describe('Remote COMBO Widget', { tag: '@widget' }, () => {
 
   test.beforeEach(async ({ comfyPage }) => {
     await comfyPage.settings.setSetting('Comfy.UseNewMenu', 'Top')
-    await comfyPage.settings.setSetting('Comfy.NodeLibrary.NewDesign', false)
-    await comfyPage.settings.setSetting(
-      'Comfy.NodeSearchBoxImpl',
-      'v1 (legacy)'
-    )
   })
 
   test.describe('Loading options', () => {

browser_tests/tests/saveImageAndWebp.spec.ts

@@ -1,42 +0,0 @@
-import { expect } from '@playwright/test'
-
-import { comfyPageFixture as test } from '../fixtures/ComfyPage'
-
-test.describe(
-  'Save Image and WEBM preview',
-  { tag: ['@screenshot', '@widget'] },
-  () => {
-    test.beforeEach(async ({ comfyPage }) => {
-      await comfyPage.settings.setSetting('Comfy.VueNodes.Enabled', true)
-      await comfyPage.vueNodes.waitForNodes()
-    })
-
-    test('Can preview both SaveImage and SaveWEBM outputs', async ({
-      comfyPage
-    }) => {
-      await comfyPage.workflow.loadWorkflow(
-        'widgets/save_image_and_animated_webp'
-      )
-      await comfyPage.vueNodes.waitForNodes()
-
-      await comfyPage.runButton.click()
-
-      const saveImageNode = comfyPage.vueNodes.getNodeByTitle('Save Image')
-      const saveWebmNode = comfyPage.vueNodes.getNodeByTitle('SaveWEBM')
-
-      // Wait for SaveImage to render an img inside .image-preview
-      await expect(saveImageNode.locator('.image-preview img')).toBeVisible({
-        timeout: 30000
-      })
-
-      // Wait for SaveWEBM to render a video inside .video-preview
-      await expect(saveWebmNode.locator('.video-preview video')).toBeVisible({
-        timeout: 30000
-      })
-
-      await expect(comfyPage.page).toHaveScreenshot(
-        'save-image-and-webm-preview.png'
-      )
-    })
-  }
-)

browser_tests/tests/sidebar/nodeLibrary.spec.ts

@@ -5,7 +5,6 @@ import { comfyPageFixture as test } from '../../fixtures/ComfyPage'
 test.describe('Node library sidebar', () => {
   test.beforeEach(async ({ comfyPage }) => {
     await comfyPage.settings.setSetting('Comfy.UseNewMenu', 'Top')
-    await comfyPage.settings.setSetting('Comfy.NodeLibrary.NewDesign', false)
     await comfyPage.settings.setSetting('Comfy.NodeLibrary.Bookmarks.V2', [])
     await comfyPage.settings.setSetting(
       'Comfy.NodeLibrary.BookmarksCustomization',

browser_tests/tests/sidebar/workflows.spec.ts

@@ -123,14 +123,17 @@ test.describe('Workflows sidebar', () => {
   test('Can save workflow as', async ({ comfyPage }) => {
     await comfyPage.command.executeCommand('Comfy.NewBlankWorkflow')
     await comfyPage.menu.topbar.saveWorkflowAs('workflow3.json')
-    await expect
-      .poll(() => comfyPage.menu.workflowsTab.getOpenedWorkflowNames())
-      .toEqual(['*Unsaved Workflow.json', 'workflow3.json'])
+    expect(await comfyPage.menu.workflowsTab.getOpenedWorkflowNames()).toEqual([
+      '*Unsaved Workflow.json',
+      'workflow3.json'
+    ])
 
     await comfyPage.menu.topbar.saveWorkflowAs('workflow4.json')
-    await expect
-      .poll(() => comfyPage.menu.workflowsTab.getOpenedWorkflowNames())
-      .toEqual(['*Unsaved Workflow.json', 'workflow3.json', 'workflow4.json'])
+    expect(await comfyPage.menu.workflowsTab.getOpenedWorkflowNames()).toEqual([
+      '*Unsaved Workflow.json',
+      'workflow3.json',
+      'workflow4.json'
+    ])
   })
 
   test('Exported workflow does not contain localized slot names', async ({
@@ -217,22 +220,24 @@ test.describe('Workflows sidebar', () => {
     await topbar.saveWorkflow('workflow1.json')
     await topbar.saveWorkflowAs('workflow2.json')
     await comfyPage.nextFrame()
-    await expect
-      .poll(() => comfyPage.menu.workflowsTab.getOpenedWorkflowNames())
-      .toEqual(['workflow1.json', 'workflow2.json'])
-    await expect
-      .poll(() => comfyPage.menu.workflowsTab.getActiveWorkflowName())
-      .toEqual('workflow2.json')
+    expect(await comfyPage.menu.workflowsTab.getOpenedWorkflowNames()).toEqual([
+      'workflow1.json',
+      'workflow2.json'
+    ])
+    expect(await comfyPage.menu.workflowsTab.getActiveWorkflowName()).toEqual(
+      'workflow2.json'
+    )
 
     await topbar.saveWorkflowAs('workflow1.json')
     await comfyPage.confirmDialog.click('overwrite')
     // The old workflow1.json should be deleted and the new one should be saved.
-    await expect
-      .poll(() => comfyPage.menu.workflowsTab.getOpenedWorkflowNames())
-      .toEqual(['workflow2.json', 'workflow1.json'])
-    await expect
-      .poll(() => comfyPage.menu.workflowsTab.getActiveWorkflowName())
-      .toEqual('workflow1.json')
+    expect(await comfyPage.menu.workflowsTab.getOpenedWorkflowNames()).toEqual([
+      'workflow2.json',
+      'workflow1.json'
+    ])
+    expect(await comfyPage.menu.workflowsTab.getActiveWorkflowName()).toEqual(
+      'workflow1.json'
+    )
   })
 
   test('Does not report warning when switching between opened workflows', async ({

browser_tests/tests/subgraph-duplicate-ids.spec.ts

@@ -1,100 +0,0 @@
-import { expect } from '@playwright/test'
-
-import { comfyPageFixture as test } from '../fixtures/ComfyPage'
-
-test.describe('Subgraph duplicate ID remapping', { tag: ['@subgraph'] }, () => {
-  const WORKFLOW = 'subgraphs/subgraph-nested-duplicate-ids'
-
-  test('All node IDs are globally unique after loading', async ({
-    comfyPage
-  }) => {
-    await comfyPage.workflow.loadWorkflow(WORKFLOW)
-
-    const result = await comfyPage.page.evaluate(() => {
-      const graph = window.app!.canvas.graph!
-      // TODO: Extract allGraphs accessor (root + subgraphs) into LGraph
-      // TODO: Extract allNodeIds accessor into LGraph
-      const allGraphs = [graph, ...graph.subgraphs.values()]
-      const allIds = allGraphs
-        .flatMap((g) => g._nodes)
-        .map((n) => n.id)
-        .filter((id): id is number => typeof id === 'number')
-
-      return { allIds, uniqueCount: new Set(allIds).size }
-    })
-
-    expect(result.uniqueCount).toBe(result.allIds.length)
-    expect(result.allIds.length).toBeGreaterThanOrEqual(10)
-  })
-
-  test('Root graph node IDs are preserved as canonical', async ({
-    comfyPage
-  }) => {
-    await comfyPage.workflow.loadWorkflow(WORKFLOW)
-
-    const rootIds = await comfyPage.page.evaluate(() => {
-      const graph = window.app!.canvas.graph!
-      return graph._nodes
-        .map((n) => n.id)
-        .filter((id): id is number => typeof id === 'number')
-        .sort((a, b) => a - b)
-    })
-
-    expect(rootIds).toEqual([1, 2, 5])
-  })
-
-  test('All links reference valid nodes in their graph', async ({
-    comfyPage
-  }) => {
-    await comfyPage.workflow.loadWorkflow(WORKFLOW)
-
-    const invalidLinks = await comfyPage.page.evaluate(() => {
-      const graph = window.app!.canvas.graph!
-      const labeledGraphs: [string, typeof graph][] = [
-        ['root', graph],
-        ...[...graph.subgraphs.entries()].map(
-          ([id, sg]) => [`subgraph:${id}`, sg] as [string, typeof graph]
-        )
-      ]
-
-      const isNonNegative = (id: number | string) =>
-        typeof id === 'number' && id >= 0
-
-      return labeledGraphs.flatMap(([label, g]) =>
-        [...g._links.values()].flatMap((link) =>
-          [
-            isNonNegative(link.origin_id) &&
-              !g._nodes_by_id[link.origin_id] &&
-              `${label}: origin_id ${link.origin_id} not found`,
-            isNonNegative(link.target_id) &&
-              !g._nodes_by_id[link.target_id] &&
-              `${label}: target_id ${link.target_id} not found`
-          ].filter(Boolean)
-        )
-      )
-    })
-
-    expect(invalidLinks).toEqual([])
-  })
-
-  test('Subgraph navigation works after ID remapping', async ({
-    comfyPage
-  }) => {
-    await comfyPage.workflow.loadWorkflow(WORKFLOW)
-
-    const subgraphNode = await comfyPage.nodeOps.getNodeRefById('5')
-    await subgraphNode.navigateIntoSubgraph()
-
-    const isInSubgraph = () =>
-      comfyPage.page.evaluate(
-        () => window.app!.canvas.graph?.isRootGraph === false
-      )
-
-    expect(await isInSubgraph()).toBe(true)
-
-    await comfyPage.page.keyboard.press('Escape')
-    await comfyPage.nextFrame()
-
-    expect(await isInSubgraph()).toBe(false)
-  })
-})

browser_tests/tests/subgraph.spec.ts

@@ -19,10 +19,6 @@ const SELECTORS = {
 test.describe('Subgraph Operations', { tag: ['@slow', '@subgraph'] }, () => {
   test.beforeEach(async ({ comfyPage }) => {
     await comfyPage.settings.setSetting('Comfy.UseNewMenu', 'Disabled')
-    await comfyPage.settings.setSetting(
-      'Comfy.NodeSearchBoxImpl',
-      'v1 (legacy)'
-    )
   })
 
   // Helper to get subgraph slot count
@@ -65,10 +61,7 @@ test.describe('Subgraph Operations', { tag: ['@slow', '@subgraph'] }, () => {
       await subgraphNode.navigateIntoSubgraph()
 
       const initialCount = await getSubgraphSlotCount(comfyPage, 'inputs')
-      const [vaeEncodeNode] = await comfyPage.nodeOps.getNodeRefsByType(
-        'VAEEncode',
-        true
-      )
+      const vaeEncodeNode = await comfyPage.nodeOps.getNodeRefById('2')
 
       await comfyPage.subgraph.connectFromInput(vaeEncodeNode, 0)
       await comfyPage.nextFrame()
@@ -84,10 +77,7 @@ test.describe('Subgraph Operations', { tag: ['@slow', '@subgraph'] }, () => {
       await subgraphNode.navigateIntoSubgraph()
 
       const initialCount = await getSubgraphSlotCount(comfyPage, 'outputs')
-      const [vaeEncodeNode] = await comfyPage.nodeOps.getNodeRefsByType(
-        'VAEEncode',
-        true
-      )
+      const vaeEncodeNode = await comfyPage.nodeOps.getNodeRefById('2')
 
       await comfyPage.subgraph.connectToOutput(vaeEncodeNode, 0)
       await comfyPage.nextFrame()
@@ -375,45 +365,6 @@ test.describe('Subgraph Operations', { tag: ['@slow', '@subgraph'] }, () => {
     })
   })
 
-  test.describe('Subgraph Unpacking', () => {
-    test('Unpacking subgraph with duplicate links does not create extra links', async ({
-      comfyPage
-    }) => {
-      await comfyPage.workflow.loadWorkflow(
-        'subgraphs/subgraph-duplicate-links'
-      )
-
-      const result = await comfyPage.page.evaluate(() => {
-        const graph = window.app!.graph!
-        const subgraphNode = graph.nodes.find((n) => n.isSubgraphNode())
-        if (!subgraphNode || !subgraphNode.isSubgraphNode()) {
-          return { error: 'No subgraph node found' }
-        }
-
-        graph.unpackSubgraph(subgraphNode)
-
-        const linkCount = graph.links.size
-        const nodes = graph.nodes
-        const ksampler = nodes.find((n) => n.type === 'KSampler')
-        if (!ksampler) return { error: 'No KSampler found after unpack' }
-
-        const linkedInputCount = ksampler.inputs.filter(
-          (i) => i.link != null
-        ).length
-
-        return { linkCount, linkedInputCount, nodeCount: nodes.length }
-      })
-
-      expect(result).not.toHaveProperty('error')
-      // Should have exactly 1 link (EmptyLatentImage→KSampler)
-      // not 4 (with 3 duplicates). The KSampler→output link is dropped
-      // because the subgraph output has no downstream connection.
-      expect(result.linkCount).toBe(1)
-      // KSampler should have exactly 1 linked input (latent_image)
-      expect(result.linkedInputCount).toBe(1)
-    })
-  })
-
   test.describe('Subgraph Creation and Deletion', () => {
     test('Can create subgraph from selected nodes', async ({ comfyPage }) => {
       await comfyPage.workflow.loadWorkflow('default')
@@ -869,7 +820,7 @@ test.describe('Subgraph Operations', { tag: ['@slow', '@subgraph'] }, () => {
 
       // Open settings dialog using hotkey
       await comfyPage.page.keyboard.press('Control+,')
-      await comfyPage.page.waitForSelector('[data-testid="settings-dialog"]', {
+      await comfyPage.page.waitForSelector('.settings-container', {
         state: 'visible'
       })
 
@@ -879,7 +830,7 @@ test.describe('Subgraph Operations', { tag: ['@slow', '@subgraph'] }, () => {
 
       // Dialog should be closed
       await expect(
-        comfyPage.page.locator('[data-testid="settings-dialog"]')
+        comfyPage.page.locator('.settings-container')
       ).not.toBeVisible()
 
       // Should still be in subgraph

browser_tests/tests/subgraphPromotion.spec.ts

@@ -1,690 +0,0 @@
-import { expect } from '@playwright/test'
-
-import type { ComfyWorkflowJSON } from '@/platform/workflow/validation/schemas/workflowSchema'
-
-import type { ComfyPage } from '../fixtures/ComfyPage'
-import { comfyPageFixture as test } from '../fixtures/ComfyPage'
-import { TestIds } from '../fixtures/selectors'
-import { fitToViewInstant } from '../helpers/fitToView'
-import {
-  getPromotedWidgetNames,
-  getPromotedWidgetCount,
-  getPromotedWidgets
-} from '../helpers/promotedWidgets'
-
-/**
- * Check whether we're currently in a subgraph.
- */
-async function isInSubgraph(comfyPage: ComfyPage): Promise<boolean> {
-  return comfyPage.page.evaluate(() => {
-    const graph = window.app!.canvas.graph
-    return !!graph && 'inputNode' in graph
-  })
-}
-
-async function exitSubgraphViaBreadcrumb(comfyPage: ComfyPage): Promise<void> {
-  const breadcrumb = comfyPage.page.getByTestId(TestIds.breadcrumb.subgraph)
-  await breadcrumb.waitFor({ state: 'visible', timeout: 5000 })
-
-  const parentLink = breadcrumb.getByRole('link').first()
-  await expect(parentLink).toBeVisible()
-  await parentLink.click()
-  await comfyPage.nextFrame()
-}
-
-test.describe(
-  'Subgraph Widget Promotion',
-  { tag: ['@subgraph', '@widget'] },
-  () => {
-    test.describe('Auto-promotion on Convert to Subgraph', () => {
-      test('Recommended widgets are auto-promoted when creating a subgraph', async ({
-        comfyPage
-      }) => {
-        await comfyPage.workflow.loadWorkflow('default')
-
-        // Select just the KSampler node (id 3) which has a "seed" widget
-        const ksampler = await comfyPage.nodeOps.getNodeRefById('3')
-        await ksampler.click('title')
-        const subgraphNode = await ksampler.convertToSubgraph()
-        await comfyPage.nextFrame()
-
-        // SubgraphNode should exist
-        expect(await subgraphNode.exists()).toBe(true)
-
-        // The KSampler has a "seed" widget which is in the recommended list.
-        // The promotion store should have at least the seed widget promoted.
-        const nodeId = String(subgraphNode.id)
-        const promotedNames = await getPromotedWidgetNames(comfyPage, nodeId)
-        expect(promotedNames).toContain('seed')
-
-        // SubgraphNode should have widgets (promoted views)
-        const widgetCount = await getPromotedWidgetCount(comfyPage, nodeId)
-        expect(widgetCount).toBeGreaterThan(0)
-      })
-
-      test('CLIPTextEncode text widget is auto-promoted', async ({
-        comfyPage
-      }) => {
-        await comfyPage.workflow.loadWorkflow('default')
-
-        // Select the positive CLIPTextEncode node (id 6)
-        const clipNode = await comfyPage.nodeOps.getNodeRefById('6')
-        await clipNode.click('title')
-        const subgraphNode = await clipNode.convertToSubgraph()
-        await comfyPage.nextFrame()
-
-        const nodeId = String(subgraphNode.id)
-        const promotedNames = await getPromotedWidgetNames(comfyPage, nodeId)
-        expect(promotedNames.length).toBeGreaterThan(0)
-
-        // CLIPTextEncode is in the recommendedNodes list, so its text widget
-        // should be promoted
-        expect(promotedNames).toContain('text')
-      })
-
-      test('SaveImage/PreviewImage nodes get pseudo-widget promoted', async ({
-        comfyPage
-      }) => {
-        await comfyPage.workflow.loadWorkflow('default')
-        await fitToViewInstant(comfyPage)
-
-        // Select the SaveImage node (id 9 in default workflow)
-        const saveNode = await comfyPage.nodeOps.getNodeRefById('9')
-        await saveNode.click('title')
-        const subgraphNode = await saveNode.convertToSubgraph()
-        await comfyPage.nextFrame()
-
-        const promotedNames = await getPromotedWidgetNames(
-          comfyPage,
-          String(subgraphNode.id)
-        )
-
-        // SaveImage is in the recommendedNodes list, so filename_prefix is promoted
-        expect(promotedNames).toContain('filename_prefix')
-      })
-    })
-
-    test.describe('Promoted Widget Visibility in LiteGraph Mode', () => {
-      test('Promoted text widget is visible on SubgraphNode', async ({
-        comfyPage
-      }) => {
-        await comfyPage.workflow.loadWorkflow(
-          'subgraphs/subgraph-with-promoted-text-widget'
-        )
-        await comfyPage.nextFrame()
-
-        // The subgraph node (id 11) should have a text widget promoted
-        const textarea = comfyPage.page.getByTestId(
-          TestIds.widgets.domWidgetTextarea
-        )
-        await expect(textarea).toBeVisible()
-        await expect(textarea).toHaveCount(1)
-      })
-
-      test('Multiple promoted widgets all render on SubgraphNode', async ({
-        comfyPage
-      }) => {
-        await comfyPage.workflow.loadWorkflow(
-          'subgraphs/subgraph-with-multiple-promoted-widgets'
-        )
-        await comfyPage.nextFrame()
-
-        const textareas = comfyPage.page.getByTestId(
-          TestIds.widgets.domWidgetTextarea
-        )
-        await expect(textareas.first()).toBeVisible()
-        const count = await textareas.count()
-        expect(count).toBeGreaterThan(1)
-      })
-    })
-
-    test.describe('Promoted Widget Visibility in Vue Mode', () => {
-      test.beforeEach(async ({ comfyPage }) => {
-        await comfyPage.settings.setSetting('Comfy.VueNodes.Enabled', true)
-      })
-
-      test('Promoted text widget renders on SubgraphNode in Vue mode', async ({
-        comfyPage
-      }) => {
-        await comfyPage.workflow.loadWorkflow(
-          'subgraphs/subgraph-with-promoted-text-widget'
-        )
-        await comfyPage.vueNodes.waitForNodes()
-
-        // SubgraphNode (id 11) should render with its body
-        const subgraphVueNode = comfyPage.vueNodes.getNodeLocator('11')
-        await expect(subgraphVueNode).toBeVisible()
-
-        // It should have the Enter Subgraph button
-        const enterButton = subgraphVueNode.getByTestId('subgraph-enter-button')
-        await expect(enterButton).toBeVisible()
-
-        // The promoted text widget should render inside the node
-        const nodeBody = subgraphVueNode.locator('[data-testid="node-body-11"]')
-        await expect(nodeBody).toBeVisible()
-
-        // Widgets section should exist and have at least one widget
-        const widgets = nodeBody.locator('.lg-node-widgets > div')
-        await expect(widgets.first()).toBeVisible()
-      })
-
-      test('Enter Subgraph button navigates into subgraph in Vue mode', async ({
-        comfyPage
-      }) => {
-        await comfyPage.workflow.loadWorkflow(
-          'subgraphs/subgraph-with-promoted-text-widget'
-        )
-        await comfyPage.vueNodes.waitForNodes()
-
-        await comfyPage.vueNodes.enterSubgraph('11')
-        await comfyPage.nextFrame()
-
-        expect(await isInSubgraph(comfyPage)).toBe(true)
-      })
-
-      test('Multiple promoted widgets render on SubgraphNode in Vue mode', async ({
-        comfyPage
-      }) => {
-        await comfyPage.workflow.loadWorkflow(
-          'subgraphs/subgraph-with-multiple-promoted-widgets'
-        )
-        await comfyPage.vueNodes.waitForNodes()
-
-        const subgraphVueNode = comfyPage.vueNodes.getNodeLocator('11')
-        await expect(subgraphVueNode).toBeVisible()
-
-        const nodeBody = subgraphVueNode.locator('[data-testid="node-body-11"]')
-        const widgets = nodeBody.locator('.lg-node-widgets > div')
-        const count = await widgets.count()
-        expect(count).toBeGreaterThan(1)
-      })
-    })
-
-    test.describe('Promoted Widget Reactivity', () => {
-      test('Value changes on promoted widget sync to interior widget', async ({
-        comfyPage
-      }) => {
-        await comfyPage.workflow.loadWorkflow(
-          'subgraphs/subgraph-with-promoted-text-widget'
-        )
-        await comfyPage.nextFrame()
-
-        const testContent = 'promoted-value-sync-test'
-
-        // Type into the promoted textarea on the SubgraphNode
-        const textarea = comfyPage.page.getByTestId(
-          TestIds.widgets.domWidgetTextarea
-        )
-        await textarea.fill(testContent)
-        await comfyPage.nextFrame()
-
-        // Navigate into subgraph
-        const subgraphNode = await comfyPage.nodeOps.getNodeRefById('11')
-        await subgraphNode.navigateIntoSubgraph()
-
-        // Interior CLIPTextEncode textarea should have the same value
-        const interiorTextarea = comfyPage.page.getByTestId(
-          TestIds.widgets.domWidgetTextarea
-        )
-        await expect(interiorTextarea).toHaveValue(testContent)
-      })
-
-      test('Value changes on interior widget sync to promoted widget', async ({
-        comfyPage
-      }) => {
-        await comfyPage.workflow.loadWorkflow(
-          'subgraphs/subgraph-with-promoted-text-widget'
-        )
-        await comfyPage.nextFrame()
-
-        const testContent = 'interior-value-sync-test'
-
-        // Navigate into subgraph
-        const subgraphNode = await comfyPage.nodeOps.getNodeRefById('11')
-        await subgraphNode.navigateIntoSubgraph()
-
-        // Type into the interior CLIPTextEncode textarea
-        const interiorTextarea = comfyPage.page.getByTestId(
-          TestIds.widgets.domWidgetTextarea
-        )
-        await interiorTextarea.fill(testContent)
-        await comfyPage.nextFrame()
-
-        // Navigate back to parent graph
-        await exitSubgraphViaBreadcrumb(comfyPage)
-
-        // Promoted textarea on SubgraphNode should have the same value
-        const promotedTextarea = comfyPage.page.getByTestId(
-          TestIds.widgets.domWidgetTextarea
-        )
-        await expect(promotedTextarea).toHaveValue(testContent)
-      })
-
-      test('Value persists through repeated navigation', async ({
-        comfyPage
-      }) => {
-        await comfyPage.workflow.loadWorkflow(
-          'subgraphs/subgraph-with-promoted-text-widget'
-        )
-        await comfyPage.nextFrame()
-
-        const testContent = 'persistence-through-navigation'
-
-        // Set value on promoted widget
-        const textarea = comfyPage.page.getByTestId(
-          TestIds.widgets.domWidgetTextarea
-        )
-        await textarea.fill(testContent)
-
-        // Navigate in and out multiple times
-        for (let i = 0; i < 3; i++) {
-          const subgraphNode = await comfyPage.nodeOps.getNodeRefById('11')
-          await subgraphNode.navigateIntoSubgraph()
-          const interiorTextarea = comfyPage.page.getByTestId(
-            TestIds.widgets.domWidgetTextarea
-          )
-          await expect(interiorTextarea).toHaveValue(testContent)
-
-          await exitSubgraphViaBreadcrumb(comfyPage)
-
-          const promotedTextarea = comfyPage.page.getByTestId(
-            TestIds.widgets.domWidgetTextarea
-          )
-          await expect(promotedTextarea).toHaveValue(testContent)
-        }
-      })
-    })
-
-    test.describe('Manual Promote/Demote via Context Menu', () => {
-      test.beforeEach(async ({ comfyPage }) => {
-        await comfyPage.settings.setSetting('Comfy.UseNewMenu', 'Top')
-      })
-
-      test('Can promote a widget from inside a subgraph', async ({
-        comfyPage
-      }) => {
-        await comfyPage.workflow.loadWorkflow('subgraphs/basic-subgraph')
-
-        const subgraphNode = await comfyPage.nodeOps.getNodeRefById('2')
-        await subgraphNode.navigateIntoSubgraph()
-
-        // Get the KSampler node (id 1) inside the subgraph
-        const ksampler = await comfyPage.nodeOps.getNodeRefById('1')
-
-        // Right-click on the KSampler's "steps" widget (index 2) to promote it
-        const stepsWidget = await ksampler.getWidget(2)
-        const widgetPos = await stepsWidget.getPosition()
-        await comfyPage.canvas.click({
-          position: widgetPos,
-          button: 'right',
-          force: true
-        })
-        await comfyPage.nextFrame()
-
-        // Look for the Promote Widget menu entry
-        const promoteEntry = comfyPage.page
-          .locator('.litemenu-entry')
-          .filter({ hasText: /Promote Widget/ })
-
-        await expect(promoteEntry).toBeVisible()
-        await promoteEntry.click()
-        await comfyPage.nextFrame()
-
-        // Navigate back to parent
-        await exitSubgraphViaBreadcrumb(comfyPage)
-
-        // SubgraphNode should now have the promoted widget
-        const widgetCount = await getPromotedWidgetCount(comfyPage, '2')
-        expect(widgetCount).toBeGreaterThan(0)
-      })
-
-      test('Can un-promote a widget from inside a subgraph', async ({
-        comfyPage
-      }) => {
-        await comfyPage.workflow.loadWorkflow('subgraphs/basic-subgraph')
-
-        // First promote a canvas-rendered widget (KSampler "steps")
-        const subgraphNode = await comfyPage.nodeOps.getNodeRefById('2')
-        await subgraphNode.navigateIntoSubgraph()
-
-        const ksampler = await comfyPage.nodeOps.getNodeRefById('1')
-        const stepsWidget = await ksampler.getWidget(2)
-        const widgetPos = await stepsWidget.getPosition()
-
-        await comfyPage.canvas.click({
-          position: widgetPos,
-          button: 'right',
-          force: true
-        })
-        await comfyPage.nextFrame()
-
-        const promoteEntry = comfyPage.page
-          .locator('.litemenu-entry')
-          .filter({ hasText: /Promote Widget/ })
-        await expect(promoteEntry).toBeVisible()
-        await promoteEntry.click()
-        await comfyPage.nextFrame()
-
-        // Navigate back and verify promotion took effect
-        await exitSubgraphViaBreadcrumb(comfyPage)
-        await fitToViewInstant(comfyPage)
-        await comfyPage.nextFrame()
-
-        const initialWidgetCount = await getPromotedWidgetCount(comfyPage, '2')
-        expect(initialWidgetCount).toBeGreaterThan(0)
-
-        // Navigate back in and un-promote
-        const subgraphNode2 = await comfyPage.nodeOps.getNodeRefById('2')
-        await subgraphNode2.navigateIntoSubgraph()
-        const stepsWidget2 = await (
-          await comfyPage.nodeOps.getNodeRefById('1')
-        ).getWidget(2)
-        const widgetPos2 = await stepsWidget2.getPosition()
-
-        await comfyPage.canvas.click({
-          position: widgetPos2,
-          button: 'right',
-          force: true
-        })
-        await comfyPage.nextFrame()
-
-        const unpromoteEntry = comfyPage.page
-          .locator('.litemenu-entry')
-          .filter({ hasText: /Un-Promote Widget/ })
-
-        await expect(unpromoteEntry).toBeVisible()
-        await unpromoteEntry.click()
-        await comfyPage.nextFrame()
-
-        // Navigate back to parent
-        await exitSubgraphViaBreadcrumb(comfyPage)
-
-        // SubgraphNode should have fewer widgets
-        const finalWidgetCount = await getPromotedWidgetCount(comfyPage, '2')
-        expect(finalWidgetCount).toBeLessThan(initialWidgetCount)
-      })
-    })
-
-    test.describe('Pseudo-Widget Promotion', () => {
-      test('Promotion store tracks pseudo-widget entries for subgraph with preview node', async ({
-        comfyPage
-      }) => {
-        await comfyPage.workflow.loadWorkflow(
-          'subgraphs/subgraph-with-preview-node'
-        )
-        await comfyPage.nextFrame()
-
-        // The SaveImage node is in the recommendedNodes list, so its
-        // filename_prefix widget should be auto-promoted
-        const promotedNames = await getPromotedWidgetNames(comfyPage, '5')
-        expect(promotedNames.length).toBeGreaterThan(0)
-        expect(promotedNames).toContain('filename_prefix')
-      })
-
-      test('Converting SaveImage to subgraph promotes its widgets', async ({
-        comfyPage
-      }) => {
-        await comfyPage.workflow.loadWorkflow('default')
-        await fitToViewInstant(comfyPage)
-
-        // Select SaveImage (id 9)
-        const saveNode = await comfyPage.nodeOps.getNodeRefById('9')
-        await saveNode.click('title')
-        const subgraphNode = await saveNode.convertToSubgraph()
-        await comfyPage.nextFrame()
-
-        // SaveImage is a recommended node, so filename_prefix should be promoted
-        const nodeId = String(subgraphNode.id)
-        const promotedNames = await getPromotedWidgetNames(comfyPage, nodeId)
-        expect(promotedNames.length).toBeGreaterThan(0)
-
-        const widgetCount = await getPromotedWidgetCount(comfyPage, nodeId)
-        expect(widgetCount).toBeGreaterThan(0)
-      })
-    })
-
-    test.describe('Legacy And Round-Trip Coverage', () => {
-      test('Legacy -1 proxyWidgets entries are hydrated to concrete interior node IDs', async ({
-        comfyPage
-      }) => {
-        await comfyPage.workflow.loadWorkflow(
-          'subgraphs/subgraph-compressed-target-slot'
-        )
-        await comfyPage.nextFrame()
-
-        const promotedWidgets = await getPromotedWidgets(comfyPage, '2')
-        expect(promotedWidgets.length).toBeGreaterThan(0)
-        expect(
-          promotedWidgets.some(([interiorNodeId]) => interiorNodeId === '-1')
-        ).toBe(false)
-        expect(
-          promotedWidgets.some(
-            ([interiorNodeId, widgetName]) =>
-              interiorNodeId !== '-1' && widgetName === 'batch_size'
-          )
-        ).toBe(true)
-      })
-
-      test('Promoted widgets survive serialize -> loadGraphData round-trip', async ({
-        comfyPage
-      }) => {
-        await comfyPage.workflow.loadWorkflow(
-          'subgraphs/subgraph-with-promoted-text-widget'
-        )
-        await comfyPage.nextFrame()
-
-        const beforePromoted = await getPromotedWidgetNames(comfyPage, '11')
-        expect(beforePromoted).toContain('text')
-
-        const serialized = await comfyPage.page.evaluate(() => {
-          return window.app!.graph!.serialize()
-        })
-
-        await comfyPage.page.evaluate((workflow: ComfyWorkflowJSON) => {
-          return window.app!.loadGraphData(workflow)
-        }, serialized as ComfyWorkflowJSON)
-        await comfyPage.nextFrame()
-
-        const afterPromoted = await getPromotedWidgetNames(comfyPage, '11')
-        expect(afterPromoted).toContain('text')
-
-        const widgetCount = await getPromotedWidgetCount(comfyPage, '11')
-        expect(widgetCount).toBeGreaterThan(0)
-      })
-
-      test('Cloning a subgraph node keeps promoted widget entries on original and clone', async ({
-        comfyPage
-      }) => {
-        await comfyPage.workflow.loadWorkflow(
-          'subgraphs/subgraph-with-promoted-text-widget'
-        )
-        await comfyPage.nextFrame()
-
-        const originalNode = await comfyPage.nodeOps.getNodeRefById('11')
-        const originalPos = await originalNode.getPosition()
-
-        await comfyPage.page.mouse.move(originalPos.x + 16, originalPos.y + 16)
-        await comfyPage.page.keyboard.down('Alt')
-        await comfyPage.page.mouse.down()
-        await comfyPage.nextFrame()
-        await comfyPage.page.mouse.move(originalPos.x + 72, originalPos.y + 72)
-        await comfyPage.page.mouse.up()
-        await comfyPage.page.keyboard.up('Alt')
-        await comfyPage.nextFrame()
-
-        const subgraphNodeIds = await 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))
-        })
-
-        expect(subgraphNodeIds.length).toBeGreaterThan(1)
-        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('Vue Mode - Promoted Preview Content', () => {
-      test.beforeEach(async ({ comfyPage }) => {
-        await comfyPage.settings.setSetting('Comfy.VueNodes.Enabled', true)
-      })
-
-      test('SubgraphNode with preview node shows hasCustomContent area in Vue mode', async ({
-        comfyPage
-      }) => {
-        await comfyPage.workflow.loadWorkflow(
-          'subgraphs/subgraph-with-preview-node'
-        )
-        await comfyPage.vueNodes.waitForNodes()
-
-        const subgraphVueNode = comfyPage.vueNodes.getNodeLocator('5')
-        await expect(subgraphVueNode).toBeVisible()
-
-        // The node body should exist
-        const nodeBody = subgraphVueNode.locator('[data-testid="node-body-5"]')
-        await expect(nodeBody).toBeVisible()
-      })
-    })
-
-    test.describe('Nested Promoted Widget Disabled State', () => {
-      test('Externally linked promoted widget is disabled, unlinked ones are not', async ({
-        comfyPage
-      }) => {
-        await comfyPage.workflow.loadWorkflow(
-          'subgraphs/subgraph-nested-promotion'
-        )
-        await comfyPage.nextFrame()
-
-        // Node 5 (Sub 0) has 4 promoted widgets. The first (string_a) has its
-        // slot connected externally from the Outer node, so it should be
-        // disabled. The remaining promoted textarea widgets (value, value_1)
-        // are unlinked and should be enabled.
-        const promotedNames = await getPromotedWidgetNames(comfyPage, '5')
-        expect(promotedNames).toContain('string_a')
-        expect(promotedNames).toContain('value')
-
-        const disabledState = await comfyPage.page.evaluate(() => {
-          const node = window.app!.canvas.graph!.getNodeById('5')
-          return (node?.widgets ?? []).map((w) => ({
-            name: w.name,
-            disabled: !!w.computedDisabled
-          }))
-        })
-
-        const linkedWidget = disabledState.find((w) => w.name === 'string_a')
-        expect(linkedWidget?.disabled).toBe(true)
-
-        const unlinkedWidgets = disabledState.filter(
-          (w) => w.name !== 'string_a'
-        )
-        for (const w of unlinkedWidgets) {
-          expect(w.disabled).toBe(false)
-        }
-      })
-
-      test('Unlinked promoted textarea widgets are editable on the subgraph exterior', async ({
-        comfyPage
-      }) => {
-        await comfyPage.workflow.loadWorkflow(
-          'subgraphs/subgraph-nested-promotion'
-        )
-        await comfyPage.nextFrame()
-
-        // The promoted textareas that are NOT externally linked should be
-        // fully opaque and interactive.
-        const textareas = comfyPage.page.getByTestId(
-          TestIds.widgets.domWidgetTextarea
-        )
-        await expect(textareas.first()).toBeVisible()
-
-        const count = await textareas.count()
-        for (let i = 0; i < count; i++) {
-          const textarea = textareas.nth(i)
-          const wrapper = textarea.locator('..')
-          const opacity = await wrapper.evaluate(
-            (el) => getComputedStyle(el).opacity
-          )
-
-          if (opacity === '1' && (await textarea.isEditable())) {
-            const testContent = `nested-promotion-edit-${i}`
-            await textarea.fill(testContent)
-            await expect(textarea).toHaveValue(testContent)
-          }
-        }
-      })
-    })
-
-    test.describe('Promotion Cleanup', () => {
-      test('Removing subgraph node clears promotion store entries', async ({
-        comfyPage
-      }) => {
-        await comfyPage.workflow.loadWorkflow(
-          'subgraphs/subgraph-with-promoted-text-widget'
-        )
-        await comfyPage.nextFrame()
-
-        // Verify promotions exist
-        const namesBefore = await getPromotedWidgetNames(comfyPage, '11')
-        expect(namesBefore.length).toBeGreaterThan(0)
-
-        // Delete the subgraph node
-        const subgraphNode = await comfyPage.nodeOps.getNodeRefById('11')
-        await subgraphNode.click('title')
-        await comfyPage.page.keyboard.press('Delete')
-        await comfyPage.nextFrame()
-
-        // Node no longer exists, so promoted widgets should be gone
-        const nodeExists = await comfyPage.page.evaluate(() => {
-          return !!window.app!.canvas.graph!.getNodeById('11')
-        })
-        expect(nodeExists).toBe(false)
-      })
-
-      test('Removing I/O slot removes associated promoted widget', async ({
-        comfyPage
-      }) => {
-        await comfyPage.settings.setSetting('Comfy.UseNewMenu', 'Top')
-
-        await comfyPage.workflow.loadWorkflow(
-          'subgraphs/subgraph-with-promoted-text-widget'
-        )
-
-        const initialWidgetCount = await getPromotedWidgetCount(comfyPage, '11')
-        expect(initialWidgetCount).toBeGreaterThan(0)
-
-        // Navigate into subgraph
-        const subgraphNode = await comfyPage.nodeOps.getNodeRefById('11')
-        await subgraphNode.navigateIntoSubgraph()
-
-        // Remove the text input slot
-        await comfyPage.subgraph.rightClickInputSlot('text')
-        await comfyPage.contextMenu.clickLitegraphMenuItem('Remove Slot')
-        await comfyPage.nextFrame()
-
-        // Navigate back via breadcrumb
-        await comfyPage.page
-          .getByTestId(TestIds.breadcrumb.subgraph)
-          .waitFor({ state: 'visible', timeout: 5000 })
-        const homeBreadcrumb = comfyPage.page.getByRole('link', {
-          name: 'subgraph-with-promoted-text-widget'
-        })
-        await homeBreadcrumb.waitFor({ state: 'visible' })
-        await homeBreadcrumb.click()
-        await comfyPage.nextFrame()
-
-        // Widget count should be reduced
-        const finalWidgetCount = await getPromotedWidgetCount(comfyPage, '11')
-        expect(finalWidgetCount).toBeLessThan(initialWidgetCount)
-      })
-    })
-  }
-)

browser_tests/tests/subgraphSearchAliases.spec.ts

@@ -54,10 +54,7 @@ async function searchAndExpectResult(
 test.describe('Subgraph Search Aliases', { tag: ['@subgraph'] }, () => {
   test.beforeEach(async ({ comfyPage }) => {
     await comfyPage.settings.setSetting('Comfy.UseNewMenu', 'Top')
-    await comfyPage.settings.setSetting(
-      'Comfy.NodeSearchBoxImpl',
-      'v1 (legacy)'
-    )
+    await comfyPage.settings.setSetting('Comfy.NodeSearchBoxImpl', 'default')
   })
 
   test('Can set search aliases on subgraph and find via search', async ({

browser_tests/tests/templateFitView.spec.ts

@@ -1,56 +0,0 @@
-import { expect } from '@playwright/test'
-
-import type { ComfyWorkflowJSON } from '@/platform/workflow/validation/schemas/workflowSchema'
-
-import { comfyPageFixture as test } from '../fixtures/ComfyPage'
-
-/**
- * Tests that templates are automatically fitted to view when loaded.
- *
- * When openSource === 'template', fitView() is called to ensure
- * templates with saved off-screen viewport positions (extra.ds)
- * are always displayed correctly.
- */
-test.describe('Template Fit View', { tag: ['@canvas', '@workflow'] }, () => {
-  test('should automatically fit view when loading a template with off-screen saved position', async ({
-    comfyPage
-  }) => {
-    await comfyPage.settings.setSetting('Comfy.EnableWorkflowViewRestore', true)
-
-    // Serialize the current default graph, inject an extreme off-screen
-    // viewport position, then reload it as a template. Without the fix,
-    // the saved offset [-5000, -5000] would be restored and nodes would
-    // be invisible.
-    const viewportState = await comfyPage.page.evaluate(async () => {
-      const app = window.app!
-      const workflow = app.graph.serialize()
-
-      workflow.extra = {
-        ...workflow.extra,
-        ds: { scale: 1, offset: [-5000, -5000] }
-      }
-
-      await app.loadGraphData(workflow as ComfyWorkflowJSON, true, true, null, {
-        openSource: 'template'
-      })
-
-      return {
-        offsetX: app.canvas.ds.offset[0],
-        offsetY: app.canvas.ds.offset[1],
-        nodeCount: app.graph._nodes.length
-      }
-    })
-
-    expect(viewportState.nodeCount).toBeGreaterThan(0)
-
-    // fitView() should have overridden the saved [-5000, -5000] offset
-    expect(
-      viewportState.offsetX,
-      'Viewport X offset should not be the saved off-screen value'
-    ).not.toBe(-5000)
-    expect(
-      viewportState.offsetY,
-      'Viewport Y offset should not be the saved off-screen value'
-    ).not.toBe(-5000)
-  })
-})

browser_tests/tests/useSettingSearch.spec.ts

@@ -22,6 +22,7 @@ test.describe('Settings Search functionality', { tag: '@settings' }, () => {
         name: 'TestSettingsExtension',
         settings: [
           {
+            // Extensions can register arbitrary setting IDs
             id: 'TestHiddenSetting' as TestSettingId,
             name: 'Test Hidden Setting',
             type: 'hidden',
@@ -29,6 +30,7 @@ test.describe('Settings Search functionality', { tag: '@settings' }, () => {
             category: ['Test', 'Hidden']
           },
           {
+            // Extensions can register arbitrary setting IDs
             id: 'TestDeprecatedSetting' as TestSettingId,
             name: 'Test Deprecated Setting',
             type: 'text',
@@ -37,6 +39,7 @@ test.describe('Settings Search functionality', { tag: '@settings' }, () => {
             category: ['Test', 'Deprecated']
           },
           {
+            // Extensions can register arbitrary setting IDs
             id: 'TestVisibleSetting' as TestSettingId,
             name: 'Test Visible Setting',
             type: 'text',
@@ -49,143 +52,238 @@ test.describe('Settings Search functionality', { tag: '@settings' }, () => {
   })
 
   test('can open settings dialog and use search box', async ({ comfyPage }) => {
-    const dialog = comfyPage.settingDialog
-    await dialog.open()
+    // Open settings dialog
+    await comfyPage.page.keyboard.press('Control+,')
+    const settingsDialog = comfyPage.page.locator('.settings-container')
+    await expect(settingsDialog).toBeVisible()
 
-    await expect(dialog.searchBox).toHaveAttribute(
+    // Find the search box
+    const searchBox = comfyPage.page.locator('.settings-search-box input')
+    await expect(searchBox).toBeVisible()
+
+    // Verify search box has the correct placeholder
+    await expect(searchBox).toHaveAttribute(
       'placeholder',
       expect.stringContaining('Search')
     )
   })
 
   test('search box is functional and accepts input', async ({ comfyPage }) => {
-    const dialog = comfyPage.settingDialog
-    await dialog.open()
+    // Open settings dialog
+    await comfyPage.page.keyboard.press('Control+,')
+    const settingsDialog = comfyPage.page.locator('.settings-container')
+    await expect(settingsDialog).toBeVisible()
 
-    await dialog.searchBox.fill('Comfy')
-    await expect(dialog.searchBox).toHaveValue('Comfy')
+    // Find and interact with the search box
+    const searchBox = comfyPage.page.locator('.settings-search-box input')
+    await searchBox.fill('Comfy')
+
+    // Verify the input was accepted
+    await expect(searchBox).toHaveValue('Comfy')
   })
 
   test('search box clears properly', async ({ comfyPage }) => {
-    const dialog = comfyPage.settingDialog
-    await dialog.open()
+    // Open settings dialog
+    await comfyPage.page.keyboard.press('Control+,')
+    const settingsDialog = comfyPage.page.locator('.settings-container')
+    await expect(settingsDialog).toBeVisible()
 
-    await dialog.searchBox.fill('test')
-    await expect(dialog.searchBox).toHaveValue('test')
+    // Find and interact with the search box
+    const searchBox = comfyPage.page.locator('.settings-search-box input')
+    await searchBox.fill('test')
+    await expect(searchBox).toHaveValue('test')
 
-    await dialog.searchBox.clear()
-    await expect(dialog.searchBox).toHaveValue('')
+    // Clear the search box
+    await searchBox.clear()
+    await expect(searchBox).toHaveValue('')
   })
 
   test('settings categories are visible in sidebar', async ({ comfyPage }) => {
-    const dialog = comfyPage.settingDialog
-    await dialog.open()
+    // Open settings dialog
+    await comfyPage.page.keyboard.press('Control+,')
+    const settingsDialog = comfyPage.page.locator('.settings-container')
+    await expect(settingsDialog).toBeVisible()
 
-    expect(await dialog.categories.count()).toBeGreaterThan(0)
+    // Check that the sidebar has categories
+    const categories = comfyPage.page.locator(
+      '.settings-sidebar .p-listbox-option'
+    )
+    expect(await categories.count()).toBeGreaterThan(0)
+
+    // Check that at least one category is visible
+    await expect(categories.first()).toBeVisible()
   })
 
   test('can select different categories in sidebar', async ({ comfyPage }) => {
-    const dialog = comfyPage.settingDialog
-    await dialog.open()
+    // Open settings dialog
+    await comfyPage.page.keyboard.press('Control+,')
+    const settingsDialog = comfyPage.page.locator('.settings-container')
+    await expect(settingsDialog).toBeVisible()
 
-    const categoryCount = await dialog.categories.count()
+    // Click on a specific category (Appearance) to verify category switching
+    const appearanceCategory = comfyPage.page.getByRole('option', {
+      name: 'Appearance'
+    })
+    await appearanceCategory.click()
 
-    if (categoryCount > 1) {
-      await dialog.categories.nth(1).click()
+    // Verify the category is selected
+    await expect(appearanceCategory).toHaveClass(/p-listbox-option-selected/)
+  })
 
-      await expect(dialog.categories.nth(1)).toHaveClass(
-        /bg-interface-menu-component-surface-selected/
-      )
-    }
+  test('settings content area is visible', async ({ comfyPage }) => {
+    // Open settings dialog
+    await comfyPage.page.keyboard.press('Control+,')
+    const settingsDialog = comfyPage.page.locator('.settings-container')
+    await expect(settingsDialog).toBeVisible()
+
+    // Check that the content area is visible
+    const contentArea = comfyPage.page.locator('.settings-content')
+    await expect(contentArea).toBeVisible()
+
+    // Check that tab panels are visible
+    const tabPanels = comfyPage.page.locator('.settings-tab-panels')
+    await expect(tabPanels).toBeVisible()
   })
 
   test('search functionality affects UI state', async ({ comfyPage }) => {
-    const dialog = comfyPage.settingDialog
-    await dialog.open()
+    // Open settings dialog
+    await comfyPage.page.keyboard.press('Control+,')
+    const settingsDialog = comfyPage.page.locator('.settings-container')
+    await expect(settingsDialog).toBeVisible()
 
-    await dialog.searchBox.fill('graph')
-    await expect(dialog.searchBox).toHaveValue('graph')
+    // Find the search box
+    const searchBox = comfyPage.page.locator('.settings-search-box input')
+
+    // Type in search box
+    await searchBox.fill('graph')
+
+    // Verify that the search input is handled
+    await expect(searchBox).toHaveValue('graph')
   })
 
   test('settings dialog can be closed', async ({ comfyPage }) => {
-    const dialog = comfyPage.settingDialog
-    await dialog.open()
+    // Open settings dialog
+    await comfyPage.page.keyboard.press('Control+,')
+    const settingsDialog = comfyPage.page.locator('.settings-container')
+    await expect(settingsDialog).toBeVisible()
 
+    // Close with escape key
     await comfyPage.page.keyboard.press('Escape')
-    await expect(dialog.root).not.toBeVisible()
+
+    // Verify dialog is closed
+    await expect(settingsDialog).not.toBeVisible()
   })
 
   test('search box has proper debouncing behavior', async ({ comfyPage }) => {
-    const dialog = comfyPage.settingDialog
-    await dialog.open()
+    // Open settings dialog
+    await comfyPage.page.keyboard.press('Control+,')
+    const settingsDialog = comfyPage.page.locator('.settings-container')
+    await expect(settingsDialog).toBeVisible()
 
-    await dialog.searchBox.fill('a')
-    await dialog.searchBox.fill('ab')
-    await dialog.searchBox.fill('abc')
-    await dialog.searchBox.fill('abcd')
+    // Type rapidly in search box
+    const searchBox = comfyPage.page.locator('.settings-search-box input')
+    await searchBox.fill('a')
+    await searchBox.fill('ab')
+    await searchBox.fill('abc')
+    await searchBox.fill('abcd')
 
-    await expect(dialog.searchBox).toHaveValue('abcd')
+    // Verify final value
+    await expect(searchBox).toHaveValue('abcd')
   })
 
   test('search excludes hidden settings from results', async ({
     comfyPage
   }) => {
-    const dialog = comfyPage.settingDialog
-    await dialog.open()
+    // Open settings dialog
+    await comfyPage.page.keyboard.press('Control+,')
+    const settingsDialog = comfyPage.page.locator('.settings-container')
+    await expect(settingsDialog).toBeVisible()
 
-    await dialog.searchBox.fill('Test')
+    // Search for our test settings
+    const searchBox = comfyPage.page.locator('.settings-search-box input')
+    await searchBox.fill('Test')
 
-    await expect(dialog.contentArea).toContainText('Test Visible Setting')
-    await expect(dialog.contentArea).not.toContainText('Test Hidden Setting')
+    // Get all settings content
+    const settingsContent = comfyPage.page.locator('.settings-tab-panels')
+
+    // Should show visible setting but not hidden setting
+    await expect(settingsContent).toContainText('Test Visible Setting')
+    await expect(settingsContent).not.toContainText('Test Hidden Setting')
   })
 
   test('search excludes deprecated settings from results', async ({
     comfyPage
   }) => {
-    const dialog = comfyPage.settingDialog
-    await dialog.open()
+    // Open settings dialog
+    await comfyPage.page.keyboard.press('Control+,')
+    const settingsDialog = comfyPage.page.locator('.settings-container')
+    await expect(settingsDialog).toBeVisible()
 
-    await dialog.searchBox.fill('Test')
+    // Search for our test settings
+    const searchBox = comfyPage.page.locator('.settings-search-box input')
+    await searchBox.fill('Test')
 
-    await expect(dialog.contentArea).toContainText('Test Visible Setting')
-    await expect(dialog.contentArea).not.toContainText(
-      'Test Deprecated Setting'
-    )
+    // Get all settings content
+    const settingsContent = comfyPage.page.locator('.settings-tab-panels')
+
+    // Should show visible setting but not deprecated setting
+    await expect(settingsContent).toContainText('Test Visible Setting')
+    await expect(settingsContent).not.toContainText('Test Deprecated Setting')
   })
 
   test('search shows visible settings but excludes hidden and deprecated', async ({
     comfyPage
   }) => {
-    const dialog = comfyPage.settingDialog
-    await dialog.open()
+    // Open settings dialog
+    await comfyPage.page.keyboard.press('Control+,')
+    const settingsDialog = comfyPage.page.locator('.settings-container')
+    await expect(settingsDialog).toBeVisible()
 
-    await dialog.searchBox.fill('Test')
+    // Search for our test settings
+    const searchBox = comfyPage.page.locator('.settings-search-box input')
+    await searchBox.fill('Test')
 
-    await expect(dialog.contentArea).toContainText('Test Visible Setting')
-    await expect(dialog.contentArea).not.toContainText('Test Hidden Setting')
-    await expect(dialog.contentArea).not.toContainText(
-      'Test Deprecated Setting'
-    )
+    // Get all settings content
+    const settingsContent = comfyPage.page.locator('.settings-tab-panels')
+
+    // Should only show the visible setting
+    await expect(settingsContent).toContainText('Test Visible Setting')
+
+    // Should not show hidden or deprecated settings
+    await expect(settingsContent).not.toContainText('Test Hidden Setting')
+    await expect(settingsContent).not.toContainText('Test Deprecated Setting')
   })
 
   test('search by setting name excludes hidden and deprecated', async ({
     comfyPage
   }) => {
-    const dialog = comfyPage.settingDialog
-    await dialog.open()
+    // Open settings dialog
+    await comfyPage.page.keyboard.press('Control+,')
+    const settingsDialog = comfyPage.page.locator('.settings-container')
+    await expect(settingsDialog).toBeVisible()
 
-    await dialog.searchBox.clear()
-    await dialog.searchBox.fill('Hidden')
-    await expect(dialog.contentArea).not.toContainText('Test Hidden Setting')
+    const searchBox = comfyPage.page.locator('.settings-search-box input')
+    const settingsContent = comfyPage.page.locator('.settings-tab-panels')
 
-    await dialog.searchBox.clear()
-    await dialog.searchBox.fill('Deprecated')
-    await expect(dialog.contentArea).not.toContainText(
-      'Test Deprecated Setting'
-    )
+    // Search specifically for hidden setting by name
+    await searchBox.clear()
+    await searchBox.fill('Hidden')
 
-    await dialog.searchBox.clear()
-    await dialog.searchBox.fill('Visible')
-    await expect(dialog.contentArea).toContainText('Test Visible Setting')
+    // Should not show the hidden setting even when searching by name
+    await expect(settingsContent).not.toContainText('Test Hidden Setting')
+
+    // Search specifically for deprecated setting by name
+    await searchBox.clear()
+    await searchBox.fill('Deprecated')
+
+    // Should not show the deprecated setting even when searching by name
+    await expect(settingsContent).not.toContainText('Test Deprecated Setting')
+
+    // Search for visible setting by name - should work
+    await searchBox.clear()
+    await searchBox.fill('Visible')
+
+    // Should show the visible setting
+    await expect(settingsContent).toContainText('Test Visible Setting')
   })
 })

browser_tests/tests/vueNodes/interactions/links/linkInteraction.spec.ts

@@ -102,7 +102,6 @@ test.describe('Vue Node Link Interaction', { tag: '@screenshot' }, () => {
   test.beforeEach(async ({ comfyPage }) => {
     await comfyPage.settings.setSetting('Comfy.UseNewMenu', 'Top')
     await comfyPage.settings.setSetting('Comfy.VueNodes.Enabled', true)
-    await comfyPage.settings.setSetting('Comfy.NodeSearchBoxImpl', 'default')
     // await comfyPage.setup()
     await comfyPage.workflow.loadWorkflow('vueNodes/simple-triple')
     await comfyPage.vueNodes.waitForNodes()
@@ -929,10 +928,7 @@ test.describe('Vue Node Link Interaction', { tag: '@screenshot' }, () => {
         'Comfy.LinkRelease.ActionShift',
         'context menu'
       )
-      await comfyPage.settings.setSetting(
-        'Comfy.NodeSearchBoxImpl',
-        'v1 (legacy)'
-      )
+      await comfyPage.settings.setSetting('Comfy.NodeSearchBoxImpl', 'default')
 
       const samplerNode = (
         await comfyPage.nodeOps.getNodeRefsByType('KSampler')
@@ -998,10 +994,6 @@ test.describe('Vue Node Link Interaction', { tag: '@screenshot' }, () => {
         'Comfy.LinkRelease.ActionShift',
         'search box'
       )
-      await comfyPage.settings.setSetting(
-        'Comfy.NodeSearchBoxImpl',
-        'v1 (legacy)'
-      )
 
       const samplerNode = (
         await comfyPage.nodeOps.getNodeRefsByType('KSampler')
@@ -1056,11 +1048,6 @@ test.describe('Vue Node Link Interaction', { tag: '@screenshot' }, () => {
     comfyPage,
     comfyMouse
   }) => {
-    await comfyPage.settings.setSetting(
-      'Comfy.NodeSearchBoxImpl',
-      'v1 (legacy)'
-    )
-
     // Setup workflow with a KSampler node
     await comfyPage.command.executeCommand('Comfy.NewBlankWorkflow')
     await comfyPage.nodeOps.waitForGraphNodes(0)

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

@@ -1,57 +0,0 @@
-import { expect } from '@playwright/test'
-
-import { comfyPageFixture as test } from '../../../../fixtures/ComfyPage'
-
-test.describe('Vue Nodes Image Preview', () => {
-  test.beforeEach(async ({ comfyPage }) => {
-    await comfyPage.setSetting('Comfy.VueNodes.Enabled', true)
-    await comfyPage.loadWorkflow('widgets/load_image_widget')
-    await comfyPage.vueNodes.waitForNodes()
-  })
-
-  async function loadImageOnNode(
-    comfyPage: Awaited<
-      ReturnType<(typeof test)['info']>
-    >['fixtures']['comfyPage']
-  ) {
-    const loadImageNode = (await comfyPage.getNodeRefsByType('LoadImage'))[0]
-    const { x, y } = await loadImageNode.getPosition()
-
-    await comfyPage.dragAndDropFile('image64x64.webp', {
-      dropPosition: { x, y }
-    })
-
-    const imagePreview = comfyPage.page.locator('.image-preview')
-    await expect(imagePreview).toBeVisible()
-    await expect(imagePreview.locator('img')).toBeVisible()
-    await expect(imagePreview).toContainText('x')
-
-    return imagePreview
-  }
-
-  test.fixme('opens mask editor from image preview button', async ({
-    comfyPage
-  }) => {
-    const imagePreview = await loadImageOnNode(comfyPage)
-
-    await imagePreview.locator('[role="img"]').hover()
-    await comfyPage.page.getByLabel('Edit or mask image').click()
-
-    await expect(comfyPage.page.locator('.mask-editor-dialog')).toBeVisible()
-  })
-
-  test.fixme('shows image context menu options', async ({ comfyPage }) => {
-    await loadImageOnNode(comfyPage)
-
-    const nodeHeader = comfyPage.vueNodes.getNodeByTitle('Load Image')
-    await nodeHeader.click()
-    await nodeHeader.click({ button: 'right' })
-
-    const contextMenu = comfyPage.page.locator('.p-contextmenu')
-    await expect(contextMenu).toBeVisible()
-    await expect(contextMenu.getByText('Open Image')).toBeVisible()
-    await expect(contextMenu.getByText('Copy Image')).toBeVisible()
-    await expect(contextMenu.getByText('Save Image')).toBeVisible()
-    await expect(contextMenu.getByText('Open in Mask Editor')).toBeVisible()
-  })
-})