Merge branch 'synap5e/assets-mode-sidebar' into synap5e/test/assets-sidebar-e2e

/view_metadata takes no path index and searches roots in order, so
metadata only misresolves on relative-path collisions; the root-0
targeting applies to preview URLs and row identity.

.github/workflows/cla.yml

@@ -38,11 +38,9 @@ jobs:
           PR_NUMBER: ${{ github.event.pull_request.number || github.event.issue.number }}
           PR_AUTHOR: ${{ github.event.pull_request.user.login || github.event.issue.user.login }}
           BASE_ALLOWLIST: action@github.com,actions-user,ampagent,claude,comfy-pr-bot,GitHub Action,github-actions,github-actions[bot],Glary Bot,Glary-Bot,*[bot]
-        # For each commit emit the GitHub login when the author/committer email resolves to a GitHub account
-        # otherwise fall back to the raw git name.
         run: |
           others=$(gh api "repos/${{ github.repository }}/pulls/${PR_NUMBER}/commits" --paginate \
-            --jq '.[] | (.author.login // .commit.author.name // empty), (.committer.login // .commit.committer.name // empty)' \
+            --jq '.[] | (.author.login // empty), (.committer.login // empty)' \
             | sort -u | grep -vix "${PR_AUTHOR}" | paste -sd, -)
           if [ -n "$others" ]; then
             echo "allowlist=${BASE_ALLOWLIST},${others}" >> "$GITHUB_OUTPUT"

.github/workflows/pr-backport.yaml

@@ -278,49 +278,32 @@ jobs:
               continue
             fi
 
-            # Create backport branch. A failure here (e.g. dirty state left
-            # by a prior target) must not abort the loop and skip remaining
-            # targets, so fall back to a clean checkout and record the error.
-            if ! git checkout -B "${BACKPORT_BRANCH}" "origin/${TARGET_BRANCH}"; then
-              echo "::error::Failed to create branch ${BACKPORT_BRANCH} for ${TARGET_BRANCH}"
-              FAILED="${FAILED}${TARGET_BRANCH}:branch-create-failed "
-              git checkout main || git checkout -f main
-              echo "::endgroup::"
-              continue
-            fi
+            # Create backport branch
+            git checkout -b "${BACKPORT_BRANCH}" "origin/${TARGET_BRANCH}"
 
             # Try cherry-pick
             if git cherry-pick "${MERGE_COMMIT}"; then
               if [ "$REMOTE_BACKPORT_EXISTS" = true ]; then
-                PUSH_CMD=(git push --force-with-lease origin "${BACKPORT_BRANCH}")
+                git push --force-with-lease origin "${BACKPORT_BRANCH}"
               else
-                PUSH_CMD=(git push origin "${BACKPORT_BRANCH}")
+                git push origin "${BACKPORT_BRANCH}"
               fi
-
-              # A push failure for one target must not abort the loop and
-              # prevent remaining targets from being attempted.
-              if "${PUSH_CMD[@]}"; then
-                echo "${BACKPORT_BRANCH}" >> "$CREATED_BRANCHES_FILE"
-                SUCCESS="${SUCCESS}${TARGET_BRANCH}:${BACKPORT_BRANCH} "
-                echo "Successfully created backport branch: ${BACKPORT_BRANCH}"
-              else
-                echo "::error::Failed to push ${BACKPORT_BRANCH} for ${TARGET_BRANCH}"
-                FAILED="${FAILED}${TARGET_BRANCH}:push-failed "
-              fi
-
+              echo "${BACKPORT_BRANCH}" >> "$CREATED_BRANCHES_FILE"
+              SUCCESS="${SUCCESS}${TARGET_BRANCH}:${BACKPORT_BRANCH} "
+              echo "Successfully created backport branch: ${BACKPORT_BRANCH}"
               # Return to main (keep the branch, we need it for PR)
-              git checkout main || git checkout -f main
+              git checkout main
             else
               # Get conflict info
               CONFLICTS=$(git diff --name-only --diff-filter=U | tr '\n' ',')
-              git cherry-pick --abort || true
+              git cherry-pick --abort
 
               echo "::error::Cherry-pick failed due to conflicts"
               FAILED="${FAILED}${TARGET_BRANCH}:conflicts:${CONFLICTS} "
 
               # Clean up the failed branch
-              git checkout main || git checkout -f main
-              git branch -D "${BACKPORT_BRANCH}" || true
+              git checkout main
+              git branch -D "${BACKPORT_BRANCH}"
             fi
 
             echo "::endgroup::"
@@ -401,10 +384,6 @@ jobs:
 
             **Reason:** Merge conflicts detected during cherry-pick of `${MERGE_COMMIT_SHORT}`
 
-            The auto-backport could not be completed automatically. Please backport
-            manually onto branch `${BACKPORT_BRANCH}` (from `origin/${target}`) and
-            open a PR to `${target}`.
-
             <details>
             <summary>📄 Conflicting files</summary>
 
@@ -437,37 +416,19 @@ jobs:
             MERGE_COMMIT=$(jq -r '.pull_request.merge_commit_sha' "$GITHUB_EVENT_PATH")
           fi
 
-          # Post a comment without letting a single failed `gh pr comment` (e.g.
-          # a locked issue, as happened for PR #13359, or a transient API error)
-          # abort the step under `set -e` and swallow the remaining failures.
-          post_comment() {
-            local body="$1"
-            local context="$2"
-            if ! gh pr comment "${PR_NUMBER}" --body "${body}"; then
-              echo "::warning::Could not comment on PR #${PR_NUMBER} about ${context}. Manual backport required."
-            fi
-          }
-
           for failure in ${{ steps.backport.outputs.failed }}; do
             IFS=':' read -r target reason conflicts <<< "${failure}"
 
-            SAFE_TARGET=$(echo "$target" | tr '/' '-')
-            BACKPORT_BRANCH="backport-${PR_NUMBER}-to-${SAFE_TARGET}"
-
             if [ "${reason}" = "branch-missing" ]; then
-              post_comment "@${PR_AUTHOR} Backport failed: Branch \`${target}\` does not exist" "missing branch ${target}"
+              gh pr comment "${PR_NUMBER}" --body "@${PR_AUTHOR} Backport failed: Branch \`${target}\` does not exist"
 
             elif [ "${reason}" = "already-exists" ]; then
-              post_comment "@${PR_AUTHOR} Commit \`${MERGE_COMMIT}\` already exists on branch \`${target}\`. No backport needed." "already-backported ${target}"
-
-            elif [ "${reason}" = "branch-create-failed" ]; then
-              gh pr comment "${PR_NUMBER}" --body "@${PR_AUTHOR} Backport to \`${target}\` failed: could not create the backport branch. Please retry or backport manually."
-
-            elif [ "${reason}" = "push-failed" ]; then
-              gh pr comment "${PR_NUMBER}" --body "@${PR_AUTHOR} Backport to \`${target}\` cherry-picked cleanly but the push failed. Please retry or push the backport branch manually."
+              gh pr comment "${PR_NUMBER}" --body "@${PR_AUTHOR} Commit \`${MERGE_COMMIT}\` already exists on branch \`${target}\`. No backport needed."
 
             elif [ "${reason}" = "conflicts" ]; then
               CONFLICTS_INLINE=$(echo "${conflicts}" | tr ',' ' ')
+              SAFE_TARGET=$(echo "$target" | tr '/' '-')
+              BACKPORT_BRANCH="backport-${PR_NUMBER}-to-${SAFE_TARGET}"
               PR_URL="${GITHUB_SERVER_URL}/${GITHUB_REPOSITORY}/pull/${PR_NUMBER}"
 
               export PR_NUMBER PR_URL MERGE_COMMIT target BACKPORT_BRANCH CONFLICTS_INLINE
@@ -483,10 +444,10 @@ jobs:
               CONFLICTS_BLOCK=$(echo "${conflicts}" | tr ',' '\n')
               MERGE_COMMIT_SHORT="${MERGE_COMMIT:0:7}"
 
-              export target MERGE_COMMIT_SHORT BACKPORT_BRANCH CONFLICTS_BLOCK AGENT_PROMPT PR_AUTHOR
-              COMMENT_BODY=$(envsubst '${target} ${MERGE_COMMIT_SHORT} ${BACKPORT_BRANCH} ${CONFLICTS_BLOCK} ${AGENT_PROMPT} ${PR_AUTHOR}' <<<"$COMMENT_BODY_TEMPLATE")
+              export target MERGE_COMMIT_SHORT CONFLICTS_BLOCK AGENT_PROMPT PR_AUTHOR
+              COMMENT_BODY=$(envsubst '${target} ${MERGE_COMMIT_SHORT} ${CONFLICTS_BLOCK} ${AGENT_PROMPT} ${PR_AUTHOR}' <<<"$COMMENT_BODY_TEMPLATE")
 
-              post_comment "${COMMENT_BODY}" "cherry-pick conflict on ${target} (backport manually onto ${BACKPORT_BRANCH})"
+              gh pr comment "${PR_NUMBER}" --body "${COMMENT_BODY}"
             fi
           done
 

.github/workflows/release-biweekly-comfyui.yaml

@@ -23,10 +23,6 @@ on:
         required: false
         default: 'Comfy-Org/ComfyUI'
         type: string
-      target_branch:
-        description: 'Optional: force a specific release branch, e.g. core/1.47 or core/2.0. Overrides the pin-derived target — use to skip a dead minor or do an out-of-cadence / major release.'
-        required: false
-        type: string
 
 jobs:
   check-release-week:
@@ -53,15 +49,12 @@ jobs:
           fi
 
       - name: Summary
-        env:
-          TARGET_BRANCH_OVERRIDE: ${{ inputs.target_branch }}
         run: |
           echo "## Release Check" >> $GITHUB_STEP_SUMMARY
           echo "" >> $GITHUB_STEP_SUMMARY
           echo "- Is release week: ${{ steps.check.outputs.is_release_week }}" >> $GITHUB_STEP_SUMMARY
           echo "- Manual trigger: ${{ github.event_name == 'workflow_dispatch' }}" >> $GITHUB_STEP_SUMMARY
           echo "- Release type: ${{ inputs.release_type || 'minor (scheduled)' }}" >> $GITHUB_STEP_SUMMARY
-          echo "- Target branch override: ${TARGET_BRANCH_OVERRIDE:-(none — pin-derived)}" >> $GITHUB_STEP_SUMMARY
 
   resolve-version:
     needs: check-release-week
@@ -110,7 +103,6 @@ jobs:
         working-directory: frontend
         env:
           RELEASE_TYPE: ${{ inputs.release_type || 'minor' }}
-          TARGET_BRANCH: ${{ inputs.target_branch }}
         run: |
           set -euo pipefail
 

apps/website/e2e/careers.spec.ts

