merge: FE-732 (PR #12417) into m1-fe-integration

Lock the post-FE-732 contracts surfaced by the latent Boolean
prop-default-true fix and the unconditional filter rendering:

- MediaAssetContextMenu.test.ts — add an explicit
  showDeleteButton: false case so the opt-out path of the prop is
  asserted, complementing the input-mode default-true case from the
  parent commit. Reshape mountComponent to take an opts object.

- MediaAssetFilterBar.test.ts — new component test verifies the
  filter button renders unconditionally and that the settings menu
  receives show-sort-options=true after the constant pin.

.env_example

@@ -41,6 +41,10 @@ ALGOLIA_API_KEY=684d998c36b67a9a9fce8fc2d8860579
 # Enable PostHog debug logging in the browser console.
 # VITE_POSTHOG_DEBUG=true
 
+# Override staging comfy-api / comfy-platform base URLs.
+# VITE_STAGING_API_BASE_URL=https://stagingapi.comfy.org
+# VITE_STAGING_PLATFORM_BASE_URL=https://stagingplatform.comfy.org
+
 # Sentry ENV vars replace with real ones for debugging
 # SENTRY_AUTH_TOKEN=private-token # get from sentry
 # SENTRY_ORG=comfy-org

.github/actions/start-comfyui-server/action.yaml

@@ -19,5 +19,8 @@ runs:
       run: |
         set -euo pipefail
         cp -r ./tools/devtools/* /ComfyUI/custom_nodes/ComfyUI_devtools/
-        cd /ComfyUI && python3 main.py --cpu --multi-user --front-end-root "${{ inputs.front_end_root }}" &
+        # TODO(FE-729): remove --enable-assets once BE-786 lands in the CI ComfyUI image
+        # (BE-786 removes the gate so /api/assets is always on). Until then, FE-729
+        # routes modelStore through assetService, which 503s without this flag.
+        cd /ComfyUI && python3 main.py --cpu --multi-user --enable-assets --front-end-root "${{ inputs.front_end_root }}" &
         wait-for-it --service 127.0.0.1:8188 -t ${{ inputs.timeout }}

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

@@ -39,7 +39,7 @@ jobs:
 
       - name: Install dependencies for analysis tools
         run: |
-          pnpm install -g typescript @vue/compiler-sfc
+          pnpm add -g typescript @vue/compiler-sfc
 
       - name: Run Claude PR Review
         uses: anthropics/claude-code-action@ff34ce0ff04a470bd3fa56c1ef391c8f1c19f8e9 # v1.0.38

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

@@ -40,11 +40,11 @@ jobs:
       - name: Install dependencies for analysis tools
         run: |
           # Check if packages are already available locally
-          if ! pnpm list typescript @vue/compiler-sfc >/dev/null 2>&1; then
+          if ! pnpm list -g typescript @vue/compiler-sfc >/dev/null 2>&1; then
             echo "Installing TypeScript and Vue compiler globally..."
-            pnpm install -g typescript @vue/compiler-sfc
+            pnpm add -g typescript @vue/compiler-sfc
           else
-            echo "TypeScript and Vue compiler already available locally"
+            echo "TypeScript and Vue compiler already available globally"
           fi
 
       - name: Run Claude Documentation Review

.npmrc

@@ -1,3 +0,0 @@
-ignore-workspace-root-check=true
-catalog-mode=prefer
-public-hoist-pattern[]=@parcel/watcher

apps/website/public/favicon.svg

@@ -0,0 +1,14 @@
+<svg width="48" height="48" viewBox="0 0 48 48" xmlns="http://www.w3.org/2000/svg">
+  <style>
+    .bg { fill: #000000; }
+    .fg { fill: #F2FF59; }
+    @media (prefers-color-scheme: dark) {
+      .bg { fill: #F2FF59; }
+      .fg { fill: #000000; }
+    }
+  </style>
+  <circle class="bg" cx="24" cy="24" r="24"/>
+  <g transform="translate(7.8 6.72) scale(0.72)">
+    <path class="fg" d="M35.6487 36.021C35.733 35.7387 35.7791 35.4411 35.7791 35.1283C35.7791 33.3963 34.3675 31.9924 32.6262 31.9924H18.4956C17.7361 32 17.1147 31.3896 17.1147 30.6342C17.1147 30.4969 17.1377 30.3672 17.1684 30.2451L20.9734 17.0606C21.1345 16.4807 21.6715 16.0534 22.3005 16.0534L36.4848 16.0382C39.4766 16.0382 42.0005 14.0315 42.76 11.2923L44.8926 3.94468C44.9616 3.68526 45 3.40296 45 3.12065C45 1.39628 43.5961 0 41.8624 0L24.7017 0C21.7252 0 19.209 1.99142 18.4342 4.70005L16.992 9.71292C16.8232 10.2852 16.2939 10.7048 15.6648 10.7048H11.5453C8.59189 10.7048 6.0987 12.6581 5.30089 15.3362L0.11507 33.3505C0.0383566 33.6175 0 33.9075 0 34.1974C0 35.9294 1.41152 37.3333 3.15292 37.3333H7.20338C7.96284 37.3333 8.58421 37.9437 8.58421 38.7067C8.58421 38.8364 8.56887 38.9661 8.53051 39.0882L7.09598 44.0553C7.02694 44.3224 6.98091 44.597 6.98091 44.8794C6.98091 46.6037 8.38476 48 10.1185 48L27.2869 47.9847C30.2711 47.9847 32.7873 45.9857 33.5544 43.2618L35.641 36.0286L35.6487 36.021Z"/>
+  </g>
+</svg>

apps/website/src/data/ashby-roles.snapshot.json

@@ -1,5 +1,5 @@
 {
-  "fetchedAt": "2026-05-12T16:10:34.114Z",
+  "fetchedAt": "2026-05-22T00:07:48.353Z",
   "departments": [
     {
       "name": "DESIGN",
@@ -36,14 +36,14 @@
           "id": "6a6d865eeb3c10a8",
           "title": "Senior Software Engineer, Frontend",
           "department": "Engineering",
-          "location": "San Francisco",
+          "location": "Remote",
           "jobUrl": "https://jobs.ashbyhq.com/comfy-org/c3e0584d-5490-491f-aae4-b5922ef63fd2"
         },
         {
           "id": "1b4f7f1da9616e14",
           "title": "Senior Software Engineer, Backend Generalist",
           "department": "Engineering",
-          "location": "San Francisco",
+          "location": "Remote",
           "jobUrl": "https://jobs.ashbyhq.com/comfy-org/732f8b39-076d-4847-afe3-f54d4451607e"
         },
         {
@@ -71,14 +71,14 @@
           "id": "91604c4182a1bc3c",
           "title": "Software Engineer, Core ComfyUI Contributor",
           "department": "Engineering",
-          "location": "San Francisco",
+          "location": "Remote",
           "jobUrl": "https://jobs.ashbyhq.com/comfy-org/7d4062d6-d500-445a-9a5f-014971af259f"
         },
         {
           "id": "a1dbc0576ab14034",
           "title": "Software Engineer, ComfyUI Desktop",
           "department": "Engineering",
-          "location": "San Francisco",
+          "location": "Remote",
           "jobUrl": "https://jobs.ashbyhq.com/comfy-org/ad2f76cb-a787-47d8-81c5-7e7f917747c0"
         },
         {
@@ -105,21 +105,21 @@
           "id": "23dd98cab77ff459",
           "title": "Freelance Motion Designer",
           "department": "Marketing",
-          "location": "San Francisco",
+          "location": "Remote",
           "jobUrl": "https://jobs.ashbyhq.com/comfy-org/a7ccc2b4-4d9d-4e04-b39c-28a711995b5b"
         },
         {
           "id": "a998b9fc973ff3c0",
           "title": "Creative Artist",
           "department": "Marketing",
-          "location": "San Francisco",
+          "location": "Remote",
           "jobUrl": "https://jobs.ashbyhq.com/comfy-org/19ba10aa-4961-45e8-8473-66a8a7a8079d"
         },
         {
           "id": "3e730938026d6e70",
           "title": "Graphic Designer",
           "department": "Marketing",
-          "location": "San Francisco",
+          "location": "Remote",
           "jobUrl": "https://jobs.ashbyhq.com/comfy-org/49fa0b07-3fa1-4a3a-b2c6-d2cc684ad63f"
         },
         {
@@ -135,6 +135,20 @@
           "department": "Marketing",
           "location": "San Francisco",
           "jobUrl": "https://jobs.ashbyhq.com/comfy-org/89d3ff75-2055-4e92-9c69-81feff55627c"
+        },
+        {
+          "id": "e11f8b9e58dbea81",
+          "title": "Creative Producer",
+          "department": "Marketing",
+          "location": "Remote",
+          "jobUrl": "https://jobs.ashbyhq.com/comfy-org/7be2d690-7a2b-4ebf-b1c4-6907b273d3d9"
+        },
+        {
+          "id": "6eac654593208ec3",
+          "title": "Forward Deployed Creative Technologist",
+          "department": "Marketing",
+          "location": "San Francisco",
+          "jobUrl": "https://jobs.ashbyhq.com/comfy-org/af49c05f-dcd8-4c3d-a464-43eb3b1c6efc"
         }
       ]
     },

apps/website/src/layouts/BaseLayout.astro

@@ -71,7 +71,7 @@ const websiteJsonLd = {
     {noindex && <meta name="robots" content="noindex, nofollow" />}
     <title>{title}</title>
 
-    <link rel="icon" href="/icons/logomark.svg" type="image/svg+xml" />
+    <link rel="icon" href="/favicon.svg" type="image/svg+xml" />
     <link rel="canonical" href={canonicalURL.href} />
     <link rel="preconnect" href="https://www.googletagmanager.com" />
     <link rel="dns-prefetch" href="https://www.googletagmanager.com" />

apps/website/src/utils/cloudNodes.registry.test.ts

@@ -2,7 +2,8 @@ import { describe, expect, it, vi } from 'vitest'
 
 import {
   DEFAULT_REGISTRY_BASE_URL,
-  fetchRegistryPacks
+  fetchRegistryPacks,
+  fetchRegistryPacksWithNodes
 } from './cloudNodes.registry'
 
 function jsonResponse(
@@ -142,3 +143,315 @@ describe('fetchRegistryPacks', () => {
     expect(result.size).toBe(0)
   })
 })
+
+describe('fetchRegistryPacksWithNodes', () => {
+  it('fetches pack metadata and comfy nodes for each pack', async () => {
+    const fetchImpl = vi.fn(async (input: RequestInfo | URL) => {
+      const url = new URL(String(input))
+
+      // Pack metadata request
+      if (url.pathname === '/nodes') {
+        return jsonResponse({
+          nodes: [
+            {
+              id: 'comfyui-impact-pack',
+              name: 'ComfyUI Impact Pack',
+              repository: 'https://github.com/ltdrdata/ComfyUI-Impact-Pack',
+              latest_version: { version: '8.0.0', createdAt: '2026-01-01' }
+            }
+          ]
+        })
+      }
+
+      // Comfy nodes request
+      if (url.pathname.includes('/comfy-nodes')) {
+        return jsonResponse({
+          comfy_nodes: [
+            { comfy_node_name: 'FaceDetailer', category: 'detailer' },
+            { comfy_node_name: 'DetailerForEach', category: 'detailer' }
+          ],
+          totalNumberOfPages: 1
+        })
+      }
+
+      return new Response('Not found', { status: 404 })
+    })
+
+    const result = await fetchRegistryPacksWithNodes(['comfyui-impact-pack'], {
+      fetchImpl: fetchImpl as typeof fetch
+    })
+
+    expect(result.size).toBe(1)
+    const packData = result.get('comfyui-impact-pack')
+    expect(packData).not.toBeNull()
+    expect(packData?.pack.name).toBe('ComfyUI Impact Pack')
+    expect(packData?.nodes).toHaveLength(2)
+    expect(packData?.nodes[0]?.comfy_node_name).toBe('FaceDetailer')
+  })
+
+  it('handles pagination for comfy nodes', async () => {
+    let comfyNodesCallCount = 0
+    const fetchImpl = vi.fn(async (input: RequestInfo | URL) => {
+      const url = new URL(String(input))
+
+      if (url.pathname === '/nodes') {
+        return jsonResponse({
+          nodes: [
+            {
+              id: 'big-pack',
+              name: 'Big Pack',
+              latest_version: { version: '1.0.0' }
+            }
+          ]
+        })
+      }
+
+      if (url.pathname.includes('/comfy-nodes')) {
+        comfyNodesCallCount++
+        const page = Number(url.searchParams.get('page') ?? '1')
+
+        if (page === 1) {
+          return jsonResponse({
+            comfy_nodes: [
+              { comfy_node_name: 'Node1', category: 'cat1' },
+              { comfy_node_name: 'Node2', category: 'cat1' }
+            ],
+            totalNumberOfPages: 2
+          })
+        } else {
+          return jsonResponse({
+            comfy_nodes: [{ comfy_node_name: 'Node3', category: 'cat2' }],
+            totalNumberOfPages: 2
+          })
+        }
+      }
+
+      return new Response('Not found', { status: 404 })
+    })
+
+    const result = await fetchRegistryPacksWithNodes(['big-pack'], {
+      fetchImpl: fetchImpl as typeof fetch
+    })
+
+    expect(comfyNodesCallCount).toBe(2)
+    const packData = result.get('big-pack')
+    expect(packData?.nodes).toHaveLength(3)
+  })
+
+  it('returns null for packs without latest_version', async () => {
+    const fetchImpl = vi.fn(async (input: RequestInfo | URL) => {
+      const url = new URL(String(input))
+
+      if (url.pathname === '/nodes') {
+        return jsonResponse({
+          nodes: [
+            {
+              id: 'no-version-pack',
+              name: 'No Version Pack',
+              latest_version: null
+            }
+          ]
+        })
+      }
+
+      return new Response('Not found', { status: 404 })
+    })
+
+    const result = await fetchRegistryPacksWithNodes(['no-version-pack'], {
+      fetchImpl: fetchImpl as typeof fetch
+    })
+
+    expect(result.get('no-version-pack')).toBeNull()
+  })
+
+  it('returns empty nodes array when comfy-nodes request fails', async () => {
+    const fetchImpl = vi.fn(async (input: RequestInfo | URL) => {
+      const url = new URL(String(input))
+
+      if (url.pathname === '/nodes') {
+        return jsonResponse({
+          nodes: [
+            {
+              id: 'failing-pack',
+              name: 'Failing Pack',
+              latest_version: { version: '1.0.0' }
+            }
+          ]
+        })
+      }
+
+      if (url.pathname.includes('/comfy-nodes')) {
+        return new Response('Server error', { status: 500 })
+      }
+
+      return new Response('Not found', { status: 404 })
+    })
+
+    const result = await fetchRegistryPacksWithNodes(['failing-pack'], {
+      fetchImpl: fetchImpl as typeof fetch
+    })
+
+    const packData = result.get('failing-pack')
+    expect(packData).not.toBeNull()
+    expect(packData?.pack.name).toBe('Failing Pack')
+    expect(packData?.nodes).toHaveLength(0)
+  })
+
+  it('handles null comfy_nodes in response', async () => {
+    const fetchImpl = vi.fn(async (input: RequestInfo | URL) => {
+      const url = new URL(String(input))
+
+      if (url.pathname === '/nodes') {
+        return jsonResponse({
+          nodes: [
+            {
+              id: 'null-nodes-pack',
+              name: 'Null Nodes Pack',
+              latest_version: { version: '1.0.0' }
+            }
+          ]
+        })
+      }
+
+      if (url.pathname.includes('/comfy-nodes')) {
+        return jsonResponse({
+          comfy_nodes: null,
+          totalNumberOfPages: 1
+        })
+      }
+
+      return new Response('Not found', { status: 404 })
+    })
+
+    const result = await fetchRegistryPacksWithNodes(['null-nodes-pack'], {
+      fetchImpl: fetchImpl as typeof fetch
+    })
+
+    const packData = result.get('null-nodes-pack')
+    expect(packData?.nodes).toHaveLength(0)
+  })
+
+  it('fetches nodes for multiple packs in parallel', async () => {
+    const packIds = ['pack-a', 'pack-b', 'pack-c']
+    const fetchImpl = vi.fn(async (input: RequestInfo | URL) => {
+      const url = new URL(String(input))
+
+      if (url.pathname === '/nodes') {
+        const requestedIds = url.searchParams.getAll('node_id')
+        return jsonResponse({
+          nodes: requestedIds.map((id) => ({
+            id,
+            name: id.toUpperCase(),
+            latest_version: { version: '1.0.0' }
+          }))
+        })
+      }
+
+      if (url.pathname.includes('/comfy-nodes')) {
+        const packId = url.pathname.split('/nodes/')[1]?.split('/')[0]
+        return jsonResponse({
+          comfy_nodes: [
+            { comfy_node_name: `${packId}-node`, category: 'test' }
+          ],
+          totalNumberOfPages: 1
+        })
+      }
+
+      return new Response('Not found', { status: 404 })
+    })
+
+    const result = await fetchRegistryPacksWithNodes(packIds, {
+      fetchImpl: fetchImpl as typeof fetch
+    })
+
+    expect(result.size).toBe(3)
+    for (const packId of packIds) {
+      const packData = result.get(packId)
+      expect(packData).not.toBeNull()
+      expect(packData?.nodes[0]?.comfy_node_name).toBe(`${packId}-node`)
+    }
+  })
+
+  it('retries comfy-nodes fetch once on failure', async () => {
+    let comfyNodesAttempts = 0
+    const fetchImpl = vi.fn(async (input: RequestInfo | URL) => {
+      const url = new URL(String(input))
+
+      if (url.pathname === '/nodes') {
+        return jsonResponse({
+          nodes: [
+            {
+              id: 'retry-pack',
+              name: 'Retry Pack',
+              latest_version: { version: '1.0.0' }
+            }
+          ]
+        })
+      }
+
+      if (url.pathname.includes('/comfy-nodes')) {
+        comfyNodesAttempts++
+        if (comfyNodesAttempts === 1) {
+          return new Response('Server error', { status: 500 })
+        }
+        return jsonResponse({
+          comfy_nodes: [{ comfy_node_name: 'RetryNode', category: 'test' }],
+          totalNumberOfPages: 1
+        })
+      }
+
+      return new Response('Not found', { status: 404 })
+    })
+
+    const result = await fetchRegistryPacksWithNodes(['retry-pack'], {
+      fetchImpl: fetchImpl as typeof fetch
+    })
+
+    expect(comfyNodesAttempts).toBe(2)
+    const packData = result.get('retry-pack')
+    expect(packData?.nodes).toHaveLength(1)
+    expect(packData?.nodes[0]?.comfy_node_name).toBe('RetryNode')
+  })
+
+  it('normalizes null boolean fields in comfy nodes', async () => {
+    const fetchImpl = vi.fn(async (input: RequestInfo | URL) => {
+      const url = new URL(String(input))
+
+      if (url.pathname === '/nodes') {
+        return jsonResponse({
+          nodes: [
+            {
+              id: 'bool-pack',
+              name: 'Bool Pack',
+              latest_version: { version: '1.0.0' }
+            }
+          ]
+        })
+      }
+
+      if (url.pathname.includes('/comfy-nodes')) {
+        return jsonResponse({
+          comfy_nodes: [
+            {
+              comfy_node_name: 'TestNode',
+              category: 'test',
+              deprecated: null,
+              experimental: null
+            }
+          ],
+          totalNumberOfPages: 1
+        })
+      }
+
+      return new Response('Not found', { status: 404 })
+    })
+
+    const result = await fetchRegistryPacksWithNodes(['bool-pack'], {
+      fetchImpl: fetchImpl as typeof fetch
+    })
+
+    const packData = result.get('bool-pack')
+    expect(packData?.nodes[0]?.deprecated).toBeUndefined()
+    expect(packData?.nodes[0]?.experimental).toBeUndefined()
+  })
+})

apps/website/src/utils/cloudNodes.registry.ts

@@ -5,8 +5,10 @@ import type { components } from '@comfyorg/registry-types'
 export const DEFAULT_REGISTRY_BASE_URL = 'https://api.comfy.org'
 const DEFAULT_TIMEOUT_MS = 5_000
 const BATCH_SIZE = 50
+const COMFY_NODES_PAGE_SIZE = 500
 
 export type RegistryPack = components['schemas']['Node']
+export type RegistryComfyNode = components['schemas']['ComfyNode']
 
 function nullToUndefined<T>(value: T | null | undefined): T | undefined {
   return value ?? undefined
@@ -58,6 +60,29 @@ const RegistryListResponseSchema = z
   })
   .passthrough()
 
+const RegistryComfyNodeSchema = z
+  .object({
+    comfy_node_name: optionalString,
+    category: optionalString,
+    description: optionalString,
+    deprecated: z
+      .boolean()
+      .nullish()
+      .transform((v) => v ?? undefined),
+    experimental: z
+      .boolean()
+      .nullish()
+      .transform((v) => v ?? undefined)
+  })
+  .passthrough()
+
+const RegistryComfyNodesResponseSchema = z
+  .object({
+    comfy_nodes: z.array(RegistryComfyNodeSchema).nullish(),
+    totalNumberOfPages: z.number().nullish()
+  })
+  .passthrough()
+
 interface FetchRegistryOptions {
   baseUrl?: string
   timeoutMs?: number
@@ -122,6 +147,142 @@ export async function fetchRegistryPacks(
   return resolved
 }
 
+export interface RegistryPackWithNodes {
+  pack: RegistryPack
+  nodes: RegistryComfyNode[]
+}
+
+export async function fetchRegistryPacksWithNodes(
+  packIds: readonly string[],
+  options: FetchRegistryOptions = {}
+): Promise<Map<string, RegistryPackWithNodes | null>> {
+  const packs = await fetchRegistryPacks(packIds, options)
+
+  const baseUrl = options.baseUrl ?? DEFAULT_REGISTRY_BASE_URL
+  const timeoutMs = clampTimeoutMs(options.timeoutMs)
+  const fetchImpl = options.fetchImpl ?? fetch
+
+  const entries = await Promise.all(
+    [...packs.entries()].map(
+      async ([packId, pack]): Promise<
+        [string, RegistryPackWithNodes | null]
+      > => {
+        if (!pack?.latest_version?.version) {
+          return [packId, null]
+        }
+
+        const nodes = await fetchComfyNodesForPack(
+          fetchImpl,
+          baseUrl,
+          packId,
+          pack.latest_version.version,
+          timeoutMs
+        )
+
+        return [packId, { pack, nodes }]
+      }
+    )
+  )
+
+  return new Map(entries)
+}
+
+async function fetchComfyNodesForPack(
+  fetchImpl: typeof fetch,
+  baseUrl: string,
+  packId: string,
+  version: string,
+  timeoutMs: number
+): Promise<RegistryComfyNode[]> {
+  const allNodes: RegistryComfyNode[] = []
+  let page = 1
+  let totalPages = 1
+
+  while (page <= totalPages) {
+    const result = await fetchComfyNodesPageWithRetry(
+      fetchImpl,
+      baseUrl,
+      packId,
+      version,
+      page,
+      timeoutMs
+    )
+
+    if (!result) break
+
+    allNodes.push(...result.nodes)
+    totalPages = result.totalPages
+    page++
+  }
+
+  return allNodes
+}
+
+async function fetchComfyNodesPageWithRetry(
+  fetchImpl: typeof fetch,
+  baseUrl: string,
+  packId: string,
+  version: string,
+  page: number,
+  timeoutMs: number
+): Promise<{ nodes: RegistryComfyNode[]; totalPages: number } | null> {
+  const firstAttempt = await fetchComfyNodesPage(
+    fetchImpl,
+    baseUrl,
+    packId,
+    version,
+    page,
+    timeoutMs
+  )
+  if (firstAttempt) return firstAttempt
+
+  // Retry once on failure
+  return fetchComfyNodesPage(
+    fetchImpl,
+    baseUrl,
+    packId,
+    version,
+    page,
+    timeoutMs
+  )
+}
+
+async function fetchComfyNodesPage(
+  fetchImpl: typeof fetch,
+  baseUrl: string,
+  packId: string,
+  version: string,
+  page: number,
+  timeoutMs: number
+): Promise<{ nodes: RegistryComfyNode[]; totalPages: number } | null> {
+  const controller = new AbortController()
+  const timer = setTimeout(() => controller.abort(), timeoutMs)
+
+  try {
+    const url = `${baseUrl}/nodes/${encodeURIComponent(packId)}/versions/${encodeURIComponent(version)}/comfy-nodes?limit=${COMFY_NODES_PAGE_SIZE}&page=${page}`
+    const res = await fetchImpl(url, {
+      method: 'GET',
+      headers: { Accept: 'application/json' },
+      signal: controller.signal
+    })
+
+    if (!res.ok) return null
+
+    const rawBody: unknown = await res.json()
+    const parsed = RegistryComfyNodesResponseSchema.safeParse(rawBody)
+    if (!parsed.success) return null
+
+    return {
+      nodes: (parsed.data.comfy_nodes ?? []) as RegistryComfyNode[],
+      totalPages: parsed.data.totalNumberOfPages ?? 1
+    }
+  } catch {
+    return null
+  } finally {
+    clearTimeout(timer)
+  }
+}
+
 async function fetchBatchWithRetry(
   fetchImpl: typeof fetch,
   baseUrl: string,

apps/website/src/utils/cloudNodes.test.ts

@@ -8,12 +8,16 @@ import { afterEach, beforeEach, describe, expect, it, vi } from 'vitest'
 import type { NodesSnapshot } from '../data/cloudNodes'
 import type * as ObjectInfoParser from '@comfyorg/object-info-parser'
 
-const fetchRegistryPacksMock = vi.hoisted(() => vi.fn(async () => new Map()))
+import type { RegistryPackWithNodes } from './cloudNodes.registry'
+
+const fetchRegistryPacksWithNodesMock = vi.hoisted(() =>
+  vi.fn(async () => new Map<string, RegistryPackWithNodes | null>())
+)
 const sanitizeCallSpy = vi.hoisted(() => vi.fn())
 
 vi.mock('./cloudNodes.registry', () => ({
   DEFAULT_REGISTRY_BASE_URL: 'https://api.comfy.org',
-  fetchRegistryPacks: fetchRegistryPacksMock
+  fetchRegistryPacksWithNodes: fetchRegistryPacksWithNodesMock
 }))
 
 vi.mock('@comfyorg/object-info-parser', async (importOriginal) => {
@@ -90,8 +94,8 @@ describe('fetchCloudNodesForBuild', () => {
 
   beforeEach(() => {
     resetCloudNodesFetcherForTests()
-    fetchRegistryPacksMock.mockReset()
-    fetchRegistryPacksMock.mockResolvedValue(new Map())
+    fetchRegistryPacksWithNodesMock.mockReset()
+    fetchRegistryPacksWithNodesMock.mockResolvedValue(new Map())
     sanitizeCallSpy.mockReset()
     delete process.env.WEBSITE_CLOUD_API_KEY
   })
@@ -102,14 +106,21 @@ describe('fetchCloudNodesForBuild', () => {
   })
 
   it('returns fresh when API succeeds', async () => {
-    fetchRegistryPacksMock.mockResolvedValue(
-      new Map([
+    fetchRegistryPacksWithNodesMock.mockResolvedValue(
+      new Map<string, RegistryPackWithNodes | null>([
         [
           'comfyui-impact-pack',
           {
-            id: 'comfyui-impact-pack',
-            name: 'ComfyUI Impact Pack',
-            repository: 'https://github.com/ltdrdata/ComfyUI-Impact-Pack'
+            pack: {
+              id: 'comfyui-impact-pack',
+              name: 'ComfyUI Impact Pack',
+              repository: 'https://github.com/ltdrdata/ComfyUI-Impact-Pack',
+              latest_version: { version: '1.0.0' }
+            },
+            nodes: [
+              { comfy_node_name: 'FaceDetailer', category: 'detailer' },
+              { comfy_node_name: 'DetailerForEach', category: 'detailer' }
+            ]
           }
         ]
       ])
@@ -129,6 +140,10 @@ describe('fetchCloudNodesForBuild', () => {
     expect(outcome.snapshot.packs[0]?.repoUrl).toBe(
       'https://github.com/ltdrdata/ComfyUI-Impact-Pack'
     )
+    // Nodes should come from registry, not object_info
+    expect(outcome.snapshot.packs[0]?.nodes).toHaveLength(2)
+    expect(outcome.snapshot.packs[0]?.nodes[0]?.name).toBe('DetailerForEach')
+    expect(outcome.snapshot.packs[0]?.nodes[1]?.name).toBe('FaceDetailer')
   })
 
   it('drops invalid nodes individually and keeps valid nodes', async () => {
@@ -297,7 +312,7 @@ describe('fetchCloudNodesForBuild', () => {
   })
 
   it('returns fresh even when registry enrichment fails', async () => {
-    fetchRegistryPacksMock.mockResolvedValue(new Map())
+    fetchRegistryPacksWithNodesMock.mockResolvedValue(new Map())
     const fetchImpl = vi.fn(async () => response({ ImpactNode: validNode() }))
     const outcome = await fetchCloudNodesForBuild({
       apiKey: KEY,
@@ -305,5 +320,8 @@ describe('fetchCloudNodesForBuild', () => {
       fetchImpl: fetchImpl as typeof fetch
     })
     expect(outcome.status).toBe('fresh')
+    // Falls back to object_info nodes when registry fails
+    if (outcome.status !== 'fresh') return
+    expect(outcome.snapshot.packs[0]?.nodes[0]?.name).toBe('ImpactNode')
   })
 })

apps/website/src/utils/cloudNodes.ts

@@ -6,12 +6,15 @@ import {
   validateComfyNodeDef
 } from '@comfyorg/object-info-parser'
 
-import type { RegistryPack } from './cloudNodes.registry'
+import type {
+  RegistryComfyNode,
+  RegistryPackWithNodes
+} from './cloudNodes.registry'
 import type { NodesSnapshot, Pack, PackNode } from '../data/cloudNodes'
 
 import bundledSnapshot from '../data/cloud-nodes.snapshot.json' with { type: 'json' }
 import { isNodesSnapshot } from '../data/cloudNodes'
-import { fetchRegistryPacks } from './cloudNodes.registry'
+import { fetchRegistryPacksWithNodes } from './cloudNodes.registry'
 import { CloudNodesEnvelopeSchema } from './cloudNodes.schema'
 
 const DEFAULT_BASE_URL = 'https://cloud.comfy.org'
@@ -235,26 +238,28 @@ async function parseCloudNodes(
   const sanitizedDefs = sanitizeUserContent(
     validDefs as Record<string, NonNullable<(typeof validDefs)[string]>>
   )
-  const grouped = groupNodesByPack(sanitizedDefs)
 
-  let registryMap = new Map<string, RegistryPack | null>()
+  // Use object_info to determine which packs are cloud-supported
+  const grouped = groupNodesByPack(sanitizedDefs)
+  const packIds = grouped.map((pack) => pack.id)
+
+  // Fetch full pack metadata and node list from registry
+  let registryMap = new Map<string, RegistryPackWithNodes | null>()
   try {
-    registryMap = await fetchRegistryPacks(
-      grouped.map((pack) => pack.id),
-      { fetchImpl: options.fetchImpl }
-    )
+    registryMap = await fetchRegistryPacksWithNodes(packIds, {
+      fetchImpl: options.fetchImpl
+    })
   } catch {
     registryMap = new Map()
   }
 
-  const packs = grouped.map((pack) =>
-    toDomainPack(
-      pack.id,
-      pack.displayName,
-      pack.nodes,
-      registryMap.get(pack.id)
-    )
-  )
+  const packs = grouped
+    .map((pack) => {
+      const registryData = registryMap.get(pack.id)
+      // Use registry nodes if available, otherwise fall back to object_info nodes
+      return toDomainPack(pack.id, pack.displayName, pack.nodes, registryData)
+    })
+    .filter((pack) => pack.nodes.length > 0)
 
   return { kind: 'ok', packs, droppedNodes }
 }
@@ -274,7 +279,7 @@ function safeExternalUrl(value: string | undefined): string | undefined {
 function toDomainPack(
   packId: string,
   fallbackDisplayName: string,
-  nodes: Array<{
+  objectInfoNodes: Array<{
     className: string
     def: {
       display_name: string
@@ -284,8 +289,18 @@ function toDomainPack(
       experimental?: boolean
     }
   }>,
-  registryPack: RegistryPack | null | undefined
+  registryData: RegistryPackWithNodes | null | undefined
 ): Pack {
+  const registryPack = registryData?.pack
+
+  // Prefer registry nodes if available, fall back to object_info nodes
+  const nodes =
+    registryData?.nodes && registryData.nodes.length > 0
+      ? registryData.nodes
+          .map((node) => toDomainNodeFromRegistry(node))
+          .filter((n): n is PackNode => n !== null)
+      : objectInfoNodes.map((node) => toDomainNode(node.className, node.def))
+
   return {
     id: packId,
     registryId: registryPack?.id,
@@ -308,9 +323,20 @@ function toDomainPack(
       registryPack?.latest_version?.createdAt ?? registryPack?.created_at,
     supportedOs: registryPack?.supported_os,
     supportedAccelerators: registryPack?.supported_accelerators,
-    nodes: nodes
-      .map((node) => toDomainNode(node.className, node.def))
-      .sort((a, b) => a.displayName.localeCompare(b.displayName))
+    nodes: nodes.sort((a, b) => a.displayName.localeCompare(b.displayName))
+  }
+}
+
+function toDomainNodeFromRegistry(node: RegistryComfyNode): PackNode | null {
+  if (!node.comfy_node_name) return null
+
+  return {
+    name: node.comfy_node_name,
+    displayName: node.comfy_node_name,
+    category: node.category || '',
+    description: node.description || undefined,
+    deprecated: node.deprecated,
+    experimental: node.experimental
   }
 }
 

browser_tests/assets/missing/fe746_load_image_bare_filename.json

@@ -0,0 +1,42 @@
+{
+  "last_node_id": 10,
+  "last_link_id": 0,
+  "nodes": [
+    {
+      "id": 10,
+      "type": "LoadImage",
+      "pos": [50, 200],
+      "size": [315, 314],
+      "flags": {},
+      "order": 0,
+      "mode": 0,
+      "inputs": [],
+      "outputs": [
+        {
+          "name": "IMAGE",
+          "type": "IMAGE",
+          "links": null
+        },
+        {
+          "name": "MASK",
+          "type": "MASK",
+          "links": null
+        }
+      ],
+      "properties": {
+        "Node name for S&R": "LoadImage"
+      },
+      "widgets_values": ["fe746_photo.png", "image"]
+    }
+  ],
+  "links": [],
+  "groups": [],
+  "config": {},
+  "extra": {
+    "ds": {
+      "offset": [0, 0],
+      "scale": 1
+    }
+  },
+  "version": 0.4
+}

browser_tests/fixtures/components/ComfyNodeSearchBoxV2.ts

@@ -1,8 +1,10 @@
+import { expect } from '@playwright/test'
 import type { Locator } from '@playwright/test'
 
 import type { RootCategoryId } from '@/components/searchbox/v2/rootCategories'
 import type { ComfyPage } from '@e2e/fixtures/ComfyPage'
 import { TestIds } from '@e2e/fixtures/selectors'
+import type { Position } from '@e2e/fixtures/types'
 
 const { searchBoxV2 } = TestIds
 
@@ -84,11 +86,12 @@ export class ComfyNodeSearchBoxV2 {
     await this.input.waitFor({ state: 'visible' })
   }
 
-  async openByDoubleClickCanvas(): Promise<void> {
+  async openByDoubleClickCanvas(position?: Position) {
+    const { x, y } = position ?? { x: 200, y: 200 }
     // Use page.mouse.dblclick (not canvas.dblclick) so the z-999 Vue overlay
     // does not intercept; coords target a viewport spot that is on the canvas
     // and clear of both the side toolbar and any default-graph nodes.
-    await this.comfyPage.page.mouse.dblclick(200, 200, { delay: 5 })
+    await this.comfyPage.page.mouse.dblclick(x, y, { delay: 5 })
   }
 
   async ensureV2Search(): Promise<void> {
@@ -109,4 +112,14 @@ export class ComfyNodeSearchBoxV2 {
       'search box'
     )
   }
+
+  async addNode(query: string, options: { position?: Position } = {}) {
+    const position = options.position ?? { x: 200, y: 200 }
+    await this.openByDoubleClickCanvas(position)
+    await this.input.fill(query)
+    await expect(this.results.first()).toContainText(query)
+    await this.comfyPage.page.keyboard.press('Enter')
+    await expect(this.dialog).toBeHidden()
+    await this.comfyPage.page.mouse.click(position.x, position.y)
+  }
 }

browser_tests/fixtures/components/QueuePanel.ts

@@ -5,11 +5,13 @@ import { TestIds } from '@e2e/fixtures/selectors'
 
 export class QueuePanel {
   readonly overlayToggle: Locator
+  readonly overlay: Locator
   readonly moreOptionsButton: Locator
 
   constructor(readonly page: Page) {
     this.overlayToggle = page.getByTestId(TestIds.queue.overlayToggle)
-    this.moreOptionsButton = page.getByLabel(/More options/i).first()
+    this.overlay = page.getByTestId(TestIds.queue.progressOverlay)
+    this.moreOptionsButton = this.overlay.getByLabel(/More options/i)
   }
 
   async openClearHistoryDialog() {

browser_tests/fixtures/components/WidgetSelectDropdown.ts

@@ -2,10 +2,24 @@ import type { Locator } from '@playwright/test'
 
 export class WidgetSelectDropdownFixture {
   public readonly selection: Locator
+  public readonly trigger: Locator
 
   constructor(public readonly root: Locator) {
+    this.trigger = root.locator('button:has(> span)').first()
     this.selection = root.locator('button span span')
   }
+
+  async open(): Promise<void> {
+    await this.trigger.click()
+  }
+
+  async searchAndSelectTop(popover: Locator, query: string): Promise<void> {
+    await this.open()
+    const searchInput = popover.getByRole('textbox')
+    await searchInput.fill(query)
+    await searchInput.press('Enter')
+  }
+
   async selectedItem(): Promise<string> {
     return await this.selection.innerText()
   }

browser_tests/fixtures/helpers/AppModeWidgetHelper.ts

@@ -1,6 +1,7 @@
 import type { Locator, Page } from '@playwright/test'
 
 import type { ComfyPage } from '@e2e/fixtures/ComfyPage'
+import { WidgetSelectDropdownFixture } from '@e2e/fixtures/components/WidgetSelectDropdown'
 
 /**
  * Helper for interacting with widgets rendered in app mode (linear view).
@@ -24,6 +25,11 @@ export class AppModeWidgetHelper {
     return this.container.locator(`[data-widget-key="${key}"]`)
   }
 
+  /** Get a FormDropdown widget by its key (e.g. "10:image"). */
+  getSelectDropdown(key: string): WidgetSelectDropdownFixture {
+    return new WidgetSelectDropdownFixture(this.getWidgetItem(key))
+  }
+
   /** Fill a textarea widget (e.g. CLIP Text Encode prompt). */
   async fillTextarea(key: string, value: string) {
     const widget = this.getWidgetItem(key)

browser_tests/fixtures/helpers/BuilderSelectHelper.ts

@@ -119,9 +119,22 @@ export class BuilderSelectHelper {
     )[0]
     if (!nodeRef) throw new Error(`Node ${nodeTitle} not found`)
     await nodeRef.centerOnNode()
-    const widgetLocator = this.comfyPage.vueNodes
-      .getNodeLocator(String(nodeRef.id))
-      .getByLabel(widgetName, { exact: true })
+    const node = this.comfyPage.vueNodes.getNodeLocator(String(nodeRef.id))
+    // Grid-mode widgets (WidgetSelectDefault) and number widgets expose
+    // aria-label on a wrapper/input. Asset-mode widgets (WidgetSelectDropdown)
+    // do not — the widget name lives in a sibling
+    // [data-testid="widget-layout-field-label"] div, so fall back to clicking
+    // the dropdown trigger button in the same row.
+    const byAriaLabel = node.getByLabel(widgetName, { exact: true })
+    const widgetLocator =
+      (await byAriaLabel.count()) > 0
+        ? byAriaLabel
+        : node
+            .getByTestId('widget-layout-field-label')
+            .filter({ hasText: widgetName })
+            .locator('..')
+            .locator('button')
+            .first()
     // oxlint-disable-next-line playwright/no-force-option -- Node container has conditional pointer-events:none that blocks actionability
     await widgetLocator.click({ force: true })
     await this.comfyPage.nextFrame()

browser_tests/fixtures/helpers/LogsTerminalHelper.ts

@@ -1,19 +1,26 @@
-import { test as base } from '@playwright/test'
-import type { Page, Route } from '@playwright/test'
+import { test as base, expect } from '@playwright/test'
+import type { Page, Route, WebSocketRoute } from '@playwright/test'
 
 import type { LogsRawResponse } from '@/schemas/apiSchema'
 
+const RAW_LOGS_URL = '**/internal/logs/raw**'
+const SUBSCRIBE_LOGS_URL = '**/internal/logs/subscribe**'
+
 export class LogsTerminalHelper {
   constructor(private readonly page: Page) {}
 
-  async mockRawLogs(messages: string[]) {
-    await this.page.route('**/internal/logs/raw**', (route: Route) =>
-      route.fulfill({
+  async mockRawLogs(messages: string[]): Promise<() => number> {
+    let count = 0
+    await this.page.unroute(RAW_LOGS_URL)
+    await this.page.route(RAW_LOGS_URL, async (route: Route) => {
+      count += 1
+      await route.fulfill({
         status: 200,
         contentType: 'application/json',
         body: JSON.stringify(LogsTerminalHelper.buildRawLogsResponse(messages))
       })
-    )
+    })
+    return () => count
   }
 
   async mockRawLogsPending(messages: string[] = []): Promise<() => void> {
@@ -21,7 +28,8 @@ export class LogsTerminalHelper {
     const pending = new Promise<void>((r) => {
       resolve = r
     })
-    await this.page.route('**/internal/logs/raw**', async (route: Route) => {
+    await this.page.unroute(RAW_LOGS_URL)
+    await this.page.route(RAW_LOGS_URL, async (route: Route) => {
       await pending
       await route.fulfill({
         status: 200,
@@ -33,15 +41,39 @@ export class LogsTerminalHelper {
   }
 
   async mockRawLogsError() {
-    await this.page.route('**/internal/logs/raw**', (route: Route) =>
+    await this.page.unroute(RAW_LOGS_URL)
+    await this.page.route(RAW_LOGS_URL, (route: Route) =>
       route.fulfill({ status: 500, body: 'Internal Server Error' })
     )
   }
 
-  async mockSubscribeLogs() {
-    await this.page.route('**/internal/logs/subscribe**', (route: Route) =>
-      route.fulfill({ status: 200, body: '' })
-    )
+  async mockSubscribeLogs(): Promise<() => number> {
+    let count = 0
+    await this.page.unroute(SUBSCRIBE_LOGS_URL)
+    await this.page.route(SUBSCRIBE_LOGS_URL, async (route: Route) => {
+      count += 1
+      await route.fulfill({ status: 200, body: '' })
+    })
+    return () => count
+  }
+
+  /**
+   * Force the frontend to reconnect by closing the proxied WebSocket. The
+   * api layer reschedules a fresh `WebSocket(...)`, the routeWebSocket
+   * handler fires again, and on `open` with `isReconnect=true` it dispatches
+   * `'reconnected'`, which triggers the logs-terminal resync.
+   *
+   * Use the resync's `subscribeLogs(true)` HTTP call as the sync point — by
+   * the time the count goes up, the new socket is open and resync has
+   * completed enough to assert against the terminal.
+   */
+  async triggerReconnect(
+    ws: WebSocketRoute,
+    subscribeFetches: () => number
+  ): Promise<void> {
+    const before = subscribeFetches()
+    await ws.close()
+    await expect.poll(subscribeFetches).toBeGreaterThan(before)
   }
 
   static buildWsLogFrame(messages: string[]): string {

browser_tests/fixtures/helpers/SubgraphHelper.ts

@@ -11,6 +11,7 @@ import type { ComfyWorkflowJSON } from '@/platform/workflow/validation/schemas/w
 import type { ComfyPage } from '@e2e/fixtures/ComfyPage'
 import { SubgraphEditor } from '@e2e/fixtures/components/SubgraphEditor'
 import { TestIds } from '@e2e/fixtures/selectors'
+import type { Position, Size } from '@e2e/fixtures/types'
 import type { NodeReference } from '@e2e/fixtures/utils/litegraphUtils'
 import { SubgraphSlotReference } from '@e2e/fixtures/utils/litegraphUtils'
 
@@ -241,6 +242,17 @@ export class SubgraphHelper {
     return new SubgraphSlotReference('output', slotName || '', this.comfyPage)
   }
 
+  async getInputBounds(): Promise<Position & Size> {
+    return await this.comfyPage.page.evaluate(() => {
+      const graph = app!.canvas.graph as Subgraph
+      const inputNode = graph.inputNode
+      const [x, y] = app!.canvas.ds.convertOffsetToCanvas(inputNode.pos)
+      const width = inputNode.size[0] * app!.canvas.ds.scale
+      const height = inputNode.size[1] * app!.canvas.ds.scale
+      return { x, y, width, height }
+    })
+  }
+
   /**
    * Connect a regular node output to a subgraph input.
    * This creates a new input slot on the subgraph if targetInputName is not provided.

browser_tests/fixtures/jobsRouteFixture.ts

@@ -1,14 +1,22 @@
 import { test as base } from '@playwright/test'
 import type { Page } from '@playwright/test'
 import type { z } from 'zod'
+import {
+  zHistoryManageRequest,
+  zQueueManageRequest,
+  zQueueManageResponse
+} from '@comfyorg/ingest-types/zod'
 
 import type {
+  JobDetail,
   JobStatus,
   RawJobListItem,
   zJobsListResponse
 } from '@/platform/remote/comfyui/jobs/jobTypes'
 
 type JobsListResponse = z.infer<typeof zJobsListResponse>
+type HistoryManageRequest = z.infer<typeof zHistoryManageRequest>
+type QueueManageRequest = z.infer<typeof zQueueManageRequest>
 
 const terminalJobStatuses = [
   'completed',
@@ -22,7 +30,8 @@ const activeJobStatuses = [
 const defaultJobsListLimit = 200
 const defaultScenarioHistoryLimit = 64
 const defaultJobsListOffset = 0
-const defaultRouteMockJobTimestamp = Date.UTC(2026, 0, 1, 12)
+
+export const routeMockJobTimestamp = Date.UTC(2026, 0, 1, 12)
 
 interface JobsListRoute {
   statuses: readonly JobStatus[]
@@ -32,7 +41,7 @@ interface JobsListRoute {
   responseLimit?: number
 }
 
-interface JobsScenario {
+export interface JobsScenario {
   history?: readonly RawJobListItem[]
   queue?: readonly RawJobListItem[]
 }
@@ -65,11 +74,9 @@ function hasJobsListPageParams(
   )
 }
 
-function isJobsListRequest(url: URL, route: JobsListRoute): boolean {
+function matchesJobsListRoute(url: URL, route: JobsListRoute): boolean {
   return (
-    url.pathname.endsWith('/api/jobs') &&
-    hasExactStatuses(url, route.statuses) &&
-    hasJobsListPageParams(url, route)
+    hasExactStatuses(url, route.statuses) && hasJobsListPageParams(url, route)
   )
 }
 
@@ -99,9 +106,9 @@ export function createRouteMockJob({
   return {
     id,
     status: 'completed',
-    create_time: defaultRouteMockJobTimestamp,
-    execution_start_time: defaultRouteMockJobTimestamp,
-    execution_end_time: defaultRouteMockJobTimestamp + 5_000,
+    create_time: routeMockJobTimestamp,
+    execution_start_time: routeMockJobTimestamp,
+    execution_end_time: routeMockJobTimestamp + 5_000,
     preview_output: {
       filename: `output_${id}.png`,
       subfolder: '',
@@ -150,7 +157,8 @@ export class JobsRouteMocker {
     const response = createJobsListResponse(route)
 
     await this.page.route(
-      (url) => isJobsListRequest(url, route),
+      (url) =>
+        url.pathname.endsWith('/api/jobs') && matchesJobsListRoute(url, route),
       async (requestRoute) => {
         if (requestRoute.request().method().toUpperCase() !== 'GET') {
           await requestRoute.fallback()
@@ -161,6 +169,62 @@ export class JobsRouteMocker {
       }
     )
   }
+
+  async mockClearQueue(): Promise<QueueManageRequest[]> {
+    const response = zQueueManageResponse.parse({ cleared: true })
+    return await this.mockPostManageRoute(
+      'queue',
+      zQueueManageRequest,
+      response
+    )
+  }
+
+  async mockClearHistory(): Promise<HistoryManageRequest[]> {
+    return await this.mockPostManageRoute('history', zHistoryManageRequest, {})
+  }
+
+  async mockDeleteHistory(): Promise<HistoryManageRequest[]> {
+    return await this.mockPostManageRoute('history', zHistoryManageRequest, {})
+  }
+
+  async mockJobDetail(jobId: string, detail: JobDetail): Promise<void> {
+    await this.page.route(
+      (url) => url.pathname.endsWith(`/api/jobs/${encodeURIComponent(jobId)}`),
+      async (requestRoute) => {
+        if (requestRoute.request().method().toUpperCase() !== 'GET') {
+          await requestRoute.fallback()
+          return
+        }
+
+        await requestRoute.fulfill({ json: detail })
+      }
+    )
+  }
+
+  private async mockPostManageRoute<TRequest>(
+    type: 'queue' | 'history',
+    requestSchema: z.ZodType<TRequest>,
+    response: unknown
+  ): Promise<TRequest[]> {
+    const requests: TRequest[] = []
+
+    await this.page.route(
+      (url) => url.pathname.endsWith(`/api/${type}`),
+      async (requestRoute) => {
+        if (requestRoute.request().method().toUpperCase() !== 'POST') {
+          await requestRoute.fallback()
+          return
+        }
+
+        requests.push(
+          requestSchema.parse(requestRoute.request().postDataJSON())
+        )
+        await requestRoute.fulfill({ json: response })
+      }
+    )
+
+    return requests
+  }
 }
 
 export const jobsRouteFixture = base.extend<{
@@ -168,6 +232,5 @@ export const jobsRouteFixture = base.extend<{
 }>({
   jobsRoutes: async ({ page }, use) => {
     await use(new JobsRouteMocker(page))
-    await page.unrouteAll({ behavior: 'wait' })
   }
 })

browser_tests/fixtures/selectors.ts

@@ -76,7 +76,15 @@ export const TestIds = {
     publishTabPanel: 'publish-tab-panel',
     apiSignin: 'api-signin-dialog',
     updatePassword: 'update-password-dialog',
-    cloudNotification: 'cloud-notification-dialog'
+    cloudNotification: 'cloud-notification-dialog',
+    openSharedWorkflow: 'open-shared-workflow-dialog',
+    openSharedWorkflowTitle: 'open-shared-workflow-title',
+    openSharedWorkflowClose: 'open-shared-workflow-close',
+    openSharedWorkflowErrorClose: 'open-shared-workflow-error-close',
+    openSharedWorkflowCancel: 'open-shared-workflow-cancel',
+    openSharedWorkflowOpenWithoutImporting:
+      'open-shared-workflow-open-without-importing',
+    openSharedWorkflowConfirm: 'open-shared-workflow-confirm'
   },
   keybindings: {
     presetMenu: 'keybinding-preset-menu'
@@ -226,7 +234,10 @@ export const TestIds = {
     currentUserIndicator: 'current-user-indicator'
   },
   queue: {
+    jobHistorySidebar: 'job-history-sidebar',
+    progressOverlay: 'queue-progress-overlay',
     overlayToggle: 'queue-overlay-toggle',
+    dockedJobHistoryAction: 'docked-job-history-action',
     jobDetailsPopover: 'queue-job-details-popover',
     clearHistoryAction: 'clear-history-action',
     jobAssetsList: 'job-assets-list',

browser_tests/fixtures/sharedWorkflowImportFixture.ts

@@ -0,0 +1,250 @@
+import { test as base } from '@playwright/test'
+import type { Page } from '@playwright/test'
+import type {
+  Asset,
+  ImportPublishedAssetsRequest,
+  ListAssetsResponse
+} from '@comfyorg/ingest-types'
+import type { z } from 'zod'
+
+import type { zSharedWorkflowResponse } from '@/platform/workflow/sharing/schemas/shareSchemas'
+import type { AssetInfo } from '@/schemas/apiSchema'
+
+type SharedWorkflowResponse = z.input<typeof zSharedWorkflowResponse>
+
+export const sharedWorkflowImportScenario = {
+  shareId: 'shared-missing-media-e2e',
+  workflowId: 'shared-missing-media-workflow',
+  publishedAssetId: 'published-input-asset-1',
+  inputFileName: 'shared_imported_image.png'
+} as const
+
+export type SharedWorkflowRequestEvent =
+  | 'import'
+  | 'input-assets-including-public-before-import'
+  | 'input-assets-including-public-after-import'
+
+export interface SharedWorkflowImportMocks {
+  resetAndStartRecording: () => void
+  getImportBody: () => ImportPublishedAssetsRequest | undefined
+  getRequestEvents: () => SharedWorkflowRequestEvent[]
+  waitForPublicInclusiveInputAssetResponseAfterImport: () => Promise<void>
+}
+
+const defaultInputFileName = '00000000000000000000000Aexample.png'
+
+const sharedWorkflowAsset: AssetInfo = {
+  id: sharedWorkflowImportScenario.publishedAssetId,
+  name: sharedWorkflowImportScenario.inputFileName,
+  preview_url: '',
+  storage_url: '',
+  model: false,
+  public: false,
+  in_library: false
+}
+
+const defaultInputAsset: Asset = {
+  id: 'default-input-asset',
+  name: defaultInputFileName,
+  asset_hash: defaultInputFileName,
+  size: 1_024,
+  mime_type: 'image/png',
+  tags: ['input'],
+  created_at: '2026-05-01T00:00:00Z',
+  updated_at: '2026-05-01T00:00:00Z',
+  last_access_time: '2026-05-01T00:00:00Z'
+}
+
+const importedInputAsset: Asset = {
+  id: 'imported-input-asset',
+  name: sharedWorkflowImportScenario.inputFileName,
+  asset_hash: sharedWorkflowImportScenario.inputFileName,
+  size: 1_024,
+  mime_type: 'image/png',
+  tags: ['input'],
+  created_at: '2026-05-01T00:00:00Z',
+  updated_at: '2026-05-01T00:00:00Z',
+  last_access_time: '2026-05-01T00:00:00Z'
+}
+
+const sharedWorkflowResponse: SharedWorkflowResponse = {
+  share_id: sharedWorkflowImportScenario.shareId,
+  workflow_id: sharedWorkflowImportScenario.workflowId,
+  name: 'Shared Missing Media Workflow',
+  listed: true,
+  publish_time: '2026-05-01T00:00:00Z',
+  workflow_json: {
+    version: 0.4,
+    last_node_id: 10,
+    last_link_id: 0,
+    nodes: [
+      {
+        id: 10,
+        type: 'LoadImage',
+        pos: [50, 200],
+        size: [315, 314],
+        flags: {},
+        order: 0,
+        mode: 0,
+        inputs: [],
+        outputs: [
+          {
+            name: 'IMAGE',
+            type: 'IMAGE',
+            links: null
+          },
+          {
+            name: 'MASK',
+            type: 'MASK',
+            links: null
+          }
+        ],
+        properties: {
+          'Node name for S&R': 'LoadImage'
+        },
+        widgets_values: [sharedWorkflowImportScenario.inputFileName, 'image']
+      }
+    ],
+    links: [],
+    groups: [],
+    config: {},
+    extra: {
+      ds: {
+        offset: [0, 0],
+        scale: 1
+      }
+    }
+  },
+  assets: [sharedWorkflowAsset]
+}
+
+export const sharedWorkflowImportFixture = base.extend<{
+  sharedWorkflowImportMocks: SharedWorkflowImportMocks
+}>({
+  sharedWorkflowImportMocks: async ({ page }, use) => {
+    const mocks = await mockSharedWorkflowImportFlow(page)
+    await use(mocks)
+  }
+})
+
+async function mockSharedWorkflowImportFlow(
+  page: Page
+): Promise<SharedWorkflowImportMocks> {
+  let isRecording = false
+  let importEndpointCalled = false
+  let importBody: ImportPublishedAssetsRequest | undefined
+  let resolvePublicInclusiveInputAssetResponseAfterImport: () => void = () => {}
+  let publicInclusiveInputAssetResponseAfterImport = new Promise<void>(
+    (resolve) => {
+      resolvePublicInclusiveInputAssetResponseAfterImport = resolve
+    }
+  )
+  const requestEvents: SharedWorkflowRequestEvent[] = []
+
+  function resetPublicInclusiveInputAssetResponseWaiter() {
+    publicInclusiveInputAssetResponseAfterImport = new Promise<void>(
+      (resolve) => {
+        resolvePublicInclusiveInputAssetResponseAfterImport = resolve
+      }
+    )
+  }
+
+  function recordRequestEvent(event: SharedWorkflowRequestEvent) {
+    if (isRecording) requestEvents.push(event)
+  }
+
+  await page.route(
+    `**/workflows/published/${sharedWorkflowImportScenario.shareId}`,
+    async (route) => {
+      await route.fulfill({
+        status: 200,
+        contentType: 'application/json',
+        body: JSON.stringify(sharedWorkflowResponse)
+      })
+    }
+  )
+
+  await page.route('**/api/assets/import', async (route) => {
+    recordRequestEvent('import')
+    importBody = route.request().postDataJSON() as ImportPublishedAssetsRequest
+    importEndpointCalled = true
+
+    await route.fulfill({
+      status: 200,
+      contentType: 'application/json',
+      body: JSON.stringify({})
+    })
+  })
+
+  // Excludes `/api/assets/import` so the specific route above
+  // remains isolated from the general asset listing mock.
+  await page.route(/\/api\/assets(?=\?|$)/, async (route) => {
+    const url = new URL(route.request().url())
+    const includeTags = getTagParam(url, 'include_tags')
+    const isInputAssetRequest = includeTags.includes('input')
+    const includesPublicAssets =
+      url.searchParams.get('include_public') === 'true'
+    const isPublicInclusiveInputAssetRequest =
+      isInputAssetRequest && includesPublicAssets
+    const isAfterImportPublicInclusiveInputAssetRequest =
+      isPublicInclusiveInputAssetRequest && importEndpointCalled
+
+    if (isPublicInclusiveInputAssetRequest) {
+      recordRequestEvent(
+        importEndpointCalled
+          ? 'input-assets-including-public-after-import'
+          : 'input-assets-including-public-before-import'
+      )
+    }
+
+    const allAssets = [
+      defaultInputAsset,
+      ...(importEndpointCalled ? [importedInputAsset] : [])
+    ]
+    const assets = includeTags.length
+      ? allAssets.filter((asset) =>
+          includeTags.every((tag) => asset.tags?.includes(tag))
+        )
+      : allAssets
+
+    const response: ListAssetsResponse = {
+      assets,
+      total: assets.length,
+      has_more: false
+    }
+
+    await route.fulfill({
+      status: 200,
+      contentType: 'application/json',
+      body: JSON.stringify(response)
+    })
+
+    if (isAfterImportPublicInclusiveInputAssetRequest) {
+      resolvePublicInclusiveInputAssetResponseAfterImport()
+    }
+  })
+
+  return {
+    resetAndStartRecording: () => {
+      isRecording = true
+      importEndpointCalled = false
+      importBody = undefined
+      requestEvents.length = 0
+      resetPublicInclusiveInputAssetResponseWaiter()
+    },
+    getImportBody: () => importBody,
+    getRequestEvents: () => [...requestEvents],
+    waitForPublicInclusiveInputAssetResponseAfterImport: () =>
+      publicInclusiveInputAssetResponseAfterImport
+  }
+}
+
+function getTagParam(url: URL, key: string): string[] {
+  return (
+    url.searchParams
+      .get(key)
+      ?.split(',')
+      .map((tag) => tag.trim())
+      .filter(Boolean) ?? []
+  )
+}

browser_tests/fixtures/utils/selectionToolboxMoreOptions.ts

@@ -0,0 +1,28 @@
+import { expect } from '@playwright/test'
+
+import type { ComfyPage } from '@e2e/fixtures/ComfyPage'
+
+export async function openMoreOptionsMenu(
+  comfyPage: ComfyPage,
+  nodeTitle: string
+) {
+  const nodes = await comfyPage.nodeOps.getNodeRefsByTitle(nodeTitle)
+  if (nodes.length === 0) {
+    throw new Error(`No "${nodeTitle}" nodes found`)
+  }
+
+  await nodes[0].centerOnNode()
+  await nodes[0].click('title')
+
+  await expect(comfyPage.page.locator('.selection-toolbox')).toBeVisible()
+
+  const moreOptionsBtn = comfyPage.page.getByTestId('more-options-button')
+  await expect(moreOptionsBtn).toBeVisible()
+  await moreOptionsBtn.click()
+  await comfyPage.nextFrame()
+
+  const menu = comfyPage.page.locator('.p-contextmenu')
+  await expect(menu).toBeVisible()
+
+  return menu
+}

browser_tests/tests/appMode.spec.ts

@@ -2,16 +2,10 @@ import {
   comfyPageFixture as test,
   comfyExpect as expect
 } from '@e2e/fixtures/ComfyPage'
-import { WidgetSelectDropdownFixture } from '@e2e/fixtures/components/WidgetSelectDropdown'
 import { TestIds } from '@e2e/fixtures/selectors'
 
 test.describe('App mode usage', () => {
-  test('Drag and Drop', async ({ comfyPage, comfyFiles }) => {
-    await comfyPage.settings.setSetting('Comfy.VueNodes.Enabled', true)
-    await comfyPage.settings.setSetting(
-      'Comfy.NodeSearchBoxImpl',
-      'v1 (legacy)'
-    )
+  test('Drag and Drop @vue-nodes', async ({ comfyPage, comfyFiles }) => {
     const { centerPanel } = comfyPage.appMode
     await comfyPage.appMode.enterAppModeWithInputs([['3', 'seed']])
     await expect(centerPanel, 'Enter app mode').toBeVisible()
@@ -25,15 +19,12 @@ test.describe('App mode usage', () => {
     //prep a load image
     await test.step('Add a load image node', async () => {
       await comfyPage.workflow.loadWorkflow('default')
-      await comfyPage.page.mouse.dblclick(200, 200, { delay: 5 })
-      await comfyPage.searchBox.fillAndSelectFirstNode('Load Image')
+      await comfyPage.searchBoxV2.addNode('Load Image')
       const loadImage = await comfyPage.vueNodes.getNodeLocator('10')
       await expect(loadImage).toBeVisible()
     })
 
-    const imageInput = new WidgetSelectDropdownFixture(
-      comfyPage.appMode.linearWidgets.locator('.lg-node-widget')
-    )
+    const imageInput = comfyPage.appMode.widgets.getSelectDropdown('10:image')
 
     await test.step('Enter app mode with image input', async () => {
       await comfyPage.appMode.enterAppModeWithInputs([['10', 'image']])
@@ -107,6 +98,45 @@ test.describe('App mode usage', () => {
     //verify values are consistent with litegraph
   })
 
+  test('FormDropdown search Enter selects the top filtered item', async ({
+    comfyPage
+  }) => {
+    await comfyPage.appMode.enableLinearMode()
+    const loadImageNode = await comfyPage.nodeOps.addNode('LoadImage')
+    await comfyPage.nextFrame()
+
+    const fileComboWidget = await loadImageNode.getWidget(0)
+    const targetImage = String(await fileComboWidget.getValue())
+    const initialImage = 'not-selected.png'
+    await comfyPage.page.evaluate(
+      ([nodeId, value]) => {
+        const node = window.app!.graph!.getNodeById(nodeId)
+        const widget = node?.widgets?.[0]
+        if (!widget) throw new Error(`Image widget not found: ${nodeId}`)
+
+        widget.value = value
+      },
+      [loadImageNode.id, initialImage] as const
+    )
+    await expect.poll(() => fileComboWidget.getValue()).toBe(initialImage)
+
+    await comfyPage.appMode.enterAppModeWithInputs([
+      [String(loadImageNode.id), 'image']
+    ])
+    await expect(comfyPage.appMode.linearWidgets).toBeVisible()
+    const imageInput = comfyPage.appMode.widgets.getSelectDropdown(
+      `${loadImageNode.id}:image`
+    )
+    const popover = comfyPage.appMode.imagePickerPopover
+
+    await expect(imageInput.root).toBeVisible()
+    await imageInput.searchAndSelectTop(popover, targetImage)
+
+    await expect(popover).toBeHidden()
+    await expect(imageInput.selection).toHaveText(targetImage)
+    await expect.poll(() => fileComboWidget.getValue()).toBe(targetImage)
+  })
+
   test.describe('Mobile', { tag: ['@mobile'] }, () => {
     test('panel navigation', async ({ comfyPage }) => {
       const { mobile } = comfyPage.appMode

browser_tests/tests/appModeBuilder.spec.ts

@@ -75,33 +75,28 @@ test.describe('App mode builder selection', () => {
   })
 
   test('Marks canvas readOnly', async ({ comfyPage }) => {
-    await comfyPage.settings.setSetting(
-      'Comfy.NodeSearchBoxImpl',
-      'v1 (legacy)'
-    )
-
-    await comfyPage.page.mouse.dblclick(100, 100, { delay: 5 })
+    await comfyPage.searchBoxV2.openByDoubleClickCanvas()
     await expect(
-      comfyPage.searchBox.input,
+      comfyPage.searchBoxV2.input,
       'Canvas is initially editable'
-    ).toHaveCount(1)
+    ).toBeVisible()
     await comfyPage.page.keyboard.press('Escape')
 
     await comfyPage.appMode.enterBuilder()
     await comfyPage.appMode.steps.goToInputs()
 
-    await comfyPage.page.mouse.dblclick(100, 100, { delay: 5 })
+    await comfyPage.searchBoxV2.openByDoubleClickCanvas()
     await expect(
-      comfyPage.searchBox.input,
+      comfyPage.searchBoxV2.input,
       'Entering builder makes the canvas readonly'
-    ).toHaveCount(0)
+    ).toBeHidden()
 
     await comfyPage.page.keyboard.press('Space')
-    await comfyPage.page.mouse.dblclick(100, 100, { delay: 5 })
+    await comfyPage.searchBoxV2.openByDoubleClickCanvas()
     await expect(
-      comfyPage.searchBox.input,
+      comfyPage.searchBoxV2.input,
       'Canvas remains readonly after pressing space'
-    ).toHaveCount(0)
+    ).toBeHidden()
 
     const ksampler = await comfyPage.vueNodes.getFixtureByTitle('KSampler')
     // oxlint-disable-next-line playwright/no-force-option -- Node container has conditional pointer-events:none that blocks actionability
@@ -112,10 +107,10 @@ test.describe('App mode builder selection', () => {
     ).toBeHidden()
 
     await comfyPage.page.keyboard.press('Escape')
-    await comfyPage.page.mouse.dblclick(100, 100, { delay: 5 })
+    await comfyPage.searchBoxV2.openByDoubleClickCanvas()
     await expect(
-      comfyPage.searchBox.input,
+      comfyPage.searchBoxV2.input,
       'Canvas is no longer readonly after exiting'
-    ).toHaveCount(1)
+    ).toBeVisible()
   })
 })

browser_tests/tests/appModeDropdownClipping.spec.ts

@@ -131,13 +131,10 @@ test.describe('App mode dropdown clipping', { tag: '@ui' }, () => {
       el.scrollTo({ top: el.scrollHeight, behavior: 'instant' })
     )
 
-    // Click the FormDropdown trigger button for the image widget.
-    // The button emits 'select-click' which toggles the Popover.
-    const imageRow = widgetList.locator(
-      'div:has(> div > span:text-is("image"))'
+    const imageInput = comfyPage.appMode.widgets.getSelectDropdown(
+      `${loadImageId}:image`
     )
-    const dropdownButton = imageRow.locator('button:has(> span)').first()
-    await dropdownButton.click()
+    await imageInput.open()
 
     // The unstyled PrimeVue Popover renders with role="dialog".
     // Locate the one containing the image grid (filter buttons like "All", "Inputs").

browser_tests/tests/assetDeleteClearsLoadImage.spec.ts

@@ -2,13 +2,15 @@
  * FE-230: Deleting an asset must clear the Load Image node preview, widget
  * value, and mark the workflow dirty.
  *
- * Local run (requires cloud build of the frontend):
- *   pnpm build:cloud
- *   pnpm exec playwright test --project=cloud \
- *     browser_tests/tests/assetDeleteClearsLoadImage.spec.ts --reporter=list
+ * FE-732: Input-asset deletion is no longer gated on `isCloud`; the same
+ * teardown flow now applies to both Cloud and OSS builds. Cloud and OSS
+ * variants below cover both Playwright projects against the shared mock.
  *
- * The cloud project is required because input-asset deletion is gated on
- * `isCloud === true` (see `useMediaAssetActions.deleteAssetApi`).
+ * Local run examples:
+ *   pnpm build:cloud && pnpm exec playwright test --project=cloud \
+ *     browser_tests/tests/assetDeleteClearsLoadImage.spec.ts --reporter=list
+ *   pnpm build && pnpm exec playwright test --project=chromium \
+ *     browser_tests/tests/assetDeleteClearsLoadImage.spec.ts --reporter=list
  */
 import type { Page, Route } from '@playwright/test'
 import { expect } from '@playwright/test'
@@ -119,81 +121,88 @@ const baseTest = comfyPageFixture.extend<{ assetMock: AssetMockApi }>({
   }
 })
 
+function registerDeleteFlowTest() {
+  baseTest(
+    'deleting an input asset clears widget value, preview cache, and marks workflow modified',
+    async ({ comfyPage, assetMock }) => {
+      await comfyPage.workflow.loadWorkflow('widgets/load_image_widget')
+
+      // Drive the production drag-and-drop flow to point the Load Image
+      // widget at the asset we are about to delete and populate the preview
+      // cache. FE-230 is asserting that the deletion tears these down.
+      const loadImageNode = (
+        await comfyPage.nodeOps.getNodeRefsByType('LoadImage')
+      )[0]
+      const { x, y } = await loadImageNode.getPosition()
+      await comfyPage.dragDrop.dragAndDropFile(DROPPED_FILE, {
+        dropPosition: { x, y },
+        waitForUpload: true
+      })
+      const imageWidget = await loadImageNode.getWidget(0)
+      await expect.poll(() => imageWidget.getValue()).toBe(DROPPED_FILE)
+
+      // Re-baseline the change tracker so the deletion-side mutation is the
+      // only thing that can flip `isModified` later.
+      await comfyPage.page.evaluate(() => {
+        const tracker =
+          window.app?.extensionManager?.workflow?.activeWorkflow?.changeTracker
+        tracker?.reset?.()
+      })
+      await expect
+        .poll(() => comfyPage.workflow.isCurrentWorkflowModified())
+        .toBe(false)
+
+      // Drive the real production flow: assets sidebar → Imported tab →
+      // right-click asset card → Delete → confirm dialog.
+      const sidebar = comfyPage.menu.assetsTab
+      // The default `open()` waits for assets on the Generated tab; we seed
+      // only an input asset, so skip that wait and let `waitForAssets(1)`
+      // gate on the Imported tab instead.
+      await sidebar.open({ waitForAssets: false })
+      await sidebar.switchToImported()
+      await sidebar.waitForAssets(1)
+      await sidebar.rightClickAsset(TARGET_CARD_TEXT)
+
+      const deleteMenuItem = sidebar.contextMenuItem('Delete')
+      await expect(deleteMenuItem).toBeVisible()
+      await deleteMenuItem.click()
+
+      await comfyPage.confirmDialog.click('delete')
+
+      // Mocked DELETE was issued.
+      await expect
+        .poll(() => assetMock.deleteCalls.includes(TARGET_ASSET.id))
+        .toBe(true)
+
+      // Widget value was cleared.
+      await expect.poll(() => imageWidget.getValue()).toBe('')
+
+      // Preview cache was cleared.
+      await expect
+        .poll(() =>
+          comfyPage.page.evaluate((nodeId) => {
+            const node = window.app!.graph.getNodeById(nodeId)
+            return node?.imgs?.length ?? 0
+          }, loadImageNode.id)
+        )
+        .toBe(0)
+
+      // Workflow was marked dirty by changeTracker.captureCanvasState().
+      await expect
+        .poll(() => comfyPage.workflow.isCurrentWorkflowModified())
+        .toBe(true)
+    }
+  )
+}
+
 baseTest.describe(
-  'FE-230 asset delete clears Load Image preview',
+  'FE-230 asset delete clears Load Image preview (cloud)',
   { tag: '@cloud' },
-  () => {
-    baseTest(
-      'deleting an input asset clears widget value, preview cache, and marks workflow modified',
-      async ({ comfyPage, assetMock }) => {
-        await comfyPage.workflow.loadWorkflow('widgets/load_image_widget')
-
-        // Drive the production drag-and-drop flow to point the Load Image
-        // widget at the asset we are about to delete and populate the preview
-        // cache. FE-230 is asserting that the deletion tears these down.
-        const loadImageNode = (
-          await comfyPage.nodeOps.getNodeRefsByType('LoadImage')
-        )[0]
-        const { x, y } = await loadImageNode.getPosition()
-        await comfyPage.dragDrop.dragAndDropFile(DROPPED_FILE, {
-          dropPosition: { x, y },
-          waitForUpload: true
-        })
-        const imageWidget = await loadImageNode.getWidget(0)
-        await expect.poll(() => imageWidget.getValue()).toBe(DROPPED_FILE)
-
-        // Re-baseline the change tracker so the deletion-side mutation is the
-        // only thing that can flip `isModified` later.
-        await comfyPage.page.evaluate(() => {
-          const tracker =
-            window.app?.extensionManager?.workflow?.activeWorkflow
-              ?.changeTracker
-          tracker?.reset?.()
-        })
-        await expect
-          .poll(() => comfyPage.workflow.isCurrentWorkflowModified())
-          .toBe(false)
-
-        // Drive the real production flow: assets sidebar → Imported tab →
-        // right-click asset card → Delete → confirm dialog.
-        const sidebar = comfyPage.menu.assetsTab
-        // The default `open()` waits for assets on the Generated tab; we seed
-        // only an input asset, so skip that wait and let `waitForAssets(1)`
-        // gate on the Imported tab instead.
-        await sidebar.open({ waitForAssets: false })
-        await sidebar.switchToImported()
-        await sidebar.waitForAssets(1)
-        await sidebar.rightClickAsset(TARGET_CARD_TEXT)
-
-        const deleteMenuItem = sidebar.contextMenuItem('Delete')
-        await expect(deleteMenuItem).toBeVisible()
-        await deleteMenuItem.click()
-
-        await comfyPage.confirmDialog.click('delete')
-
-        // Mocked DELETE was issued.
-        await expect
-          .poll(() => assetMock.deleteCalls.includes(TARGET_ASSET.id))
-          .toBe(true)
-
-        // Widget value was cleared.
-        await expect.poll(() => imageWidget.getValue()).toBe('')
-
-        // Preview cache was cleared.
-        await expect
-          .poll(() =>
-            comfyPage.page.evaluate((nodeId) => {
-              const node = window.app!.graph.getNodeById(nodeId)
-              return node?.imgs?.length ?? 0
-            }, loadImageNode.id)
-          )
-          .toBe(0)
-
-        // Workflow was marked dirty by changeTracker.captureCanvasState().
-        await expect
-          .poll(() => comfyPage.workflow.isCurrentWorkflowModified())
-          .toBe(true)
-      }
-    )
-  }
+  registerDeleteFlowTest
+)
+
+baseTest.describe(
+  'FE-230 asset delete clears Load Image preview (oss)',
+  { tag: '@oss' },
+  registerDeleteFlowTest
 )

browser_tests/tests/bottomPanelLogs.spec.ts

@@ -147,5 +147,68 @@ test.describe('Bottom Panel Logs', { tag: '@ui' }, () => {
       )
       await expect(comfyPage.bottomPanel.logs.terminalRoot).toBeHidden()
     })
+
+    test('resyncs the terminal when the WebSocket reconnects', async ({
+      comfyPage,
+      logsTerminal,
+      getWebSocket
+    }) => {
+      const subscribeFetches = await logsTerminal.mockSubscribeLogs()
+      const initialLine = 'pre-reboot log line'
+      const postRebootLineA = 'post-reboot line A'
+      const postRebootLineB = 'post-reboot line B'
+
+      await logsTerminal.mockRawLogs([initialLine])
+      await comfyPage.bottomPanel.toggleLogs()
+      await expect(comfyPage.bottomPanel.logs.terminalRoot).toContainText(
+        initialLine
+      )
+
+      // Swap the raw-logs mock so the next fetch returns the post-reboot view.
+      await logsTerminal.mockRawLogs([postRebootLineA, postRebootLineB])
+
+      const ws = await getWebSocket()
+      await logsTerminal.triggerReconnect(ws, subscribeFetches)
+
+      await expect(comfyPage.bottomPanel.logs.terminalRoot).toContainText(
+        postRebootLineA
+      )
+      await expect(comfyPage.bottomPanel.logs.terminalRoot).toContainText(
+        postRebootLineB
+      )
+      // reset() before write means the pre-reboot line must be gone.
+      await expect(comfyPage.bottomPanel.logs.terminalRoot).not.toContainText(
+        initialLine
+      )
+    })
+
+    test('resumes WebSocket log streaming after the reconnect', async ({
+      comfyPage,
+      logsTerminal,
+      getWebSocket
+    }) => {
+      const subscribeFetches = await logsTerminal.mockSubscribeLogs()
+      await logsTerminal.mockRawLogs(['initial'])
+      await comfyPage.bottomPanel.toggleLogs()
+      await expect(comfyPage.bottomPanel.logs.terminalRoot).toContainText(
+        'initial'
+      )
+
+      await logsTerminal.mockRawLogs(['after-reboot snapshot'])
+
+      const ws = await getWebSocket()
+      await logsTerminal.triggerReconnect(ws, subscribeFetches)
+
+      // The route handler fires again on the new connection; pull the latest
+      // WebSocketRoute and push a live frame to prove the 'logs' listener
+      // survived the reconnect.
+      const liveLine = 'live log emitted after the reconnect'
+      const newWs = await getWebSocket()
+      newWs.send(LogsTerminalHelper.buildWsLogFrame([liveLine]))
+
+      await expect(comfyPage.bottomPanel.logs.terminalRoot).toContainText(
+        liveLine
+      )
+    })
   })
 })

browser_tests/tests/defaultKeybindings.spec.ts

@@ -27,7 +27,6 @@ test.describe('Default Keybindings', { tag: '@keyboard' }, () => {
     const sidebarTabs = [
       { key: 'KeyW', tabId: 'workflows', label: 'workflows' },
       { key: 'KeyN', tabId: 'node-library', label: 'node library' },
-      { key: 'KeyM', tabId: 'model-library', label: 'model library' },
       { key: 'KeyA', tabId: 'assets', label: 'assets' }
     ] as const
 

browser_tests/tests/groupNode.spec.ts

@@ -361,3 +361,15 @@ test.describe('Group Node', { tag: '@node' }, () => {
     })
   })
 })
+
+test('Convert to subgraph unpacks the group Node @vue-nodes', async ({
+  comfyPage
+}) => {
+  await comfyPage.workflow.loadWorkflow('groupnodes/legacy_group_node')
+  await (await comfyPage.vueNodes.getFixtureByTitle('hello')).title.click()
+  await comfyPage.page.keyboard.press('Control+Shift+e')
+  await expect(comfyPage.vueNodes.getNodeByTitle('New Subgraph')).toBeVisible()
+
+  await comfyPage.vueNodes.enterSubgraph()
+  await expect(comfyPage.vueNodes.getNodeByTitle('')).toHaveCount(2)
+})

browser_tests/tests/linearMode.spec.ts

@@ -1,4 +1,5 @@
 import {
+  ComfyPage,
   comfyPageFixture as test,
   comfyExpect as expect
 } from '@e2e/fixtures/ComfyPage'
@@ -43,4 +44,45 @@ test.describe('Linear Mode', { tag: '@ui' }, () => {
     await expect(comfyPage.page.getByTestId('linear-widgets')).toBeVisible()
     await expect(comfyPage.canvas).toBeHidden()
   })
+
+  test('Spinner persists until workflow loaded', async ({
+    page,
+    request
+  }, testInfo) => {
+    const comfyPage = new ComfyPage(page, request)
+    const { parallelIndex } = testInfo
+    const username = `playwright-test-${parallelIndex}`
+    const userId = await comfyPage.setupUser(username)
+    comfyPage.userIds[parallelIndex] = userId
+
+    await page.goto(`${comfyPage.url}/api/users`)
+    await page.evaluate((id) => {
+      localStorage.clear()
+      sessionStorage.clear()
+      localStorage.setItem('Comfy.userId', id)
+    }, comfyPage.id)
+
+    const splash = page.locator('#splash-loader')
+
+    let notifyWorkflowRequested!: () => void
+    const workflowRequested = new Promise<void>(
+      (r) => (notifyWorkflowRequested = r)
+    )
+    let unblockRequest!: () => void
+    const requestUnblocked = new Promise<void>((r) => (unblockRequest = r))
+
+    await page.route('**/templates/default.json', async (route) => {
+      notifyWorkflowRequested()
+      await requestUnblocked
+      return route.continue()
+    })
+
+    await comfyPage.goto({ url: `${comfyPage.url}/?template=default` })
+    await workflowRequested
+
+    await comfyPage.nextFrame()
+    await expect(splash).toBeVisible()
+    unblockRequest()
+    await expect(splash).toBeHidden()
+  })
 })

browser_tests/tests/maskEditor.spec.ts

@@ -218,21 +218,8 @@ test.describe('Mask Editor', { tag: '@vue-nodes' }, () => {
   }) => {
     const dialog = await maskEditor.openDialog()
 
-    let maskUploadCount = 0
     let imageUploadCount = 0
 
-    await comfyPage.page.route('**/upload/mask', (route) => {
-      maskUploadCount++
-      return route.fulfill({
-        status: 200,
-        contentType: 'application/json',
-        body: JSON.stringify({
-          name: `test-mask-${maskUploadCount}.png`,
-          subfolder: 'clipspace',
-          type: 'input'
-        })
-      })
-    })
     await comfyPage.page.route('**/upload/image', (route) => {
       imageUploadCount++
       return route.fulfill({
@@ -252,20 +239,17 @@ test.describe('Mask Editor', { tag: '@vue-nodes' }, () => {
 
     await expect(dialog).toBeHidden()
 
-    // The save pipeline uploads multiple layers (mask + image variants)
+    // The save pipeline uploads four layers (masked, paint, painted, paintedMasked)
+    // through the unified /upload/image endpoint.
     expect(
-      maskUploadCount + imageUploadCount,
-      'save should trigger upload calls'
-    ).toBeGreaterThan(0)
+      imageUploadCount,
+      'save should upload all four layers via /upload/image'
+    ).toBe(4)
   })
 
   test('save failure keeps dialog open', async ({ comfyPage, maskEditor }) => {
     const dialog = await maskEditor.openDialog()
 
-    // Fail all upload routes
-    await comfyPage.page.route('**/upload/mask', (route) =>
-      route.fulfill({ status: 500 })
-    )
     await comfyPage.page.route('**/upload/image', (route) =>
       route.fulfill({ status: 500 })
     )

browser_tests/tests/missingMediaAssetUnion.spec.ts

@@ -0,0 +1,197 @@
+import type { Page } from '@playwright/test'
+import type { Asset, ListAssetsResponse } from '@comfyorg/ingest-types'
+
+import {
+  comfyExpect as expect,
+  comfyPageFixture as test
+} from '@e2e/fixtures/ComfyPage'
+import type { ComfyPage } from '@e2e/fixtures/ComfyPage'
+import { TestIds } from '@e2e/fixtures/selectors'
+import type { WorkspaceStore } from '@e2e/types/globals'
+
+// BE-933 / BE-934 add `file_path` (and BE-933 also `display_name`) to the asset
+// wire shape. `@comfyorg/ingest-types` is not yet regenerated from the updated
+// OpenAPI (tracked under BE-932); extend the local type so mocks can carry the
+// post-BE field without an `any` cast.
+type PostBEAsset = Asset & {
+  file_path?: string | null
+  display_name?: string | null
+}
+
+const WORKFLOW_WIDGET_VALUE = 'fe746_photo.png'
+
+async function mockAssetListing(
+  page: Page,
+  assets: PostBEAsset[]
+): Promise<void> {
+  await page.route(/\/api\/assets(?=\?|$)/, async (route) => {
+    const response: ListAssetsResponse = {
+      assets: assets as Asset[],
+      total: assets.length,
+      has_more: false
+    }
+    await route.fulfill({
+      status: 200,
+      contentType: 'application/json',
+      body: JSON.stringify(response)
+    })
+  })
+}
+
+async function mockAssetListingFailure(
+  page: Page,
+  status: number
+): Promise<void> {
+  await page.route(/\/api\/assets(?=\?|$)/, async (route) => {
+    await route.fulfill({
+      status,
+      contentType: 'application/json',
+      body: JSON.stringify({ detail: `forced ${status} for FE-746 test` })
+    })
+  })
+}
+
+async function getCachedMissingMediaNames(
+  comfyPage: ComfyPage
+): Promise<string[] | null> {
+  return await comfyPage.page.evaluate(() => {
+    const workflow = (window.app!.extensionManager as WorkspaceStore).workflow
+      .activeWorkflow
+    if (!workflow) return null
+    return (
+      workflow.pendingWarnings?.missingMediaCandidates?.map(
+        (candidate) => candidate.name
+      ) ?? []
+    )
+  })
+}
+
+test.describe(
+  'Missing media detection — file_path union (FE-746)',
+  { tag: '@cloud' },
+  () => {
+    test.use({
+      initialSettings: {
+        'Comfy.RightSidePanel.ShowErrorsTab': true
+      }
+    })
+
+    test('does not surface missing media when a post-BE asset emits file_path that diverges from the workflow widget value (Case B regression)', async ({
+      comfyPage
+    }) => {
+      // BE-933 / BE-934 post-deploy shape: asset emits a namespace-rooted
+      // file_path that differs from the bare `name` the user originally chose.
+      // The workflow widget value (`fe746_photo.png`) predates the rollout, so
+      // it must still match via the `name` arm of the detection-key union.
+      // Case A (file_path-only early return) would mark this as missing.
+      await mockAssetListing(comfyPage.page, [
+        {
+          id: 'fe746-asset-1',
+          name: WORKFLOW_WIDGET_VALUE,
+          asset_hash: 'blake3:fe7460000000000000000000000000000',
+          file_path: 'input/sub/fe746_photo.png',
+          size: 1024,
+          mime_type: 'image/png',
+          tags: ['input'],
+          created_at: '2026-05-22T00:00:00Z',
+          updated_at: '2026-05-22T00:00:00Z',
+          last_access_time: '2026-05-22T00:00:00Z'
+        }
+      ])
+
+      await comfyPage.workflow.loadWorkflow(
+        'missing/fe746_load_image_bare_filename'
+      )
+
+      await expect(
+        comfyPage.page.getByTestId(TestIds.dialogs.errorOverlay)
+      ).toBeHidden()
+      await expect.poll(() => getCachedMissingMediaNames(comfyPage)).toEqual([])
+    })
+
+    test('matches via legacy `name` fallback when the asset has no file_path (BE-933 hash-only registration)', async ({
+      comfyPage
+    }) => {
+      // BE-933 hash-only null case: asset registered via POST /assets/from-hash
+      // has no on-disk path, so `file_path` (and `display_name`) come back null.
+      // Detection must still succeed via the legacy `name` arm.
+      await mockAssetListing(comfyPage.page, [
+        {
+          id: 'fe746-asset-hash-only',
+          name: WORKFLOW_WIDGET_VALUE,
+          asset_hash: 'blake3:fe7460000000000000000000000000001',
+          file_path: null,
+          display_name: null,
+          size: 1024,
+          mime_type: 'image/png',
+          tags: ['input'],
+          created_at: '2026-05-22T00:00:00Z',
+          updated_at: '2026-05-22T00:00:00Z',
+          last_access_time: '2026-05-22T00:00:00Z'
+        }
+      ])
+
+      await comfyPage.workflow.loadWorkflow(
+        'missing/fe746_load_image_bare_filename'
+      )
+
+      await expect(
+        comfyPage.page.getByTestId(TestIds.dialogs.errorOverlay)
+      ).toBeHidden()
+      await expect.poll(() => getCachedMissingMediaNames(comfyPage)).toEqual([])
+    })
+
+    test('surfaces missing media when no asset in the listing covers the widget value', async ({
+      comfyPage
+    }) => {
+      // Sanity: with the union still in place, an asset listing that does not
+      // include the widget value via any key (file_path / asset_hash / name)
+      // must still report missing. Guards against accidental "match
+      // everything" regressions when the early-return was removed.
+      await mockAssetListing(comfyPage.page, [
+        {
+          id: 'fe746-unrelated-asset',
+          name: 'unrelated.png',
+          asset_hash: 'blake3:fe7460000000000000000000000000002',
+          file_path: 'input/unrelated.png',
+          size: 1024,
+          mime_type: 'image/png',
+          tags: ['input'],
+          created_at: '2026-05-22T00:00:00Z',
+          updated_at: '2026-05-22T00:00:00Z',
+          last_access_time: '2026-05-22T00:00:00Z'
+        }
+      ])
+
+      await comfyPage.workflow.loadWorkflow(
+        'missing/fe746_load_image_bare_filename'
+      )
+
+      await expect
+        .poll(() => getCachedMissingMediaNames(comfyPage))
+        .toContain(WORKFLOW_WIDGET_VALUE)
+      await expect(
+        comfyPage.page.getByTestId(TestIds.dialogs.errorOverlay)
+      ).toBeVisible()
+    })
+
+    test('soft-degrades when /api/assets fails so verification does not deadlock pending candidates', async ({
+      comfyPage
+    }) => {
+      // Promise.allSettled + per-branch soft-degrade (Finding 2): when the
+      // input-asset oracle fails (pre-BE-786 OSS without /api/assets, partial
+      // BE-934 deploys, transient network errors), the verifier must finish
+      // — marking the candidate missing — rather than leaving isMissing
+      // stuck at undefined behind a silent toast.
+      await mockAssetListingFailure(comfyPage.page, 500)
+
+      await comfyPage.workflow.loadWorkflow(
+        'missing/fe746_load_image_bare_filename'
+      )
+
+      await expect
+        .poll(() => getCachedMissingMediaNames(comfyPage))
+        .toContain(WORKFLOW_WIDGET_VALUE)
+    })
+  }
+)

browser_tests/tests/nodeContextMenuShapeSubmenu.spec.ts

@@ -0,0 +1,65 @@
+import { expect } from '@playwright/test'
+
+import type { ComfyPage } from '@e2e/fixtures/ComfyPage'
+import { comfyPageFixture as test } from '@e2e/fixtures/ComfyPage'
+import { openMoreOptionsMenu } from '@e2e/fixtures/utils/selectionToolboxMoreOptions'
+
+test.describe(
+  'Node context menu shape submenu (FE-570)',
+  { tag: '@ui' },
+  () => {
+    test.beforeEach(async ({ comfyPage }) => {
+      await comfyPage.settings.setSetting('Comfy.UseNewMenu', 'Top')
+      await comfyPage.settings.setSetting('Comfy.Canvas.SelectionToolbox', true)
+      await comfyPage.workflow.loadWorkflow('nodes/single_ksampler')
+    })
+
+    async function expectShapePopoverVisible(comfyPage: ComfyPage) {
+      const popover = comfyPage.page
+        .locator('.p-popover')
+        .filter({ hasText: 'Default' })
+      await expect(popover).toBeVisible()
+      await expect(popover).toContainText('Box')
+      await expect(popover).toContainText('Card')
+
+      const popoverBox = await popover.boundingBox()
+      expect(popoverBox).not.toBeNull()
+      expect(popoverBox!.width).toBeGreaterThan(0)
+      expect(popoverBox!.height).toBeGreaterThan(0)
+    }
+
+    test('Shape popover opens when the menu fits in the viewport', async ({
+      comfyPage
+    }) => {
+      await comfyPage.page.setViewportSize({ width: 1280, height: 900 })
+      const menu = await openMoreOptionsMenu(comfyPage, 'KSampler')
+      const rootList = menu.locator(':scope > ul')
+
+      await expect
+        .poll(() => rootList.evaluate((el) => getComputedStyle(el).overflowY))
+        .toBe('visible')
+
+      await menu.getByRole('menuitem', { name: 'Shape' }).click()
+      await expectShapePopoverVisible(comfyPage)
+    })
+
+    test('Shape popover opens even when the menu must scroll', async ({
+      comfyPage
+    }) => {
+      await comfyPage.page.setViewportSize({ width: 1280, height: 520 })
+      const menu = await openMoreOptionsMenu(comfyPage, 'KSampler')
+      const rootList = menu.locator(':scope > ul')
+
+      await expect
+        .poll(() =>
+          rootList.evaluate((el) => el.scrollHeight > el.clientHeight)
+        )
+        .toBe(true)
+
+      const shapeItem = menu.getByRole('menuitem', { name: 'Shape' })
+      await shapeItem.scrollIntoViewIfNeeded()
+      await shapeItem.click()
+      await expectShapePopoverVisible(comfyPage)
+    })
+  }
+)

browser_tests/tests/priceBadge.spec.ts

@@ -0,0 +1,38 @@
+import {
+  comfyPageFixture as test,
+  comfyExpect as expect
+} from '@e2e/fixtures/ComfyPage'
+
+test('Price badge displays on subgraphs @vue-nodes', async ({ comfyPage }) => {
+  const apiNodeName = 'Node With Price Badge'
+
+  const priceBadge = comfyPage.page.locator('.lg-node-header i + span')
+  const apiNode = comfyPage.vueNodes.getNodeByTitle(apiNodeName)
+
+  await comfyPage.menu.topbar.newWorkflowButton.click()
+  await comfyPage.nextFrame()
+
+  await comfyPage.searchBoxV2.addNode(apiNodeName)
+  await expect(apiNode, 'Add partner node').toBeVisible()
+  await expect(apiNode.locator(priceBadge), 'Has price badge').toBeVisible()
+
+  await comfyPage.contextMenu
+    .openForVueNode(apiNode)
+    .then((m) => m.clickMenuItemExact('Convert to Subgraph'))
+  const subgraphNode = comfyPage.vueNodes.getNodeByTitle('New Subgraph')
+  await expect(subgraphNode, 'Convert to Subgraph').toBeVisible()
+
+  const nodePrice = subgraphNode.locator(priceBadge)
+  await expect(nodePrice, 'subgraphNode has price badge').toBeVisible()
+  const initialPrice = Number(await nodePrice.innerText())
+
+  await comfyPage.subgraph.editor.togglePromotion(subgraphNode, {
+    nodeName: apiNodeName,
+    widgetName: 'price',
+    toState: true
+  })
+  await comfyPage.vueNodes.selectComboOption('New Subgraph', 'price', '2x')
+  await expect(nodePrice, 'Price is reactive').toHaveText(
+    String(initialPrice * 2)
+  )
+})

browser_tests/tests/propertiesPanel/errorsTabMissingModels.spec.ts

@@ -115,42 +115,5 @@ test.describe('Errors tab - Missing models', { tag: '@ui' }, () => {
         comfyPage.page.getByTestId(TestIds.dialogs.missingModelRefresh)
       ).toBeVisible()
     })
-
-    test('Should clear resolved missing model when Refresh is clicked', async ({
-      comfyPage
-    }) => {
-      await loadWorkflowAndOpenErrorsTab(comfyPage, 'missing/missing_models')
-      await comfyPage.page.route(/\/object_info$/, async (route) => {
-        const response = await route.fetch()
-        const objectInfo = await response.json()
-        const ckptName =
-          objectInfo.CheckpointLoaderSimple.input.required.ckpt_name
-        ckptName[0] = [...ckptName[0], 'fake_model.safetensors']
-        await route.fulfill({ response, json: objectInfo })
-      })
-
-      const objectInfoResponse = comfyPage.page.waitForResponse((response) => {
-        const url = new URL(response.url())
-        return url.pathname.endsWith('/object_info') && response.ok()
-      })
-      const modelFoldersResponse = comfyPage.page.waitForResponse(
-        (response) => {
-          const url = new URL(response.url())
-          return url.pathname.endsWith('/experiment/models') && response.ok()
-        }
-      )
-      const refreshButton = comfyPage.page.getByTestId(
-        TestIds.dialogs.missingModelRefresh
-      )
-
-      await Promise.all([
-        objectInfoResponse,
-        modelFoldersResponse,
-        refreshButton.click()
-      ])
-      await expect(
-        comfyPage.page.getByTestId(TestIds.dialogs.missingModelsGroup)
-      ).toBeHidden()
-    })
   })
 })

browser_tests/tests/selectionToolboxSubmenus.spec.ts

@@ -2,6 +2,7 @@ import { expect } from '@playwright/test'
 
 import { comfyPageFixture as test } from '@e2e/fixtures/ComfyPage'
 import type { ComfyPage } from '@e2e/fixtures/ComfyPage'
+import { openMoreOptionsMenu } from '@e2e/fixtures/utils/selectionToolboxMoreOptions'
 
 test.beforeEach(async ({ comfyPage }) => {
   await comfyPage.settings.setSetting('Comfy.UseNewMenu', 'Disabled')
@@ -18,61 +19,8 @@ test.describe(
       await comfyPage.nextFrame()
     })
 
-    const openMoreOptions = async (comfyPage: ComfyPage) => {
-      const ksamplerNodes =
-        await comfyPage.nodeOps.getNodeRefsByTitle('KSampler')
-      if (ksamplerNodes.length === 0) {
-        throw new Error('No KSampler nodes found')
-      }
-
-      // Drag the KSampler to the center of the screen
-      const nodePos = await ksamplerNodes[0].getPosition()
-      const viewportSize = comfyPage.page.viewportSize()
-      if (!viewportSize) {
-        throw new Error(
-          'Viewport size is null - page may not be properly initialized'
-        )
-      }
-      const centerX = viewportSize.width / 3
-      const centerY = viewportSize.height / 2
-      await comfyPage.canvasOps.dragAndDrop(
-        { x: nodePos.x, y: nodePos.y },
-        { x: centerX, y: centerY }
-      )
-      await comfyPage.nextFrame()
-
-      await ksamplerNodes[0].click('title')
-
-      await expect(comfyPage.page.locator('.selection-toolbox')).toBeVisible()
-
-      const moreOptionsBtn = comfyPage.page.getByTestId('more-options-button')
-      await expect(moreOptionsBtn).toBeVisible()
-
-      await moreOptionsBtn.click()
-
-      await comfyPage.nextFrame()
-
-      const menuOptionsVisible = await comfyPage.page
-        .getByText('Rename')
-        .isVisible({ timeout: 2000 })
-        .catch(() => false)
-      if (menuOptionsVisible) {
-        return
-      }
-
-      await moreOptionsBtn.click()
-      await comfyPage.nextFrame()
-
-      const menuOptionsVisibleAfterClick = await comfyPage.page
-        .getByText('Rename')
-        .isVisible({ timeout: 2000 })
-        .catch(() => false)
-      if (menuOptionsVisibleAfterClick) {
-        return
-      }
-
-      throw new Error('Could not open More Options menu - popover not showing')
-    }
+    const openMoreOptions = (comfyPage: ComfyPage) =>
+      openMoreOptionsMenu(comfyPage, 'KSampler')
 
     test('hides Node Info from More Options menu when the new menu is disabled', async ({
       comfyPage
@@ -92,11 +40,14 @@ test.describe(
       )[0]
 
       await openMoreOptions(comfyPage)
-      await comfyPage.page.getByText('Shape', { exact: true }).hover()
-      await expect(
-        comfyPage.page.getByText('Box', { exact: true })
-      ).toBeVisible()
-      await comfyPage.page.getByText('Box', { exact: true }).click()
+      // Shape now opens via body-appended popover (FE-570); a hover no
+      // longer reveals the submenu — match the Color flow and click.
+      await comfyPage.page.getByText('Shape', { exact: true }).click()
+      const shapePopover = comfyPage.page
+        .locator('.p-popover')
+        .filter({ hasText: 'Default' })
+      await expect(shapePopover.getByText('Box', { exact: true })).toBeVisible()
+      await shapePopover.getByText('Box', { exact: true }).click()
       await comfyPage.nextFrame()
 
       await expect.poll(() => nodeRef.getProperty<number>('shape')).toBe(1)

browser_tests/tests/sharedWorkflowMissingMedia.spec.ts

@@ -0,0 +1,147 @@
+import { expect, mergeTests } from '@playwright/test'
+
+import { comfyPageFixture } from '@e2e/fixtures/ComfyPage'
+import type { ComfyPage } from '@e2e/fixtures/ComfyPage'
+import { TestIds } from '@e2e/fixtures/selectors'
+import {
+  sharedWorkflowImportFixture,
+  sharedWorkflowImportScenario
+} from '@e2e/fixtures/sharedWorkflowImportFixture'
+import type { SharedWorkflowImportMocks } from '@e2e/fixtures/sharedWorkflowImportFixture'
+import { PropertiesPanelHelper } from '@e2e/tests/propertiesPanel/PropertiesPanelHelper'
+import type { WorkspaceStore } from '@e2e/types/globals'
+
+const IMPORT_ORDER_TIMEOUT_MS = 5_000
+
+async function expectImportPrecedesPublicInclusiveInputAssetScan(
+  mocks: SharedWorkflowImportMocks
+): Promise<void> {
+  await expect(async () => {
+    const events = mocks.getRequestEvents()
+    const importIndex = events.indexOf('import')
+    const afterImportIndex = events.indexOf(
+      'input-assets-including-public-after-import'
+    )
+
+    expect(
+      events,
+      'public-inclusive input assets must not be scanned before import'
+    ).not.toContain('input-assets-including-public-before-import')
+    expect(importIndex, `events: ${events.join(',')}`).toBeGreaterThanOrEqual(0)
+    expect(afterImportIndex, `events: ${events.join(',')}`).toBeGreaterThan(
+      importIndex
+    )
+  }).toPass({ timeout: IMPORT_ORDER_TIMEOUT_MS })
+}
+
+async function getCachedMissingMediaWarningNames(
+  comfyPage: ComfyPage
+): Promise<string[] | null> {
+  return await comfyPage.page.evaluate(() => {
+    const workflow = (window.app!.extensionManager as WorkspaceStore).workflow
+      .activeWorkflow
+    if (!workflow) return null
+
+    return (
+      workflow.pendingWarnings?.missingMediaCandidates?.map(
+        (candidate) => candidate.name
+      ) ?? []
+    )
+  })
+}
+
+async function expectNoMissingMediaAfterPublicInclusiveAssetScan(
+  comfyPage: ComfyPage,
+  mocks: SharedWorkflowImportMocks
+): Promise<void> {
+  await mocks.waitForPublicInclusiveInputAssetResponseAfterImport()
+  await comfyPage.nextFrame()
+
+  await expect(
+    comfyPage.page.getByTestId(TestIds.dialogs.errorOverlay)
+  ).toBeHidden()
+  await expect
+    .poll(() => getCachedMissingMediaWarningNames(comfyPage))
+    .toEqual([])
+}
+
+async function openPanelAndExpectNoMissingMedia(
+  comfyPage: ComfyPage
+): Promise<void> {
+  const page = comfyPage.page
+  const errorOverlay = page.getByTestId(TestIds.dialogs.errorOverlay)
+  await expect(errorOverlay).toBeHidden()
+
+  const panel = new PropertiesPanelHelper(page)
+  await panel.open(comfyPage.actionbar.propertiesButton)
+  await expect(
+    panel.root.getByTestId(TestIds.propertiesPanel.errorsTab)
+  ).toBeHidden()
+  await expect(page.getByTestId(TestIds.dialogs.missingMediaGroup)).toHaveCount(
+    0
+  )
+}
+
+const test = mergeTests(comfyPageFixture, sharedWorkflowImportFixture)
+
+test.describe('Shared workflow missing media', { tag: '@cloud' }, () => {
+  // Missing media only surfaces the overlay when the Errors tab is enabled
+  // (src/stores/executionErrorStore.ts).
+  test.use({
+    initialSettings: {
+      'Comfy.RightSidePanel.ShowErrorsTab': true
+    }
+  })
+
+  test.beforeEach(async ({ comfyPage, sharedWorkflowImportMocks }) => {
+    sharedWorkflowImportMocks.resetAndStartRecording()
+    await comfyPage.setup({
+      clearStorage: false,
+      url: `/?share=${sharedWorkflowImportScenario.shareId}`
+    })
+  })
+
+  test('imports shared media before loading workflow so missing media is not surfaced', async ({
+    comfyPage,
+    sharedWorkflowImportMocks
+  }) => {
+    const { page } = comfyPage
+
+    const dialog = page.getByTestId(TestIds.dialogs.openSharedWorkflow)
+    await expect(
+      dialog.getByTestId(TestIds.dialogs.openSharedWorkflowTitle)
+    ).toBeVisible()
+
+    await dialog.getByTestId(TestIds.dialogs.openSharedWorkflowConfirm).click()
+
+    await expect
+      .poll(() =>
+        page.evaluate(() =>
+          window.app!.graph.nodes.map((node) => ({
+            type: node.type,
+            value: node.widgets?.[0]?.value
+          }))
+        )
+      )
+      .toEqual([
+        {
+          type: 'LoadImage',
+          value: sharedWorkflowImportScenario.inputFileName
+        }
+      ])
+    await expectImportPrecedesPublicInclusiveInputAssetScan(
+      sharedWorkflowImportMocks
+    )
+    await expectNoMissingMediaAfterPublicInclusiveAssetScan(
+      comfyPage,
+      sharedWorkflowImportMocks
+    )
+
+    expect(sharedWorkflowImportMocks.getImportBody()).toEqual({
+      published_asset_ids: [sharedWorkflowImportScenario.publishedAssetId],
+      share_id: sharedWorkflowImportScenario.shareId
+    })
+    expect(new URL(page.url()).searchParams.has('share')).toBe(false)
+    await openPanelAndExpectNoMissingMedia(comfyPage)
+  })
+})

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

@@ -8,13 +8,14 @@ import type {
 import { comfyPageFixture } from '@e2e/fixtures/ComfyPage'
 import { createMixedMediaJobs } from '@e2e/fixtures/helpers/AssetsHelper'
 
-// The assets sidebar's media-type filter menu only renders in cloud mode
-// (`MediaAssetFilterBar.vue` gates `MediaAssetFilterButton` behind `isCloud`).
-// We tag tests `@cloud` so they run against the cloud Playwright project,
-// and register both `/api/assets` and `/api/jobs` route handlers as auto
-// fixtures — Playwright runs auto fixtures before the `comfyPage` fixture's
-// internal `setup()`, so the page first-loads with mocks already in place.
-// See cloud-asset-default.spec.ts for the same pattern.
+// Post-FE-732 the media-type filter menu renders unconditionally on both
+// Cloud and OSS builds. These tests keep the `@cloud` tag because the
+// `/api/jobs` dependency is still cloud-only; once OSS exposes equivalent
+// jobs data we can drop the tag. Auto fixtures register `/api/assets` and
+// `/api/jobs` route handlers — Playwright runs auto fixtures before the
+// `comfyPage` fixture's internal `setup()`, so the page first-loads with
+// mocks already in place. See cloud-asset-default.spec.ts for the same
+// pattern.
 
 const MIXED_JOBS = createMixedMediaJobs(['images', 'video', 'audio', '3D'])
 

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

@@ -8,13 +8,14 @@ import type {
 import { comfyPageFixture } from '@e2e/fixtures/ComfyPage'
 import { createJobsWithExecutionTimes } from '@e2e/fixtures/helpers/AssetsHelper'
 
-// The assets sidebar's sort options live inside the settings popover and are
-// only rendered in cloud mode (`MediaAssetFilterBar.vue`:
-// `:show-sort-options="isCloud"`). We tag tests `@cloud` so they run against
-// the cloud Playwright project, and register `/api/assets`, `/api/jobs`, and
-// `/internal/files/input` route handlers as auto fixtures — Playwright runs
-// auto fixtures before the `comfyPage` fixture's internal `setup()`, so the
-// page first-loads with mocks already in place.
+// Post-FE-732 the sort options inside the settings popover render
+// unconditionally on both Cloud and OSS builds. These tests keep the
+// `@cloud` tag because the `/api/jobs` dependency (used by the generation-
+// time sort) is still cloud-only; once OSS exposes equivalent jobs data we
+// can drop the tag. Auto fixtures register `/api/assets`, `/api/jobs`, and
+// `/internal/files/input` route handlers — Playwright runs auto fixtures
+// before the `comfyPage` fixture's internal `setup()`, so the page first-
+// loads with mocks already in place.
 
 // Three jobs whose `(create_time, duration)` axes are intentionally
 // misaligned so newest/oldest and longest/fastest sorts produce *different*

browser_tests/tests/sidebar/assets.spec.ts

@@ -10,6 +10,9 @@ import type {
   RawJobListItem
 } from '@/platform/remote/comfyui/jobs/jobTypes'
 
+// Legacy coverage backed by AssetsHelper's shadow backend. New assets-sidebar
+// browser coverage should use typed route mocks in assetsSidebarTab.spec.ts.
+
 // ---------------------------------------------------------------------------
 // Shared fixtures
 // ---------------------------------------------------------------------------

browser_tests/tests/sidebar/assetsSidebarTab.spec.ts

@@ -0,0 +1,278 @@
+import { expect, mergeTests } from '@playwright/test'
+import type { Page } from '@playwright/test'
+
+import { comfyPageFixture } from '@e2e/fixtures/ComfyPage'
+import {
+  createRouteMockJob,
+  jobsRouteFixture,
+  routeMockJobTimestamp
+} from '@e2e/fixtures/jobsRouteFixture'
+import type {
+  JobDetail,
+  RawJobListItem
+} from '@/platform/remote/comfyui/jobs/jobTypes'
+
+const test = mergeTests(comfyPageFixture, jobsRouteFixture)
+
+interface ViewFile {
+  body?: Buffer | string
+  contentType?: string
+}
+
+type ViewFilesByName = Readonly<Record<string, ViewFile>>
+
+const transparentPng = Buffer.from(
+  'iVBORw0KGgoAAAANSUhEUgAAAAEAAAABCAYAAAAfFcSJAAAADUlEQVR42mP8z8BQDwAFgwJ/lwPIRwAAAABJRU5ErkJggg==',
+  'base64'
+)
+
+const alphaJob = createRouteMockJob({
+  id: 'alpha',
+  create_time: routeMockJobTimestamp - 1_000,
+  execution_start_time: routeMockJobTimestamp - 1_000,
+  execution_end_time: routeMockJobTimestamp,
+  preview_output: {
+    filename: 'alpha.png',
+    subfolder: '',
+    type: 'output',
+    nodeId: '1',
+    mediaType: 'images'
+  }
+})
+
+const betaJob = createRouteMockJob({
+  id: 'beta',
+  create_time: routeMockJobTimestamp - 2_000,
+  execution_start_time: routeMockJobTimestamp - 2_000,
+  execution_end_time: routeMockJobTimestamp,
+  preview_output: {
+    filename: 'beta.png',
+    subfolder: '',
+    type: 'output',
+    nodeId: '2',
+    mediaType: 'images'
+  }
+})
+
+const multiOutputJob = createRouteMockJob({
+  id: 'multi-output',
+  create_time: routeMockJobTimestamp - 3_000,
+  execution_start_time: routeMockJobTimestamp - 3_000,
+  execution_end_time: routeMockJobTimestamp,
+  preview_output: {
+    filename: 'multi-output-a.png',
+    subfolder: '',
+    type: 'output',
+    nodeId: '3',
+    mediaType: 'images'
+  },
+  outputs_count: 2
+})
+
+const multiOutputJobDetail: JobDetail = {
+  ...multiOutputJob,
+  outputs: {
+    '3': {
+      images: [
+        {
+          filename: 'multi-output-a.png',
+          subfolder: '',
+          type: 'output'
+        },
+        {
+          filename: 'multi-output-b.png',
+          subfolder: '',
+          type: 'output'
+        }
+      ]
+    }
+  }
+}
+
+const generatedJobs: RawJobListItem[] = [alphaJob, betaJob]
+
+const viewFiles = {
+  'alpha.png': {},
+  'beta.png': {},
+  'imported.png': {},
+  'multi-output-a.png': {},
+  'multi-output-b.png': {}
+}
+
+async function mockInputFiles(page: Page, files: readonly string[]) {
+  await page.route('**/internal/files/input**', async (route) => {
+    if (route.request().method().toUpperCase() !== 'GET') {
+      await route.fallback()
+      return
+    }
+
+    await route.fulfill({ json: [...files] })
+  })
+}
+
+async function mockViewFiles(page: Page, filesByName: ViewFilesByName) {
+  await page.route('**/api/view**', async (route) => {
+    if (route.request().method().toUpperCase() !== 'GET') {
+      await route.fallback()
+      return
+    }
+
+    const url = new URL(route.request().url())
+    const filename = url.searchParams.get('filename')
+    if (!filename) {
+      await route.fulfill({
+        status: 400,
+        json: { error: 'Missing filename' } satisfies { error: string }
+      })
+      return
+    }
+
+    const file = filesByName[filename]
+    if (!file) {
+      await route.fulfill({
+        status: 404,
+        json: {
+          error: `Unknown filename: ${filename}`
+        } satisfies { error: string }
+      })
+      return
+    }
+
+    await route.fulfill({
+      body: file.body ?? transparentPng,
+      contentType: file.contentType ?? 'image/png'
+    })
+  })
+}
+
+test.describe('FE-130 assets sidebar route mocks', () => {
+  test.beforeEach(async ({ jobsRoutes, page }) => {
+    await jobsRoutes.mockJobsQueue([])
+    await jobsRoutes.mockJobsHistory(generatedJobs)
+    await mockInputFiles(page, ['imported.png'])
+    await mockViewFiles(page, viewFiles)
+  })
+
+  test('renders generated and imported assets with image previews', async ({
+    comfyPage
+  }) => {
+    const tab = comfyPage.menu.assetsTab
+
+    await comfyPage.setup()
+    await tab.open()
+
+    await expect(tab.getAssetCardByName('alpha')).toBeVisible()
+    await expect(tab.getAssetCardByName('beta')).toBeVisible()
+    await expect(
+      comfyPage.page.getByRole('img', { name: 'alpha.png' })
+    ).toHaveJSProperty('naturalWidth', 1)
+
+    await tab.switchToImported()
+
+    await expect(tab.getAssetCardByName('imported')).toBeVisible()
+    await expect(
+      comfyPage.page.getByRole('img', { name: 'imported.png' })
+    ).toHaveJSProperty('naturalWidth', 1)
+  })
+
+  test('opens previews for generated and imported images', async ({
+    comfyPage
+  }) => {
+    const tab = comfyPage.menu.assetsTab
+
+    await comfyPage.setup()
+    await tab.open()
+
+    await comfyPage.page.getByRole('img', { name: 'alpha.png' }).dblclick()
+    await expect(comfyPage.mediaLightbox.root).toBeVisible()
+    await expect(
+      comfyPage.mediaLightbox.root.getByRole('img', {
+        name: 'alpha.png'
+      })
+    ).toBeVisible()
+
+    await comfyPage.mediaLightbox.closeButton.click()
+    await expect(comfyPage.mediaLightbox.root).toBeHidden()
+
+    await tab.switchToImported()
+
+    await comfyPage.page.getByRole('img', { name: 'imported.png' }).dblclick()
+    await expect(comfyPage.mediaLightbox.root).toBeVisible()
+    await expect(
+      comfyPage.mediaLightbox.root.getByRole('img', {
+        name: 'imported.png'
+      })
+    ).toBeVisible()
+  })
+
+  test('shows footer actions for single and multiple generated selections', async ({
+    comfyPage
+  }) => {
+    const tab = comfyPage.menu.assetsTab
+
+    await comfyPage.setup()
+    await tab.open()
+
+    await tab.getAssetCardByName('alpha').click()
+    await expect(tab.selectionCountButton).toHaveText(/Assets Selected:\s*1\b/)
+    await expect(tab.deleteSelectedButton).toBeVisible()
+    await expect(tab.downloadSelectedButton).toBeVisible()
+
+    await comfyPage.page.keyboard.down('Control')
+    await tab.getAssetCardByName('beta').click()
+    await comfyPage.page.keyboard.up('Control')
+
+    await expect(tab.selectionCountButton).toHaveText(/Assets Selected:\s*2\b/)
+    await expect(tab.deleteSelectedButton).toBeVisible()
+    await expect(tab.downloadSelectedButton).toBeVisible()
+  })
+
+  test('loads full generated job outputs from job detail', async ({
+    comfyPage,
+    jobsRoutes
+  }) => {
+    const tab = comfyPage.menu.assetsTab
+
+    await jobsRoutes.mockJobsHistory([multiOutputJob])
+    await jobsRoutes.mockJobDetail('multi-output', multiOutputJobDetail)
+
+    await comfyPage.setup()
+    await tab.open()
+
+    await tab
+      .getAssetCardByName('multi-output-a')
+      .getByRole('button', { name: 'See more outputs' })
+      .click()
+
+    await expect(tab.backToAssetsButton).toBeVisible()
+    await expect(tab.getAssetCardByName('multi-output-b')).toBeVisible()
+    await expect(
+      comfyPage.page.getByRole('img', { name: 'multi-output-b.png' })
+    ).toHaveJSProperty('naturalWidth', 1)
+  })
+
+  test('deletes a generated output asset through explicit history refresh', async ({
+    comfyPage,
+    jobsRoutes
+  }) => {
+    const tab = comfyPage.menu.assetsTab
+
+    await comfyPage.setup()
+    await tab.open()
+    await expect(tab.getAssetCardByName('alpha')).toBeVisible()
+
+    const deleteRequests = await jobsRoutes.mockDeleteHistory()
+    await jobsRoutes.mockJobsHistory([betaJob])
+
+    await tab.getAssetCardByName('alpha').click({ button: 'right' })
+    await tab.contextMenuItem('Delete').click()
+    await comfyPage.confirmDialog.delete.click()
+
+    await expect.poll(() => deleteRequests).toHaveLength(1)
+    expect(deleteRequests[0]).toEqual({ delete: ['alpha'] })
+    await expect(tab.getAssetCardByName('alpha')).toHaveCount(0)
+    await expect(comfyPage.toast.toastSuccesses).toContainText(
+      'Asset deleted successfully'
+    )
+  })
+})

browser_tests/tests/sidebar/jobHistory.spec.ts

@@ -0,0 +1,274 @@
+import { expect, mergeTests } from '@playwright/test'
+
+import { comfyPageFixture } from '@e2e/fixtures/ComfyPage'
+import type { ComfyPage } from '@e2e/fixtures/ComfyPage'
+import {
+  createRouteMockJob,
+  jobsRouteFixture,
+  routeMockJobTimestamp
+} from '@e2e/fixtures/jobsRouteFixture'
+import type { JobsScenario } from '@e2e/fixtures/jobsRouteFixture'
+import { TestIds } from '@e2e/fixtures/selectors'
+import type { RawJobListItem } from '@/platform/remote/comfyui/jobs/jobTypes'
+
+const historyJobs: RawJobListItem[] = [
+  createRouteMockJob({
+    id: 'history-completed',
+    status: 'completed',
+    create_time: routeMockJobTimestamp - 60_000,
+    execution_start_time: routeMockJobTimestamp - 60_000,
+    execution_end_time: routeMockJobTimestamp - 55_000,
+    preview_output: {
+      filename: 'completed-output.png',
+      subfolder: '',
+      type: 'output',
+      nodeId: '1',
+      mediaType: 'images'
+    }
+  }),
+  createRouteMockJob({
+    id: 'history-failed',
+    status: 'failed',
+    create_time: routeMockJobTimestamp - 120_000,
+    execution_start_time: routeMockJobTimestamp - 120_000,
+    execution_end_time: routeMockJobTimestamp - 118_000,
+    outputs_count: 0,
+    execution_error: {
+      node_id: '1',
+      node_type: 'SaveImage',
+      exception_message: 'Intentional fixture failure',
+      exception_type: 'Error',
+      traceback: [],
+      current_inputs: {},
+      current_outputs: {}
+    }
+  }),
+  createRouteMockJob({
+    id: 'history-cancelled',
+    status: 'cancelled',
+    create_time: routeMockJobTimestamp - 180_000,
+    execution_start_time: routeMockJobTimestamp - 180_000,
+    execution_end_time: routeMockJobTimestamp - 179_000,
+    outputs_count: 0
+  })
+]
+
+const activeJobs: RawJobListItem[] = [
+  createRouteMockJob({
+    id: 'queue-running',
+    status: 'in_progress',
+    create_time: routeMockJobTimestamp - 10_000,
+    execution_start_time: routeMockJobTimestamp - 9_000,
+    execution_end_time: null,
+    outputs_count: 0
+  }),
+  createRouteMockJob({
+    id: 'queue-pending',
+    status: 'pending',
+    create_time: routeMockJobTimestamp - 5_000,
+    execution_start_time: null,
+    execution_end_time: null,
+    outputs_count: 0
+  })
+]
+const runningOnlyJobs = activeJobs.filter((job) => job.status !== 'pending')
+
+const test = mergeTests(comfyPageFixture, jobsRouteFixture).extend<{
+  initialJobsScenario: JobsScenario
+  mockInitialJobsScenario: void
+}>({
+  initialJobsScenario: [
+    { history: historyJobs, queue: activeJobs },
+    { option: true }
+  ],
+  mockInitialJobsScenario: [
+    async ({ jobsRoutes, initialJobsScenario }, use) => {
+      await jobsRoutes.mockJobsScenario(initialJobsScenario)
+      await use()
+    },
+    { auto: true }
+  ]
+})
+
+async function openJobHistorySidebar(comfyPage: ComfyPage) {
+  await comfyPage.page
+    .getByTestId(TestIds.sidebar.toolbar)
+    .getByRole('button', { name: 'Job History', exact: true })
+    .click()
+  await expect(jobHistorySidebar(comfyPage)).toBeVisible()
+}
+
+function jobRow(comfyPage: ComfyPage) {
+  const list = comfyPage.page.getByTestId(TestIds.queue.jobAssetsList)
+
+  return (jobId: string) => list.locator(`[data-job-id="${jobId}"]`)
+}
+
+function jobHistorySidebar(comfyPage: ComfyPage) {
+  return comfyPage.page.getByTestId(TestIds.queue.jobHistorySidebar)
+}
+
+function clearQueueButton(comfyPage: ComfyPage) {
+  return jobHistorySidebar(comfyPage).getByRole('button', {
+    name: 'Clear queue',
+    exact: true
+  })
+}
+
+async function openSidebarClearHistoryDialog(comfyPage: ComfyPage) {
+  await jobHistorySidebar(comfyPage)
+    .getByLabel(/More options/i)
+    .click()
+  await comfyPage.page.getByTestId(TestIds.queue.clearHistoryAction).click()
+}
+
+test.describe('Job history sidebar', { tag: '@ui' }, () => {
+  test.describe('docked overlay action', () => {
+    test.use({ initialSettings: { 'Comfy.Queue.QPOV2': false } })
+
+    test('opens from the queue overlay docked history action', async ({
+      comfyPage
+    }) => {
+      await comfyPage.page.getByTestId(TestIds.queue.overlayToggle).click()
+      await comfyPage.queuePanel.moreOptionsButton.click()
+      await comfyPage.page
+        .getByTestId(TestIds.queue.dockedJobHistoryAction)
+        .click()
+
+      await expect(jobHistorySidebar(comfyPage)).toBeVisible()
+      await expect(jobRow(comfyPage)('history-completed')).toBeVisible()
+      await expect(jobRow(comfyPage)('queue-pending')).toBeVisible()
+    })
+  })
+
+  test.describe('expanded history tab', () => {
+    test.use({ initialSettings: { 'Comfy.Queue.QPOV2': true } })
+
+    test('shows terminal and active job states', async ({ comfyPage }) => {
+      await openJobHistorySidebar(comfyPage)
+
+      const row = jobRow(comfyPage)
+      await expect(row('queue-pending')).toBeVisible()
+      await expect(row('queue-running')).toBeVisible()
+      await expect(row('history-completed')).toBeVisible()
+      await expect(row('history-failed')).toBeVisible()
+      await expect(row('history-cancelled')).toBeVisible()
+
+      await expect(clearQueueButton(comfyPage)).toBeEnabled()
+    })
+
+    test('filters completed and failed history jobs', async ({ comfyPage }) => {
+      await openJobHistorySidebar(comfyPage)
+
+      await comfyPage.page
+        .getByRole('button', { name: 'Completed', exact: true })
+        .click()
+
+      const row = jobRow(comfyPage)
+      await expect(row('history-completed')).toBeVisible()
+      await expect(row('history-failed')).toBeHidden()
+      await expect(row('queue-running')).toBeHidden()
+
+      await comfyPage.page
+        .getByRole('button', { name: 'Failed', exact: true })
+        .click()
+
+      await expect(row('history-failed')).toBeVisible()
+      await expect(row('history-cancelled')).toBeVisible()
+      await expect(row('history-completed')).toBeHidden()
+    })
+
+    test('searches by job id and output filename', async ({ comfyPage }) => {
+      await openJobHistorySidebar(comfyPage)
+
+      const row = jobRow(comfyPage)
+      const searchInput = comfyPage.page.getByPlaceholder('Search...')
+
+      await searchInput.fill('history-failed')
+      await expect(row('history-failed')).toBeVisible()
+      await expect(row('history-completed')).toBeHidden()
+      await expect(row('queue-running')).toBeHidden()
+
+      await searchInput.fill('completed-output')
+      await expect(row('history-completed')).toBeVisible()
+      await expect(row('history-failed')).toBeHidden()
+
+      await searchInput.clear()
+      await expect(row('history-completed')).toBeVisible()
+      await expect(row('queue-running')).toBeVisible()
+    })
+
+    test('clears pending queue jobs and leaves running/history jobs', async ({
+      comfyPage,
+      jobsRoutes
+    }) => {
+      await openJobHistorySidebar(comfyPage)
+
+      const row = jobRow(comfyPage)
+      await expect(row('queue-pending')).toBeVisible()
+
+      const clearQueueRequests = await jobsRoutes.mockClearQueue()
+      const clearHistoryRequests = await jobsRoutes.mockClearHistory()
+      await jobsRoutes.mockJobsScenario({
+        history: historyJobs,
+        queue: runningOnlyJobs
+      })
+
+      await clearQueueButton(comfyPage).click()
+
+      await expect.poll(() => clearQueueRequests.length).toBe(1)
+      expect(clearQueueRequests).toContainEqual({ clear: true })
+      await expect(row('queue-pending')).toBeHidden()
+      await expect(row('queue-running')).toBeVisible()
+      await expect(row('history-completed')).toBeVisible()
+      await expect(clearQueueButton(comfyPage)).toBeDisabled()
+      expect(clearHistoryRequests).toHaveLength(0)
+    })
+
+    test('clears history from the sidebar menu and keeps active jobs', async ({
+      comfyPage,
+      jobsRoutes
+    }) => {
+      await openJobHistorySidebar(comfyPage)
+
+      const row = jobRow(comfyPage)
+      await expect(row('history-completed')).toBeVisible()
+
+      const clearHistoryRequests = await jobsRoutes.mockClearHistory()
+      const clearQueueRequests = await jobsRoutes.mockClearQueue()
+      await jobsRoutes.mockJobsScenario({
+        history: [],
+        queue: activeJobs
+      })
+
+      await openSidebarClearHistoryDialog(comfyPage)
+      await expect(
+        comfyPage.page.getByText('Clear your job queue history?')
+      ).toBeVisible()
+      await comfyPage.page
+        .getByRole('button', { name: 'Clear', exact: true })
+        .click()
+
+      await expect.poll(() => clearHistoryRequests.length).toBe(1)
+      expect(clearHistoryRequests).toContainEqual({ clear: true })
+      await expect(row('history-completed')).toBeHidden()
+      await expect(row('history-failed')).toBeHidden()
+      await expect(row('queue-running')).toBeVisible()
+      await expect(row('queue-pending')).toBeVisible()
+      expect(clearQueueRequests).toHaveLength(0)
+    })
+  })
+
+  test.describe('without pending queue jobs', () => {
+    test.use({
+      initialJobsScenario: { history: historyJobs, queue: runningOnlyJobs },
+      initialSettings: { 'Comfy.Queue.QPOV2': true }
+    })
+
+    test('disables clear queue', async ({ comfyPage }) => {
+      await openJobHistorySidebar(comfyPage)
+
+      await expect(clearQueueButton(comfyPage)).toBeDisabled()
+    })
+  })
+})

browser_tests/tests/sidebar/modelLibrary.spec.ts

@@ -1,236 +0,0 @@
-import { expect } from '@playwright/test'
-
-import { comfyPageFixture as test } from '@e2e/fixtures/ComfyPage'
-
-const MOCK_FOLDERS: Record<string, string[]> = {
-  checkpoints: [
-    'sd_xl_base_1.0.safetensors',
-    'dreamshaper_8.safetensors',
-    'realisticVision_v51.safetensors'
-  ],
-  loras: ['detail_tweaker_xl.safetensors', 'add_brightness.safetensors'],
-  vae: ['sdxl_vae.safetensors']
-}
-
-// ==========================================================================
-// 1. Tab open/close
-// ==========================================================================
-
-test.describe('Model library sidebar - tab', () => {
-  test.beforeEach(async ({ comfyPage }) => {
-    await comfyPage.modelLibrary.mockFoldersWithFiles(MOCK_FOLDERS)
-    await comfyPage.setup()
-  })
-
-  test.afterEach(async ({ comfyPage }) => {
-    await comfyPage.modelLibrary.clearMocks()
-  })
-
-  test('Opens model library tab and shows tree', async ({ comfyPage }) => {
-    const tab = comfyPage.menu.modelLibraryTab
-    await tab.open()
-
-    await expect(tab.modelTree).toBeVisible()
-    await expect(tab.searchInput).toBeVisible()
-  })
-
-  test('Shows refresh and load all folders buttons', async ({ comfyPage }) => {
-    const tab = comfyPage.menu.modelLibraryTab
-    await tab.open()
-
-    await expect(tab.refreshButton).toBeVisible()
-    await expect(tab.loadAllFoldersButton).toBeVisible()
-  })
-})
-
-// ==========================================================================
-// 2. Folder display
-// ==========================================================================
-
-test.describe('Model library sidebar - folders', () => {
-  // Mocks are set up before setup(), so app.ts's loadModelFolders()
-  // call during initialization hits the mock and populates the store.
-  test.beforeEach(async ({ comfyPage }) => {
-    await comfyPage.modelLibrary.mockFoldersWithFiles(MOCK_FOLDERS)
-    await comfyPage.setup()
-  })
-
-  test.afterEach(async ({ comfyPage }) => {
-    await comfyPage.modelLibrary.clearMocks()
-  })
-
-  test('Displays model folders after opening tab', async ({ comfyPage }) => {
-    const tab = comfyPage.menu.modelLibraryTab
-    await tab.open()
-
-    await expect(tab.getFolderByLabel('checkpoints')).toBeVisible()
-    await expect(tab.getFolderByLabel('loras')).toBeVisible()
-    await expect(tab.getFolderByLabel('vae')).toBeVisible()
-  })
-
-  test('Expanding a folder loads and shows models', async ({ comfyPage }) => {
-    const tab = comfyPage.menu.modelLibraryTab
-    await tab.open()
-
-    // Click the folder to expand it
-    await tab.getFolderByLabel('checkpoints').click()
-
-    // Models should appear as leaf nodes
-    await expect(tab.getLeafByLabel('sd_xl_base_1.0')).toBeVisible()
-    await expect(tab.getLeafByLabel('dreamshaper_8')).toBeVisible()
-    await expect(tab.getLeafByLabel('realisticVision_v51')).toBeVisible()
-  })
-
-  test('Expanding a different folder shows its models', async ({
-    comfyPage
-  }) => {
-    const tab = comfyPage.menu.modelLibraryTab
-    await tab.open()
-
-    await tab.getFolderByLabel('loras').click()
-
-    await expect(tab.getLeafByLabel('detail_tweaker_xl')).toBeVisible()
-    await expect(tab.getLeafByLabel('add_brightness')).toBeVisible()
-  })
-})
-
-// ==========================================================================
-// 3. Search
-// ==========================================================================
-
-test.describe('Model library sidebar - search', () => {
-  test.beforeEach(async ({ comfyPage }) => {
-    await comfyPage.modelLibrary.mockFoldersWithFiles(MOCK_FOLDERS)
-    await comfyPage.setup()
-  })
-
-  test.afterEach(async ({ comfyPage }) => {
-    await comfyPage.modelLibrary.clearMocks()
-  })
-
-  test('Search filters models by filename', async ({ comfyPage }) => {
-    const tab = comfyPage.menu.modelLibraryTab
-    await tab.open()
-
-    await tab.searchInput.fill('dreamshaper')
-
-    // Wait for debounce (300ms) + load + render
-    await expect(tab.getLeafByLabel('dreamshaper_8')).toBeVisible()
-
-    // Other models should not be visible
-    await expect(tab.getLeafByLabel('sd_xl_base_1.0')).toBeHidden()
-  })
-
-  test('Clearing search restores folder view', async ({ comfyPage }) => {
-    const tab = comfyPage.menu.modelLibraryTab
-    await tab.open()
-
-    await tab.searchInput.fill('dreamshaper')
-    await expect(tab.getLeafByLabel('dreamshaper_8')).toBeVisible()
-
-    // Clear the search
-    await tab.searchInput.fill('')
-
-    // Folders should be visible again (collapsed)
-    await expect(tab.getFolderByLabel('checkpoints')).toBeVisible()
-    await expect(tab.getFolderByLabel('loras')).toBeVisible()
-  })
-
-  test('Search with no matches shows empty tree', async ({ comfyPage }) => {
-    const tab = comfyPage.menu.modelLibraryTab
-    await tab.open()
-
-    // Expand a folder and verify models are present before searching
-    await tab.getFolderByLabel('checkpoints').click()
-    await expect(tab.leafNodes).not.toHaveCount(0)
-
-    await tab.searchInput.fill('nonexistent_model_xyz')
-
-    // Wait for debounce, then verify no leaf nodes
-    await expect.poll(() => tab.leafNodes.count()).toBe(0)
-  })
-})
-
-// ==========================================================================
-// 4. Refresh and load all
-// ==========================================================================
-
-test.describe('Model library sidebar - refresh', () => {
-  test.afterEach(async ({ comfyPage }) => {
-    await comfyPage.modelLibrary.clearMocks()
-  })
-
-  test('Refresh button reloads folder list', async ({ comfyPage }) => {
-    await comfyPage.modelLibrary.mockFoldersWithFiles({
-      checkpoints: ['model_a.safetensors']
-    })
-    await comfyPage.setup()
-
-    const tab = comfyPage.menu.modelLibraryTab
-    await tab.open()
-
-    await expect(tab.getFolderByLabel('checkpoints')).toBeVisible()
-
-    // Update mock to include a new folder
-    await comfyPage.modelLibrary.clearMocks()
-    await comfyPage.modelLibrary.mockFoldersWithFiles({
-      checkpoints: ['model_a.safetensors'],
-      loras: ['lora_b.safetensors']
-    })
-
-    // Wait for the refresh request to complete
-    const refreshRequest = comfyPage.page.waitForRequest(
-      (req) => req.url().endsWith('/experiment/models'),
-      { timeout: 5000 }
-    )
-    await tab.refreshButton.click()
-    await refreshRequest
-
-    await expect(tab.getFolderByLabel('loras')).toBeVisible()
-  })
-
-  test('Load all folders button triggers loading all model data', async ({
-    comfyPage
-  }) => {
-    await comfyPage.modelLibrary.mockFoldersWithFiles(MOCK_FOLDERS)
-    await comfyPage.setup()
-
-    const tab = comfyPage.menu.modelLibraryTab
-    await tab.open()
-
-    // Wait for a per-folder model files request triggered by load all
-    const folderRequest = comfyPage.page.waitForRequest(
-      (req) =>
-        /\/api\/experiment\/models\/[^/]+$/.test(req.url()) &&
-        req.method() === 'GET',
-      { timeout: 5000 }
-    )
-
-    await tab.loadAllFoldersButton.click()
-    await folderRequest
-  })
-})
-
-// ==========================================================================
-// 5. Empty state
-// ==========================================================================
-
-test.describe('Model library sidebar - empty state', () => {
-  test.afterEach(async ({ comfyPage }) => {
-    await comfyPage.modelLibrary.clearMocks()
-  })
-
-  test('Shows empty tree when no model folders exist', async ({
-    comfyPage
-  }) => {
-    await comfyPage.modelLibrary.mockFoldersWithFiles({})
-    await comfyPage.setup()
-
-    const tab = comfyPage.menu.modelLibraryTab
-    await tab.open()
-
-    await expect(tab.modelTree).toBeVisible()
-    await expect(tab.folderNodes).toHaveCount(0)
-    await expect(tab.leafNodes).toHaveCount(0)
-  })
-})

browser_tests/tests/sidebar/nodeLibraryV2.spec.ts

@@ -129,4 +129,26 @@ test.describe('Node library sidebar V2', () => {
     await expect(tab.nodePreview, 'Preview displays on hover').toBeVisible()
     await expect(tab.nodePreview).toContainText('Inverts the image')
   })
+
+  test('Click-to-place from sidebar selects the newly added node', async ({
+    comfyPage
+  }) => {
+    const tab = comfyPage.menu.nodeLibraryTabV2
+    await comfyPage.nodeOps.clearGraph()
+    await tab.expandFolder('sampling')
+
+    const canvasBox = (await comfyPage.canvas.boundingBox())!
+    const target = {
+      x: canvasBox.width / 2,
+      y: canvasBox.height / 2
+    }
+
+    await tab.getNode('KSampler (Advanced)').click()
+    await comfyPage.canvas.click({ position: target })
+
+    await expect.poll(() => comfyPage.nodeOps.getGraphNodesCount()).toBe(1)
+    await expect
+      .poll(() => comfyPage.nodeOps.getSelectedGraphNodesCount())
+      .toBe(1)
+  })
 })

browser_tests/tests/subgraph/subgraphOperations.spec.ts

@@ -5,10 +5,6 @@ import { comfyPageFixture as test } from '@e2e/fixtures/ComfyPage'
 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)'
-    )
   })
 
   test.describe('Subgraph Clipboard Operations', () => {
@@ -58,8 +54,7 @@ test.describe('Subgraph Operations', { tag: ['@slow', '@subgraph'] }, () => {
       const subgraphNode = await comfyPage.nodeOps.getNodeRefById('2')
       await subgraphNode.navigateIntoSubgraph()
 
-      await comfyPage.canvasOps.doubleClick()
-      await comfyPage.searchBox.fillAndSelectFirstNode('Note')
+      await comfyPage.searchBoxV2.addNode('Note')
       await comfyPage.nextFrame()
 
       const initialCount = await comfyPage.subgraph.getNodeCount()

browser_tests/tests/subgraph/subgraphPromotion.spec.ts

@@ -745,20 +745,19 @@ test('Link already promoted widget @vue-nodes', async ({ comfyPage }) => {
 })
 
 test('Can promote multiple previews @vue-nodes', async ({ comfyPage }) => {
-  await comfyPage.settings.setSetting('Comfy.NodeSearchBoxImpl', 'v1 (legacy)')
   await comfyPage.menu.topbar.newWorkflowButton.click()
   await comfyPage.nextFrame()
 
   await test.step('Add and rename a Load Image node', async () => {
-    await comfyPage.page.mouse.dblclick(300, 300, { delay: 5 })
-    await comfyPage.searchBox.fillAndSelectFirstNode('Load Image')
+    const position = { x: 300, y: 300 }
+    await comfyPage.searchBoxV2.addNode('Load Image', { position })
     const loadImage = await comfyPage.vueNodes.getFixtureByTitle('Load Image')
     await loadImage.setTitle('Character Reference')
   })
 
   await test.step('Add a second Load Image node', async () => {
-    await comfyPage.page.mouse.dblclick(600, 300, { delay: 5 })
-    await comfyPage.searchBox.fillAndSelectFirstNode('Load Image')
+    const position = { x: 600, y: 300 }
+    await comfyPage.searchBoxV2.addNode('Load Image', { position })
   })
 
   await test.step('Convert both nodes to subgraph', async () => {

browser_tests/tests/subgraph/subgraphSlots.spec.ts

@@ -632,3 +632,72 @@ test.describe('Subgraph Slots', { tag: ['@slow', '@subgraph'] }, () => {
     })
   })
 })
+
+test(
+  'link interactions',
+  { tag: ['@vue-nodes', '@subgraph'] },
+  async ({ comfyPage }) => {
+    await comfyPage.workflow.loadWorkflow('subgraphs/basic-subgraph')
+    await comfyPage.vueNodes.enterSubgraph('2')
+
+    const ksampler = await comfyPage.vueNodes.getFixtureByTitle('KSampler')
+    const seedSlot = ksampler.getSlot('seed')
+    const seedIOSlot = await comfyPage.subgraph.getInputSlot('seed')
+
+    await test.step('Make second INT typed connection', async () => {
+      const toPos = await seedIOSlot.getOpenSlotPosition()
+      await seedSlot.dragTo(comfyPage.canvas, { targetPosition: toPos })
+      const isConnected = () => comfyPage.vueNodes.isSlotConnected(seedSlot)
+      await expect.poll(isConnected).toBe(true)
+    })
+
+    const stepsSlot = ksampler.getSlot('steps')
+
+    await test.step('Node -> I/O hover effect', async () => {
+      await stepsSlot.hover()
+      await stepsSlot.click({ trial: true })
+      await comfyPage.page.mouse.down()
+      await comfyPage.canvas.hover({ position: await seedIOSlot.getPosition() })
+
+      const rawClip = await comfyPage.subgraph.getInputBounds()
+      const absolutePos = await comfyPage.canvasOps.toAbsolute(rawClip)
+      const clip = { ...rawClip, ...absolutePos }
+      await expect(comfyPage.page).toHaveScreenshot('vue-io-highlight.png', {
+        clip
+      })
+
+      //cancel link operation
+      await stepsSlot.hover()
+      await comfyPage.page.mouse.up()
+    })
+
+    await ksampler.title.hover()
+
+    const slotParent = stepsSlot.locator('../..')
+    await expect(slotParent, 'unconnected slot is hidden').toHaveCSS(
+      'opacity',
+      '0'
+    )
+
+    await test.step('Connect I/O to node with snap', async () => {
+      const hasSnap = () =>
+        comfyPage.page.evaluate(() => !!app!.canvas._highlight_pos)
+      expect(await hasSnap()).toBe(false)
+
+      const emptySlotPos = await seedIOSlot.getOpenSlotPosition()
+      await comfyPage.canvas.hover({ position: emptySlotPos })
+      await comfyPage.page.mouse.down()
+      await stepsSlot.hover()
+      await expect.poll(hasSnap).toBe(true)
+      await comfyPage.page.mouse.up()
+
+      //move hover off the slot
+      await ksampler.title.hover()
+    })
+
+    await expect(slotParent, 'connected slot is visible').not.toHaveCSS(
+      'opacity',
+      '0'
+    )
+  }
+)

browser_tests/tests/templates.spec.ts

@@ -143,7 +143,7 @@ test.describe('Templates', { tag: ['@slow', '@workflow'] }, () => {
     })
 
     await expect(
-      comfyPage.page.getByRole('heading', { name: 'Open shared workflow' })
+      comfyPage.page.getByTestId(TestIds.dialogs.openSharedWorkflowTitle)
     ).toBeVisible()
 
     await expect(comfyPage.templates.content).toBeHidden()

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

@@ -1082,17 +1082,10 @@ test.describe(
       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)
-      await comfyPage.command.executeCommand('Workspace.SearchBox.Toggle')
-      await comfyPage.nextFrame()
-      await comfyPage.searchBox.fillAndSelectFirstNode('KSampler')
+      await comfyPage.searchBoxV2.addNode('KSampler')
       await comfyPage.nodeOps.waitForGraphNodes(1)
 
       // Convert the KSampler node to a subgraph

browser_tests/tests/vueNodes/videoPreview.spec.ts

@@ -9,8 +9,6 @@ const file1 = 'workflow.mp4' as const
 const file2 = 'workflow.webm' as const
 
 test('@vue-nodes Load Video', async ({ comfyPage, comfyFiles }) => {
-  await comfyPage.settings.setSetting('Comfy.NodeSearchBoxImpl', 'v1 (legacy)')
-
   const loadVideoNode = comfyPage.vueNodes.getNodeByTitle('Load Video')
   const loadVideo = new VideoPreview(loadVideoNode)
 
@@ -18,9 +16,7 @@ test('@vue-nodes Load Video', async ({ comfyPage, comfyFiles }) => {
     await comfyPage.menu.topbar.newWorkflowButton.click()
     await comfyPage.nextFrame()
 
-    await comfyPage.page.mouse.dblclick(500, 300, { delay: 5 })
-    await comfyPage.searchBox.fillAndSelectFirstNode('Load Video')
-
+    await comfyPage.searchBoxV2.addNode('Load Video')
     await expect(loadVideoNode).toHaveCount(1)
     await expect(loadVideoNode).toBeVisible()
   })

browser_tests/tests/vueNodes/widgets/audioWidget.spec.ts

@@ -5,8 +5,6 @@ import {
 } from '@e2e/fixtures/ComfyPage'
 
 test('@vue-nodes Audio Widget', async ({ comfyPage, comfyFiles }) => {
-  await comfyPage.settings.setSetting('Comfy.NodeSearchBoxImpl', 'v1 (legacy)')
-
   const loadAudioNode = comfyPage.vueNodes.getNodeByTitle('Load Audio')
   const audioPreview = new AudioPreview(loadAudioNode)
 
@@ -14,9 +12,7 @@ test('@vue-nodes Audio Widget', async ({ comfyPage, comfyFiles }) => {
     await comfyPage.menu.topbar.newWorkflowButton.click()
     await comfyPage.nextFrame()
 
-    //await comfyPage.canvasOps.doubleClick()
-    await comfyPage.page.mouse.dblclick(500, 500, { delay: 5 })
-    await comfyPage.searchBox.fillAndSelectFirstNode('Load Audio')
+    await comfyPage.searchBoxV2.addNode('Load Audio')
     await expect(loadAudioNode).toBeVisible()
   })
 

package.json

@@ -1,6 +1,6 @@
 {
   "name": "@comfyorg/comfyui-frontend",
-  "version": "1.45.9",
+  "version": "1.45.12",
   "private": true,
   "description": "Official front-end implementation of ComfyUI",
   "homepage": "https://comfy.org",
@@ -37,7 +37,7 @@
     "lint:desktop": "nx run @comfyorg/desktop-ui:lint",
     "locale": "lobe-i18n locale",
     "oxlint": "oxlint src browser_tests --type-aware",
-    "prepare": "husky || true && git config blame.ignoreRevsFile .git-blame-ignore-revs || true",
+    "prepare": "pnpm exec husky || true && git config blame.ignoreRevsFile .git-blame-ignore-revs || true",
     "preview": "nx preview",
     "storybook": "nx storybook",
     "storybook:desktop": "nx run @comfyorg/desktop-ui:storybook",
@@ -60,6 +60,7 @@
     "@atlaskit/pragmatic-drag-and-drop": "^1.3.1",
     "@comfyorg/comfyui-electron-types": "catalog:",
     "@comfyorg/design-system": "workspace:*",
+    "@comfyorg/fbx-exporter-three": "^1.0.1",
     "@comfyorg/object-info-parser": "workspace:*",
     "@comfyorg/registry-types": "workspace:*",
     "@comfyorg/shared-frontend-utils": "workspace:*",
@@ -112,7 +113,7 @@
     "primevue": "catalog:",
     "reka-ui": "catalog:",
     "semver": "^7.7.2",
-    "three": "^0.170.0",
+    "three": "catalog:",
     "tiptap-markdown": "^0.8.10",
     "typegpu": "catalog:",
     "vee-validate": "catalog:",
@@ -210,20 +211,7 @@
   },
   "engines": {
     "node": "24.x",
-    "pnpm": ">=10"
+    "pnpm": ">=11"
   },
-  "packageManager": "pnpm@10.33.0",
-  "pnpm": {
-    "overrides": {
-      "vite": "catalog:"
-    },
-    "ignoredBuiltDependencies": [
-      "@firebase/util",
-      "core-js",
-      "protobufjs",
-      "sharp",
-      "unrs-resolver",
-      "vue-demi"
-    ]
-  }
+  "packageManager": "pnpm@11.1.1"
 }

packages/design-system/package.json

@@ -20,7 +20,6 @@
     "tailwindcss": "catalog:",
     "typescript": "catalog:"
   },
-  "packageManager": "pnpm@10.17.1",
   "nx": {
     "tags": [
       "scope:shared",

packages/ingest-types/package.json

@@ -16,7 +16,6 @@
   "devDependencies": {
     "@hey-api/openapi-ts": "0.93.0"
   },
-  "packageManager": "pnpm@10.17.1",
   "nx": {
     "tags": [
       "scope:shared",

packages/registry-types/package.json

@@ -6,7 +6,6 @@
   "exports": {
     ".": "./src/comfyRegistryTypes.ts"
   },
-  "packageManager": "pnpm@10.17.1",
   "nx": {
     "tags": [
       "scope:shared",

packages/shared-frontend-utils/package.json

@@ -18,6 +18,5 @@
   },
   "devDependencies": {
     "typescript": "catalog:"
-  },
-  "packageManager": "pnpm@10.17.1"
+  }
 }

packages/shared-frontend-utils/src/formatUtil.test.ts

@@ -112,6 +112,7 @@ describe('formatUtil', () => {
         expect(getMediaTypeFromFilename('asset.gltf')).toBe('3D')
         expect(getMediaTypeFromFilename('binary.glb')).toBe('3D')
         expect(getMediaTypeFromFilename('apple.usdz')).toBe('3D')
+        expect(getMediaTypeFromFilename('scan.ply')).toBe('3D')
       })
     })
 

packages/shared-frontend-utils/src/formatUtil.ts

@@ -591,7 +591,7 @@ const IMAGE_EXTENSIONS = [
 ] as const
 const VIDEO_EXTENSIONS = ['mp4', 'm4v', 'webm', 'mov', 'avi', 'mkv'] as const
 const AUDIO_EXTENSIONS = ['mp3', 'wav', 'ogg', 'flac'] as const
-const THREE_D_EXTENSIONS = ['obj', 'fbx', 'gltf', 'glb', 'usdz'] as const
+const THREE_D_EXTENSIONS = ['obj', 'fbx', 'gltf', 'glb', 'usdz', 'ply'] as const
 const TEXT_EXTENSIONS = [
   'txt',
   'md',

pnpm-workspace.yaml

@@ -2,6 +2,11 @@ packages:
   - apps/**
   - packages/**
 
+ignoreWorkspaceRootCheck: true
+catalogMode: prefer
+publicHoistPattern:
+  - '@parcel/watcher'
+
 catalog:
   '@alloc/quick-lru': ^5.2.0
   '@astrojs/check': ^0.9.8
@@ -31,7 +36,7 @@ catalog:
   '@primevue/themes': ^4.2.5
   '@sentry/vite-plugin': ^4.6.0
   '@sentry/vue': ^10.32.1
-  '@sparkjsdev/spark': ^0.1.10
+  '@sparkjsdev/spark': ^2.1.0
   '@storybook/addon-docs': ^10.2.10
   '@storybook/addon-mcp': 0.1.6
   '@storybook/vue3': ^10.2.10
@@ -54,7 +59,7 @@ catalog:
   '@types/jsdom': ^21.1.7
   '@types/node': ^24.1.0
   '@types/semver': ^7.7.0
-  '@types/three': ^0.170.0
+  '@types/three': ^0.184.1
   '@vee-validate/zod': ^4.15.1
   '@vercel/analytics': ^2.0.1
   '@vitejs/plugin-vue': ^6.0.0
@@ -113,7 +118,7 @@ catalog:
   storybook: ^10.2.10
   stylelint: ^16.26.1
   tailwindcss: ^4.3.0
-  three: ^0.170.0
+  three: ^0.184.0
   tailwindcss-primeui: ^0.6.1
   tsx: ^4.15.6
   tw-animate-css: ^1.3.8
@@ -144,22 +149,20 @@ catalog:
 
 cleanupUnusedCatalogs: true
 
-ignoredBuiltDependencies:
-  - '@firebase/util'
-  - protobufjs
-  - unrs-resolver
-  - vue-demi
-
-onlyBuiltDependencies:
-  - '@playwright/browser-chromium'
-  - '@playwright/browser-firefox'
-  - '@playwright/browser-webkit'
-  - '@sentry/cli'
-  - '@tailwindcss/oxide'
-  - esbuild
-  - nx
-  - oxc-resolver
+allowBuilds:
+  '@firebase/util': false
+  '@sentry/cli': true
+  '@tailwindcss/oxide': true
+  core-js: false
+  esbuild: true
+  nx: true
+  oxc-resolver: true
+  protobufjs: false
+  sharp: false
+  unrs-resolver: false
+  vue-demi: false
 
 overrides:
+  vite: 'catalog:'
   '@tiptap/pm': 2.27.2
   '@types/eslint': '-'

src/components/bottomPanel/tabs/terminal/LogsTerminal.test.ts

@@ -0,0 +1,291 @@
+import { createTestingPinia } from '@pinia/testing'
+import { render, screen } from '@testing-library/vue'
+import { beforeEach, describe, expect, it, vi } from 'vitest'
+import { nextTick } from 'vue'
+import { createI18n } from 'vue-i18n'
+
+import LogsTerminal from '@/components/bottomPanel/tabs/terminal/LogsTerminal.vue'
+
+const apiMock = vi.hoisted(
+  () =>
+    new (class extends EventTarget {
+      clientId: string | null = 'test-client'
+      getRawLogs = vi.fn(async () => ({ entries: [{ m: 'log line\n' }] }))
+      subscribeLogs = vi.fn(async () => {})
+    })()
+)
+
+vi.mock('@/scripts/api', () => ({ api: apiMock }))
+
+const terminalMock = vi.hoisted(() => ({
+  open: vi.fn(),
+  dispose: vi.fn(),
+  write: vi.fn(),
+  reset: vi.fn(),
+  scrollToBottom: vi.fn(),
+  onSelectionChange: vi.fn(() => ({ dispose: vi.fn() })),
+  hasSelection: vi.fn(() => false),
+  getSelection: vi.fn(() => ''),
+  selectAll: vi.fn(),
+  clearSelection: vi.fn()
+}))
+
+vi.mock('@/composables/bottomPanelTabs/useTerminal', () => ({
+  useTerminal: vi.fn(() => ({
+    terminal: terminalMock,
+    useAutoSize: vi.fn(() => ({ resize: vi.fn() }))
+  }))
+}))
+
+vi.mock('@/components/bottomPanel/tabs/terminal/BaseTerminal.vue', async () => {
+  const { defineComponent, ref } = await import('vue')
+  const { useTerminal } =
+    await import('@/composables/bottomPanelTabs/useTerminal')
+  return {
+    default: defineComponent({
+      emits: ['created'],
+      setup(_, { emit }) {
+        const root = ref<HTMLElement | undefined>(undefined)
+        emit('created', useTerminal(root), root)
+        return () => null
+      }
+    })
+  }
+})
+
+const i18n = createI18n({
+  legacy: false,
+  locale: 'en',
+  messages: {
+    en: {
+      logsTerminal: {
+        loadError:
+          'Unable to load logs, please ensure you have updated your ComfyUI backend.',
+        resyncError:
+          'Unable to resync logs after the backend reconnected. Reopen the console to retry.'
+      }
+    }
+  }
+})
+
+const renderLogsTerminal = () =>
+  render(LogsTerminal, {
+    global: {
+      plugins: [
+        createTestingPinia({
+          createSpy: vi.fn,
+          stubActions: false,
+          initialState: { execution: { clientId: 'test-client' } }
+        }),
+        i18n
+      ]
+    }
+  })
+
+// Silence the production console.error calls in error-path tests. Vitest
+// isolates this file's module graph so the spy does not affect other files.
+vi.spyOn(console, 'error').mockImplementation(() => {})
+
+// Resolve a getRawLogs call manually to drive deterministic timing in tests
+// that need to observe behavior mid-fetch.
+const deferredRawLogs = () => {
+  let resolve!: (value: { entries: { m: string }[] }) => void
+  let reject!: (err: unknown) => void
+  const promise = new Promise<{ entries: { m: string }[] }>((res, rej) => {
+    resolve = res
+    reject = rej
+  })
+  return { promise, resolve, reject }
+}
+
+describe('LogsTerminal', () => {
+  beforeEach(() => {
+    vi.clearAllMocks()
+    apiMock.clientId = 'test-client'
+  })
+
+  it('loads logs and subscribes to streaming on mount', async () => {
+    renderLogsTerminal()
+
+    await vi.waitFor(() => {
+      expect(apiMock.getRawLogs).toHaveBeenCalledTimes(1)
+      expect(apiMock.subscribeLogs).toHaveBeenCalledWith(true)
+      expect(terminalMock.write).toHaveBeenCalledWith('log line\n')
+    })
+  })
+
+  it('resyncs, snaps to tail, and re-subscribes on "reconnected"', async () => {
+    renderLogsTerminal()
+
+    await vi.waitFor(() => {
+      expect(apiMock.subscribeLogs).toHaveBeenCalledWith(true)
+    })
+
+    apiMock.dispatchEvent(new CustomEvent('reconnected'))
+
+    await vi.waitFor(() => {
+      expect(apiMock.getRawLogs).toHaveBeenCalledTimes(2)
+      expect(terminalMock.reset).toHaveBeenCalledTimes(1)
+      expect(terminalMock.scrollToBottom).toHaveBeenCalledTimes(1)
+      expect(apiMock.subscribeLogs).toHaveBeenCalledTimes(2)
+      expect(apiMock.subscribeLogs).toHaveBeenLastCalledWith(true)
+    })
+
+    // The full sequence must be: reset -> write -> scroll -> subscribe
+    const resetOrder = terminalMock.reset.mock.invocationCallOrder[0]
+    const writeOrder = terminalMock.write.mock.invocationCallOrder.at(-1)!
+    const scrollOrder = terminalMock.scrollToBottom.mock.invocationCallOrder[0]
+    const subscribeOrder =
+      apiMock.subscribeLogs.mock.invocationCallOrder.at(-1)!
+    expect(resetOrder).toBeLessThan(writeOrder)
+    expect(writeOrder).toBeLessThan(scrollOrder)
+    expect(scrollOrder).toBeLessThan(subscribeOrder)
+  })
+
+  it('aborts an in-flight resync when a second "reconnected" arrives', async () => {
+    renderLogsTerminal()
+    await vi.waitFor(() => {
+      expect(apiMock.subscribeLogs).toHaveBeenCalledWith(true)
+    })
+
+    // First resync hangs on getRawLogs
+    const first = deferredRawLogs()
+    apiMock.getRawLogs.mockImplementationOnce(() => first.promise)
+    apiMock.dispatchEvent(new CustomEvent('reconnected'))
+    await vi.waitFor(() => {
+      expect(apiMock.getRawLogs).toHaveBeenCalledTimes(2)
+    })
+
+    // Second resync resolves immediately
+    apiMock.getRawLogs.mockImplementationOnce(async () => ({
+      entries: [{ m: 'fresh\n' }]
+    }))
+    apiMock.dispatchEvent(new CustomEvent('reconnected'))
+    await vi.waitFor(() => {
+      expect(terminalMock.reset).toHaveBeenCalledTimes(1)
+    })
+
+    // Now resolve the first (aborted) resync — none of its side effects must apply
+    first.resolve({ entries: [{ m: 'stale\n' }] })
+    await nextTick()
+    await nextTick()
+
+    expect(terminalMock.reset).toHaveBeenCalledTimes(1)
+    expect(terminalMock.write).not.toHaveBeenCalledWith('stale\n')
+    expect(terminalMock.write).toHaveBeenCalledWith('fresh\n')
+  })
+
+  it('aborts an in-flight mount fetch when "reconnected" arrives first', async () => {
+    // Mount's getRawLogs hangs so we can drive the race deterministically.
+    const mount = deferredRawLogs()
+    apiMock.getRawLogs.mockImplementationOnce(() => mount.promise)
+    renderLogsTerminal()
+    await vi.waitFor(() => {
+      expect(apiMock.getRawLogs).toHaveBeenCalledTimes(1)
+    })
+
+    // Resync wins the race and writes the post-reboot snapshot.
+    apiMock.getRawLogs.mockImplementationOnce(async () => ({
+      entries: [{ m: 'fresh\n' }]
+    }))
+    apiMock.dispatchEvent(new CustomEvent('reconnected'))
+    await vi.waitFor(() => {
+      expect(terminalMock.reset).toHaveBeenCalledTimes(1)
+      expect(terminalMock.write).toHaveBeenCalledWith('fresh\n')
+    })
+
+    // Mount's late response must not stomp on the freshly-reset terminal.
+    mount.resolve({ entries: [{ m: 'stale-mount\n' }] })
+    await nextTick()
+    await nextTick()
+
+    expect(terminalMock.write).not.toHaveBeenCalledWith('stale-mount\n')
+  })
+
+  it('surfaces an inline error when the resync fetch fails', async () => {
+    renderLogsTerminal()
+    await vi.waitFor(() => {
+      expect(apiMock.subscribeLogs).toHaveBeenCalledWith(true)
+    })
+
+    apiMock.getRawLogs.mockRejectedValueOnce(new Error('boom'))
+
+    apiMock.dispatchEvent(new CustomEvent('reconnected'))
+
+    await vi.waitFor(() => {
+      expect(
+        screen.getByTestId('terminal-error-message').textContent
+      ).toContain('Unable to resync logs')
+    })
+  })
+
+  it('shows a load error when the initial fetch fails', async () => {
+    apiMock.getRawLogs.mockRejectedValueOnce(new Error('boom'))
+
+    renderLogsTerminal()
+
+    await vi.waitFor(() => {
+      expect(
+        screen.getByTestId('terminal-error-message').textContent
+      ).toContain('Unable to load logs')
+    })
+  })
+
+  it('recovers from an initial load failure when a reconnect arrives', async () => {
+    apiMock.getRawLogs
+      .mockRejectedValueOnce(new Error('initial fail'))
+      .mockResolvedValueOnce({ entries: [{ m: 'recovered\n' }] })
+
+    renderLogsTerminal()
+
+    await vi.waitFor(() => {
+      expect(
+        screen.getByTestId('terminal-error-message').textContent
+      ).toContain('Unable to load logs')
+    })
+
+    apiMock.dispatchEvent(new CustomEvent('reconnected'))
+
+    await vi.waitFor(() => {
+      expect(screen.queryByTestId('terminal-error-message')).toBeNull()
+      expect(screen.queryByTestId('terminal-loading-spinner')).toBeNull()
+      expect(terminalMock.write).toHaveBeenCalledWith('recovered\n')
+    })
+  })
+
+  it('cleans up listeners and unsubscribes on unmount', async () => {
+    const { unmount } = renderLogsTerminal()
+    await vi.waitFor(() => {
+      expect(apiMock.subscribeLogs).toHaveBeenCalledWith(true)
+    })
+
+    unmount()
+    await vi.waitFor(() => {
+      expect(apiMock.subscribeLogs).toHaveBeenCalledWith(false)
+    })
+
+    apiMock.dispatchEvent(new CustomEvent('reconnected'))
+    await nextTick()
+
+    expect(terminalMock.reset).not.toHaveBeenCalled()
+    // No additional getRawLogs beyond the mount-time call
+    expect(apiMock.getRawLogs).toHaveBeenCalledTimes(1)
+  })
+
+  it('does not write to the terminal when unmount happens mid-fetch', async () => {
+    const pending = deferredRawLogs()
+    apiMock.getRawLogs.mockImplementationOnce(() => pending.promise)
+
+    const { unmount } = renderLogsTerminal()
+    await vi.waitFor(() => {
+      expect(apiMock.getRawLogs).toHaveBeenCalledTimes(1)
+    })
+
+    unmount()
+    pending.resolve({ entries: [{ m: 'late\n' }] })
+    await nextTick()
+    await nextTick()
+
+    expect(terminalMock.write).not.toHaveBeenCalled()
+  })
+})

src/components/bottomPanel/tabs/terminal/LogsTerminal.vue

@@ -12,79 +12,36 @@
       data-testid="terminal-loading-spinner"
       class="relative inset-0 z-10 flex h-full items-center justify-center"
     />
-    <BaseTerminal v-show="!loading" @created="terminalCreated" />
+    <BaseTerminal
+      v-show="!loading && !errorMessage"
+      @created="terminalCreated"
+    />
   </div>
 </template>
 
 <script setup lang="ts">
-import { until } from '@vueuse/core'
-import { storeToRefs } from 'pinia'
+import type { Terminal } from '@xterm/xterm'
 import ProgressSpinner from 'primevue/progressspinner'
 import type { Ref } from 'vue'
-import { onMounted, onUnmounted, ref } from 'vue'
+import { shallowRef } from 'vue'
 
 import type { useTerminal } from '@/composables/bottomPanelTabs/useTerminal'
-import type { LogEntry, LogsWsMessage } from '@/schemas/apiSchema'
-import { api } from '@/scripts/api'
-import { useExecutionStore } from '@/stores/executionStore'
+import { useLogsTerminal } from '@/composables/bottomPanelTabs/useLogsTerminal'
 
 import BaseTerminal from './BaseTerminal.vue'
 
-const errorMessage = ref('')
-const loading = ref(true)
+const terminal = shallowRef<Terminal>()
+const { errorMessage, loading } = useLogsTerminal(terminal)
 
 const terminalCreated = (
-  { terminal, useAutoSize }: ReturnType<typeof useTerminal>,
+  { terminal: instance, useAutoSize }: ReturnType<typeof useTerminal>,
   root: Ref<HTMLElement | undefined>
 ) => {
   // Auto-size terminal to fill container width.
   // minCols: 80 ensures minimum width for colab environments.
   // See https://github.com/comfyanonymous/ComfyUI/issues/6396
   useAutoSize({ root, autoRows: true, autoCols: true, minCols: 80 })
-
-  const update = (entries: Array<LogEntry>) => {
-    terminal.write(entries.map((e) => e.m).join(''))
-  }
-
-  const logReceived = (e: CustomEvent<LogsWsMessage>) => {
-    update(e.detail.entries)
-  }
-
-  const loadLogEntries = async () => {
-    const logs = await api.getRawLogs()
-    update(logs.entries)
-  }
-
-  const watchLogs = async () => {
-    const { clientId } = storeToRefs(useExecutionStore())
-    if (!clientId.value) {
-      await until(clientId).not.toBeNull()
-    }
-    await api.subscribeLogs(true)
-    api.addEventListener('logs', logReceived)
-  }
-
-  onMounted(async () => {
-    try {
-      await loadLogEntries()
-    } catch (err) {
-      console.error('Error loading logs', err)
-      // On older backends the endpoints won't exist
-      errorMessage.value =
-        'Unable to load logs, please ensure you have updated your ComfyUI backend.'
-      return
-    }
-
-    await watchLogs()
-    loading.value = false
-  })
-
-  onUnmounted(async () => {
-    if (api.clientId) {
-      await api.subscribeLogs(false)
-    }
-    api.removeEventListener('logs', logReceived)
-  })
+  terminal.value = instance
 }
 </script>
 

src/components/graph/GraphCanvas.vue

@@ -541,32 +541,26 @@ onMounted(async () => {
     }
 
     vueNodeLifecycle.setupEmptyGraphListener()
+
+    // Load color palette
+    colorPaletteStore.customPalettes = settingStore.get(
+      'Comfy.CustomColorPalettes'
+    )
+
+    // Restore saved workflow and workflow tabs state
+    await workflowPersistence.initializeWorkflow()
+    await workflowPersistence.restoreWorkflowTabsState()
+    await workflowPersistence.loadTemplateFromUrlIfPresent()
   } finally {
     workspaceStore.spinner = false
   }
+  await workflowPersistence.loadSharedWorkflowFromUrlIfPresent()
 
   comfyApp.canvas.onSelectionChange = useChainCallback(
     comfyApp.canvas.onSelectionChange,
     () => canvasStore.updateSelectedItems()
   )
 
-  // Load color palette
-  colorPaletteStore.customPalettes = settingStore.get(
-    'Comfy.CustomColorPalettes'
-  )
-
-  // Restore saved workflow and workflow tabs state
-  await workflowPersistence.initializeWorkflow()
-  await workflowPersistence.restoreWorkflowTabsState()
-
-  const sharedWorkflowLoadStatus =
-    await workflowPersistence.loadSharedWorkflowFromUrlIfPresent()
-
-  // Load template from URL if present
-  if (sharedWorkflowLoadStatus === 'not-present') {
-    await workflowPersistence.loadTemplateFromUrlIfPresent()
-  }
-
   // Accept workspace invite from URL if present (e.g., ?invite=TOKEN)
   // WorkspaceAuthGate ensures flag state is resolved before GraphCanvas mounts
   if (inviteUrlLoader && flags.teamWorkspacesEnabled) {

src/components/graph/NodeContextMenu.vue

@@ -10,7 +10,7 @@
       <a
         v-bind="props.action"
         class="flex items-center gap-2 px-3 py-1.5"
-        @click="item.isColorSubmenu ? showColorPopover($event) : undefined"
+        @click="onItemClick($event, item)"
       >
         <i v-if="item.icon" :class="[item.icon, 'size-4']" />
         <span class="flex-1">{{ item.label }}</span>
@@ -21,20 +21,27 @@
           {{ item.shortcut }}
         </span>
         <i
-          v-if="hasSubmenu || item.isColorSubmenu"
+          v-if="hasSubmenu || item.isColorSubmenu || item.isShapeSubmenu"
           class="icon-[lucide--chevron-right] size-4 opacity-60"
         />
       </a>
     </template>
   </ContextMenu>
 
-  <!-- Color picker menu (custom with color circles) -->
-  <ColorPickerMenu
+  <SubmenuPopover
     v-if="colorOption"
-    ref="colorPickerMenu"
-    key="color-picker-menu"
+    ref="colorSubmenu"
+    key="color-submenu"
     :option="colorOption"
-    @submenu-click="handleColorSelect"
+    @submenu-click="handleSubmenuSelect"
+  />
+
+  <SubmenuPopover
+    v-if="shapeOption"
+    ref="shapeSubmenu"
+    key="shape-submenu"
+    :option="shapeOption"
+    @submenu-click="handleSubmenuSelect"
   />
 </template>
 
@@ -54,16 +61,18 @@ import type {
 } from '@/composables/graph/useMoreOptionsMenu'
 import { useCanvasStore } from '@/renderer/core/canvas/canvasStore'
 
-import ColorPickerMenu from './selectionToolbox/ColorPickerMenu.vue'
+import SubmenuPopover from './selectionToolbox/SubmenuPopover.vue'
 
 interface ExtendedMenuItem extends MenuItem {
   isColorSubmenu?: boolean
+  isShapeSubmenu?: boolean
   shortcut?: string
   originalOption?: MenuOption
 }
 
 const contextMenu = ref<InstanceType<typeof ContextMenu>>()
-const colorPickerMenu = ref<InstanceType<typeof ColorPickerMenu>>()
+const colorSubmenu = ref<InstanceType<typeof SubmenuPopover>>()
+const shapeSubmenu = ref<InstanceType<typeof SubmenuPopover>>()
 const isOpen = ref(false)
 
 const { menuOptions, bump } = useMoreOptionsMenu()
@@ -150,21 +159,20 @@ useEventListener(
   { passive: true }
 )
 
-// Find color picker option
 const colorOption = computed(() =>
   menuOptions.value.find((opt) => opt.isColorPicker)
 )
 
-// Check if option is the color picker
-function isColorOption(option: MenuOption): boolean {
-  return Boolean(option.isColorPicker)
-}
+const shapeOption = computed(() =>
+  menuOptions.value.find((opt) => opt.isShapePicker)
+)
 
-// Convert MenuOption to PrimeVue MenuItem
 function convertToMenuItem(option: MenuOption): ExtendedMenuItem {
   if (option.type === 'divider') return { separator: true }
 
-  const isColor = isColorOption(option)
+  const isColor = Boolean(option.isColorPicker)
+  const isShape = Boolean(option.isShapePicker)
+  const usesPopover = isColor || isShape
 
   const item: ExtendedMenuItem = {
     label: option.label,
@@ -172,11 +180,14 @@ function convertToMenuItem(option: MenuOption): ExtendedMenuItem {
     disabled: option.disabled,
     shortcut: option.shortcut,
     isColorSubmenu: isColor,
+    isShapeSubmenu: isShape,
     originalOption: option
   }
 
-  // Native submenus for non-color options
-  if (option.hasSubmenu && option.submenu && !isColor) {
+  // Submenus opened via popover (color, shape) deliberately omit `items` so
+  // PrimeVue does not render a nested <ul> inside the scrollable root list,
+  // which would be clipped when the menu overflows the viewport (FE-570).
+  if (option.hasSubmenu && option.submenu && !usesPopover) {
     item.items = option.submenu.map((sub) => ({
       label: sub.label,
       icon: sub.icon,
@@ -188,7 +199,6 @@ function convertToMenuItem(option: MenuOption): ExtendedMenuItem {
     }))
   }
 
-  // Regular action items
   if (!option.hasSubmenu && option.action) {
     item.command = () => {
       option.action?.()
@@ -245,17 +255,30 @@ function toggle(event: Event) {
 
 defineExpose({ toggle, hide, isOpen, show })
 
-function showColorPopover(event: MouseEvent) {
-  event.stopPropagation()
-  event.preventDefault()
-  const target = Array.from((event.currentTarget as HTMLElement).children).find(
-    (el) => el.classList.contains('icon-[lucide--chevron-right]')
-  ) as HTMLElement
-  colorPickerMenu.value?.toggle(event, target)
+function onItemClick(event: MouseEvent, item: ExtendedMenuItem) {
+  if (item.isColorSubmenu) {
+    openSubmenuPopover(event, colorSubmenu.value, shapeSubmenu.value)
+  } else if (item.isShapeSubmenu) {
+    openSubmenuPopover(event, shapeSubmenu.value, colorSubmenu.value)
+  }
 }
 
-// Handle color selection
-function handleColorSelect(subOption: SubMenuOption) {
+function openSubmenuPopover(
+  event: MouseEvent,
+  target: InstanceType<typeof SubmenuPopover> | undefined,
+  other: InstanceType<typeof SubmenuPopover> | undefined
+) {
+  if (!target) return
+  event.stopPropagation()
+  event.preventDefault()
+  other?.hide()
+  const anchor = Array.from((event.currentTarget as HTMLElement).children).find(
+    (el) => el.classList.contains('icon-[lucide--chevron-right]')
+  ) as HTMLElement
+  target.toggle(event, anchor)
+}
+
+function handleSubmenuSelect(subOption: SubMenuOption) {
   subOption.action()
   hide()
 }
@@ -270,11 +293,17 @@ function constrainMenuHeight() {
   if (!rootList) return
 
   const rect = rootList.getBoundingClientRect()
-  const maxHeight = window.innerHeight - rect.top - 8
-  if (maxHeight > 0) {
-    rootList.style.maxHeight = `${maxHeight}px`
-    rootList.style.overflowY = 'auto'
-  }
+  const availableHeight = window.innerHeight - rect.top - 8
+  if (availableHeight <= 0) return
+
+  // Setting overflow-y to auto/scroll on the root <ul> coerces overflow-x
+  // to a non-visible value too (CSS spec), which clips horizontally-opening
+  // submenus like Shape. Only apply the constraint when content truly
+  // overflows so the common case keeps overflow visible.
+  if (rootList.scrollHeight <= availableHeight) return
+
+  rootList.style.maxHeight = `${availableHeight}px`
+  rootList.style.overflowY = 'auto'
 }
 
 function onMenuShow() {

src/components/graph/selectionToolbox/SubmenuPopover.vue

@@ -8,7 +8,7 @@
     unstyled
     :pt="{
       root: {
-        class: 'absolute z-60'
+        class: 'p-popover absolute z-60'
       },
       content: {
         class: [
@@ -90,8 +90,12 @@ const popoverRef = ref<InstanceType<typeof Popover>>()
 const toggle = (event: Event, target?: HTMLElement) => {
   popoverRef.value?.toggle(event, target)
 }
+const hide = () => {
+  popoverRef.value?.hide()
+}
 defineExpose({
-  toggle
+  toggle,
+  hide
 })
 
 const handleSubmenuClick = (subOption: SubMenuOption) => {

src/components/load3d/Load3D.vue

@@ -4,8 +4,6 @@
     @mouseenter="handleMouseEnter"
     @mouseleave="handleMouseLeave"
     @pointerdown.stop
-    @pointermove.stop
-    @pointerup.stop
   >
     <Load3DScene
       v-if="node"

src/components/load3d/Load3DScene.vue

@@ -5,11 +5,7 @@
     data-capture-wheel="true"
     tabindex="-1"
     @pointerdown.stop="focusContainer"
-    @pointermove.stop
-    @pointerup.stop
     @mousedown.stop
-    @mousemove.stop
-    @mouseup.stop
     @contextmenu.stop.prevent
     @dragover.prevent.stop="handleDragOver"
     @dragleave.stop="handleDragLeave"

src/components/load3d/controls/ExportControls.vue

@@ -48,7 +48,8 @@ const showExportFormats = ref(false)
 const exportFormats = [
   { label: 'GLB', value: 'glb' },
   { label: 'OBJ', value: 'obj' },
-  { label: 'STL', value: 'stl' }
+  { label: 'STL', value: 'stl' },
+  { label: 'FBX', value: 'fbx' }
 ]
 
 function toggleExportFormats() {

src/components/load3d/controls/viewer/ViewerExportControls.test.ts

@@ -81,12 +81,12 @@ function renderComponent(onExportModel?: (format: string) => void) {
 }
 
 describe('ViewerExportControls', () => {
-  it('renders all three export format options', () => {
+  it('renders all four export format options', () => {
     renderComponent()
     const select = screen.getByRole('combobox') as HTMLSelectElement
     const optionValues = Array.from(select.options).map((o) => o.value)
 
-    expect(optionValues).toEqual(['glb', 'obj', 'stl'])
+    expect(optionValues).toEqual(['glb', 'obj', 'stl', 'fbx'])
   })
 
   it('defaults the export format to obj', () => {

src/components/load3d/controls/viewer/ViewerExportControls.vue

@@ -42,7 +42,8 @@ const emit = defineEmits<{
 const exportFormats = [
   { label: 'GLB', value: 'glb' },
   { label: 'OBJ', value: 'obj' },
-  { label: 'STL', value: 'stl' }
+  { label: 'STL', value: 'stl' },
+  { label: 'FBX', value: 'fbx' }
 ]
 
 const exportFormat = ref('obj')

src/components/node/CreditBadge.vue

@@ -12,7 +12,7 @@
   </span>
   <span
     v-if="rest"
-    class="-ml-2.5 max-w-max min-w-0 grow basis-0 truncate rounded-r-full bg-component-node-widget-background"
+    class="-ml-2.5 flex h-5 max-w-max min-w-0 grow basis-0 items-center truncate rounded-r-full bg-component-node-widget-background text-xs"
   >
     <span class="pr-2" v-text="rest" />
   </span>

src/components/queue/QueueProgressOverlay.vue

@@ -4,6 +4,7 @@
     :class="['flex', 'justify-end', 'w-full', 'pointer-events-none']"
   >
     <div
+      data-testid="queue-progress-overlay"
       class="pointer-events-auto flex max-h-[60vh] w-[350px] min-w-[310px] flex-col overflow-hidden rounded-lg border font-inter transition-colors duration-200 ease-in-out"
       :class="containerClass"
       @mouseenter="isHovered = true"

src/components/sidebar/tabs/AssetsSidebarTab.vue

@@ -141,7 +141,6 @@
           <template v-if="isCompact">
             <!-- Compact mode: Icon only -->
             <Button
-              v-if="shouldShowDeleteButton"
               size="icon"
               data-testid="assets-delete-selected"
               @click="handleDeleteSelected"
@@ -159,7 +158,6 @@
           <template v-else>
             <!-- Normal mode: Icon + Text -->
             <Button
-              v-if="shouldShowDeleteButton"
               variant="secondary"
               data-testid="assets-delete-selected"
               @click="handleDeleteSelected"
@@ -190,7 +188,6 @@
     :asset="contextMenuAsset"
     :asset-type="contextMenuAssetType"
     :file-kind="contextMenuFileKind"
-    :show-delete-button="shouldShowDeleteButton"
     :selected-assets="selectedAssets"
     :is-bulk-mode="isBulkMode"
     @zoom="handleZoomClick(contextMenuAsset)"
@@ -237,7 +234,7 @@ import Button from '@/components/ui/button/Button.vue'
 import MediaAssetContextMenu from '@/platform/assets/components/MediaAssetContextMenu.vue'
 import MediaAssetFilterBar from '@/platform/assets/components/MediaAssetFilterBar.vue'
 import { getAssetType } from '@/platform/assets/composables/media/assetMappers'
-import { useMediaAssets } from '@/platform/assets/composables/media/useMediaAssets'
+import { useAssetsApi } from '@/platform/assets/composables/media/useAssetsApi'
 import { useAssetSelection } from '@/platform/assets/composables/useAssetSelection'
 import { useMediaAssetActions } from '@/platform/assets/composables/useMediaAssetActions'
 import { useMediaAssetFiltering } from '@/platform/assets/composables/useMediaAssetFiltering'
@@ -246,9 +243,9 @@ import type { OutputAssetMetadata } from '@/platform/assets/schemas/assetMetadat
 import { getOutputAssetMetadata } from '@/platform/assets/schemas/assetMetadataSchema'
 import type { AssetItem } from '@/platform/assets/schemas/assetSchema'
 import { getAssetDisplayName } from '@/platform/assets/utils/assetMetadataUtils'
+import { getAssetUrl } from '@/platform/assets/utils/assetUrlUtil'
 import type { MediaKind } from '@/platform/assets/schemas/mediaAssetSchema'
 import { resolveOutputAssetItems } from '@/platform/assets/utils/outputAssetUtil'
-import { isCloud } from '@/platform/distribution/types'
 import { useDialogStore } from '@/stores/dialogStore'
 import { ResultItemImpl } from '@/stores/queueStore'
 import {
@@ -280,13 +277,6 @@ const isListView = computed(() => viewMode.value === 'list')
 const contextMenuRef = ref<InstanceType<typeof MediaAssetContextMenu>>()
 const contextMenuAsset = ref<AssetItem | null>(null)
 
-// Determine if delete button should be shown
-// Hide delete button when in input tab and not in cloud (OSS mode - files are from local folders)
-const shouldShowDeleteButton = computed(() => {
-  if (activeTab.value === 'input' && !isCloud) return false
-  return true
-})
-
 const contextMenuAssetType = computed(() =>
   contextMenuAsset.value ? getAssetType(contextMenuAsset.value.tags) : 'input'
 )
@@ -309,8 +299,8 @@ const formattedExecutionTime = computed(() => {
 
 const toast = useToast()
 
-const inputAssets = useMediaAssets('input')
-const outputAssets = useMediaAssets('output')
+const inputAssets = useAssetsApi('input')
+const outputAssets = useAssetsApi('output')
 
 // Asset selection
 const {
@@ -582,7 +572,7 @@ const handleZoomClick = (asset: AssetItem) => {
       title: getAssetDisplayName(asset),
       component: Load3dViewerContent,
       props: {
-        modelUrl: asset.preview_url || ''
+        modelUrl: asset.preview_url || getAssetUrl(asset)
       },
       dialogComponentProps: {
         style: 'width: 80vw; height: 80vh;',

src/components/sidebar/tabs/JobHistorySidebarTab.vue

@@ -1,5 +1,8 @@
 <template>
-  <SidebarTabTemplate :title="$t('queue.jobHistory')">
+  <SidebarTabTemplate
+    data-testid="job-history-sidebar"
+    :title="$t('queue.jobHistory')"
+  >
     <template #alt-title>
       <div class="ml-auto flex shrink-0 items-center">
         <JobHistoryActionsMenu @clear-history="onClearHistory" />

src/components/ui/search-input/AsyncSearchInput.test.ts

@@ -25,17 +25,19 @@ type Searcher = NonNullable<ComponentProps<typeof AsyncSearchInput>['searcher']>
 function renderSearch(
   initialQuery: string = '',
   searcher?: Searcher,
-  updateKey?: { value: unknown }
+  updateKey?: { value: unknown },
+  onEnter?: (event: KeyboardEvent) => void
 ) {
   const query = ref(initialQuery)
   const key = updateKey
   const Harness = defineComponent({
     components: { AsyncSearchInput },
-    setup: () => ({ query, searcher, key }),
+    setup: () => ({ query, searcher, key, onEnter }),
     template: `<AsyncSearchInput
       v-model="query"
       :searcher="searcher"
       :update-key="key"
+      @enter="onEnter"
     />`
   })
   const utils = render(Harness, { global: { plugins: [i18n] } })
@@ -63,6 +65,14 @@ describe('AsyncSearchInput', () => {
       await user.type(screen.getByRole('textbox'), 'abc')
       expect(query.value).toBe('abc')
     })
+
+    it('emits enter when the user presses Enter in the textbox', async () => {
+      const onEnter = vi.fn()
+      renderSearch('', undefined, undefined, onEnter)
+      const user = userEvent.setup({ advanceTimers: vi.advanceTimersByTime })
+      await user.type(screen.getByRole('textbox'), '{Enter}')
+      expect(onEnter).toHaveBeenCalledTimes(1)
+    })
   })
 
   describe('Clear button', () => {

src/components/ui/search-input/AsyncSearchInput.vue

@@ -23,6 +23,9 @@ const {
   debounceMaxWaitMs?: number
   class?: HTMLAttributes['class']
 }>()
+const emit = defineEmits<{
+  enter: [event: KeyboardEvent]
+}>()
 
 const searchQuery = defineModel<string>({ default: '' })
 
@@ -62,6 +65,11 @@ function handleFocus(event: FocusEvent) {
     target.select()
   }
 }
+
+function handleKeydownEnter(event: KeyboardEvent) {
+  if (event.isComposing) return
+  emit('enter', event)
+}
 </script>
 
 <template>
@@ -97,6 +105,7 @@ function handleFocus(event: FocusEvent) {
       :placeholder="$t('g.searchPlaceholder', { subject: '' })"
       :autofocus
       @focus="handleFocus"
+      @keydown.enter="handleKeydownEnter"
     />
     <button
       v-if="searchQuery.trim().length > 0"

src/composables/bottomPanelTabs/useLogsTerminal.ts

@@ -0,0 +1,123 @@
+import { until, useEventListener } from '@vueuse/core'
+import { storeToRefs } from 'pinia'
+import type { Ref } from 'vue'
+import { onMounted, onScopeDispose, ref } from 'vue'
+import { useI18n } from 'vue-i18n'
+
+import type { LogEntry, LogsWsMessage } from '@/schemas/apiSchema'
+import { api } from '@/scripts/api'
+import { useExecutionStore } from '@/stores/executionStore'
+
+type TerminalLike = {
+  write: (data: string) => void
+  reset: () => void
+  scrollToBottom: () => void
+}
+
+/**
+ * Drives the built-in logs terminal: initial load, live `logs` stream, and
+ * full resync when the backend WebSocket reconnects (e.g., after a reboot).
+ *
+ * Listeners are registered synchronously so we cannot miss a `reconnected`
+ * event during the mount-time fetch/subscribe awaits. In-flight fetches are
+ * tied to AbortControllers so that:
+ *   - rapid double-reconnects don't interleave writes / double-subscribe
+ *   - unmount mid-fetch never writes to a disposed terminal
+ */
+export function useLogsTerminal(
+  terminal: Readonly<Ref<TerminalLike | undefined>>
+) {
+  const { t } = useI18n()
+  const errorMessage = ref('')
+  const loading = ref(true)
+
+  let mountController: AbortController | undefined
+  let resyncController: AbortController | undefined
+
+  const writeEntries = (entries: LogEntry[]) => {
+    terminal.value?.write(entries.map((e) => e.m).join(''))
+  }
+
+  const resyncLogs = async () => {
+    // Cancel both the in-flight mount fetch and any prior resync so a late
+    // mount response can't write a stale snapshot on top of a freshly-reset
+    // terminal after we've already written the post-reconnect view.
+    mountController?.abort()
+    resyncController?.abort()
+    const controller = new AbortController()
+    resyncController = controller
+    const { signal } = controller
+
+    try {
+      const logs = await api.getRawLogs()
+      if (signal.aborted || !terminal.value) return
+      terminal.value.reset()
+      writeEntries(logs.entries)
+      terminal.value.scrollToBottom()
+      // Backend lost the per-client log subscription across the restart;
+      // re-subscribe so new runtime logs stream over the fresh WebSocket.
+      await api.subscribeLogs(true)
+      if (signal.aborted) return
+      errorMessage.value = ''
+      loading.value = false
+    } catch (err) {
+      if (signal.aborted) return
+      console.error('Error resyncing logs after reconnect', err)
+      errorMessage.value = t('logsTerminal.resyncError')
+    }
+  }
+
+  // Register listeners synchronously, before any awaits, so a reconnect
+  // fired during mount cannot be missed. useEventListener handles cleanup
+  // on scope dispose.
+  useEventListener(api, 'logs', (e: CustomEvent<LogsWsMessage>) => {
+    writeEntries(e.detail.entries)
+  })
+  useEventListener(api, 'reconnected', () => {
+    void resyncLogs()
+  })
+
+  onMounted(async () => {
+    if (!terminal.value) await until(terminal).toBeTruthy()
+
+    const controller = new AbortController()
+    mountController = controller
+    const { signal } = controller
+
+    try {
+      const logs = await api.getRawLogs()
+      if (signal.aborted || !terminal.value) return
+      writeEntries(logs.entries)
+    } catch (err) {
+      if (signal.aborted) return
+      console.error('Error loading logs', err)
+      errorMessage.value = t('logsTerminal.loadError')
+      loading.value = false
+      return
+    }
+
+    const { clientId } = storeToRefs(useExecutionStore())
+    if (!clientId.value) await until(clientId).not.toBeNull()
+    if (signal.aborted) return
+
+    try {
+      await api.subscribeLogs(true)
+    } catch (err) {
+      if (signal.aborted) return
+      console.error('Error subscribing to logs', err)
+    }
+
+    if (!signal.aborted) loading.value = false
+  })
+
+  onScopeDispose(() => {
+    mountController?.abort()
+    resyncController?.abort()
+    if (!api.clientId) return
+    api.subscribeLogs(false).catch((err) => {
+      console.error('Error unsubscribing from logs', err)
+    })
+  })
+
+  return { errorMessage, loading }
+}

src/composables/graph/useErrorClearingHooks.test.ts

@@ -989,12 +989,8 @@ describe('scan skips interior of bypassed subgraph containers', () => {
       expect.any(Function),
       expect.any(Function)
     )
-    expect(mediaScanSpy).toHaveBeenCalledWith(rootGraph, leafNode, false)
-    expect(mediaScanSpy).not.toHaveBeenCalledWith(
-      rootGraph,
-      innerSubgraphNode,
-      false
-    )
+    expect(mediaScanSpy).toHaveBeenCalledWith(rootGraph, leafNode)
+    expect(mediaScanSpy).not.toHaveBeenCalledWith(rootGraph, innerSubgraphNode)
   })
 })
 

src/composables/graph/useErrorClearingHooks.ts

@@ -246,7 +246,7 @@ function scanSingleNodeMedia(node: LGraphNode): void {
   if (!app.rootGraph) return
   if (!getActiveExecutionId(node)) return
 
-  const mediaCandidates = scanNodeMediaCandidates(app.rootGraph, node, isCloud)
+  const mediaCandidates = scanNodeMediaCandidates(app.rootGraph, node)
   const confirmedMedia = mediaCandidates.filter((c) => c.isMissing === true)
   if (confirmedMedia.length) {
     useMissingMediaStore().addMissingMedia(confirmedMedia)
@@ -302,7 +302,7 @@ async function verifyAndAddPendingMedia(
 ): Promise<void> {
   const rootGraphAtScan = app.rootGraph
   try {
-    await verifyMediaCandidates(pending, { isCloud })
+    await verifyMediaCandidates(pending, { allowCompactSuffix: isCloud })
     if (app.rootGraph !== rootGraphAtScan) return
     const verified = pending.filter(
       (c) => c.isMissing === true && isCandidateStillActive(c.nodeId)

src/composables/graph/useGraphNodeManager.ts

@@ -48,6 +48,8 @@ export interface WidgetSlotMetadata {
   type: string
 }
 
+type Badges = (LGraphBadge | (() => LGraphBadge))[]
+
 /**
  * Minimal render-specific widget data extracted from LiteGraph widgets.
  * Value and metadata (label, hidden, disabled, etc.) are accessed via widgetValueStore.
@@ -107,7 +109,7 @@ export interface VueNodeData {
   title: string
   type: string
   apiNode?: boolean
-  badges?: (LGraphBadge | (() => LGraphBadge))[]
+  badges?: Badges
   bgcolor?: string
   color?: string
   flags?: {
@@ -786,6 +788,12 @@ export function useGraphNodeManager(graph: LGraph): GraphNodeManager {
                 showAdvanced: Boolean(propertyEvent.newValue)
               })
               break
+            case 'badges':
+              vueNodeData.set(nodeId, {
+                ...currentData,
+                badges: propertyEvent.newValue as Badges
+              })
+              break
           }
         }
       },

src/composables/graph/useMoreOptionsMenu.ts

@@ -33,6 +33,7 @@ export interface MenuOption {
   disabled?: boolean
   source?: 'litegraph' | 'vue'
   isColorPicker?: boolean
+  isShapePicker?: boolean
 }
 
 export interface SubMenuOption {

src/composables/graph/useNodeMenuOptions.ts

@@ -66,6 +66,7 @@ export function useNodeMenuOptions() {
       icon: 'icon-[lucide--box]',
       hasSubmenu: true,
       submenu: shapeSubmenu.value,
+      isShapePicker: true,
       action: () => {}
     },
     {

src/composables/maskeditor/useMaskEditorSaver.ts

@@ -1,3 +1,5 @@
+import type { UploadImageResponse } from '@comfyorg/ingest-types'
+
 import { useMaskEditorDataStore } from '@/stores/maskEditorDataStore'
 import { useMaskEditorStore } from '@/stores/maskEditorStore'
 import { useNodeOutputStore } from '@/stores/nodeOutputStore'
@@ -6,7 +8,6 @@ import type {
   EditorOutputLayer,
   ImageRef
 } from '@/stores/maskEditorDataStore'
-import { isCloud } from '@/platform/distribution/types'
 import { api } from '@/scripts/api'
 import { app } from '@/scripts/app'
 import { createAnnotatedPath } from '@/utils/createAnnotatedPath'
@@ -209,18 +210,11 @@ export function useMaskEditorSaver() {
   }
 
   async function uploadAllLayers(outputData: EditorOutputData): Promise<void> {
-    const sourceRef = dataStore.inputData!.sourceRef
-
-    const actualMaskedRef = await uploadMask(outputData.maskedImage, sourceRef)
-    const actualPaintRef = await uploadImage(outputData.paintLayer, sourceRef)
-    const actualPaintedRef = await uploadImage(
-      outputData.paintedImage,
-      sourceRef
-    )
-
-    const actualPaintedMaskedRef = await uploadMask(
-      outputData.paintedMaskedImage,
-      actualPaintedRef
+    const actualMaskedRef = await uploadLayer(outputData.maskedImage)
+    const actualPaintRef = await uploadLayer(outputData.paintLayer)
+    const actualPaintedRef = await uploadLayer(outputData.paintedImage)
+    const actualPaintedMaskedRef = await uploadLayer(
+      outputData.paintedMaskedImage
     )
 
     outputData.maskedImage.ref = actualMaskedRef
@@ -229,50 +223,10 @@ export function useMaskEditorSaver() {
     outputData.paintedMaskedImage.ref = actualPaintedMaskedRef
   }
 
-  async function uploadMask(
-    layer: EditorOutputLayer,
-    originalRef: ImageRef
-  ): Promise<ImageRef> {
+  async function uploadLayer(layer: EditorOutputLayer): Promise<ImageRef> {
     const formData = new FormData()
     formData.append('image', layer.blob, layer.ref.filename)
-    formData.append('original_ref', JSON.stringify(originalRef))
     formData.append('type', 'input')
-    formData.append('subfolder', 'clipspace')
-
-    const response = await api.fetchApi('/upload/mask', {
-      method: 'POST',
-      body: formData
-    })
-
-    if (!response.ok) {
-      throw new Error(`Failed to upload mask: ${layer.ref.filename}`)
-    }
-
-    try {
-      const data = await response.json()
-      if (data?.name) {
-        return {
-          filename: data.name,
-          subfolder: data.subfolder || layer.ref.subfolder,
-          type: data.type || layer.ref.type
-        }
-      }
-    } catch (error) {
-      console.warn('[MaskEditorSaver] Failed to parse upload response:', error)
-    }
-
-    return layer.ref
-  }
-
-  async function uploadImage(
-    layer: EditorOutputLayer,
-    originalRef: ImageRef
-  ): Promise<ImageRef> {
-    const formData = new FormData()
-    formData.append('image', layer.blob, layer.ref.filename)
-    formData.append('original_ref', JSON.stringify(originalRef))
-    formData.append('type', 'input')
-    formData.append('subfolder', 'clipspace')
 
     const response = await api.fetchApi('/upload/image', {
       method: 'POST',
@@ -280,23 +234,31 @@ export function useMaskEditorSaver() {
     })
 
     if (!response.ok) {
-      throw new Error(`Failed to upload image: ${layer.ref.filename}`)
+      throw new Error(`Failed to upload: ${layer.ref.filename}`)
     }
 
+    let data: UploadImageResponse
     try {
-      const data = await response.json()
-      if (data?.name) {
-        return {
-          filename: data.name,
-          subfolder: data.subfolder || layer.ref.subfolder,
-          type: data.type || layer.ref.type
-        }
-      }
+      data = await response.json()
     } catch (error) {
-      console.warn('[MaskEditorSaver] Failed to parse upload response:', error)
+      throw new Error(
+        `Invalid upload response for ${layer.ref.filename}: ${
+          error instanceof Error ? error.message : String(error)
+        }`
+      )
     }
 
-    return layer.ref
+    if (!data?.name) {
+      throw new Error(
+        `Upload response missing 'name' for ${layer.ref.filename}`
+      )
+    }
+
+    return {
+      filename: data.name,
+      subfolder: data.subfolder || '',
+      type: data.type || 'input'
+    }
   }
 
   async function updateNodePreview(
@@ -322,19 +284,8 @@ export function useMaskEditorSaver() {
 
     const imageWidget = node.widgets?.find((w) => w.name === 'image')
     if (imageWidget) {
-      // Widget value format differs between Cloud and OSS:
-      // - Cloud: JUST the filename (subfolder handled by backend)
-      // - OSS: subfolder/filename (traditional format)
-      let widgetValue: string
-      if (isCloud) {
-        widgetValue =
-          mainRef.filename + (mainRef.type ? ` [${mainRef.type}]` : '')
-      } else {
-        widgetValue =
-          (mainRef.subfolder ? mainRef.subfolder + '/' : '') +
-          mainRef.filename +
-          (mainRef.type ? ` [${mainRef.type}]` : '')
-      }
+      const widgetValue =
+        mainRef.filename + (mainRef.type ? ` [${mainRef.type}]` : '')
 
       imageWidget.value = widgetValue
 

src/composables/node/useNodeDragToCanvas.test.ts

@@ -3,20 +3,27 @@ import { afterEach, beforeEach, describe, expect, it, vi } from 'vitest'
 import type { ComfyNodeDefImpl } from '@/stores/nodeDefStore'
 import type { useNodeDragToCanvas as UseNodeDragToCanvasType } from './useNodeDragToCanvas'
 
-const { mockAddNodeOnGraph, mockConvertEventToCanvasOffset, mockCanvas } =
-  vi.hoisted(() => {
-    const mockConvertEventToCanvasOffset = vi.fn()
-    return {
-      mockAddNodeOnGraph: vi.fn(),
-      mockConvertEventToCanvasOffset,
-      mockCanvas: {
-        canvas: {
-          getBoundingClientRect: vi.fn()
-        },
-        convertEventToCanvasOffset: mockConvertEventToCanvasOffset
-      }
+const {
+  mockAddNodeOnGraph,
+  mockConvertEventToCanvasOffset,
+  mockSelectItems,
+  mockCanvas
+} = vi.hoisted(() => {
+  const mockConvertEventToCanvasOffset = vi.fn()
+  const mockSelectItems = vi.fn()
+  return {
+    mockAddNodeOnGraph: vi.fn(),
+    mockConvertEventToCanvasOffset,
+    mockSelectItems,
+    mockCanvas: {
+      canvas: {
+        getBoundingClientRect: vi.fn()
+      },
+      convertEventToCanvasOffset: mockConvertEventToCanvasOffset,
+      selectItems: mockSelectItems
     }
-  })
+  }
+})
 
 vi.mock('@/renderer/core/canvas/canvasStore', () => ({
   useCanvasStore: vi.fn(() => ({
@@ -119,6 +126,11 @@ describe('useNodeDragToCanvas', () => {
         'pointermove',
         expect.any(Function)
       )
+      expect(addEventListenerSpy).toHaveBeenCalledWith(
+        'pointerdown',
+        expect.any(Function),
+        true
+      )
       expect(addEventListenerSpy).toHaveBeenCalledWith(
         'pointerup',
         expect.any(Function),
@@ -239,6 +251,57 @@ describe('useNodeDragToCanvas', () => {
       expect(isDragging.value).toBe(true)
     })
 
+    it('should select the placed node when one is returned from the graph', () => {
+      mockCanvas.canvas.getBoundingClientRect.mockReturnValue({
+        left: 0,
+        right: 500,
+        top: 0,
+        bottom: 500
+      })
+      mockConvertEventToCanvasOffset.mockReturnValue([150, 150])
+      const placedNode = { id: 1 }
+      mockAddNodeOnGraph.mockReturnValue(placedNode)
+
+      const { startDrag, setupGlobalListeners } = useNodeDragToCanvas()
+      setupGlobalListeners()
+      startDrag(mockNodeDef)
+
+      document.dispatchEvent(
+        new PointerEvent('pointerup', {
+          clientX: 250,
+          clientY: 250,
+          bubbles: true
+        })
+      )
+
+      expect(mockSelectItems).toHaveBeenCalledWith([placedNode])
+    })
+
+    it('should not call selectItems when graph returns no node', () => {
+      mockCanvas.canvas.getBoundingClientRect.mockReturnValue({
+        left: 0,
+        right: 500,
+        top: 0,
+        bottom: 500
+      })
+      mockConvertEventToCanvasOffset.mockReturnValue([150, 150])
+      mockAddNodeOnGraph.mockReturnValue(null)
+
+      const { startDrag, setupGlobalListeners } = useNodeDragToCanvas()
+      setupGlobalListeners()
+      startDrag(mockNodeDef)
+
+      document.dispatchEvent(
+        new PointerEvent('pointerup', {
+          clientX: 250,
+          clientY: 250,
+          bubbles: true
+        })
+      )
+
+      expect(mockSelectItems).not.toHaveBeenCalled()
+    })
+
     it('should not add node on pointerup when in native drag mode', () => {
       mockCanvas.canvas.getBoundingClientRect.mockReturnValue({
         left: 0,
@@ -339,4 +402,58 @@ describe('useNodeDragToCanvas', () => {
       expect(dragMode.value).toBe('click')
     })
   })
+
+  describe('blockCommitPointerDown', () => {
+    function dispatchPointerDown(x: number, y: number) {
+      const event = new PointerEvent('pointerdown', {
+        clientX: x,
+        clientY: y,
+        bubbles: true,
+        cancelable: true
+      })
+      const stopSpy = vi.spyOn(event, 'stopImmediatePropagation')
+      document.dispatchEvent(event)
+      return stopSpy
+    }
+
+    beforeEach(() => {
+      mockCanvas.canvas.getBoundingClientRect.mockReturnValue({
+        left: 0,
+        right: 500,
+        top: 0,
+        bottom: 500
+      })
+    })
+
+    it('should stop propagation when in click-drag mode over canvas', () => {
+      const { startDrag, setupGlobalListeners } = useNodeDragToCanvas()
+      setupGlobalListeners()
+      startDrag(mockNodeDef)
+
+      expect(dispatchPointerDown(250, 250)).toHaveBeenCalled()
+    })
+
+    it('should not stop propagation when not dragging', () => {
+      const { setupGlobalListeners } = useNodeDragToCanvas()
+      setupGlobalListeners()
+
+      expect(dispatchPointerDown(250, 250)).not.toHaveBeenCalled()
+    })
+
+    it('should not stop propagation in native drag mode', () => {
+      const { startDrag, setupGlobalListeners } = useNodeDragToCanvas()
+      setupGlobalListeners()
+      startDrag(mockNodeDef, 'native')
+
+      expect(dispatchPointerDown(250, 250)).not.toHaveBeenCalled()
+    })
+
+    it('should not stop propagation when pointer is outside canvas', () => {
+      const { startDrag, setupGlobalListeners } = useNodeDragToCanvas()
+      setupGlobalListeners()
+      startDrag(mockNodeDef)
+
+      expect(dispatchPointerDown(600, 250)).not.toHaveBeenCalled()
+    })
+  })
 })

src/composables/node/useNodeDragToCanvas.ts

@@ -22,31 +22,33 @@ function cancelDrag() {
   dragMode.value = 'click'
 }
 
-function addNodeAtPosition(clientX: number, clientY: number): boolean {
-  if (!draggedNode.value) return false
-
-  const canvasStore = useCanvasStore()
-  const canvas = canvasStore.canvas
-  if (!canvas) return false
-
-  const canvasElement = canvas.canvas as HTMLCanvasElement
+function isOverCanvas(clientX: number, clientY: number): boolean {
+  const canvasElement = useCanvasStore().canvas?.canvas as
+    | HTMLCanvasElement
+    | undefined
+  if (!canvasElement) return false
   const rect = canvasElement.getBoundingClientRect()
-  const isOverCanvas =
+  return (
     clientX >= rect.left &&
     clientX <= rect.right &&
     clientY >= rect.top &&
     clientY <= rect.bottom
+  )
+}
 
-  if (isOverCanvas) {
-    const pos = canvas.convertEventToCanvasOffset({
-      clientX,
-      clientY
-    } as PointerEvent)
-    const litegraphService = useLitegraphService()
-    litegraphService.addNodeOnGraph(draggedNode.value, { pos })
-    return true
-  }
-  return false
+function addNodeAtPosition(clientX: number, clientY: number): boolean {
+  if (!draggedNode.value) return false
+  const canvas = useCanvasStore().canvas
+  if (!canvas) return false
+  if (!isOverCanvas(clientX, clientY)) return false
+
+  const pos = canvas.convertEventToCanvasOffset({
+    clientX,
+    clientY
+  } as PointerEvent)
+  const node = useLitegraphService().addNodeOnGraph(draggedNode.value, { pos })
+  if (node) canvas.selectItems([node])
+  return true
 }
 
 function endDrag(e: PointerEvent) {
@@ -64,11 +66,19 @@ function handleKeydown(e: KeyboardEvent) {
   if (e.key === 'Escape') cancelDrag()
 }
 
+// Prevent LiteGraph's empty-canvas hit-test from deselecting the placed node on pointerup.
+function blockCommitPointerDown(e: PointerEvent) {
+  if (!isDragging.value || dragMode.value !== 'click') return
+  if (!isOverCanvas(e.clientX, e.clientY)) return
+  e.stopImmediatePropagation()
+}
+
 function setupGlobalListeners() {
   if (listenersSetup) return
   listenersSetup = true
 
   document.addEventListener('pointermove', updatePosition)
+  document.addEventListener('pointerdown', blockCommitPointerDown, true)
   document.addEventListener('pointerup', endDrag, true)
   document.addEventListener('keydown', handleKeydown)
 }
@@ -78,6 +88,7 @@ function cleanupGlobalListeners() {
   listenersSetup = false
 
   document.removeEventListener('pointermove', updatePosition)
+  document.removeEventListener('pointerdown', blockCommitPointerDown, true)
   document.removeEventListener('pointerup', endDrag, true)
   document.removeEventListener('keydown', handleKeydown)
 

src/composables/node/useNodePricing.test.ts

@@ -625,9 +625,9 @@ describe('useNodePricing', () => {
         getNodeDisplayPrice(node)
         await new Promise((r) => setTimeout(r, 50))
 
-        // VueNodes path bumps per-node ref instead of the global tick.
+        // VueNodes path bumps per-node ref and the global tick.
         expect(getNodeRevisionRef(node.id).value).toBeGreaterThan(revBefore)
-        expect(pricingRevision.value).toBe(tickBefore)
+        expect(pricingRevision.value).toBeGreaterThan(tickBefore)
       } finally {
         LiteGraph.vueNodesMode = false
       }

src/composables/node/useNodePricing.ts

@@ -509,10 +509,8 @@ const scheduleEvaluation = (
       if (LiteGraph.vueNodesMode) {
         // VueNodes mode: bump per-node revision (only this node re-renders)
         getNodeRevisionRef(node.id).value++
-      } else {
-        // Nodes 1.0 mode: bump global tick to trigger setDirtyCanvas
-        pricingTick.value++
       }
+      pricingTick.value++
     })
 
   inflight.set(node, { sig, promise })

src/composables/node/usePriceBadge.ts

@@ -18,6 +18,15 @@ export const usePriceBadge = () => {
     } else {
       node.badges.push(...newBadges)
     }
+    const graph = node.graph
+    if (!graph) return
+    graph.trigger('node:property:changed', {
+      type: 'node:property:changed',
+      nodeId: node.id,
+      property: 'badges',
+      oldValue: node.badges,
+      newValue: node.badges
+    })
   }
   function collectCreditsBadges(
     graph: LGraph,

src/composables/painter/usePainter.test.ts

@@ -384,7 +384,63 @@ describe('usePainter', () => {
         '/upload/image',
         expect.objectContaining({ method: 'POST' })
       )
-      expect(result).toBe('painter/uploaded.png [temp]')
+      expect(result).toBe('uploaded.png [input]')
+
+      const [, init] = fetchApiMock.mock.calls[0]
+      const body = init?.body as FormData
+      expect(body).toBeInstanceOf(FormData)
+      expect(body.get('type')).toBe('input')
+      expect(body.get('subfolder')).toBeNull()
+    })
+
+    it('throws when the upload response is missing a name', async () => {
+      const maskWidget = makeWidget('mask', '')
+      mockWidgets.push(maskWidget)
+
+      vi.mocked(api.fetchApi).mockResolvedValueOnce({
+        status: 200,
+        json: async () => ({})
+      } as Response)
+
+      const fakeCanvas = {
+        width: 4,
+        height: 4,
+        toBlob: (cb: BlobCallback) => cb(new Blob(['x']))
+      } as unknown as HTMLCanvasElement
+
+      const { canvasEl } = mountPainter('test-node', '')
+      canvasEl.value = fakeCanvas
+      await nextTick()
+
+      await expect(
+        maskWidget.serializeValue!({} as LGraphNode, 0)
+      ).rejects.toThrow(/painter\.uploadError/)
+    })
+
+    it('throws when the upload response body is not valid JSON', async () => {
+      const maskWidget = makeWidget('mask', '')
+      mockWidgets.push(maskWidget)
+
+      vi.mocked(api.fetchApi).mockResolvedValueOnce({
+        status: 200,
+        json: async () => {
+          throw new SyntaxError('Unexpected token')
+        }
+      } as unknown as Response)
+
+      const fakeCanvas = {
+        width: 4,
+        height: 4,
+        toBlob: (cb: BlobCallback) => cb(new Blob(['x']))
+      } as unknown as HTMLCanvasElement
+
+      const { canvasEl } = mountPainter('test-node', '')
+      canvasEl.value = fakeCanvas
+      await nextTick()
+
+      await expect(
+        maskWidget.serializeValue!({} as LGraphNode, 0)
+      ).rejects.toThrow(/painter\.uploadError/)
     })
 
     it('returns existing modelValue when canvas element is unmounted at serialize time', async () => {

src/composables/painter/usePainter.ts

@@ -1,3 +1,4 @@
+import type { UploadImageResponse } from '@comfyorg/ingest-types'
 import type { Ref } from 'vue'
 import { computed, onMounted, onUnmounted, ref, watch } from 'vue'
 import { useElementSize } from '@vueuse/core'
@@ -12,7 +13,6 @@ import { hexToRgb } from '@/utils/colorUtil'
 import type { Point } from '@/extensions/core/maskeditor/types'
 import type { LGraphNode } from '@/lib/litegraph/src/LGraphNode'
 import type { IBaseWidget } from '@/lib/litegraph/src/types/widgets'
-import { isCloud } from '@/platform/distribution/types'
 import { useToastStore } from '@/platform/updates/common/toastStore'
 import { api } from '@/scripts/api'
 import { app } from '@/scripts/app'
@@ -631,8 +631,7 @@ export function usePainter(nodeId: string, options: UsePainterOptions) {
     const name = `painter-${nodeId}-${Date.now()}.png`
     const body = new FormData()
     body.append('image', blob, name)
-    if (!isCloud) body.append('subfolder', 'painter')
-    body.append('type', isCloud ? 'input' : 'temp')
+    body.append('type', 'input')
 
     let resp: Response
     try {
@@ -658,7 +657,7 @@ export function usePainter(nodeId: string, options: UsePainterOptions) {
       throw new Error(err)
     }
 
-    let data: { name: string }
+    let data: UploadImageResponse
     try {
       data = await resp.json()
     } catch (e) {
@@ -670,9 +669,16 @@ export function usePainter(nodeId: string, options: UsePainterOptions) {
       throw new Error(err)
     }
 
-    const result = isCloud
-      ? `${data.name} [input]`
-      : `painter/${data.name} [temp]`
+    if (!data?.name) {
+      const err = t('painter.uploadError', {
+        status: resp.status,
+        statusText: "missing 'name' in response"
+      })
+      toastStore.addAlert(err)
+      throw new Error(err)
+    }
+
+    const result = `${data.name} [input]`
     modelValue.value = result
     isDirty.value = false
     return result

src/composables/useCoreCommands.ts

@@ -1283,23 +1283,9 @@ export function useCoreCommands(): ComfyCommand[] {
     {
       id: 'Comfy.BrowseModelAssets',
       icon: 'pi pi-folder-open',
-      label: 'Experimental: Browse Model Assets',
+      label: 'Browse Model Assets',
       versionAdded: '1.28.3',
       function: async () => {
-        if (!useSettingStore().get('Comfy.Assets.UseAssetAPI')) {
-          const confirmed = await dialogService.confirm({
-            title: 'Enable Asset API',
-            message:
-              'The Asset API is currently disabled. Would you like to enable it?',
-            type: 'default'
-          })
-
-          if (!confirmed) return
-
-          const settingStore = useSettingStore()
-          await settingStore.set('Comfy.Assets.UseAssetAPI', true)
-          await workflowService.reloadCurrentWorkflow()
-        }
         const assetBrowserDialog = useAssetBrowserDialog()
         await assetBrowserDialog.browse({
           assetType: 'models',
@@ -1318,22 +1304,6 @@ export function useCoreCommands(): ComfyCommand[] {
         })
       }
     },
-    {
-      id: 'Comfy.ToggleAssetAPI',
-      icon: 'pi pi-database',
-      label: () =>
-        `Experimental: ${
-          useSettingStore().get('Comfy.Assets.UseAssetAPI')
-            ? 'Disable'
-            : 'Enable'
-        } AssetAPI`,
-      function: async () => {
-        const settingStore = useSettingStore()
-        const current = settingStore.get('Comfy.Assets.UseAssetAPI') ?? false
-        await settingStore.set('Comfy.Assets.UseAssetAPI', !current)
-        await useWorkflowService().reloadCurrentWorkflow() // ensure changes take effect immediately
-      }
-    },
     {
       id: 'Comfy.ToggleQPOV2',
       icon: 'pi pi-list',

src/composables/useFeatureFlags.ts

@@ -43,6 +43,12 @@ function resolveFlag<T>(
   return remoteConfigValue ?? api.getServerFeature(flagKey, defaultValue)
 }
 
+/**
+ * Reactive feature-flag shape returned by {@link useFeatureFlags}.
+ * Exported so test mocks can stay in sync with the real shape.
+ */
+export type FeatureFlags = ReturnType<typeof useFeatureFlags>['flags']
+
 /**
  * Composable for reactive access to server-side feature flags
  */

src/composables/useLoad3d.test.ts

@@ -75,7 +75,6 @@ vi.mock('@/renderer/core/canvas/canvasStore', () => ({
 }))
 
 vi.mock('@/platform/assets/utils/assetPreviewUtil', () => ({
-  isAssetPreviewSupported: vi.fn(() => false),
   persistThumbnail: vi.fn().mockResolvedValue(undefined)
 }))
 
@@ -1483,22 +1482,9 @@ describe('useLoad3d', () => {
       expect(composable).toBeDefined()
     })
 
-    it('does not call captureThumbnail when asset preview is unsupported', async () => {
-      const { isAssetPreviewSupported } =
+    it('captures thumbnail and persists it when a model_file widget has a value', async () => {
+      const { persistThumbnail } =
         await import('@/platform/assets/utils/assetPreviewUtil')
-      vi.mocked(isAssetPreviewSupported).mockReturnValue(false)
-
-      const { handler } = await getModelReadyHandler()
-      handler()
-      await Promise.resolve()
-
-      expect(mockLoad3d.captureThumbnail).not.toHaveBeenCalled()
-    })
-
-    it('captures thumbnail and persists it when asset preview is supported and a model_file widget has a value', async () => {
-      const { isAssetPreviewSupported, persistThumbnail } =
-        await import('@/platform/assets/utils/assetPreviewUtil')
-      vi.mocked(isAssetPreviewSupported).mockReturnValue(true)
       vi.mocked(Load3dUtils.splitFilePath).mockReturnValue([
         '',
         'cube.glb'
@@ -1523,9 +1509,8 @@ describe('useLoad3d', () => {
     })
 
     it('skips persistence when the model widget has no value', async () => {
-      const { isAssetPreviewSupported, persistThumbnail } =
+      const { persistThumbnail } =
         await import('@/platform/assets/utils/assetPreviewUtil')
-      vi.mocked(isAssetPreviewSupported).mockReturnValue(true)
       mockNode.widgets = [
         { name: 'model_file', value: '' } as unknown as IWidget
       ]
@@ -1539,9 +1524,8 @@ describe('useLoad3d', () => {
     })
 
     it('swallows captureThumbnail rejections silently', async () => {
-      const { isAssetPreviewSupported, persistThumbnail } =
+      const { persistThumbnail } =
         await import('@/platform/assets/utils/assetPreviewUtil')
-      vi.mocked(isAssetPreviewSupported).mockReturnValue(true)
       vi.mocked(Load3dUtils.splitFilePath).mockReturnValue([
         '',
         'broken.glb'

src/composables/useLoad3d.ts

@@ -8,10 +8,7 @@ import { useChainCallback } from '@/composables/functional/useChainCallback'
 import type Load3d from '@/extensions/core/load3d/Load3d'
 import Load3dUtils from '@/extensions/core/load3d/Load3dUtils'
 import { createLoad3d } from '@/extensions/core/load3d/createLoad3d'
-import {
-  isAssetPreviewSupported,
-  persistThumbnail
-} from '@/platform/assets/utils/assetPreviewUtil'
+import { persistThumbnail } from '@/platform/assets/utils/assetPreviewUtil'
 import type {
   AnimationItem,
   CameraConfig,
@@ -862,7 +859,7 @@ export const useLoad3d = (nodeOrRef: MaybeRef<LGraphNode | null>) => {
       isFirstModelLoad = false
     },
     modelReady: () => {
-      if (!load3d || !isAssetPreviewSupported()) return
+      if (!load3d) return
 
       const node = nodeRef.value
       const modelWidget = node?.widgets?.find(

src/config/comfyApi.ts

@@ -12,11 +12,12 @@ const STAGING_PLATFORM_BASE_URL = 'https://stagingplatform.comfy.org'
 
 const BUILD_TIME_API_BASE_URL = __USE_PROD_CONFIG__
   ? PROD_API_BASE_URL
-  : STAGING_API_BASE_URL
+  : (import.meta.env.VITE_STAGING_API_BASE_URL ?? STAGING_API_BASE_URL)
 
 const BUILD_TIME_PLATFORM_BASE_URL = __USE_PROD_CONFIG__
   ? PROD_PLATFORM_BASE_URL
-  : STAGING_PLATFORM_BASE_URL
+  : (import.meta.env.VITE_STAGING_PLATFORM_BASE_URL ??
+    STAGING_PLATFORM_BASE_URL)
 
 export function getComfyApiBaseUrl(): string {
   if (!isCloud) {