@@ -8,7 +8,7 @@ test.describe('Careers page @smoke', () => {
   })
 
   test('has correct title', async ({ page }) => {
-    await expect(page).toHaveTitle('Careers - Comfy')
+    await expect(page).toHaveTitle('Careers — Comfy')
   })
 
   test('Roles section heading is visible', async ({ page }) => {
@@ -72,7 +72,7 @@ test.describe('Careers page role links', () => {
 test.describe('Careers page (zh-CN) @smoke', () => {
   test('renders localized heading and roles', async ({ page }) => {
     await page.goto('/zh-CN/careers')
-    await expect(page).toHaveTitle('招聘 - Comfy')
+    await expect(page).toHaveTitle('招聘 — Comfy')
     await expect(
       page.getByRole('heading', { name: '职位', level: 2 })
     ).toBeVisible()

apps/website/e2e/cloud-nodes.spec.ts

@@ -9,7 +9,7 @@ test.describe('Cloud nodes page @smoke', () => {
 
   test('has correct title', async ({ page }) => {
     await expect(page).toHaveTitle(
-      'Custom-node packs on Comfy Cloud - supported by default'
+      'Custom-node packs on Comfy Cloud — supported by default'
     )
   })
 

apps/website/e2e/cloud.spec.ts

@@ -8,7 +8,7 @@ test.describe('Cloud page @smoke', () => {
   })
 
   test('has correct title', async ({ page }) => {
-    await expect(page).toHaveTitle('Comfy Cloud - AI in the Cloud')
+    await expect(page).toHaveTitle('Comfy Cloud — AI in the Cloud')
   })
 
   test('HeroSection heading and subtitle are visible', async ({ page }) => {

apps/website/e2e/download.spec.ts

@@ -16,7 +16,7 @@ test.describe('Download page @smoke', () => {
 
   test('has correct title', async ({ page }) => {
     await expect(page).toHaveTitle(
-      'Download Comfy Desktop - Run AI on Your Hardware'
+      'Download Comfy Desktop — Run AI on Your Hardware'
     )
   })
 

apps/website/e2e/homepage.spec.ts

@@ -17,7 +17,7 @@ test.describe('Homepage @smoke', () => {
   })
 
   test('has correct title', async ({ page }) => {
-    await expect(page).toHaveTitle('Comfy - Professional Control of Visual AI')
+    await expect(page).toHaveTitle('Comfy — Professional Control of Visual AI')
   })
 
   test('HeroSection heading is visible', async ({ page }) => {

apps/website/e2e/learning.spec.ts

@@ -13,7 +13,7 @@ test.describe('Learning page @smoke', () => {
   })
 
   test('has correct title', async ({ page }) => {
-    await expect(page).toHaveTitle('Learning - Comfy')
+    await expect(page).toHaveTitle('Learning — Comfy')
   })
 
   test('hero headline references ComfyUI', async ({ page }) => {
@@ -137,7 +137,7 @@ test.describe('Learning page (zh-CN) @smoke', () => {
   test('renders localized title, headings, and tutorials', async ({ page }) => {
     await page.goto('/zh-CN/learning')
 
-    await expect(page).toHaveTitle('学习 - Comfy')
+    await expect(page).toHaveTitle('学习 — Comfy')
     await expect(page.getByRole('heading', { level: 1 })).toContainText(
       /[一-鿿]/
     )

apps/website/e2e/navigation.spec.ts

@@ -31,26 +31,6 @@ test.describe('Desktop navigation @smoke', () => {
     }
   })
 
-  test('NEW badge shows on Products and Community only', async ({ page }) => {
-    const nav = page.getByRole('navigation', { name: 'Main navigation' })
-    const desktopLinks = nav.getByTestId('desktop-nav-links')
-
-    for (const label of ['Products', 'Community']) {
-      await expect(
-        desktopLinks
-          .getByRole('button', { name: label })
-          .getByText('NEW', { exact: true })
-      ).toBeVisible()
-    }
-
-    await expect(
-      desktopLinks.getByRole('button', { name: 'Company' }).getByText('NEW')
-    ).toHaveCount(0)
-    await expect(
-      desktopLinks.getByRole('link', { name: 'Pricing' }).getByText('NEW')
-    ).toHaveCount(0)
-  })
-
   test('CTA buttons are visible', async ({ page }) => {
     const nav = page.getByRole('navigation', { name: 'Main navigation' })
     const desktopCTA = nav.getByTestId('desktop-nav-cta')
@@ -137,27 +117,6 @@ test.describe('Mobile menu @mobile', () => {
     }
   })
 
-  test('NEW badge shows on Products and Community only', async ({ page }) => {
-    await page.getByRole('button', { name: 'Toggle menu' }).click()
-
-    const menu = page.getByRole('dialog')
-
-    for (const label of ['Products', 'Community']) {
-      await expect(
-        menu.getByRole('button', { name: label }).getByText('NEW', {
-          exact: true
-        })
-      ).toBeVisible()
-    }
-
-    await expect(
-      menu.getByRole('button', { name: 'Company' }).getByText('NEW')
-    ).toHaveCount(0)
-    await expect(
-      menu.getByRole('link', { name: 'Pricing' }).getByText('NEW')
-    ).toHaveCount(0)
-  })
-
   test('clicking section with subitems drills down and back works', async ({
     page
   }) => {

apps/website/e2e/payment.spec.ts

@@ -22,7 +22,7 @@ test.describe('Payment success page @smoke', () => {
   })
 
   test('has correct title and is noindex', async ({ page }) => {
-    await expect(page).toHaveTitle('Payment Successful - Comfy')
+    await expect(page).toHaveTitle('Payment Successful — Comfy')
     await expectNoIndex(page)
   })
 
@@ -54,7 +54,7 @@ test.describe('Payment failed page @smoke', () => {
   })
 
   test('has correct title and is noindex', async ({ page }) => {
-    await expect(page).toHaveTitle('Payment Failed - Comfy')
+    await expect(page).toHaveTitle('Payment Failed — Comfy')
     await expectNoIndex(page)
   })
 
@@ -84,7 +84,7 @@ test.describe('Payment failed page @smoke', () => {
 test.describe('Payment pages zh-CN @smoke', () => {
   test('zh-CN success page renders and links correctly', async ({ page }) => {
     await page.goto('/zh-CN/payment/success')
-    await expect(page).toHaveTitle('支付成功 - Comfy')
+    await expect(page).toHaveTitle('支付成功 — Comfy')
     await expectNoIndex(page)
     await expect(
       page.getByRole('heading', { name: '支付成功', level: 1 })
@@ -99,7 +99,7 @@ test.describe('Payment pages zh-CN @smoke', () => {
 
   test('zh-CN failed page renders and links correctly', async ({ page }) => {
     await page.goto('/zh-CN/payment/failed')
-    await expect(page).toHaveTitle('支付失败 - Comfy')
+    await expect(page).toHaveTitle('支付失败 — Comfy')
     await expectNoIndex(page)
     await expect(
       page.getByRole('heading', { name: '无法完成支付', level: 1 })

apps/website/src/components/common/HeaderMain/HeaderMainDesktop.vue

@@ -16,7 +16,6 @@ import type { NavItem } from '../../../data/mainNavigation'
 import type { Locale } from '../../../i18n/translations'
 import NavColumn from './NavColumn.vue'
 import NavFeaturedCard from './NavFeaturedCard.vue'
-import NewBadge from './NewBadge.vue'
 
 const { locale = 'en' } = defineProps<{ locale?: Locale }>()
 const mainNavigation = getMainNavigation(locale)
@@ -43,10 +42,7 @@ function isNavItemActive(navItem: NavItem, path: string): boolean {
           <NavigationMenuTrigger
             :active="isNavItemActive(navItem, currentPath)"
           >
-            <span class="inline-flex items-center gap-1">
-              <span class="ppformula-text-center">{{ navItem.label }}</span>
-              <NewBadge v-if="navItem.badge" :locale="locale" size="xxs" />
-            </span>
+            {{ navItem.label }}
           </NavigationMenuTrigger>
           <NavigationMenuContent class="w-auto" data-testid="nav-dropdown">
             <ul class="flex w-max gap-16">

apps/website/src/components/common/HeaderMain/HeaderMainMobile.vue

@@ -8,7 +8,6 @@ import { lockScroll, unlockScroll } from '../../../composables/scrollLock'
 import type { Locale } from '../../../i18n/translations.ts'
 import { t } from '../../../i18n/translations.ts'
 import NavLinkContent from './NavLinkContent.vue'
-import NewBadge from './NewBadge.vue'
 import Sheet from '@/components/ui/sheet/Sheet.vue'
 import SheetContent from '@/components/ui/sheet/SheetContent.vue'
 import SheetDescription from '@/components/ui/sheet/SheetDescription.vue'
@@ -97,8 +96,7 @@ onUnmounted(() => {
                   :href="item.columns ? undefined : item.href"
                   @click="item.columns && (activeSection = item.label)"
                 >
-                  <span class="ppformula-text-center">{{ item.label }}</span>
-                  <NewBadge v-if="item.badge" :locale="locale" size="xxs" />
+                  {{ item.label }}
                   <template #append>
                     <ChevronRight class="size-7" />
                   </template>

apps/website/src/components/common/HeaderMain/NavLinkContent.vue

@@ -1,9 +1,10 @@
 <script setup lang="ts">
+import Badge from '@/components/ui/badge/Badge.vue'
 import { ArrowUpRight } from '@lucide/vue'
 
 import type { NavColumnItem } from '../../../data/mainNavigation'
 import type { Locale } from '../../../i18n/translations'
-import NewBadge from './NewBadge.vue'
+import { t } from '../../../i18n/translations'
 
 defineProps<{ item: NavColumnItem; locale: Locale }>()
 </script>
@@ -11,7 +12,9 @@ defineProps<{ item: NavColumnItem; locale: Locale }>()
 <template>
   <span class="flex items-center gap-2">
     <span class="ppformula-text-center">{{ item.label }}</span>
-    <NewBadge v-if="item.badge" :locale="locale" size="xs" />
+    <Badge v-if="item.badge" size="xs" variant="accent">
+      {{ t('nav.badgeNew', locale) }}
+    </Badge>
     <ArrowUpRight
       v-if="item.external"
       class="text-primary-comfy-yellow size-4"

apps/website/src/components/common/HeaderMain/NewBadge.vue

@@ -1,15 +0,0 @@
-<script setup lang="ts">
-import Badge from '@/components/ui/badge/Badge.vue'
-
-import type { BadgeVariants } from '@/components/ui/badge'
-import type { Locale } from '../../../i18n/translations'
-import { t } from '../../../i18n/translations'
-
-defineProps<{ locale: Locale; size?: BadgeVariants['size'] }>()
-</script>
-
-<template>
-  <Badge :size="size" variant="accent">
-    {{ t('nav.badgeNew', locale) }}
-  </Badge>
-</template>

apps/website/src/components/ui/badge/index.ts

@@ -6,15 +6,14 @@ export const badgeVariants = cva({
   variants: {
     size: {
       md: 'px-4 py-1 text-xs',
-      xs: 'px-2 py-0.5 text-[9px]',
-      xxs: 'px-1.5 py-px text-[8px]'
+      xs: 'px-2 py-0.5 text-[9px]'
     },
     variant: {
       default: 'bg-transparency-ink-t80',
       subtle: 'bg-transparency-white-t4 text-primary-comfy-canvas',
       category: 'text-primary-comfy-yellow px-0 font-semibold uppercase',
       accent:
-        'before:bg-primary-comfy-yellow relative isolate overflow-visible rounded-none bg-transparent font-bold tracking-wide text-primary-comfy-ink uppercase before:absolute before:inset-0 before:-z-10 before:-skew-x-12 before:rounded-sm'
+        'before:bg-primary-comfy-yellow relative isolate overflow-visible rounded-none bg-transparent px-2 py-0.5 text-[9px] font-bold tracking-wide text-primary-comfy-ink uppercase before:absolute before:inset-0 before:-z-10 before:-skew-x-12 before:rounded-sm'
     }
   },
   defaultVariants: {

apps/website/src/data/mainNavigation.ts

@@ -30,23 +30,15 @@ export type NavItem =
       label: string
       columns: NavColumn[]
       featured?: NavFeatured
-      badge?: 'new'
       href?: never
     }
-  | {
-      label: string
-      href: string
-      badge?: 'new'
-      columns?: never
-      featured?: never
-    }
+  | { label: string; href: string; columns?: never; featured?: never }
 
 export function getMainNavigation(locale: Locale): NavItem[] {
   const routes = getRoutes(locale)
   return [
     {
       label: t('nav.products', locale),
-      badge: 'new',
       featured: {
         imageSrc: 'https://media.comfy.org/website/nav/mcp-card.webp',
         imageAlt: t('nav.featuredProductsAlt', locale),
@@ -103,7 +95,6 @@ export function getMainNavigation(locale: Locale): NavItem[] {
     { label: t('nav.pricing', locale), href: routes.cloudPricing },
     {
       label: t('nav.community', locale),
-      badge: 'new',
       featured: {
         imageSrc: 'https://media.comfy.org/website/nav/featured-demo-card.jpg',
         imageAlt: t('nav.featuredCommunityAlt', locale),

apps/website/src/i18n/translations.ts

@@ -823,7 +823,7 @@ const translations = {
     'zh-CN': 'Comfy Cloud 支持的自定义节点包'
   },
   'cloudNodes.meta.title': {
-    en: 'Custom-node packs on Comfy Cloud - supported by default',
+    en: 'Custom-node packs on Comfy Cloud — supported by default',
     'zh-CN': 'Comfy Cloud 自定义节点包合集——开箱即用'
   },
   'cloudNodes.meta.description': {
@@ -1845,8 +1845,8 @@ const translations = {
 
   // MCP – Meta
   'mcp.meta.title': {
-    en: 'Comfy MCP - Drive ComfyUI from any AI agent',
-    'zh-CN': 'Comfy MCP - 让任何 AI 智能体驱动 ComfyUI'
+    en: 'Comfy MCP — Drive ComfyUI from any AI agent',
+    'zh-CN': 'Comfy MCP — 让任何 AI 智能体驱动 ComfyUI'
   },
   'mcp.meta.description': {
     en: 'Comfy MCP exposes the full ComfyUI engine over the Model Context Protocol. Generate images, video, audio, and 3D from Claude Code, Claude Desktop, and any MCP-compatible client.',
@@ -3483,8 +3483,8 @@ const translations = {
   },
 
   'affiliate-terms.page.title': {
-    en: 'Affiliate Terms - Comfy',
-    'zh-CN': 'Affiliate Terms - Comfy'
+    en: 'Affiliate Terms — Comfy',
+    'zh-CN': 'Affiliate Terms — Comfy'
   },
   'affiliate-terms.page.description': {
     en: 'Comfy.org Affiliate Program Terms and Conditions.',
@@ -3896,8 +3896,8 @@ const translations = {
       'This document reproduces the current template of the Enterprise Customer Agreement for reference only. The executed Agreement between Comfy and Customer, together with any signed Order Forms, governs the relationship between the parties. To request an executable copy, please contact <a href="mailto:sales@comfy.org" class="text-white underline">sales@comfy.org</a>.'
   },
   'enterprise-msa.page.title': {
-    en: 'Enterprise MSA - Comfy',
-    'zh-CN': 'Enterprise MSA - Comfy'
+    en: 'Enterprise MSA — Comfy',
+    'zh-CN': 'Enterprise MSA — Comfy'
   },
   'enterprise-msa.page.description': {
     en: 'Comfy Enterprise Customer Agreement — the master services agreement that governs Comfy Enterprise deployments of Comfy Cloud, Comfy API, and related products.',
@@ -4361,8 +4361,8 @@ const translations = {
 
   // Affiliate page (/affiliates) — head metadata
   'affiliate.page.title': {
-    en: 'Comfy.org Affiliate Program - Become a Partner',
-    'zh-CN': 'Comfy.org 联盟计划 - 成为合作伙伴'
+    en: 'Comfy.org Affiliate Program — Become a Partner',
+    'zh-CN': 'Comfy.org 联盟计划 — 成为合作伙伴'
   },
   'affiliate.page.description': {
     en: 'Earn 30% recurring commission for 3 months on every Comfy Cloud subscription you refer. Apply to become a Comfy Partner.',
@@ -4387,8 +4387,8 @@ const translations = {
   // Launches page (/launches) — head metadata
   // zh-CN strings pending native review (see apps/website/.scratch/drops-page/PRD.md)
   'launches.page.title': {
-    en: 'ComfyUI Live Demo & Q&A - June 29 Launch Livestream',
-    'zh-CN': 'ComfyUI 直播演示与问答 - 6 月 29 日发布直播'
+    en: 'ComfyUI Live Demo & Q&A — June 29 Launch Livestream',
+    'zh-CN': 'ComfyUI 直播演示与问答 — 6 月 29 日发布直播'
   },
   'launches.page.description': {
     en: 'Join the ComfyUI livestream on June 29 for a hands-on product demo and live Q&A. See what’s new across desktop, cloud, and community, and get your questions answered.',

apps/website/src/pages/404.astro

@@ -3,7 +3,7 @@ import BaseLayout from '../layouts/BaseLayout.astro'
 ---
 
 <BaseLayout
-  title="404 - Page Not Found - Comfy"
+  title="404 — Page Not Found — Comfy"
   noindex>
   <div
     class="flex w-full flex-col items-center p-4 h-[calc(100dvh-12rem)]">

apps/website/src/pages/about.astro

@@ -16,7 +16,7 @@ const { siteUrl, locale } = pageContext(
 ---
 
 <BaseLayout
-  title="About Us - Comfy"
+  title="About Us — Comfy"
   pageType="AboutPage"
   mainEntityId={organizationId(siteUrl)}
   breadcrumbs={[

apps/website/src/pages/careers.astro

@@ -42,7 +42,7 @@ const roles = itemListNode(
 ---
 
 <BaseLayout
-  title="Careers - Comfy"
+  title="Careers — Comfy"
   description="Join the team building the operating system for generative AI. Open roles in engineering, design, marketing, and more."
   pageType="CollectionPage"
   mainEntityId={jsonLdId(url, 'itemlist')}

apps/website/src/pages/case-studies.astro

@@ -3,6 +3,6 @@ import BaseLayout from '../layouts/BaseLayout.astro'
 import ComingSoon from '../components/common/ComingSoon.astro'
 ---
 
-<BaseLayout title="Case Studies - Comfy">
+<BaseLayout title="Case Studies — Comfy">
   <ComingSoon />
 </BaseLayout>

apps/website/src/pages/cloud/index.astro

@@ -11,7 +11,7 @@ import { t } from '../../i18n/translations'
 ---
 
 <BaseLayout
-  title="Comfy Cloud - AI in the Cloud"
+  title="Comfy Cloud — AI in the Cloud"
   description={t('cloud.hero.subtitle', 'en')}
   keywords={['comfyui web app', 'comfyui app', 'comfyui online', 'comfyui cloud', 'comfy cloud', 'comfy ui application', 'comfyui browser', 'cloud comfyui', 'managed comfyui']}
 >

apps/website/src/pages/cloud/pricing.astro

@@ -20,7 +20,7 @@ const productId = jsonLdId(url, 'product')
 ---
 
 <BaseLayout
-  title="Pricing - Comfy Cloud"
+  title="Pricing — Comfy Cloud"
   mainEntityId={productId}
   breadcrumbs={[
     { name: t('breadcrumb.home', locale), url: absoluteUrl(Astro.site, '/') },

apps/website/src/pages/contact.astro

@@ -13,7 +13,7 @@ const { siteUrl, locale } = pageContext(
 ---
 
 <BaseLayout
-  title="Contact - Comfy"
+  title="Contact — Comfy"
   pageType="ContactPage"
   mainEntityId={organizationId(siteUrl)}
   breadcrumbs={[

apps/website/src/pages/customers.astro

@@ -11,7 +11,7 @@ import { loadStories } from '../utils/loadStories'
 const stories = (await loadStories('en')).map(toCardProps)
 ---
 
-<BaseLayout title="Customer Stories - Comfy">
+<BaseLayout title="Customer Stories — Comfy">
   <HeroSection client:load />
   <StorySection stories={stories} />
   <FeedbackSection client:load />

apps/website/src/pages/customers/[slug].astro

@@ -17,7 +17,7 @@ export async function getStaticPaths() {
 const { entry, next } = Astro.props
 ---
 
-<BaseLayout title={`${entry.data.title} - Comfy`}>
+<BaseLayout title={`${entry.data.title} — Comfy`}>
   <DetailHeroSection
     label={entry.data.category}
     title={entry.data.title}

apps/website/src/pages/demos/[slug].astro

@@ -58,7 +58,7 @@ const learningResource: JsonLdNode = {
 ---
 
 <BaseLayout
-  title={`${title} - Comfy`}
+  title={`${title} — Comfy`}
   description={description}
   ogImage={demo.ogImage}
   mainEntityId={learningId}

apps/website/src/pages/demos/index.astro

@@ -3,6 +3,6 @@ import BaseLayout from '../../layouts/BaseLayout.astro'
 import ComingSoon from '../../components/common/ComingSoon.astro'
 ---
 
-<BaseLayout title="Demos - Comfy" description="Interactive demos and tutorials for ComfyUI.">
+<BaseLayout title="Demos — Comfy" description="Interactive demos and tutorials for ComfyUI.">
   <ComingSoon />
 </BaseLayout>

apps/website/src/pages/download.astro

@@ -23,7 +23,7 @@ const { siteUrl, locale } = pageContext(
 ---
 
 <BaseLayout
-  title="Download Comfy Desktop - Run AI on Your Hardware"
+  title="Download Comfy Desktop — Run AI on Your Hardware"
   description={t('download.hero.subtitle', 'en')}
   mainEntityId={comfyUiSoftwareId(siteUrl)}
   breadcrumbs={[

apps/website/src/pages/gallery.astro

@@ -5,7 +5,7 @@ import GallerySection from '../components/gallery/GallerySection.vue'
 import ContactSection from '../components/gallery/ContactSection.vue'
 ---
 
-<BaseLayout title="Gallery - Comfy">
+<BaseLayout title="Gallery — Comfy">
   <HeroSection />
   <GallerySection client:load />
   <ContactSection />

apps/website/src/pages/index.astro

@@ -24,7 +24,7 @@ const { siteUrl } = pageContext(
 ---
 
 <BaseLayout
-  title="Comfy - Professional Control of Visual AI"
+  title="Comfy — Professional Control of Visual AI"
   description={t("hero.subtitle", "en")}
   mainEntityId={comfyUiSoftwareId(siteUrl)}
   extraJsonLd={[

apps/website/src/pages/learning.astro

@@ -12,7 +12,7 @@ import { externalLinks } from '../config/routes'
 const routes = getRoutes('en')
 ---
 
-<BaseLayout title="Learning - Comfy">
+<BaseLayout title="Learning — Comfy">
   <HeroSection client:load />
   <FeaturedWorkflowSection client:visible />
   <TutorialsSection client:visible />

apps/website/src/pages/models.astro

@@ -7,7 +7,7 @@ import ProductShowcaseSection from '../components/home/ProductShowcaseSection.vu
 ---
 
 <BaseLayout
-  title="Models - Comfy"
+  title="Models — Comfy"
   description="Run the world's leading AI models in ComfyUI. Browse every supported model with community workflow templates ready to run."
 >
   <ModelsHeroSection

apps/website/src/pages/p/supported-models/[slug].astro

@@ -103,7 +103,7 @@ const faqPage: JsonLdNode = {
 ---
 
 <BaseLayout
-  title={`${pageTitle} - Comfy`}
+  title={`${pageTitle} — Comfy`}
   description={pageDescription}
   ogImage={model.thumbnailUrl}
   mainEntityId={softwareId}

apps/website/src/pages/p/supported-models/index.astro

@@ -43,7 +43,7 @@ const dirLabel: Record<string, string> = {
 ---
 
 <BaseLayout
-  title={`${title} - Comfy`}
+  title={`${title} — Comfy`}
   description={subtitle}
   pageType="CollectionPage"
   mainEntityId={jsonLdId(url, 'itemlist')}

apps/website/src/pages/payment/failed.astro

@@ -4,7 +4,7 @@ import PaymentStatusSection from '../../components/payment/PaymentStatusSection.
 ---
 
 <BaseLayout
-  title="Payment Failed - Comfy"
+  title="Payment Failed — Comfy"
   description="Your payment was not completed."
   noindex
 >

apps/website/src/pages/payment/success.astro

@@ -4,7 +4,7 @@ import PaymentStatusSection from '../../components/payment/PaymentStatusSection.
 ---
 
 <BaseLayout
-  title="Payment Successful - Comfy"
+  title="Payment Successful — Comfy"
   description="Your payment was processed successfully."
   noindex
 >

apps/website/src/pages/privacy-policy.astro

@@ -5,7 +5,7 @@ import HeroSection from '../components/legal/HeroSection.vue'
 ---
 
 <BaseLayout
-  title="Privacy Policy - Comfy"
+  title="Privacy Policy — Comfy"
   description="Comfy privacy policy. Learn how we collect, use, and protect your personal information."
   noindex
 >

apps/website/src/pages/privacy/desktop.astro

@@ -5,7 +5,7 @@ import HeroSection from '../../components/legal/HeroSection.vue'
 ---
 
 <BaseLayout
-  title="Desktop Privacy Policy - Comfy"
+  title="Desktop Privacy Policy — Comfy"
   description="Privacy policy for Comfy Desktop. Named processors, lawful basis under GDPR/UK GDPR, retention periods, and your rights."
 >
   <HeroSection title="Desktop Privacy Policy" />

apps/website/src/pages/terms-of-service.astro

@@ -6,7 +6,7 @@ import { t } from '../i18n/translations'
 ---
 
 <BaseLayout
-  title="Terms of Service - Comfy"
+  title="Terms of Service — Comfy"
   description="Terms of Service governing use of the Comfy Products, including Comfy Cloud, Comfy API, and Comfy Enterprise."
   noindex
 >

apps/website/src/pages/videos.astro

@@ -3,6 +3,6 @@ import BaseLayout from '../layouts/BaseLayout.astro'
 import ComingSoon from '../components/common/ComingSoon.astro'
 ---
 
-<BaseLayout title="Videos - Comfy">
+<BaseLayout title="Videos — Comfy">
   <ComingSoon />
 </BaseLayout>

apps/website/src/pages/zh-CN/about.astro

@@ -16,7 +16,7 @@ const { siteUrl, locale } = pageContext(
 ---
 
 <BaseLayout
-  title="关于我们 - Comfy"
+  title="关于我们 — Comfy"
   description="了解 ComfyUI 背后的团队和使命——开源的生成式 AI 平台。"
   pageType="AboutPage"
   mainEntityId={organizationId(siteUrl)}

apps/website/src/pages/zh-CN/careers.astro

@@ -42,7 +42,7 @@ const roles = itemListNode(
 ---
 
 <BaseLayout
-  title="招聘 - Comfy"
+  title="招聘 — Comfy"
   description="加入构建生成式 AI 操作系统的团队。工程、设计、市场营销等岗位开放招聘中。"
   pageType="CollectionPage"
   mainEntityId={jsonLdId(url, 'itemlist')}

apps/website/src/pages/zh-CN/case-studies.astro

@@ -3,6 +3,6 @@ import BaseLayout from '../../layouts/BaseLayout.astro'
 import ComingSoon from '../../components/common/ComingSoon.astro'
 ---
 
-<BaseLayout title="案例研究 - Comfy">
+<BaseLayout title="案例研究 — Comfy">
   <ComingSoon />
 </BaseLayout>

apps/website/src/pages/zh-CN/cloud/index.astro

@@ -11,7 +11,7 @@ import { t } from '../../../i18n/translations'
 ---
 
 <BaseLayout
-  title="Comfy Cloud - 云端 AI"
+  title="Comfy Cloud — 云端 AI"
   description={t('cloud.hero.subtitle', 'zh-CN')}
   keywords={['comfyui web app', 'comfyui app', 'comfyui online', 'comfyui cloud', 'ComfyUI 网页版', 'ComfyUI 云端', 'ComfyUI 应用', 'Comfy Cloud', '云端 ComfyUI']}
 >

apps/website/src/pages/zh-CN/cloud/pricing.astro

@@ -20,7 +20,7 @@ const productId = jsonLdId(url, 'product')
 ---
 
 <BaseLayout
-  title="定价 - Comfy Cloud"
+  title="定价 — Comfy Cloud"
   mainEntityId={productId}
   breadcrumbs={[
     {

apps/website/src/pages/zh-CN/contact.astro

@@ -13,7 +13,7 @@ const { siteUrl, locale } = pageContext(
 ---
 
 <BaseLayout
-  title="联系我们 - Comfy"
+  title="联系我们 — Comfy"
   pageType="ContactPage"
   mainEntityId={organizationId(siteUrl)}
   breadcrumbs={[

apps/website/src/pages/zh-CN/customers.astro

@@ -11,7 +11,7 @@ import { loadStories } from '../../utils/loadStories'
 const stories = (await loadStories('zh-CN')).map(toCardProps)
 ---
 
-<BaseLayout title="客户故事 - Comfy">
+<BaseLayout title="客户故事 — Comfy">
   <HeroSection locale="zh-CN" client:load />
   <StorySection stories={stories} locale="zh-CN" />
   <FeedbackSection locale="zh-CN" client:load />

apps/website/src/pages/zh-CN/customers/[slug].astro

@@ -17,7 +17,7 @@ export async function getStaticPaths() {
 const { entry, next } = Astro.props
 ---
 
-<BaseLayout title={`${entry.data.title} - Comfy`}>
+<BaseLayout title={`${entry.data.title} — Comfy`}>
   <DetailHeroSection
     label={entry.data.category}
     title={entry.data.title}

apps/website/src/pages/zh-CN/demos/[slug].astro

@@ -58,7 +58,7 @@ const learningResource: JsonLdNode = {
 ---
 
 <BaseLayout
-  title={`${title} - Comfy`}
+  title={`${title} — Comfy`}
   description={description}
   ogImage={demo.ogImage}
   mainEntityId={learningId}

apps/website/src/pages/zh-CN/demos/index.astro

@@ -3,7 +3,7 @@ import BaseLayout from '../../../layouts/BaseLayout.astro'
 import { t } from '../../../i18n/translations'
 ---
 
-<BaseLayout title="演示 - Comfy" description="ComfyUI 的互动演示和教程。">
+<BaseLayout title="演示 — Comfy" description="ComfyUI 的互动演示和教程。">
   <section class="flex min-h-[60vh] items-center justify-center px-6">
     <div class="text-center">
       <h1 class="text-primary-comfy-canvas text-4xl font-light">

apps/website/src/pages/zh-CN/download.astro

@@ -23,7 +23,7 @@ const { siteUrl, locale } = pageContext(
 ---
 
 <BaseLayout
-  title="下载 Comfy 桌面版 - 在您的硬件上运行 AI"
+  title="下载 Comfy 桌面版 — 在您的硬件上运行 AI"
   description={t('download.hero.subtitle', 'zh-CN')}
   mainEntityId={comfyUiSoftwareId(siteUrl)}
   breadcrumbs={[

apps/website/src/pages/zh-CN/gallery.astro

@@ -5,7 +5,7 @@ import GallerySection from '../../components/gallery/GallerySection.vue'
 import ContactSection from '../../components/gallery/ContactSection.vue'
 ---
 
-<BaseLayout title="作品集 - Comfy">
+<BaseLayout title="作品集 — Comfy">
   <HeroSection locale="zh-CN" />
   <GallerySection locale="zh-CN" client:load />
   <ContactSection locale="zh-CN" />

apps/website/src/pages/zh-CN/index.astro

@@ -24,7 +24,7 @@ const { siteUrl } = pageContext(
 ---
 
 <BaseLayout
-  title="Comfy - 视觉 AI 的最强可控性"
+  title="Comfy — 视觉 AI 的最强可控性"
   description={t('hero.subtitle', 'zh-CN')}
   mainEntityId={comfyUiSoftwareId(siteUrl)}
   extraJsonLd={[comfyUiApplicationNode(siteUrl), comfyUiSourceCodeNode(siteUrl)]}

apps/website/src/pages/zh-CN/learning.astro

@@ -11,7 +11,7 @@ import { learningEvents } from '../../data/events'
 const routes = getRoutes('zh-CN')
 ---
 
-<BaseLayout title="学习 - Comfy">
+<BaseLayout title="学习 — Comfy">
   <HeroSection locale="zh-CN" client:load />
   <FeaturedWorkflowSection locale="zh-CN" client:visible />
   <TutorialsSection locale="zh-CN" client:visible />

apps/website/src/pages/zh-CN/models.astro

@@ -7,7 +7,7 @@ import ProductShowcaseSection from '../../components/home/ProductShowcaseSection
 ---
 
 <BaseLayout
-  title="模型 - Comfy"
+  title="模型 — Comfy"
   description="在 ComfyUI 中运行世界领先的 AI 模型。浏览所有支持的模型及社区工作流模板。"
 >
   <ModelsHeroSection

apps/website/src/pages/zh-CN/payment/failed.astro

@@ -3,6 +3,6 @@ import BaseLayout from '../../../layouts/BaseLayout.astro'
 import PaymentStatusSection from '../../../components/payment/PaymentStatusSection.vue'
 ---
 
-<BaseLayout title="支付失败 - Comfy" description="您的支付未能完成。" noindex>
+<BaseLayout title="支付失败 — Comfy" description="您的支付未能完成。" noindex>
   <PaymentStatusSection status="failed" locale="zh-CN" />
 </BaseLayout>

apps/website/src/pages/zh-CN/payment/success.astro

@@ -3,6 +3,6 @@ import BaseLayout from '../../../layouts/BaseLayout.astro'
 import PaymentStatusSection from '../../../components/payment/PaymentStatusSection.vue'
 ---
 
-<BaseLayout title="支付成功 - Comfy" description="您的支付已成功完成。" noindex>
+<BaseLayout title="支付成功 — Comfy" description="您的支付已成功完成。" noindex>
   <PaymentStatusSection status="success" locale="zh-CN" />
 </BaseLayout>

apps/website/src/pages/zh-CN/privacy-policy.astro

@@ -5,7 +5,7 @@ import HeroSection from '../../components/legal/HeroSection.vue'
 ---
 
 <BaseLayout
-  title="隐私政策 - Comfy"
+  title="隐私政策 — Comfy"
   description="Comfy 隐私政策。了解我们如何收集、使用和保护您的个人信息。"
   noindex
 >

apps/website/src/pages/zh-CN/privacy/desktop.astro

@@ -5,7 +5,7 @@ import HeroSection from '../../../components/legal/HeroSection.vue'
 ---
 
 <BaseLayout
-  title="Desktop 隐私政策 - Comfy"
+  title="Desktop 隐私政策 — Comfy"
   description="Comfy Desktop 隐私政策。命名的数据处理方、GDPR/UK GDPR 下的合法依据、保留期限和您的权利。"
 >
   <HeroSection title="Desktop 隐私政策" />

apps/website/src/pages/zh-CN/videos.astro

@@ -3,6 +3,6 @@ import BaseLayout from '../../layouts/BaseLayout.astro'
 import ComingSoon from '../../components/common/ComingSoon.astro'
 ---
 
-<BaseLayout title="视频 - Comfy">
+<BaseLayout title="视频 — Comfy">
   <ComingSoon />
 </BaseLayout>

apps/website/src/templates/drops/DropCard.vue

@@ -61,12 +61,7 @@ const { drop, locale } = defineProps<{
             class="size-full object-cover object-center transition-transform duration-500 ease-out group-hover/pill-trigger:scale-105"
           />
         </div>
-        <Badge
-          v-if="drop.badge"
-          size="xs"
-          variant="accent"
-          class="absolute top-6 left-8"
-        >
+        <Badge v-if="drop.badge" variant="accent" class="absolute top-6 left-8">
           {{ drop.badge[locale] }}
         </Badge>
       </CardContent>

browser_tests/fixtures/ComfyPage.ts

@@ -28,7 +28,6 @@ import {
   ModelLibrarySidebarTab,
   NodeLibrarySidebarTab,
   NodeLibrarySidebarTabV2,
-  SidebarTab,
   WorkflowsSidebarTab
 } from '@e2e/fixtures/components/SidebarTab'
 import { Topbar } from '@e2e/fixtures/components/Topbar'
@@ -71,7 +70,6 @@ class ComfyPropertiesPanel {
 }
 
 class ComfyMenu {
-  private _appsTab: SidebarTab | null = null
   private _assetsTab: AssetsSidebarTab | null = null
   private _modelLibraryTab: ModelLibrarySidebarTab | null = null
   private _nodeLibraryTab: NodeLibrarySidebarTab | null = null
@@ -106,11 +104,6 @@ class ComfyMenu {
     return this._nodeLibraryTabV2
   }
 
-  get appsTab() {
-    this._appsTab ??= new SidebarTab(this.page, 'apps')
-    return this._appsTab
-  }
-
   get assetsTab() {
     this._assetsTab ??= new AssetsSidebarTab(this.page)
     return this._assetsTab

browser_tests/fixtures/components/SidebarTab.ts

@@ -4,7 +4,7 @@ import { expect } from '@playwright/test'
 import type { WorkspaceStore } from '@e2e/types/globals'
 import { TestIds } from '@e2e/fixtures/selectors'
 
-export class SidebarTab {
+class SidebarTab {
   public readonly tabButton: Locator
   public readonly selectedTabButton: Locator
 
@@ -254,6 +254,18 @@ export class ModelLibrarySidebarTab extends SidebarTab {
       .filter({ hasText: label })
       .first()
   }
+
+  /**
+   * A folder's own row (not the whole subtree). Required for nested folders:
+   * an ancestor `.p-tree-node`'s text contains its descendants' labels, so
+   * `getFolderByLabel` would match — and click — the ancestor instead.
+   */
+  getFolderRowByLabel(label: string) {
+    return this.modelTree
+      .locator('.p-tree-node:not(.p-tree-node-leaf) > .p-tree-node-content')
+      .filter({ hasText: label })
+      .first()
+  }
 }
 
 type MediaFilterKind = 'image' | 'video' | 'audio' | '3d'
@@ -322,9 +334,6 @@ export class AssetsSidebarTab extends SidebarTab {
   // --- Folder view ---
   public readonly backToAssetsButton: Locator
 
-  // --- Panel chrome ---
-  public readonly panelHeader: Locator
-
   // --- Loading ---
   public readonly skeletonLoaders: Locator
 
@@ -361,7 +370,6 @@ export class AssetsSidebarTab extends SidebarTab {
     this.deleteSelectedButton = page.getByTestId('assets-delete-selected')
     this.downloadSelectedButton = page.getByTestId('assets-download-selected')
     this.backToAssetsButton = page.getByText('Back to all assets')
-    this.panelHeader = page.locator('.comfy-vue-side-bar-header')
     this.skeletonLoaders = page.locator(
       '.sidebar-content-container .animate-pulse'
     )

browser_tests/fixtures/components/WorkflowActionsDropdown.ts

@@ -1,40 +0,0 @@
-import type { Locator, Page } from '@playwright/test'
-
-import { TestIds } from '@e2e/fixtures/selectors'
-
-/**
- * The graph/app view-mode toggle and its workflow actions dropdown.
- * A separate instance mounts in each host - the subgraph breadcrumb (graph
- * mode) and the app-mode center panel - and unmounts as the mode flips.
- */
-export class WorkflowActionsDropdown {
-  /** The segmented graph/app toggle hosting the workflow actions trigger. */
-  public readonly viewModeToggle: Locator
-  /** The active segment; opens the workflow actions menu. */
-  public readonly trigger: Locator
-  /** The inactive segment that switches into app mode. */
-  public readonly enterAppModeSegment: Locator
-  /** The inactive segment that switches back to the node graph. */
-  public readonly enterGraphSegment: Locator
-  /** The workflow actions dropdown menu. */
-  public readonly menu: Locator
-
-  constructor(page: Page) {
-    this.viewModeToggle = page.getByTestId(
-      TestIds.workflowActions.viewModeToggle
-    )
-    this.trigger = this.triggerIn(this.viewModeToggle)
-    this.enterAppModeSegment = this.viewModeToggle.getByRole('button', {
-      name: 'Enter app mode'
-    })
-    this.enterGraphSegment = this.viewModeToggle.getByRole('button', {
-      name: 'Enter node graph'
-    })
-    this.menu = page.getByRole('menu', { name: 'Workflow actions' })
-  }
-
-  /** The trigger as rendered inside a specific mode's host. */
-  triggerIn(host: Locator): Locator {
-    return host.getByRole('button', { name: 'Workflow actions' })
-  }
-}

browser_tests/fixtures/data/assetFixtures.ts

@@ -1,4 +1,13 @@
 import type { Asset } from '@comfyorg/ingest-types'
+
+import type { AssetItem } from '@/platform/assets/schemas/assetSchema'
+
+/**
+ * Core-native asset shape: the ingest Asset plus the `loader_path` contract
+ * field that `supports_model_type_tags` backends emit (see
+ * `src/platform/assets/schemas/assetSchema.ts`).
+ */
+export type CoreModelAsset = Asset & Pick<AssetItem, 'loader_path'>
 function createModelAsset(
   overrides: Partial<Asset> = {}
 ): Asset & { hash?: string } {
@@ -89,6 +98,70 @@ export const STABLE_LORA: Asset = createModelAsset({
   updated_at: '2025-02-20T14:00:00Z'
 })
 
+function createCoreModelAsset(
+  overrides: Partial<CoreModelAsset>
+): CoreModelAsset {
+  return { ...createModelAsset(), ...overrides }
+}
+
+export const MODEL_TYPE_CHECKPOINT_NESTED: CoreModelAsset =
+  createCoreModelAsset({
+    id: 'mt-checkpoint-001',
+    name: 'sd_xl_base_1.0.safetensors',
+    tags: ['models', 'model_type:checkpoints'],
+    loader_path: 'SDXL/sd_xl_base_1.0.safetensors',
+    created_at: '2025-01-15T10:30:00Z',
+    updated_at: '2025-01-15T10:30:00Z'
+  })
+
+export const MODEL_TYPE_CHECKPOINT_ROOT: CoreModelAsset = createCoreModelAsset({
+  id: 'mt-checkpoint-002',
+  name: 'v1-5-pruned-emaonly.safetensors',
+  tags: ['models', 'model_type:checkpoints'],
+  loader_path: 'v1-5-pruned-emaonly.safetensors',
+  created_at: '2025-01-20T08:00:00Z',
+  updated_at: '2025-01-20T08:00:00Z'
+})
+
+export const MODEL_TYPE_CHECKPOINT_GGUF: CoreModelAsset = createCoreModelAsset({
+  id: 'mt-checkpoint-003',
+  name: 'flux_quantized.gguf',
+  tags: ['models', 'model_type:checkpoints'],
+  loader_path: 'flux_quantized.gguf',
+  created_at: '2025-02-01T09:00:00Z',
+  updated_at: '2025-02-01T09:00:00Z'
+})
+
+export const MODEL_TYPE_CHECKPOINT_SCANNED: CoreModelAsset =
+  createCoreModelAsset({
+    id: 'mt-checkpoint-004',
+    name: 'freshly_scanned.safetensors',
+    tags: ['models', 'model_type:checkpoints'],
+    loader_path: 'freshly_scanned.safetensors',
+    created_at: '2025-02-10T09:00:00Z',
+    updated_at: '2025-02-10T09:00:00Z'
+  })
+
+export const MODEL_TYPE_LORA: CoreModelAsset = createCoreModelAsset({
+  id: 'mt-lora-001',
+  name: 'detail_enhancer_v1.2.safetensors',
+  tags: ['models', 'model_type:loras'],
+  loader_path: 'detail_enhancer_v1.2.safetensors',
+  created_at: '2025-02-20T14:00:00Z',
+  updated_at: '2025-02-20T14:00:00Z'
+})
+
+export const MODEL_TYPE_LORA_README: CoreModelAsset = createCoreModelAsset({
+  id: 'mt-lora-002',
+  name: 'README.txt',
+  mime_type: 'text/plain',
+  size: 2_048,
+  tags: ['models', 'model_type:loras'],
+  loader_path: 'README.txt',
+  created_at: '2025-02-20T14:00:00Z',
+  updated_at: '2025-02-20T14:00:00Z'
+})
+
 export const STABLE_INPUT_IMAGE: Asset = createInputAsset({
   id: 'test-input-001',
   name: 'reference_photo.png',

browser_tests/fixtures/helpers/AppModeHelper.ts

@@ -4,7 +4,6 @@ import type { ComfyPage } from '@e2e/fixtures/ComfyPage'
 import { TestIds } from '@e2e/fixtures/selectors'
 
 import { OutputHistoryComponent } from '@e2e/fixtures/components/OutputHistory'
-import { WorkflowActionsDropdown } from '@e2e/fixtures/components/WorkflowActionsDropdown'
 import { AppModeWidgetHelper } from '@e2e/fixtures/helpers/AppModeWidgetHelper'
 import { BuilderFooterHelper } from '@e2e/fixtures/helpers/BuilderFooterHelper'
 import { BuilderSaveAsHelper } from '@e2e/fixtures/helpers/BuilderSaveAsHelper'
@@ -20,7 +19,6 @@ export class AppModeHelper {
   readonly outputHistory: OutputHistoryComponent
   readonly steps: BuilderStepsHelper
   readonly widgets: AppModeWidgetHelper
-  readonly workflowActions: WorkflowActionsDropdown
 
   /** The "Connect an output" popover shown when saving without outputs. */
   public readonly connectOutputPopover: Locator
@@ -79,7 +77,6 @@ export class AppModeHelper {
     this.outputHistory = new OutputHistoryComponent(comfyPage.page)
     this.steps = new BuilderStepsHelper(comfyPage)
     this.widgets = new AppModeWidgetHelper(comfyPage)
-    this.workflowActions = new WorkflowActionsDropdown(comfyPage.page)
 
     this.connectOutputPopover = this.page.getByTestId(
       TestIds.builder.connectOutputPopover
@@ -188,7 +185,10 @@ export class AppModeHelper {
       .waitFor({ state: 'hidden', timeout: 5000 })
       .catch(() => {})
 
-    await this.workflowActions.trigger.click()
+    await this.page
+      .getByRole('button', { name: 'Workflow actions' })
+      .first()
+      .click()
     await this.page
       .getByRole('menuitem', { name: /Build app|Edit app/ })
       .click()

browser_tests/fixtures/helpers/AssetHelper.ts

@@ -3,6 +3,7 @@ import type { Page, Route } from '@playwright/test'
 import type {
   Asset,
   ListAssetsResponse,
+  SeedAssetsResponse,
   UpdateAssetData
 } from '@comfyorg/ingest-types'
 import {
@@ -35,6 +36,13 @@ function emptyConfig(): AssetConfig {
 
 type AssetOperator = (config: AssetConfig) => AssetConfig
 
+/**
+ * Scoped to the API path so the built frontend's own `/assets/*.js` chunks
+ * are never intercepted (a page navigated after `mock()` would otherwise
+ * fail to load).
+ */
+const ASSET_API_ROUTE_PATTERN = '**/api/assets**'
+
 function addAssets(config: AssetConfig, newAssets: Asset[]): AssetConfig {
   const merged = new Map(config.assets)
   for (const asset of newAssets) {
@@ -141,6 +149,8 @@ export class AssetHelper {
         return this.handleUpdateAsset(route, path, body)
       if (method === 'DELETE' && /\/assets\/[^/]+$/.test(path))
         return this.handleDeleteAsset(route, path)
+      if (method === 'POST' && path.endsWith('/assets/seed'))
+        return this.handleSeedScan(route)
       if (method === 'POST' && /\/assets\/?$/.test(path))
         return this.handleUploadAsset(route)
       if (method === 'POST' && path.endsWith('/assets/download'))
@@ -149,7 +159,7 @@ export class AssetHelper {
       return route.fallback()
     }
 
-    const pattern = '**/assets**'
+    const pattern = ASSET_API_ROUTE_PATTERN
     this.routeHandlers.push({ pattern, handler })
     await this.page.route(pattern, handler)
   }
@@ -165,7 +175,7 @@ export class AssetHelper {
       })
     }
 
-    const pattern = '**/assets**'
+    const pattern = ASSET_API_ROUTE_PATTERN
     this.routeHandlers.push({ pattern, handler })
     await this.page.route(pattern, handler)
   }
@@ -276,6 +286,11 @@ export class AssetHelper {
     return route.fulfill({ status: 201, json: response })
   }
 
+  private handleSeedScan(route: Route) {
+    const response: SeedAssetsResponse = { status: 'started' }
+    return route.fulfill({ status: 200, json: response })
+  }
+
   private handleDownloadAsset(route: Route) {
     return route.fulfill({
       status: 202,

browser_tests/fixtures/helpers/FeatureFlagHelper.ts

@@ -51,6 +51,22 @@ export class FeatureFlagHelper {
     })
   }
 
+  /**
+   * Force server feature flags (the WS `feature_flags` handshake payload) on
+   * the running app by merging into `api.serverFeatureFlags`. The `ff:`
+   * localStorage override is dev-only (tree-shaken from production builds),
+   * so this is the way to control `api.serverSupportsFeature()` in e2e.
+   * Call after `comfyPage.setup()` so the real handshake cannot clobber it.
+   */
+  async setServerFlags(flags: Record<string, unknown>): Promise<void> {
+    await this.page.evaluate((flagMap: Record<string, unknown>) => {
+      window.app!.api.serverFeatureFlags.value = {
+        ...window.app!.api.serverFeatureFlags.value,
+        ...flagMap
+      }
+    }, flags)
+  }
+
   /**
    * Mock server feature flags via route interception on /api/features.
    */

browser_tests/fixtures/selectors.ts

@@ -239,9 +239,6 @@ export const TestIds = {
     renameInput: 'subgraph-breadcrumb-rename-input',
     menu: (key: string) => `subgraph-breadcrumb-menu-${key}`
   },
-  workflowActions: {
-    viewModeToggle: 'view-mode-toggle'
-  },
   templates: {
     content: 'template-workflows-content',
     workflowCard: (id: string) => `template-workflow-${id}`
@@ -279,7 +276,6 @@ export const TestIds = {
     overlay: 'loading-overlay'
   },
   load3d: {
-    categoryMenu: 'load3d-category-menu',
     recordingDuration: 'load3d-recording-duration'
   },
   load3dViewer: {

browser_tests/fixtures/utils/dispatchApiEvent.ts

@@ -0,0 +1,20 @@
+import type { Page } from '@playwright/test'
+
+/**
+ * Dispatches a wire-level custom event on the app's api singleton, simulating
+ * a websocket broadcast (e.g. `assets.seed.fast_complete`). Uses the raw
+ * EventTarget dispatch because `api.dispatchCustomEvent` is typed against the
+ * ApiEventTypes map, which deliberately excludes events consumed via
+ * `addCustomEventListener`.
+ */
+export async function dispatchApiCustomEvent(
+  page: Page,
+  type: string
+): Promise<void> {
+  await page.evaluate((eventType) => {
+    EventTarget.prototype.dispatchEvent.call(
+      window.app!.api,
+      new CustomEvent(eventType)
+    )
+  }, type)
+}

browser_tests/tests/appMode.spec.ts

@@ -1,14 +1,9 @@
-import { mergeTests } from '@playwright/test'
-
 import {
-  comfyExpect as expect,
-  comfyPageFixture
+  comfyPageFixture as test,
+  comfyExpect as expect
 } from '@e2e/fixtures/ComfyPage'
-import { subgraphBreadcrumbFixture } from '@e2e/fixtures/helpers/SubgraphBreadcrumbHelper'
 import { TestIds } from '@e2e/fixtures/selectors'
 
-const test = mergeTests(comfyPageFixture, subgraphBreadcrumbFixture)
-
 test.describe('App mode usage', () => {
   test('Drag and Drop @vue-nodes', async ({ comfyPage, comfyFiles }) => {
     const { centerPanel } = comfyPage.appMode
@@ -142,117 +137,6 @@ test.describe('App mode usage', () => {
     await expect.poll(() => fileComboWidget.getValue()).toBe(targetImage)
   })
 
-  test('Shows a single side toolbar per mode, filtered to assets + apps in app mode', async ({
-    comfyPage
-  }) => {
-    const { sideToolbar, nodeLibraryTab, assetsTab, appsTab } = comfyPage.menu
-
-    await test.step('Graph mode shows the full toolbar', async () => {
-      await expect(sideToolbar).toHaveCount(1)
-      await expect(nodeLibraryTab.tabButton).toBeVisible()
-    })
-
-    await test.step('App mode shows only assets + apps', async () => {
-      await comfyPage.appMode.enterAppModeWithInputs([['3', 'seed']])
-      await expect(comfyPage.appMode.centerPanel).toBeVisible()
-
-      await expect(sideToolbar).toHaveCount(1)
-      await expect(assetsTab.tabButton).toBeVisible()
-      await expect(appsTab.tabButton).toBeVisible()
-      await expect(nodeLibraryTab.tabButton).toBeHidden()
-    })
-  })
-
-  test('Workflow actions menu keeps the same position across graph/app mode', async ({
-    comfyPage,
-    subgraphBreadcrumb
-  }) => {
-    const { workflowActions, centerPanel } = comfyPage.appMode
-
-    // Toggling graph<->app mode happens from this control, so it must not move
-    // out from under the cursor as the mode flips.
-    const graphActions = workflowActions.triggerIn(
-      subgraphBreadcrumb.panel.root
-    )
-    await expect(graphActions).toBeVisible()
-    const graphBox = await graphActions.boundingBox()
-
-    expect(graphBox).not.toBeNull()
-
-    await comfyPage.appMode.enterAppModeWithInputs([['3', 'seed']])
-    await expect(centerPanel).toBeVisible()
-
-    const appActions = workflowActions.triggerIn(centerPanel)
-    await expect(appActions).toBeVisible()
-
-    // The toggle segments reorder (morph) as the mode flips, so poll until the
-    // active control settles at the same x it occupied in graph mode.
-    await expect
-      .poll(async () => {
-        const box = await appActions.boundingBox()
-        return box ? Math.abs(box.x - graphBox!.x) : Infinity
-      })
-      .toBeLessThanOrEqual(1)
-  })
-
-  test('Toggle segment flips mode without opening the menu', async ({
-    comfyPage
-  }) => {
-    const { workflowActions } = comfyPage.appMode
-    await expect(workflowActions.viewModeToggle).toBeVisible()
-
-    await workflowActions.enterAppModeSegment.click()
-
-    await expect(comfyPage.appMode.centerPanel).toBeVisible()
-    // The inactive segment switches mode; it must not also open the actions menu.
-    await expect(workflowActions.menu).toBeHidden()
-    await expect(workflowActions.viewModeToggle).toBeVisible()
-  })
-
-  test('Toggle segment flips mode via keyboard without opening the menu', async ({
-    comfyPage
-  }) => {
-    const { workflowActions } = comfyPage.appMode
-    await workflowActions.enterAppModeSegment.focus()
-    await workflowActions.enterAppModeSegment.press('Enter')
-
-    await expect(comfyPage.appMode.centerPanel).toBeVisible()
-    await expect(workflowActions.menu).toBeHidden()
-    await expect(workflowActions.trigger).toBeFocused()
-  })
-
-  test('Mode toggle re-appears after exiting the builder to graph mode', async ({
-    comfyPage
-  }) => {
-    const toggle = comfyPage.appMode.workflowActions.viewModeToggle
-    await comfyPage.appMode.enableLinearMode()
-    await expect(toggle).toBeVisible()
-
-    await comfyPage.appMode.enterBuilder()
-    await expect(toggle).toBeHidden()
-    await expect(comfyPage.appMode.centerPanel).toBeHidden()
-
-    await comfyPage.appMode.footer.exitButton.click()
-    // Exiting the builder lands in graph mode: the app-mode-only center panel
-    // stays hidden while the graph-mode toggle host re-mounts and the toggle
-    // re-appears.
-    await expect(toggle).toBeVisible()
-    await expect(comfyPage.appMode.centerPanel).toBeHidden()
-  })
-
-  test('Mode toggle survives a sidebar tab remounting the app panel', async ({
-    comfyPage
-  }) => {
-    const toggle = comfyPage.appMode.workflowActions.viewModeToggle
-    await comfyPage.appMode.enterAppModeWithInputs([['3', 'seed']])
-    await expect(comfyPage.appMode.centerPanel).toBeVisible()
-    await expect(toggle).toBeVisible()
-
-    // Opening a sidebar tab remounts the app panel; the toggle re-renders with it.
-    await comfyPage.menu.assetsTab.tabButton.click()
-    await expect(toggle).toBeVisible()
-  })
-
   test.describe('Mobile', { tag: ['@mobile'] }, () => {
     test('panel navigation', async ({ comfyPage }) => {
       const { mobile } = comfyPage.appMode

browser_tests/tests/load3d/Load3DHelper.ts

@@ -11,47 +11,39 @@ export class Load3DHelper {
   }
 
   get menuButton(): Locator {
-    return this.node.getByTestId(TestIds.load3d.categoryMenu)
-  }
-
-  private get menuPanel(): Locator {
-    return this.node.page().getByRole('dialog')
+    return this.node.getByRole('button', { name: /show menu/i })
   }
 
   get recordingButton(): Locator {
-    return this.node.getByRole('button', { name: 'Record', exact: true })
+    return this.node.getByRole('button', { name: /start recording/i })
   }
 
   get stopRecordingButton(): Locator {
     return this.node.getByRole('button', { name: /stop recording/i })
   }
 
-  get recordingMenuButton(): Locator {
+  get exportRecordingButton(): Locator {
+    return this.node.getByRole('button', { name: /export recording/i })
+  }
+
+  get clearRecordingButton(): Locator {
+    return this.node.getByRole('button', { name: /clear recording/i })
+  }
+
+  get recordingDuration(): Locator {
     return this.node.getByTestId(TestIds.load3d.recordingDuration)
   }
 
-  get downloadRecordingMenuItem(): Locator {
-    return this.menuPanel.getByRole('button', { name: 'Download Recording' })
-  }
-
-  get startNewRecordingMenuItem(): Locator {
-    return this.menuPanel.getByRole('button', { name: 'Start New Recording' })
-  }
-
-  get deleteRecordingMenuItem(): Locator {
-    return this.menuPanel.getByRole('button', { name: 'Delete Recording' })
-  }
-
   get gridToggleButton(): Locator {
     return this.node.getByRole('button', { name: /show grid/i })
   }
 
   get uploadBackgroundImageButton(): Locator {
-    return this.node.getByRole('button', { name: 'BG Image' })
+    return this.node.getByRole('button', { name: /upload background image/i })
   }
 
   get removeBackgroundImageButton(): Locator {
-    return this.node.getByRole('button', { name: 'Remove BG' })
+    return this.node.getByRole('button', { name: /remove background image/i })
   }
 
   get panoramaModeButton(): Locator {
@@ -62,10 +54,6 @@ export class Load3DHelper {
     return this.node.locator('input[type="color"]')
   }
 
-  get exportButton(): Locator {
-    return this.node.getByRole('button', { name: 'Export', exact: true })
-  }
-
   get openViewerButton(): Locator {
     return this.node.getByRole('button', { name: /open in 3d viewer/i })
   }
@@ -75,15 +63,11 @@ export class Load3DHelper {
   }
 
   getMenuCategory(name: string): Locator {
-    return this.menuPanel.getByRole('button', { name, exact: true })
+    return this.node.getByText(name, { exact: true })
   }
 
   get gizmoToggleButton(): Locator {
-    // The category chip is also named "Gizmo" once that category is active;
-    // only the toggle carries aria-pressed.
-    return this.node
-      .getByRole('button', { name: 'Gizmo' })
-      .and(this.node.locator('[aria-pressed]'))
+    return this.node.getByRole('button', { name: 'Gizmo' })
   }
 
   get gizmoTranslateButton(): Locator {
@@ -99,17 +83,13 @@ export class Load3DHelper {
   }
 
   get gizmoResetButton(): Locator {
-    return this.node.getByRole('button', { name: 'Reset', exact: true })
+    return this.node.getByRole('button', { name: 'Reset Transform' })
   }
 
   async openMenu(): Promise<void> {
     await this.menuButton.click()
   }
 
-  async openRecordingMenu(): Promise<void> {
-    await this.recordingMenuButton.click()
-  }
-
   async openGizmoCategory(): Promise<void> {
     await this.openMenu()
     await this.getMenuCategory('Gizmo').click()

browser_tests/tests/load3d/load3d.spec.ts

@@ -47,12 +47,10 @@ test.describe('Load3D', () => {
       await load3d.openMenu()
 
       await expect(load3d.getMenuCategory('Scene')).toBeVisible()
-      await expect(load3d.getMenuCategory('3D Model')).toBeVisible()
+      await expect(load3d.getMenuCategory('Model')).toBeVisible()
       await expect(load3d.getMenuCategory('Camera')).toBeVisible()
       await expect(load3d.getMenuCategory('Light')).toBeVisible()
-      await expect(load3d.getMenuCategory('HDRI')).toBeVisible()
-      await expect(load3d.getMenuCategory('Gizmo')).toBeVisible()
-      await expect(load3d.exportButton).toBeVisible()
+      await expect(load3d.getMenuCategory('Export')).toBeVisible()
 
       await expect(load3d.node).toHaveScreenshot(
         'load3d-controls-menu-open.png',
@@ -255,7 +253,7 @@ test.describe('Load3D', () => {
     }
   )
 
-  test('Recording controls collapse into a duration chip with a menu after a recording', async ({
+  test('Recording controls show stop/export/clear buttons after a recording', async ({
     comfyPage,
     load3d
   }) => {
@@ -267,25 +265,20 @@ test.describe('Load3D', () => {
       await expect(load3d.stopRecordingButton).toBeVisible()
     })
 
-    await test.step('Stop recording surfaces the duration chip with a 1s duration', async () => {
+    await test.step('Stop recording surfaces export/clear controls and a 1s duration', async () => {
       // Record for 1s wall-clock so the duration display settles on 00:01.
       await comfyPage.delay(1000)
       await load3d.stopRecordingButton.click()
-      await expect(load3d.recordingMenuButton).toBeVisible()
-      await expect(load3d.recordingMenuButton).toHaveText('00:01')
-    })
-
-    await test.step('Chip menu offers download, re-record and delete actions', async () => {
-      await load3d.openRecordingMenu()
-      await expect(load3d.downloadRecordingMenuItem).toBeVisible()
-      await expect(load3d.startNewRecordingMenuItem).toBeVisible()
-      await expect(load3d.deleteRecordingMenuItem).toBeVisible()
-    })
-
-    await test.step('Deleting the recording restores the record button', async () => {
-      await load3d.deleteRecordingMenuItem.click()
-      await expect(load3d.recordingMenuButton).toHaveCount(0)
       await expect(load3d.recordingButton).toBeVisible()
+      await expect(load3d.exportRecordingButton).toBeVisible()
+      await expect(load3d.clearRecordingButton).toBeVisible()
+      await expect(load3d.recordingDuration).toHaveText('00:01')
+    })
+
+    await test.step('Clear recording removes export and clear controls', async () => {
+      await load3d.clearRecordingButton.click()
+      await expect(load3d.exportRecordingButton).toHaveCount(0)
+      await expect(load3d.clearRecordingButton).toHaveCount(0)
     })
   })
 })

browser_tests/tests/maskEditor.spec.ts

@@ -46,10 +46,7 @@ test.describe('Mask Editor', { tag: '@vue-nodes' }, () => {
     { tag: ['@smoke', '@screenshot'] },
     async ({ comfyPage, maskEditor }) => {
       const { nodeId } = await maskEditor.loadImageOnNode()
-      // Center the node so its header clears the view-mode toggle floating
-      // at the top-left of the canvas.
-      const nodeRef = await comfyPage.nodeOps.getNodeRefById(nodeId)
-      await nodeRef.centerOnNode()
+      await comfyPage.canvasOps.pan({ x: 0, y: 40 }, { x: 300, y: 300 })
 
       const nodeHeader = comfyPage.vueNodes
         .getNodeLocator(nodeId)

browser_tests/tests/minimap.spec.ts

@@ -476,37 +476,6 @@ test.describe('Minimap', { tag: '@canvas' }, () => {
       })
       .toBe(true)
   })
-
-  test(
-    'Closing minimap after subgraph navigation keeps Vue render in sync',
-    { tag: '@vue-nodes' },
-    async ({ comfyPage }) => {
-      await comfyPage.workflow.loadWorkflow('subgraphs/basic-subgraph')
-
-      const subgraphNodeId = await comfyPage.subgraph.findSubgraphNodeId()
-
-      // Round-trip layers Vue's onNodeAdded wrapper on top of the minimap's.
-      await comfyPage.vueNodes.enterSubgraph(subgraphNodeId)
-      await comfyPage.subgraph.exitViaBreadcrumb()
-
-      // Minimap unmount must not clobber the Vue wrapper layered above it.
-      await comfyPage.page
-        .getByTestId(TestIds.canvas.closeMinimapButton)
-        .click()
-
-      const subgraphFixture =
-        await comfyPage.vueNodes.getFixtureByTitle('New Subgraph')
-      await comfyPage.contextMenu.openForVueNode(subgraphFixture.header)
-      await comfyPage.contextMenu.clickMenuItemExact('Unpack Subgraph')
-      await comfyPage.contextMenu.waitForHidden()
-
-      await expect.poll(() => comfyPage.nodeOps.getGraphNodesCount()).toBe(2)
-      await expect.poll(() => comfyPage.vueNodes.getNodeCount()).toBe(2)
-      await expect(
-        comfyPage.vueNodes.getNodeLocator(subgraphNodeId)
-      ).toHaveCount(0)
-    }
-  )
 })
 
 test.describe('Minimap mobile', { tag: ['@mobile', '@canvas'] }, () => {

browser_tests/tests/sidebar/assetsSidebarTab.spec.ts

@@ -276,255 +276,3 @@ test.describe('FE-130 assets sidebar route mocks', () => {
     )
   })
 })
-
-test.describe('FE-910 marquee selection and select all', () => {
-  test.beforeEach(async ({ jobsRoutes, page, comfyPage }) => {
-    await jobsRoutes.mockJobsQueue([])
-    await jobsRoutes.mockJobsHistory(generatedJobs)
-    await mockInputFiles(page, ['imported.png'])
-    await mockViewFiles(page, viewFiles)
-    await comfyPage.setup()
-    await comfyPage.menu.assetsTab.open()
-  })
-
-  test('Ctrl/Cmd+A selects every asset while the panel is hovered', async ({
-    comfyPage
-  }) => {
-    const tab = comfyPage.menu.assetsTab
-
-    await expect(tab.assetCards).toHaveCount(2)
-
-    await tab.getAssetCardByName('alpha').hover()
-    await comfyPage.page.keyboard.press('ControlOrMeta+a')
-
-    await expect(tab.selectedCards).toHaveCount(2)
-  })
-
-  test('a marquee that begins in the panel header selects the cards', async ({
-    comfyPage
-  }) => {
-    const tab = comfyPage.menu.assetsTab
-    const { page } = comfyPage
-
-    await expect(tab.assetCards).toHaveCount(2)
-    await expect(tab.selectedCards).toHaveCount(0)
-
-    const header = await tab.panelHeader.boundingBox()
-    const beta = await tab.getAssetCardByName('beta').boundingBox()
-    if (!header || !beta) {
-      throw new Error('panel header or asset card has no layout box')
-    }
-
-    // Begin the rubber-band in the header (above the grid), then drag down
-    // across both cards.
-    await page.mouse.move(header.x + 24, header.y + 20)
-    await page.mouse.down()
-    await page.mouse.move(beta.x + 8, beta.y + beta.height - 8, { steps: 14 })
-    await page.mouse.up()
-
-    await expect(tab.selectedCards).toHaveCount(2)
-    await expect(tab.selectionFooter).toBeVisible()
-  })
-
-  test('Ctrl/Cmd+A leaves assets unselected while the canvas is hovered', async ({
-    comfyPage
-  }) => {
-    const tab = comfyPage.menu.assetsTab
-    const { page } = comfyPage
-
-    await expect(tab.assetCards).toHaveCount(2)
-
-    const viewport = page.viewportSize()
-    if (!viewport) throw new Error('viewport size is unavailable')
-
-    // Hover the canvas (not the panel); Ctrl/Cmd+A must yield to the canvas.
-    await page.mouse.move(viewport.width - 100, viewport.height / 2)
-    await page.keyboard.press('ControlOrMeta+a')
-
-    await expect(tab.selectedCards).toHaveCount(0)
-  })
-
-  test('a modifier-held marquee adds to the existing selection', async ({
-    comfyPage
-  }) => {
-    const tab = comfyPage.menu.assetsTab
-    const { page } = comfyPage
-
-    await expect(tab.assetCards).toHaveCount(2)
-
-    await tab.getAssetCardByName('alpha').click()
-    await expect(tab.selectedCards).toHaveCount(1)
-
-    const beta = await tab.getAssetCardByName('beta').boundingBox()
-    if (!beta) throw new Error('beta card has no layout box')
-
-    // Hold a modifier so the marquee is additive, then rubber-band over beta.
-    await page.keyboard.down('Control')
-    await page.mouse.move(beta.x + 12, beta.y + 12)
-    await page.mouse.down()
-    await page.mouse.move(beta.x + beta.width - 12, beta.y + beta.height - 12, {
-      steps: 12
-    })
-    await page.mouse.up()
-    await page.keyboard.up('Control')
-
-    await expect(tab.selectedCards).toHaveCount(2)
-  })
-
-  test('a Ctrl/Cmd+Shift marquee removes the covered cards from the selection', async ({
-    comfyPage
-  }) => {
-    const tab = comfyPage.menu.assetsTab
-    const { page } = comfyPage
-
-    await expect(tab.assetCards).toHaveCount(2)
-
-    await tab.getAssetCardByName('alpha').hover()
-    await page.keyboard.press('ControlOrMeta+a')
-    await expect(tab.selectedCards).toHaveCount(2)
-
-    const beta = await tab.getAssetCardByName('beta').boundingBox()
-    if (!beta) throw new Error('beta card has no layout box')
-
-    // Ctrl+Shift makes the marquee subtractive: rubber-band over beta only.
-    await page.keyboard.down('Control')
-    await page.keyboard.down('Shift')
-    await page.mouse.move(beta.x + 12, beta.y + 12)
-    await page.mouse.down()
-    await page.mouse.move(beta.x + beta.width - 12, beta.y + beta.height - 12, {
-      steps: 12
-    })
-    await page.mouse.up()
-    await page.keyboard.up('Shift')
-    await page.keyboard.up('Control')
-
-    await expect(tab.selectedCards).toHaveCount(1)
-    await expect(tab.getAssetCardByName('alpha')).toHaveAttribute(
-      'data-selected',
-      'true'
-    )
-  })
-
-  test('Ctrl/Cmd-dragging from an asset card starts a marquee selection', async ({
-    comfyPage
-  }) => {
-    const tab = comfyPage.menu.assetsTab
-    const { page } = comfyPage
-
-    await expect(tab.assetCards).toHaveCount(2)
-    await expect(tab.selectedCards).toHaveCount(0)
-
-    const alpha = await tab.getAssetCardByName('alpha').boundingBox()
-    const beta = await tab.getAssetCardByName('beta').boundingBox()
-    if (!alpha || !beta) throw new Error('asset cards have no layout box')
-
-    // Ctrl bypasses card drag, so a press that begins on a card rubber-bands.
-    await page.keyboard.down('Control')
-    await page.mouse.move(alpha.x + alpha.width / 2, alpha.y + alpha.height / 2)
-    await page.mouse.down()
-    await page.mouse.move(beta.x + beta.width - 6, beta.y + beta.height - 6, {
-      steps: 12
-    })
-    await page.mouse.up()
-    await page.keyboard.up('Control')
-
-    await expect(tab.selectedCards).toHaveCount(2)
-    await expect(tab.selectionFooter).toBeVisible()
-  })
-
-  test('Ctrl/Cmd-dragging within a single card selects only that card', async ({
-    comfyPage
-  }) => {
-    const tab = comfyPage.menu.assetsTab
-    const { page } = comfyPage
-
-    await expect(tab.assetCards).toHaveCount(2)
-
-    const alpha = tab.getAssetCardByName('alpha')
-    const box = await alpha.boundingBox()
-    if (!box) throw new Error('alpha card has no layout box')
-
-    const start = { x: box.x + box.width / 2, y: box.y + box.height / 2 }
-    await page.keyboard.down('Control')
-    await page.mouse.move(start.x, start.y)
-    await page.mouse.down()
-    await page.mouse.move(start.x + 12, start.y + 12, { steps: 4 })
-    await page.mouse.up()
-    await page.keyboard.up('Control')
-
-    await expect(tab.selectedCards).toHaveCount(1)
-    await expect(alpha).toHaveAttribute('data-selected', 'true')
-  })
-
-  test('Ctrl/Cmd+A in the focused search input does not select assets', async ({
-    comfyPage
-  }) => {
-    const tab = comfyPage.menu.assetsTab
-    const query = 'alpha'
-
-    await tab.searchInput.fill(query)
-    await expect(tab.assetCards).toHaveCount(1)
-
-    await tab.searchInput.focus()
-    await comfyPage.page.keyboard.press('ControlOrMeta+a')
-
-    await expect(tab.selectedCards).toHaveCount(0)
-    await expect
-      .poll(() =>
-        tab.searchInput.evaluate((el: HTMLInputElement) => {
-          return { start: el.selectionStart, end: el.selectionEnd }
-        })
-      )
-      .toEqual({ start: 0, end: query.length })
-  })
-
-  test('a drag starting in the search input does not marquee-select assets', async ({
-    comfyPage
-  }) => {
-    const tab = comfyPage.menu.assetsTab
-    const { page } = comfyPage
-
-    await expect(tab.assetCards).toHaveCount(2)
-
-    const search = await tab.searchInput.boundingBox()
-    const beta = await tab.getAssetCardByName('beta').boundingBox()
-    if (!search || !beta)
-      throw new Error('search box or card has no layout box')
-
-    await page.mouse.move(
-      search.x + search.width / 2,
-      search.y + search.height / 2
-    )
-    await page.mouse.down()
-    await page.mouse.move(beta.x + beta.width / 2, beta.y + beta.height / 2, {
-      steps: 12
-    })
-    await page.mouse.up()
-
-    await expect(tab.selectedCards).toHaveCount(0)
-  })
-
-  test('Ctrl/Cmd+A does not select assets while an aria-modal dialog is open', async ({
-    comfyPage
-  }) => {
-    const tab = comfyPage.menu.assetsTab
-    await expect(tab.assetCards).toHaveCount(2)
-
-    await comfyPage.page.evaluate(() => {
-      const dialog = document.createElement('div')
-      dialog.id = 'test-modal'
-      dialog.setAttribute('role', 'dialog')
-      dialog.setAttribute('aria-modal', 'true')
-      document.body.appendChild(dialog)
-    })
-
-    await tab.getAssetCardByName('alpha').hover()
-    await comfyPage.page.keyboard.press('ControlOrMeta+a')
-
-    await expect(tab.selectedCards).toHaveCount(0)
-
-    await comfyPage.page.evaluate(() => {
-      document.getElementById('test-modal')?.remove()
-    })
-  })
-})

browser_tests/tests/sidebar/modelLibraryAssetMode.spec.ts

@@ -0,0 +1,231 @@
+import { expect, mergeTests } from '@playwright/test'
+
+import type { Asset } from '@comfyorg/ingest-types'
+import { assetApiFixture } from '@e2e/fixtures/assetApiFixture'
+import { comfyPageFixture } from '@e2e/fixtures/ComfyPage'
+import {
+  MODEL_TYPE_CHECKPOINT_GGUF,
+  MODEL_TYPE_CHECKPOINT_NESTED,
+  MODEL_TYPE_CHECKPOINT_ROOT,
+  MODEL_TYPE_CHECKPOINT_SCANNED,
+  MODEL_TYPE_LORA,
+  MODEL_TYPE_LORA_README,
+  STABLE_CHECKPOINT
+} from '@e2e/fixtures/data/assetFixtures'
+import { withModels } from '@e2e/fixtures/helpers/AssetHelper'
+import { dispatchApiCustomEvent } from '@e2e/fixtures/utils/dispatchApiEvent'
+import type { ModelFolderInfo } from '@/platform/assets/schemas/assetSchema'
+
+const test = mergeTests(comfyPageFixture, assetApiFixture)
+
+// Deliberately not alphabetical: the sidebar must show folders in backend
+// registration order, so 'loras' listed first must render first.
+const REGISTERED_FOLDERS: ModelFolderInfo[] = [
+  { name: 'loras', folders: ['/models/loras'], extensions: [] },
+  {
+    name: 'checkpoints',
+    folders: ['/models/checkpoints'],
+    extensions: ['.safetensors', '.gguf']
+  }
+]
+
+const WALK_ASSETS: Asset[] = [
+  MODEL_TYPE_CHECKPOINT_NESTED,
+  MODEL_TYPE_CHECKPOINT_ROOT,
+  MODEL_TYPE_CHECKPOINT_GGUF,
+  MODEL_TYPE_LORA,
+  MODEL_TYPE_LORA_README
+]
+
+test.use({
+  initialSettings: {
+    'Comfy.Assets.UseAssetAPI': true,
+    'Comfy.ModelLibrary.UseAssetBrowser': false
+  }
+})
+
+test.describe('Model library sidebar - asset mode', () => {
+  test.beforeEach(async ({ comfyPage, assetApi }) => {
+    assetApi.configure(withModels(WALK_ASSETS))
+    await assetApi.mock()
+    await comfyPage.modelLibrary.mockModelFolders(REGISTERED_FOLDERS)
+    await comfyPage.setup()
+    await comfyPage.featureFlags.setServerFlags({
+      supports_model_type_tags: true
+    })
+    await comfyPage.menu.modelLibraryTab.open()
+  })
+
+  test.afterEach(async ({ comfyPage }) => {
+    await comfyPage.modelLibrary.clearMocks()
+  })
+
+  test('Lists folders in backend registration order', async ({ comfyPage }) => {
+    const tab = comfyPage.menu.modelLibraryTab
+
+    await expect(tab.folderNodes.nth(0)).toContainText('loras')
+    await expect(tab.folderNodes.nth(1)).toContainText('checkpoints')
+  })
+
+  test('Eager-loads models and drops the load-all button', async ({
+    comfyPage
+  }) => {
+    const tab = comfyPage.menu.modelLibraryTab
+
+    await expect(tab.refreshButton).toBeVisible()
+    await expect(tab.loadAllFoldersButton).toBeHidden()
+
+    // Models render from the eager walk on expansion, with loader_path
+    // subdirectories as nested folders.
+    await tab.getFolderRowByLabel('checkpoints').click()
+    await expect(tab.getLeafByLabel('v1-5-pruned-emaonly')).toBeVisible()
+    await tab.getFolderRowByLabel('SDXL').click()
+    await expect(tab.getLeafByLabel('sd_xl_base_1.0')).toBeVisible()
+  })
+
+  test('Applies registered extension allowlists verbatim and default-filters match-all folders', async ({
+    comfyPage
+  }) => {
+    const tab = comfyPage.menu.modelLibraryTab
+
+    // checkpoints registers ['.safetensors', '.gguf'], so the .gguf model
+    // shows even though the legacy fixed list would have hidden it.
+    await tab.getFolderRowByLabel('checkpoints').click()
+    await expect(tab.getLeafByLabel('flux_quantized.gguf')).toBeVisible()
+
+    // loras is registered match-all (empty allowlist); the FE substitutes
+    // the default model-extension list, hiding non-model noise.
+    await tab.getFolderRowByLabel('loras').click()
+    await expect(tab.getLeafByLabel('detail_enhancer_v1.2')).toBeVisible()
+    await expect(tab.getLeafByLabel('README')).toBeHidden()
+  })
+
+  test('Refresh seeds a backend rescan', async ({ comfyPage, assetApi }) => {
+    const tab = comfyPage.menu.modelLibraryTab
+
+    await tab.refreshButton.click()
+
+    await expect
+      .poll(
+        () =>
+          assetApi
+            .getMutations()
+            .find(
+              (mutation) =>
+                mutation.method === 'POST' &&
+                mutation.endpoint.endsWith('/assets/seed')
+            )?.body
+      )
+      .toEqual({ roots: ['models'] })
+  })
+
+  test('Live-updates the tree when the scan fast-phase completes', async ({
+    comfyPage,
+    assetApi
+  }) => {
+    const tab = comfyPage.menu.modelLibraryTab
+
+    await tab.getFolderRowByLabel('checkpoints').click()
+    await expect(tab.getLeafByLabel('v1-5-pruned-emaonly')).toBeVisible()
+    await expect(tab.getLeafByLabel('freshly_scanned')).toBeHidden()
+
+    assetApi.configure(
+      withModels([...WALK_ASSETS, MODEL_TYPE_CHECKPOINT_SCANNED])
+    )
+    await dispatchApiCustomEvent(comfyPage.page, 'assets.seed.fast_complete')
+
+    await expect(tab.getLeafByLabel('freshly_scanned')).toBeVisible()
+  })
+
+  test('Active search results update when the scan fast-phase completes', async ({
+    comfyPage,
+    assetApi
+  }) => {
+    const tab = comfyPage.menu.modelLibraryTab
+
+    // Search an existing model first: its result proves the eager load and
+    // the debounced search pipeline have settled, so the later update can
+    // only come from the scan event, not from a still-pending load.
+    await tab.searchInput.fill('detail_enhancer')
+    await expect(tab.getLeafByLabel('detail_enhancer_v1.2')).toBeVisible()
+
+    await tab.searchInput.fill('freshly')
+    await expect(tab.leafNodes).toHaveCount(0)
+
+    assetApi.configure(
+      withModels([...WALK_ASSETS, MODEL_TYPE_CHECKPOINT_SCANNED])
+    )
+    await dispatchApiCustomEvent(comfyPage.page, 'assets.seed.fast_complete')
+
+    await expect(tab.getLeafByLabel('freshly_scanned')).toBeVisible()
+  })
+
+  test('Placing a model fills the loader with the category-relative loader path', async ({
+    comfyPage
+  }) => {
+    await comfyPage.nodeOps.clearGraph()
+    const tab = comfyPage.menu.modelLibraryTab
+
+    await tab.getFolderRowByLabel('checkpoints').click()
+    await tab.getFolderRowByLabel('SDXL').click()
+    await tab.getLeafByLabel('sd_xl_base_1.0').click()
+
+    // The visible ghost preview marks arming as complete, so a zero node
+    // count here proves nothing is placed until the canvas is clicked.
+    const ghost = comfyPage.page.locator(
+      '[data-node-id="preview-CheckpointLoaderSimple"]'
+    )
+    await expect(ghost).toBeVisible()
+    expect(await comfyPage.nodeOps.getGraphNodesCount()).toBe(0)
+
+    const canvasBox = (await comfyPage.canvas.boundingBox())!
+    await comfyPage.canvas.click({
+      position: { x: canvasBox.width / 2, y: canvasBox.height / 2 }
+    })
+
+    await expect.poll(() => comfyPage.nodeOps.getGraphNodesCount()).toBe(1)
+
+    const [loader] = await comfyPage.nodeOps.getNodeRefsByType(
+      'CheckpointLoaderSimple'
+    )
+    expect(loader).toBeDefined()
+    const widget = await loader.getWidgetByName('ckpt_name')
+    expect(await widget.getValue()).toBe('SDXL/sd_xl_base_1.0.safetensors')
+  })
+})
+
+test.describe('Model library sidebar - asset mode on bare-tag backends', () => {
+  test.beforeEach(async ({ comfyPage, assetApi }) => {
+    assetApi.configure(withModels([STABLE_CHECKPOINT]))
+    await assetApi.mock()
+    await comfyPage.modelLibrary.mockModelFolders([
+      {
+        name: 'checkpoints',
+        folders: ['/models/checkpoints'],
+        extensions: ['.safetensors']
+      }
+    ])
+    await comfyPage.setup()
+    // Force the capability off rather than omitting it: the real backend's
+    // feature_flags handshake would otherwise decide which mode this tests.
+    // Bare-tag backends bucket by bare tags and emit no loader_path, so
+    // names fall back to the filename.
+    await comfyPage.featureFlags.setServerFlags({
+      supports_model_type_tags: false
+    })
+    await comfyPage.menu.modelLibraryTab.open()
+  })
+
+  test.afterEach(async ({ comfyPage }) => {
+    await comfyPage.modelLibrary.clearMocks()
+  })
+
+  test('Buckets by bare tags and names leaves from the filename', async ({
+    comfyPage
+  }) => {
+    const tab = comfyPage.menu.modelLibraryTab
+
+    await tab.getFolderRowByLabel('checkpoints').click()
+    await expect(tab.getLeafByLabel('sd_xl_base_1.0')).toBeVisible()
+  })
+})

browser_tests/tests/sidebar/modelLibraryRouting.spec.ts

@@ -0,0 +1,73 @@
+import { expect, mergeTests } from '@playwright/test'
+
+import { assetApiFixture } from '@e2e/fixtures/assetApiFixture'
+import { comfyPageFixture } from '@e2e/fixtures/ComfyPage'
+
+const test = mergeTests(comfyPageFixture, assetApiFixture)
+
+const assetBrowserModal = '[data-component-id="AssetBrowserModal"]'
+
+test.describe('Model library tab routing', () => {
+  test('Opens the asset browser when both asset settings are enabled', async ({
+    comfyPage,
+    assetApi
+  }) => {
+    await assetApi.mock()
+    await comfyPage.settings.setSetting('Comfy.Assets.UseAssetAPI', true)
+    await comfyPage.settings.setSetting(
+      'Comfy.ModelLibrary.UseAssetBrowser',
+      true
+    )
+
+    await comfyPage.menu.modelLibraryTab.tabButton.click()
+
+    await expect(comfyPage.page.locator(assetBrowserModal)).toBeVisible()
+    await expect(comfyPage.menu.modelLibraryTab.modelTree).toBeHidden()
+  })
+
+  test('Keeps the sidebar tree when the asset API is disabled', async ({
+    comfyPage
+  }) => {
+    // With the asset API off, the browser setting is inert.
+    await comfyPage.settings.setSetting('Comfy.Assets.UseAssetAPI', false)
+    await comfyPage.settings.setSetting(
+      'Comfy.ModelLibrary.UseAssetBrowser',
+      true
+    )
+
+    await comfyPage.menu.modelLibraryTab.open()
+
+    await expect(comfyPage.menu.modelLibraryTab.modelTree).toBeVisible()
+    await expect(comfyPage.page.locator(assetBrowserModal)).toBeHidden()
+  })
+
+  test('Keeps the sidebar tree when only the asset API is enabled', async ({
+    comfyPage,
+    assetApi
+  }) => {
+    await assetApi.mock()
+    await comfyPage.settings.setSetting('Comfy.Assets.UseAssetAPI', true)
+    await comfyPage.settings.setSetting(
+      'Comfy.ModelLibrary.UseAssetBrowser',
+      false
+    )
+
+    await comfyPage.menu.modelLibraryTab.open()
+
+    await expect(comfyPage.menu.modelLibraryTab.modelTree).toBeVisible()
+    await expect(comfyPage.page.locator(assetBrowserModal)).toBeHidden()
+  })
+})
+
+test.describe('Model library tab routing on cloud', { tag: '@cloud' }, () => {
+  test('Defaults to the asset browser', async ({ comfyPage, assetApi }) => {
+    // Cloud defaults both asset settings on; no explicit settings here so the
+    // test pins the defaults, not just the routing.
+    await assetApi.mock()
+
+    await comfyPage.menu.modelLibraryTab.tabButton.click()
+
+    await expect(comfyPage.page.locator(assetBrowserModal)).toBeVisible()
+    await expect(comfyPage.menu.modelLibraryTab.modelTree).toBeHidden()
+  })
+})