[automated] Update website screenshot expectations

The PP Formula optical-centering shift was 0.19em, which over-corrected
and left every button/badge/nav label about 1.4px low. Reduce it to
0.1em, measured via canvas glyph-ink metrics (~0.09-0.10em centers
uppercase). It is a position:relative nudge only, so no box sizes or
layout change. Verified no regressions across Button, BrandButton,
ButtonPill, Badge, nav, and DownloadLocalButton on 12 pages.

.claude/settings.json

@@ -1,86 +0,0 @@
-{
-  "hooks": {
-    "PreToolUse": [
-      {
-        "matcher": "Bash",
-        "hooks": [
-          {
-            "type": "command",
-            "if": "Bash(tsc *)",
-            "command": "echo 'Use `pnpm typecheck` instead of running tsc directly.' >&2 && exit 2"
-          },
-          {
-            "type": "command",
-            "if": "Bash(vue-tsc *)",
-            "command": "echo 'Use `pnpm typecheck` instead of running vue-tsc directly.' >&2 && exit 2"
-          },
-          {
-            "type": "command",
-            "if": "Bash(npx tsc *)",
-            "command": "echo 'Use `pnpm typecheck` instead of running tsc via npx.' >&2 && exit 2"
-          },
-          {
-            "type": "command",
-            "if": "Bash(pnpx tsc *)",
-            "command": "echo 'Use `pnpm typecheck` instead of running tsc via pnpx.' >&2 && exit 2"
-          },
-          {
-            "type": "command",
-            "if": "Bash(pnpm exec tsc *)",
-            "command": "echo 'Use `pnpm typecheck` instead of `pnpm exec tsc`.' >&2 && exit 2"
-          },
-          {
-            "type": "command",
-            "if": "Bash(npx vitest *)",
-            "command": "echo 'Use `pnpm test:unit` (or `pnpm test:unit <path>`) instead of npx vitest.' >&2 && exit 2"
-          },
-          {
-            "type": "command",
-            "if": "Bash(pnpx vitest *)",
-            "command": "echo 'Use `pnpm test:unit` (or `pnpm test:unit <path>`) instead of pnpx vitest.' >&2 && exit 2"
-          },
-          {
-            "type": "command",
-            "if": "Bash(npx eslint *)",
-            "command": "echo 'Use `pnpm lint` or `pnpm lint:fix` instead of npx eslint.' >&2 && exit 2"
-          },
-          {
-            "type": "command",
-            "if": "Bash(pnpx eslint *)",
-            "command": "echo 'Use `pnpm lint` or `pnpm lint:fix` instead of pnpx eslint.' >&2 && exit 2"
-          },
-          {
-            "type": "command",
-            "if": "Bash(npx prettier *)",
-            "command": "echo 'This project uses oxfmt, not prettier. Use `pnpm format` or `pnpm format:check`.' >&2 && exit 2"
-          },
-          {
-            "type": "command",
-            "if": "Bash(pnpx prettier *)",
-            "command": "echo 'This project uses oxfmt, not prettier. Use `pnpm format` or `pnpm format:check`.' >&2 && exit 2"
-          },
-          {
-            "type": "command",
-            "if": "Bash(npx oxlint *)",
-            "command": "echo 'Use `pnpm oxlint` instead of npx oxlint.' >&2 && exit 2"
-          },
-          {
-            "type": "command",
-            "if": "Bash(npx stylelint *)",
-            "command": "echo 'Use `pnpm stylelint` instead of npx stylelint.' >&2 && exit 2"
-          },
-          {
-            "type": "command",
-            "if": "Bash(npx knip *)",
-            "command": "echo 'Use `pnpm knip` instead of npx knip.' >&2 && exit 2"
-          },
-          {
-            "type": "command",
-            "if": "Bash(pnpx knip *)",
-            "command": "echo 'Use `pnpm knip` instead of pnpx knip.' >&2 && exit 2"
-          }
-        ]
-      }
-    ]
-  }
-}

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

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

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

@@ -121,7 +121,7 @@ jobs:
             --title "ComfyUI E2E Coverage" \
             --no-function-coverage \
             --precision 1 \
-            --ignore-errors source,unmapped,range \
+            --ignore-errors source,unmapped \
             --synthesize-missing
 
       - name: Upload HTML report artifact

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

@@ -95,6 +95,7 @@ jobs:
     if: |
       github.event_name == 'workflow_dispatch'
       || (github.event_name == 'pull_request'
+          && github.event.pull_request.head.repo.fork == false
           && startsWith(github.head_ref, 'version-bump-')
           && (needs.changes.outputs.storybook-changes == 'true'
               || needs.changes.outputs.app-frontend-changes == 'true'

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

@@ -55,6 +55,3 @@ jobs:
           flags: unit
           token: ${{ secrets.CODECOV_TOKEN }}
           fail_ci_if_error: false
-
-      - name: Enforce critical coverage gate
-        run: pnpm test:coverage:critical

.github/workflows/ci-vercel-website-preview.yaml

@@ -30,7 +30,7 @@ concurrency:
 
 jobs:
   deploy-preview:
-    if: github.event_name == 'pull_request'
+    if: github.event_name == 'pull_request' && github.event.pull_request.head.repo.fork == false
     runs-on: ubuntu-latest
     permissions:
       contents: read

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

@@ -67,7 +67,15 @@ jobs:
 
       - name: Deploy report to Cloudflare
         id: deploy
-        if: always() && !cancelled()
+        if: >-
+          ${{
+            always() &&
+            !cancelled() &&
+            (
+              github.event_name != 'pull_request' ||
+              github.event.pull_request.head.repo.fork == false
+            )
+          }}
         env:
           CLOUDFLARE_API_TOKEN: ${{ secrets.CLOUDFLARE_API_TOKEN }}
           CLOUDFLARE_ACCOUNT_ID: ${{ secrets.CLOUDFLARE_ACCOUNT_ID }}

.github/workflows/cloud-dispatch-build.yaml

@@ -32,12 +32,13 @@ jobs:
     if: >
       github.repository == 'Comfy-Org/ComfyUI_frontend' &&
       (github.event_name != 'pull_request' ||
-       (github.event.action == 'labeled' &&
-        contains(fromJSON('["preview","preview-cpu","preview-gpu"]'), github.event.label.name)) ||
-       (github.event.action == 'synchronize' &&
-        (contains(github.event.pull_request.labels.*.name, 'preview') ||
-         contains(github.event.pull_request.labels.*.name, 'preview-cpu') ||
-         contains(github.event.pull_request.labels.*.name, 'preview-gpu'))))
+       (github.event.pull_request.head.repo.fork == false &&
+        ((github.event.action == 'labeled' &&
+          contains(fromJSON('["preview","preview-cpu","preview-gpu"]'), github.event.label.name)) ||
+         (github.event.action == 'synchronize' &&
+          (contains(github.event.pull_request.labels.*.name, 'preview') ||
+           contains(github.event.pull_request.labels.*.name, 'preview-cpu') ||
+           contains(github.event.pull_request.labels.*.name, 'preview-gpu'))))))
     runs-on: ubuntu-latest
     steps:
       - name: Build client payload

.github/workflows/cloud-dispatch-cleanup.yaml

@@ -21,6 +21,7 @@ jobs:
     # - Preview label specifically removed
     if: >
       github.repository == 'Comfy-Org/ComfyUI_frontend' &&
+      github.event.pull_request.head.repo.fork == false &&
       ((github.event.action == 'closed' &&
         (contains(github.event.pull_request.labels.*.name, 'preview') ||
          contains(github.event.pull_request.labels.*.name, 'preview-cpu') ||

apps/website/public/icons/node-link.svg

@@ -1,3 +1,3 @@
-<svg preserveAspectRatio="none" width="100%" height="100%" overflow="visible" style="display: block;" viewBox="0 0 20 32" fill="none" xmlns="http://www.w3.org/2000/svg">
-<path id="Vector" d="M20 32V0C20 5.39616 15.5172 9.78053 10 9.78053C4.48276 9.78053 0 5.416 0 0V32C0 26.6038 4.48276 22.2195 10 22.2195C15.5172 22.2195 20 26.6038 20 32Z" fill="var(--fill-0, #F2FF59)"/>
+<svg width="20" height="32" viewBox="0 0 20 32" fill="none" xmlns="http://www.w3.org/2000/svg">
+<path d="M20 32V0C20 5.39616 15.5172 9.78053 10 9.78053C4.48276 9.78053 0 5.416 0 0V32C0 26.6038 4.48276 22.2195 10 22.2195C15.5172 22.2195 20 26.6038 20 32Z" fill="#F2FF59"/>
 </svg>

apps/website/src/components/blocks/FeatureGrid01.vue

@@ -56,7 +56,7 @@ const columnClass: Record<ColumnCount, string> = {
 
 <template>
   <section class="max-w-9xl mx-auto px-6 py-16 lg:py-24">
-    <SectionHeader :label="eyebrow" align="start">
+    <SectionHeader max-width="xl" :label="eyebrow" align="start">
       {{ heading }}
       <template v-if="subtitle" #subtitle>
         <p class="mt-4 max-w-xl text-sm text-smoke-700 lg:text-base">

apps/website/src/components/common/SiteFooter.vue

@@ -38,7 +38,8 @@ const topColumns: { title: string; links: FooterLink[] }[] = [
       { label: t('nav.comfyCloud', locale), href: routes.cloud },
       { label: t('nav.comfyApi', locale), href: routes.api },
       { label: t('nav.comfyEnterprise', locale), href: routes.cloudEnterprise },
-      { label: t('nav.mcpServer', locale), href: routes.mcp }
+      { label: t('nav.mcpServer', locale), href: routes.mcp },
+      { label: t('nav.supportedModels', locale), href: routes.models }
     ]
   },
   {

apps/website/src/components/contact/FormSection.vue

@@ -33,36 +33,41 @@ useHeroAnimation({
 </script>
 
 <template>
-  <section ref="sectionRef" class="px-4 py-20 lg:flex lg:px-20 lg:py-24">
+  <section
+    ref="sectionRef"
+    class="px-4 py-20 lg:flex lg:gap-16 lg:px-20 lg:py-24"
+  >
     <!-- Left column: intro + image -->
     <div class="lg:w-1/2">
-      <SectionLabel ref="badgeRef">
-        {{ t(tk('badge'), locale) }}
-      </SectionLabel>
+      <div class="lg:max-w-xl">
+        <SectionLabel ref="badgeRef">
+          {{ t(tk('badge'), locale) }}
+        </SectionLabel>
 
-      <h1
-        ref="headingRef"
-        class="text-primary-comfy-canvas mt-4 text-3xl font-light whitespace-pre-line lg:text-5xl"
-      >
-        {{ t(tk('heading'), locale) }}
-      </h1>
+        <h1
+          ref="headingRef"
+          class="mt-4 text-3xl font-light whitespace-pre-line text-primary-comfy-canvas lg:text-5xl"
+        >
+          {{ t(tk('heading'), locale) }}
+        </h1>
 
-      <div ref="descRef">
-        <p class="text-primary-comfy-canvas mt-4 text-sm">
-          {{ t(tk('description'), locale) }}
-        </p>
+        <div ref="descRef">
+          <p class="mt-4 text-sm text-primary-comfy-canvas">
+            {{ t(tk('description'), locale) }}
+          </p>
 
-        <p class="text-primary-comfy-canvas mt-4 text-sm">
-          {{ t(tk('supportLink'), locale) }}
-          <a
-            href="https://docs.comfy.org/"
-            target="_blank"
-            rel="noopener noreferrer"
-            class="text-primary-comfy-yellow underline"
-          >
-            {{ t(tk('supportLinkCta'), locale) }}
-          </a>
-        </p>
+          <p class="mt-4 text-sm text-primary-comfy-canvas">
+            {{ t(tk('supportLink'), locale) }}
+            <a
+              href="https://docs.comfy.org/"
+              target="_blank"
+              rel="noopener noreferrer"
+              class="text-primary-comfy-yellow underline"
+            >
+              {{ t(tk('supportLinkCta'), locale) }}
+            </a>
+          </p>
+        </div>
       </div>
 
       <div ref="imageRef" class="mt-8 overflow-hidden rounded-2xl lg:-ml-20">

apps/website/src/components/customers/ArticleNav.vue

@@ -15,7 +15,7 @@ const { categories } = defineProps<{
 
 const activeSection = ref(categories[0]?.value ?? '')
 
-const HEADER_OFFSET = -144
+const HEADER_OFFSET_PX = -144
 const BOTTOM_THRESHOLD_PX = 4
 const SCROLL_SAFETY_MS = 1500
 
@@ -52,7 +52,7 @@ function scrollToSection(id: string) {
   const el = document.getElementById(id)
   if (el) {
     scrollTo(el, {
-      offset: HEADER_OFFSET,
+      offset: HEADER_OFFSET_PX,
       duration: 0.8,
       immediate: prefersReducedMotion(),
       onComplete: clearScrollLock

apps/website/src/components/customers/content/ListItem.astro

@@ -1,5 +1,5 @@
 <li
-  class="flex items-start gap-2 text-primary-comfy-canvas before:mt-1.5 before:size-1.5 before:shrink-0 before:rounded-full before:bg-primary-comfy-yellow before:content-['']"
+  class="flex items-start gap-2 text-primary-comfy-canvas before:mt-1.5 before:size-1.5 before:shrink-0 before:rounded-full before:bg-primary-comfy-yellow"
 >
   <slot />
 </li>

apps/website/src/data/mainNavigation.ts

@@ -40,13 +40,13 @@ export function getMainNavigation(locale: Locale): NavItem[] {
     {
       label: t('nav.products', locale),
       featured: {
-        imageSrc: 'https://media.comfy.org/website/nav/featured-model-card.jpg',
+        imageSrc: 'https://media.comfy.org/website/nav/mcp-card.webp',
         imageAlt: t('nav.featuredProductsAlt', locale),
         title: t('nav.featuredProductsTitle', locale),
         cta: {
-          label: t('cta.tryWorkflow', locale),
+          label: t('cta.getStarted', locale),
           ariaLabel: t('nav.featuredProductsCtaAria', locale),
-          href: 'https://comfy.org/workflows/api_seedance2_0_r2v-64f4db9e3e33/'
+          href: routes.mcp
         }
       },
       columns: [
@@ -82,6 +82,7 @@ export function getMainNavigation(locale: Locale): NavItem[] {
               href: routes.launches,
               badge: 'new'
             },
+            { label: t('nav.supportedModels', locale), href: routes.models },
             {
               label: t('nav.docs', locale),
               href: externalLinks.docs,

apps/website/src/i18n/translations.ts

@@ -26,6 +26,10 @@ const translations = {
     en: 'Try Workflow',
     'zh-CN': '试用工作流'
   },
+  'cta.getStarted': {
+    en: 'GET STARTED',
+    'zh-CN': '快速开始'
+  },
   'cta.watchNow': {
     en: 'Watch Now',
     'zh-CN': '立即观看'
@@ -2183,6 +2187,7 @@ const translations = {
   'nav.badgeNew': { en: 'NEW', 'zh-CN': '新' },
   // Column headers used in HeaderMainDesktop dropdowns
   'nav.mcpServer': { en: 'Comfy MCP', 'zh-CN': 'Comfy MCP' },
+  'nav.supportedModels': { en: 'Supported Models', 'zh-CN': '支持的模型' },
   'nav.colFeatures': { en: 'Features', 'zh-CN': '功能' },
   'nav.colPrograms': { en: 'Programs', 'zh-CN': '项目' },
   'nav.colConnect': { en: 'Connect', 'zh-CN': '联系' },
@@ -2196,16 +2201,16 @@ const translations = {
   // Featured dropdown cards — keys are keyed by parent nav item, not card content,
   // so the copy can be swapped without renaming the key.
   'nav.featuredProductsTitle': {
-    en: 'New Release: Seedance 2.0',
-    'zh-CN': '全新发布：Seedance 2.0'
+    en: 'NEW: COMFY MCP',
+    'zh-CN': '全新发布：Comfy MCP'
   },
   'nav.featuredProductsAlt': {
-    en: 'Seedance 2.0 release feature image',
-    'zh-CN': 'Seedance 2.0 发布精选图片'
+    en: 'Comfy MCP feature image',
+    'zh-CN': 'Comfy MCP 精选图片'
   },
   'nav.featuredProductsCtaAria': {
-    en: 'Try the Seedance 2.0 workflow',
-    'zh-CN': '试用 Seedance 2.0 工作流'
+    en: 'Get started with Comfy MCP',
+    'zh-CN': '开始使用 Comfy MCP'
   },
   'nav.featuredCommunityTitle': {
     en: 'Sky Replacement',

apps/website/src/styles/global.css

@@ -248,7 +248,7 @@
 @utility ppformula-text-center {
   display: inline-block;
   position: relative;
-  top: 0.19em;
+  top: 0.1em;
 }
 
 /* Hide native play-button overlay iOS Safari shows when autoplay is blocked

browser_tests/assets/linear-validation-warning.json

@@ -0,0 +1,45 @@
+{
+  "last_node_id": 9,
+  "last_link_id": 9,
+  "nodes": [
+    {
+      "id": 9,
+      "type": "SaveImage",
+      "pos": {
+        "0": 64,
+        "1": 104
+      },
+      "size": {
+        "0": 210,
+        "1": 58
+      },
+      "flags": {},
+      "order": 0,
+      "mode": 0,
+      "inputs": [
+        {
+          "name": "images",
+          "type": "IMAGE",
+          "link": null
+        }
+      ],
+      "outputs": [],
+      "properties": {},
+      "widgets_values": ["ComfyUI"]
+    }
+  ],
+  "links": [],
+  "groups": [],
+  "config": {},
+  "extra": {
+    "ds": {
+      "scale": 1,
+      "offset": [0, 0]
+    },
+    "linearData": {
+      "inputs": [],
+      "outputs": ["9"]
+    }
+  },
+  "version": 0.4
+}

browser_tests/fixtures/ComfyPage.ts

@@ -537,7 +537,6 @@ export const comfyPageFixture = base.extend<{
         'Comfy.TutorialCompleted': true,
         'Comfy.Queue.MaxHistoryItems': 64,
         'Comfy.SnapToGrid.GridSize': testComfySnapToGridGridSize,
-        'Comfy.VueNodes.AutoScaleLayout': false,
         // Disable toast warning about version compatibility, as they may or
         // may not appear - depending on upstream ComfyUI dependencies
         'Comfy.VersionCompatibility.DisableWarnings': true,

browser_tests/fixtures/helpers/AppModeHelper.ts

@@ -34,6 +34,10 @@ export class AppModeHelper {
   public readonly outputPlaceholder: Locator
   /** The linear-mode widget list container (visible in app mode). */
   public readonly linearWidgets: Locator
+  /** The validation warning shown above the app mode run button. */
+  public readonly validationWarning: Locator
+  /** The action that opens graph mode errors from the validation warning. */
+  public readonly viewErrorsInGraphButton: Locator
   /** The PrimeVue Popover for the image picker (renders with role="dialog"). */
   public readonly imagePickerPopover: Locator
   /** The Run button in the app mode footer. */
@@ -92,13 +96,19 @@ export class AppModeHelper {
     this.outputPlaceholder = this.page.getByTestId(
       TestIds.builder.outputPlaceholder
     )
-    this.linearWidgets = this.page.getByTestId('linear-widgets')
+    this.linearWidgets = this.page.getByTestId(TestIds.linear.widgetContainer)
+    this.validationWarning = this.page.getByTestId(
+      TestIds.linear.validationWarning
+    )
+    this.viewErrorsInGraphButton = this.validationWarning.getByTestId(
+      TestIds.linear.viewErrorsInGraph
+    )
     this.imagePickerPopover = this.page
       .getByRole('dialog')
       .filter({ has: this.page.getByRole('button', { name: 'All' }) })
       .first()
     this.runButton = this.page
-      .getByTestId('linear-run-button')
+      .getByTestId(TestIds.linear.runButton)
       .getByRole('button', { name: /run/i })
     this.welcome = this.page.getByTestId(TestIds.appMode.welcome)
     this.emptyWorkflowText = this.page.getByTestId(

browser_tests/fixtures/helpers/TemplateHelper.ts

@@ -6,6 +6,10 @@ import type {
 } from '@/platform/workflow/templates/types/template'
 import { mockTemplateIndex } from '@e2e/fixtures/data/templateFixtures'
 
+const ROUTE_PATTERN_WORKFLOW_TEMPLATES = /\/api\/workflow_templates(?:\?.*)?$/
+const ROUTE_PATTERN_TEMPLATE_INDEX = /\/templates\/index\.json(?:\?.*)?$/
+const ROUTE_PATTERN_TEMPLATE_THUMBNAILS = /\/templates\/.*\.webp(?:\?.*)?$/
+
 interface TemplateConfig {
   readonly templates: readonly TemplateInfo[]
   readonly index: readonly WorkflowTemplates[] | null
@@ -41,10 +45,6 @@ export function withTemplates(templates: TemplateInfo[]): TemplateOperator {
 export class TemplateHelper {
   private templates: TemplateInfo[]
   private index: WorkflowTemplates[] | null
-  private routeHandlers: Array<{
-    pattern: string
-    handler: (route: Route) => Promise<void>
-  }> = []
 
   constructor(
     private readonly page: Page,
@@ -64,29 +64,30 @@ export class TemplateHelper {
   }
 
   async mock(): Promise<void> {
+    await this.mockCustomTemplates()
     await this.mockIndex()
     await this.mockThumbnails()
   }
 
-  async mockIndex(): Promise<void> {
+  async mockCustomTemplates(): Promise<void> {
     const customTemplatesHandler = async (route: Route) => {
-      const customTemplates: Record<string, string[]> = {}
       await route.fulfill({
         status: 200,
-        body: JSON.stringify(customTemplates),
+        body: '{}',
         headers: {
           'Content-Type': 'application/json',
           'Cache-Control': 'no-store'
         }
       })
     }
-    const customTemplatesPattern = '**/api/workflow_templates'
-    this.routeHandlers.push({
-      pattern: customTemplatesPattern,
-      handler: customTemplatesHandler
-    })
-    await this.page.route(customTemplatesPattern, customTemplatesHandler)
 
+    await this.page.route(
+      ROUTE_PATTERN_WORKFLOW_TEMPLATES,
+      customTemplatesHandler
+    )
+  }
+
+  async mockIndex(): Promise<void> {
     const indexHandler = async (route: Route) => {
       const payload = this.index ?? mockTemplateIndex(this.templates)
       await route.fulfill({
@@ -98,9 +99,8 @@ export class TemplateHelper {
         }
       })
     }
-    const indexPattern = '**/templates/index.json'
-    this.routeHandlers.push({ pattern: indexPattern, handler: indexHandler })
-    await this.page.route(indexPattern, indexHandler)
+
+    await this.page.route(ROUTE_PATTERN_TEMPLATE_INDEX, indexHandler)
   }
 
   async mockThumbnails(): Promise<void> {
@@ -114,12 +114,8 @@ export class TemplateHelper {
         }
       })
     }
-    const thumbnailPattern = '**/templates/**.webp'
-    this.routeHandlers.push({
-      pattern: thumbnailPattern,
-      handler: thumbnailHandler
-    })
-    await this.page.route(thumbnailPattern, thumbnailHandler)
+
+    await this.page.route(ROUTE_PATTERN_TEMPLATE_THUMBNAILS, thumbnailHandler)
   }
 
   getTemplates(): TemplateInfo[] {
@@ -129,15 +125,6 @@ export class TemplateHelper {
   get templateCount(): number {
     return this.templates.length
   }
-
-  async clearMocks(): Promise<void> {
-    for (const { pattern, handler } of this.routeHandlers) {
-      await this.page.unroute(pattern, handler)
-    }
-    this.routeHandlers = []
-    this.templates = []
-    this.index = null
-  }
 }
 
 export function createTemplateHelper(

browser_tests/fixtures/selectors.ts

@@ -172,6 +172,9 @@ export const TestIds = {
     mobileNavigation: 'linear-mobile-navigation',
     mobileWorkflows: 'linear-mobile-workflows',
     outputInfo: 'linear-output-info',
+    runButton: 'linear-run-button',
+    validationWarning: 'linear-validation-warning',
+    viewErrorsInGraph: 'linear-view-errors',
     widgetContainer: 'linear-widgets'
   },
   builder: {

browser_tests/fixtures/templateApiFixture.ts

@@ -7,10 +7,6 @@ export const templateApiFixture = base.extend<{
   templateApi: TemplateHelper
 }>({
   templateApi: async ({ page }, use) => {
-    const templateApi = createTemplateHelper(page)
-
-    await use(templateApi)
-
-    await templateApi.clearMocks()
+    await use(createTemplateHelper(page))
   }
 })

browser_tests/tests/appModeValidationWarning.spec.ts

@@ -0,0 +1,106 @@
+import {
+  comfyExpect as expect,
+  comfyPageFixture as test
+} from '@e2e/fixtures/ComfyPage'
+import type { NodeError, PromptResponse } from '@/schemas/apiSchema'
+import { ExecutionHelper } from '@e2e/fixtures/helpers/ExecutionHelper'
+import { enableErrorsOverlay } from '@e2e/fixtures/helpers/ErrorsTabHelper'
+import { TestIds } from '@e2e/fixtures/selectors'
+
+const SAVE_IMAGE_NODE_ID = '9'
+
+function buildSaveImageRequiredInputError(): NodeError {
+  return {
+    class_type: 'SaveImage',
+    dependent_outputs: [],
+    errors: [
+      {
+        type: 'required_input_missing',
+        message: 'Required input is missing: images',
+        details: '',
+        extra_info: { input_name: 'images' }
+      }
+    ]
+  }
+}
+
+test.describe(
+  'App mode validation warning',
+  { tag: ['@ui', '@workflow'] },
+  () => {
+    test.beforeEach(async ({ comfyPage }) => {
+      await enableErrorsOverlay(comfyPage)
+      await comfyPage.workflow.loadWorkflow('linear-validation-warning')
+      await comfyPage.appMode.toggleAppMode()
+      await expect(comfyPage.appMode.linearWidgets).toBeVisible()
+    })
+
+    test('opens graph errors from the app mode validation warning', async ({
+      comfyPage
+    }) => {
+      await expect(comfyPage.appMode.validationWarning).toBeHidden()
+
+      const exec = new ExecutionHelper(comfyPage)
+      await exec.mockValidationFailure({
+        [SAVE_IMAGE_NODE_ID]: buildSaveImageRequiredInputError()
+      })
+
+      await comfyPage.appMode.runButton.click()
+      const appModeOverlay = comfyPage.appMode.centerPanel.getByTestId(
+        TestIds.dialogs.errorOverlay
+      )
+      await expect(appModeOverlay).toBeHidden()
+
+      await expect(comfyPage.appMode.validationWarning).toBeVisible()
+      await expect(comfyPage.appMode.validationWarning).toContainText(
+        /Required input missing/i
+      )
+      await expect(comfyPage.appMode.viewErrorsInGraphButton).toBeVisible()
+
+      await comfyPage.appMode.viewErrorsInGraphButton.click()
+
+      await expect(comfyPage.appMode.linearWidgets).toBeHidden()
+      await expect(
+        comfyPage.page.getByTestId(TestIds.propertiesPanel.root)
+      ).toBeVisible()
+      await expect(
+        comfyPage.page.getByTestId(TestIds.propertiesPanel.errorsTab)
+      ).toBeVisible()
+    })
+
+    test('keeps the app mode run button enabled when the warning is visible', async ({
+      comfyPage
+    }) => {
+      const exec = new ExecutionHelper(comfyPage)
+      await exec.mockValidationFailure({
+        [SAVE_IMAGE_NODE_ID]: buildSaveImageRequiredInputError()
+      })
+
+      await comfyPage.appMode.runButton.click()
+      await expect(comfyPage.appMode.validationWarning).toBeVisible()
+      await expect(comfyPage.appMode.runButton).toBeEnabled()
+
+      let promptQueued = false
+      const mockResponse: PromptResponse = {
+        prompt_id: 'test-id',
+        node_errors: {},
+        error: ''
+      }
+      await comfyPage.page.route(
+        '**/api/prompt',
+        async (route) => {
+          promptQueued = true
+          await route.fulfill({
+            status: 200,
+            body: JSON.stringify(mockResponse)
+          })
+        },
+        { times: 1 }
+      )
+
+      await comfyPage.appMode.runButton.click()
+
+      await expect.poll(() => promptQueued).toBe(true)
+    })
+  }
+)

browser_tests/tests/dialogs/pricingTableDeepLink.spec.ts

@@ -28,7 +28,12 @@ const APP_URL = process.env.PLAYWRIGHT_TEST_URL || 'http://localhost:8188'
 // matches it against the members self-row.
 const SELF_EMAIL = 'e2e@test.comfy.org'
 
-const BOOT_FEATURES = { team_workspaces_enabled: true } satisfies RemoteConfig
+// consolidated_billing_enabled routes personal workspaces to the unified
+// pricing table asserted here; without it they fall back to the legacy table.
+const BOOT_FEATURES = {
+  team_workspaces_enabled: true,
+  consolidated_billing_enabled: true
+} satisfies RemoteConfig
 // Disable the experimental Asset API: with it on (cloud default) the unmocked
 // asset endpoints 403 and workflow restore throws uncaught, aborting the
 // GraphCanvas onMounted chain before the deep-link loader.

browser_tests/tests/graph.spec.ts

@@ -1,5 +1,6 @@
 import { expect } from '@playwright/test'
 
+import { toLinkId } from '@/types/linkId'
 import { toNodeId } from '@/types/nodeId'
 
 import { comfyPageFixture as test } from '@e2e/fixtures/ComfyPage'
@@ -15,9 +16,10 @@ test.describe('Graph', { tag: ['@smoke', '@canvas'] }, () => {
     await comfyPage.workflow.loadWorkflow('inputs/input_order_swap')
     await expect
       .poll(() =>
-        comfyPage.page.evaluate(() => {
-          return window.app!.graph!.links.get(1)?.target_slot
-        })
+        comfyPage.page.evaluate(
+          (linkId) => window.app!.graph!.links.get(linkId)?.target_slot,
+          toLinkId(1)
+        )
       )
       .toBe(1)
   })

browser_tests/tests/linearMode.spec.ts

@@ -3,6 +3,7 @@ import {
   comfyPageFixture as test,
   comfyExpect as expect
 } from '@e2e/fixtures/ComfyPage'
+import { TestIds } from '@e2e/fixtures/selectors'
 
 test.describe('Linear Mode', { tag: '@ui' }, () => {
   test('Displays linear controls when app mode active', async ({
@@ -16,7 +17,9 @@ test.describe('Linear Mode', { tag: '@ui' }, () => {
   test('Run button visible in linear mode', async ({ comfyPage }) => {
     await comfyPage.appMode.enterAppModeWithInputs([])
 
-    await expect(comfyPage.page.getByTestId('linear-run-button')).toBeVisible()
+    await expect(
+      comfyPage.page.getByTestId(TestIds.linear.runButton)
+    ).toBeVisible()
   })
 
   test('Workflow info section visible', async ({ comfyPage }) => {

browser_tests/tests/maskEditor.spec.ts

@@ -46,6 +46,7 @@ test.describe('Mask Editor', { tag: '@vue-nodes' }, () => {
     { tag: ['@smoke', '@screenshot'] },
     async ({ comfyPage, maskEditor }) => {
       const { nodeId } = await maskEditor.loadImageOnNode()
+      await comfyPage.canvasOps.pan({ x: 0, y: 40 }, { x: 300, y: 300 })
 
       const nodeHeader = comfyPage.vueNodes
         .getNodeLocator(nodeId)

browser_tests/tests/subgraph/subgraphSlots.spec.ts

@@ -691,7 +691,8 @@ test(
       const emptySlotPos = await seedIOSlot.getOpenSlotPosition()
       await comfyPage.canvas.hover({ position: emptySlotPos })
       await comfyPage.page.mouse.down()
-      await stepsSlot.hover()
+      const { width, height } = (await stepsSlot.boundingBox())!
+      await stepsSlot.hover({ position: { x: (width * 3) / 4, y: height / 2 } })
       await expect.poll(hasSnap).toBe(true)
       await comfyPage.page.mouse.up()
 

browser_tests/tests/templateFilteringCount.spec.ts

@@ -17,7 +17,7 @@ test.describe(
   'Template distribution filtering count',
   { tag: '@cloud' },
   () => {
-    test.beforeEach(async ({ comfyPage, templateApi }) => {
+    test.beforeEach(async ({ comfyPage }) => {
       await comfyPage.settings.setSetting('Comfy.Templates.SelectedModels', [])
       await comfyPage.settings.setSetting(
         'Comfy.Templates.SelectedUseCases',
@@ -25,8 +25,6 @@ test.describe(
       )
       await comfyPage.settings.setSetting('Comfy.Templates.SelectedRunsOn', [])
       await comfyPage.settings.setSetting('Comfy.Templates.SortBy', 'default')
-
-      await templateApi.mockThumbnails()
     })
 
     test('displayed count matches visible cards when distribution filter excludes templates', async ({
@@ -56,7 +54,7 @@ test.describe(
           })
         ])
       )
-      await templateApi.mockIndex()
+      await templateApi.mock()
 
       await comfyPage.command.executeCommand('Comfy.BrowseTemplates')
       await expect(comfyPage.templates.content).toBeVisible()
@@ -101,7 +99,7 @@ test.describe(
           })
         ])
       )
-      await templateApi.mockIndex()
+      await templateApi.mock()
 
       await comfyPage.command.executeCommand('Comfy.BrowseTemplates')
       await expect(comfyPage.templates.content).toBeVisible()
@@ -143,7 +141,7 @@ test.describe(
           })
         ])
       )
-      await templateApi.mockIndex()
+      await templateApi.mock()
 
       await comfyPage.command.executeCommand('Comfy.BrowseTemplates')
       await expect(comfyPage.templates.content).toBeVisible()
@@ -184,7 +182,7 @@ test.describe(
           })
         ])
       )
-      await templateApi.mockIndex()
+      await templateApi.mock()
 
       await comfyPage.command.executeCommand('Comfy.BrowseTemplates')
       await expect(comfyPage.templates.content).toBeVisible()
@@ -222,7 +220,7 @@ test.describe(
           })
         ])
       )
-      await templateApi.mockIndex()
+      await templateApi.mock()
 
       await comfyPage.command.executeCommand('Comfy.BrowseTemplates')
       await expect(comfyPage.templates.content).toBeVisible()

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

@@ -1238,7 +1238,7 @@ test(
   { tag: '@vue-nodes' },
   async ({ comfyMouse, comfyPage }) => {
     async function performDisconnect(slot: Locator, isFast: boolean) {
-      await comfyMouse.dragElementBy(slot, { x: isFast ? -25 : -80 })
+      await comfyMouse.dragElementBy(slot, { x: isFast ? -30 : -80 })
 
       if (!isFast) {
         await expect(comfyPage.contextMenu.litegraphContextMenu).toBeVisible()
@@ -1251,7 +1251,7 @@ test(
 
     const ksamplerLocator = comfyPage.vueNodes.getNodeByTitle('KSampler')
     const ksampler = new VueNodeFixture(ksamplerLocator)
-    await comfyMouse.dragElementBy(ksamplerLocator, { x: 100 })
+    await comfyMouse.dragElementBy(ksampler.title, { x: 100 })
 
     await test.step('Disconnection with normal links', async () => {
       await performDisconnect(ksampler.getSlot('model'), true)

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

@@ -234,7 +234,8 @@ test.describe('Vue Node Context Menu', { tag: '@vue-nodes' }, () => {
       await comfyPage.page
         .context()
         .grantPermissions(['clipboard-read', 'clipboard-write'])
-      await comfyPage.workflow.loadWorkflow('widgets/load_image_widget')
+      await comfyPage.nodeOps.clearGraph()
+      await comfyPage.searchBoxV2.addNode('Load Image')
       await comfyPage.vueNodes.waitForNodes(1)
       await comfyPage.page
         .locator('[data-node-id] img')

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

@@ -14,7 +14,8 @@ const wstest = mergeTests(test, webSocketFixture)
 
 test.describe('Vue Nodes Image Preview', { tag: '@vue-nodes' }, () => {
   async function loadImageOnNode(comfyPage: ComfyPage) {
-    await comfyPage.workflow.loadWorkflow('widgets/load_image_widget')
+    await comfyPage.nodeOps.clearGraph()
+    await comfyPage.searchBoxV2.addNode('Load Image')
 
     const loadImageNode = (
       await comfyPage.nodeOps.getNodeRefsByType('LoadImage')

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

@@ -12,14 +12,14 @@ test.describe('Vue Node Moving', { tag: '@vue-nodes' }, () => {
   const getHeaderPos = async (
     comfyPage: ComfyPage,
     title: string
-  ): Promise<{ x: number; y: number; width: number; height: number }> => {
+  ): Promise<{ x: number; y: number }> => {
     const box = await comfyPage.vueNodes
       .getNodeByTitle(title)
       .getByTestId('node-title')
       .first()
       .boundingBox()
     if (!box) throw new Error(`${title} header not found`)
-    return box
+    return { x: box.x + box.width / 2, y: box.y + box.height / 2 }
   }
 
   const getLoadCheckpointHeaderPos = async (comfyPage: ComfyPage) =>
@@ -84,29 +84,27 @@ test.describe('Vue Node Moving', { tag: '@vue-nodes' }, () => {
     await comfyPage.idleFrames(2)
   }
 
-  test('should allow moving nodes by dragging', async ({ comfyPage }) => {
-    const loadCheckpointHeaderPos = await getLoadCheckpointHeaderPos(comfyPage)
-    await comfyPage.canvasOps.dragAndDrop(loadCheckpointHeaderPos, {
-      x: 256,
-      y: 256
-    })
+  test('should allow moving nodes by dragging', async ({
+    comfyPage,
+    comfyMouse
+  }) => {
+    const initialHeaderPos = await getLoadCheckpointHeaderPos(comfyPage)
+    const node = await comfyPage.vueNodes.getFixtureByTitle('Load Checkpoint')
+    await comfyMouse.dragElementBy(node.header, { x: 100, y: 100 })
 
     const newHeaderPos = await getLoadCheckpointHeaderPos(comfyPage)
-    await expectPosChanged(loadCheckpointHeaderPos, newHeaderPos)
+    await expectPosChanged(initialHeaderPos, newHeaderPos)
   })
 
   test('should not move node when pointer moves less than drag threshold', async ({
-    comfyPage
+    comfyPage,
+    comfyMouse
   }) => {
     const headerPos = await getLoadCheckpointHeaderPos(comfyPage)
 
     // Move only 2px — below the 3px drag threshold in useNodePointerInteractions
-    await comfyPage.page.mouse.move(headerPos.x, headerPos.y)
-    await comfyPage.page.mouse.down()
-    await comfyPage.page.mouse.move(headerPos.x + 2, headerPos.y + 1, {
-      steps: 5
-    })
-    await comfyPage.page.mouse.up()
+    const node = await comfyPage.vueNodes.getFixtureByTitle('Load Checkpoint')
+    await comfyMouse.dragElementBy(node.header, { x: 2, y: 1 })
     await comfyPage.nextFrame()
 
     const afterPos = await getLoadCheckpointHeaderPos(comfyPage)
@@ -295,14 +293,12 @@ test.describe('Vue Node Moving', { tag: '@vue-nodes' }, () => {
       await expect(comfyPage.vueNodes.selectedNodes).toHaveCount(3)
 
       // Re-fetch drag source after clicks in case the header reflowed.
-      const dragSrc = await getHeaderPos(comfyPage, 'Load Checkpoint')
-      const centerX = dragSrc.x + dragSrc.width / 2
-      const centerY = dragSrc.y + dragSrc.height / 2
+      const headerPos = await getHeaderPos(comfyPage, 'Load Checkpoint')
 
-      await comfyPage.page.mouse.move(centerX, centerY)
+      await comfyPage.page.mouse.move(headerPos.x, headerPos.y)
       await comfyPage.page.mouse.down()
       await comfyPage.nextFrame()
-      await comfyPage.page.mouse.move(centerX + dx, centerY + dy, {
+      await comfyPage.page.mouse.move(headerPos.x + dx, headerPos.y + dy, {
         steps: 20
       })
       await comfyPage.page.mouse.up()

browser_tests/tests/vueNodes/nodeStates/pin.spec.ts

@@ -42,7 +42,10 @@ test.describe('Vue Node Pin', { tag: '@vue-nodes' }, () => {
     await expect(pinIndicator2).toBeHidden()
   })
 
-  test('should not allow dragging pinned nodes', async ({ comfyPage }) => {
+  test('should not allow dragging pinned nodes', async ({
+    comfyMouse,
+    comfyPage
+  }) => {
     const checkpointNodeHeader = comfyPage.page.getByText('Load Checkpoint')
     await checkpointNodeHeader.click()
     await comfyPage.page.keyboard.press(PIN_HOTKEY)
@@ -50,10 +53,7 @@ test.describe('Vue Node Pin', { tag: '@vue-nodes' }, () => {
     // Try to drag the node
     const headerPos = await checkpointNodeHeader.boundingBox()
     if (!headerPos) throw new Error('Failed to get header position')
-    await comfyPage.canvasOps.dragAndDrop(
-      { x: headerPos.x, y: headerPos.y },
-      { x: headerPos.x + 256, y: headerPos.y + 256 }
-    )
+    await comfyMouse.dragElementBy(checkpointNodeHeader, { x: 256, y: 256 })
 
     // Verify the node is not dragged (same position before and after click-and-drag)
     await expect
@@ -64,11 +64,7 @@ test.describe('Vue Node Pin', { tag: '@vue-nodes' }, () => {
     await checkpointNodeHeader.click()
     await comfyPage.page.keyboard.press(PIN_HOTKEY)
 
-    // Try to drag the node again
-    await comfyPage.canvasOps.dragAndDrop(
-      { x: headerPos.x, y: headerPos.y },
-      { x: headerPos.x + 256, y: headerPos.y + 256 }
-    )
+    await comfyMouse.dragElementBy(checkpointNodeHeader, { x: 256, y: 256 })
 
     // Verify the node is dragged
     await expect

browser_tests/tests/widgetCopyButton.spec.ts

@@ -5,12 +5,7 @@ import {
 
 test.describe('Widget copy button', { tag: ['@ui', '@vue-nodes'] }, () => {
   test.beforeEach(async ({ comfyPage }) => {
-    // Add a PreviewAny node which has a read-only textarea with a copy button
-    await comfyPage.page.evaluate(() => {
-      const node = window.LiteGraph!.createNode('PreviewAny')
-      window.app!.graph.add(node)
-    })
-
+    await comfyPage.searchBoxV2.addNode('Preview as Text')
     await comfyPage.vueNodes.waitForNodes()
   })
 

global.d.ts

@@ -41,6 +41,29 @@ interface GtagFunction {
   (...args: unknown[]): void
 }
 
+type SyftDataTraits = Record<string, string | number | null | undefined>
+
+interface SyftDataPendingFetch {
+  args: unknown[]
+  resolve: (value: unknown) => void
+  reject: (reason?: unknown) => void
+}
+
+interface SyftDataClient {
+  identify(email: string, traits?: SyftDataTraits): void
+  signup(email: string, traits?: SyftDataTraits): void
+  track(event: string, traits?: SyftDataTraits): void
+  page(...args: unknown[]): void
+  q?: unknown[][]
+  fi?: SyftDataPendingFetch[]
+  fetchID?: (...args: unknown[]) => Promise<unknown>
+}
+
+/** Installed by the Syft UMD instead of SyftDataClient when telemetry is opted out */
+interface SyftDisabledClient {
+  enable: () => void
+}
+
 interface Window {
   __CONFIG__: {
     gtm_container_id?: string
@@ -78,6 +101,8 @@ interface Window {
   }
   dataLayer?: Array<Record<string, unknown>>
   gtag?: GtagFunction
+  syft?: SyftDataClient | SyftDisabledClient
+  syftc?: { sourceId?: string; enabled?: boolean }
   ire_o?: string
   ire?: ImpactQueueFunction
   rewardful?: RewardfulQueueFunction

package.json

@@ -53,7 +53,6 @@
     "test:browser:coverage": "cross-env COLLECT_COVERAGE=true pnpm test:browser",
     "test:browser:local": "cross-env PLAYWRIGHT_LOCAL=1 PLAYWRIGHT_TEST_URL=http://localhost:5173 pnpm test:browser",
     "test:coverage": "vitest run --coverage",
-    "test:coverage:critical": "cross-env COVERAGE_CRITICAL=true vitest run --coverage",
     "test:unit": "vitest run",
     "typecheck": "vue-tsc --noEmit",
     "typecheck:browser": "vue-tsc --project browser_tests/tsconfig.json",

packages/design-system/src/css/comfyIconSet.js

@@ -1,10 +1,4 @@
-import {
-  cleanupSVG,
-  importDirectorySync,
-  isEmptyColor,
-  parseColors,
-  runSVGO
-} from '@iconify/tools'
+import { cleanupSVG, importDirectorySync, runSVGO } from '@iconify/tools'
 import { resolve } from 'node:path'
 
 export const COMFY_ICON_PREFIX = 'comfy'
@@ -13,13 +7,6 @@ const COMFY_ICONS_DIR = resolve(import.meta.dirname, '../icons')
 
 let cached
 
-/**
- * Load the comfy icon folder as a normalized Iconify icon set.
- *
- * Mirrors the pipeline that `@plugin "@iconify/tailwind4" { from-folder(...) }`
- * runs internally so monotone hardcoded colors become `currentColor` and
- * outer-svg attributes like `fill="none"` survive the body extraction.
- */
 export function loadComfyIconSet() {
   if (cached) return cached
   const iconSet = importDirectorySync(COMFY_ICONS_DIR)
@@ -32,18 +19,6 @@ export function loadComfyIconSet() {
     }
     try {
       cleanupSVG(svg)
-      const palette = parseColors(svg)
-      const colors = palette.colors.filter(
-        (color) => typeof color === 'string' || !isEmptyColor(color)
-      )
-      const totalColors = colors.length + (palette.hasUnsetColor ? 1 : 0)
-      if (totalColors < 2) {
-        parseColors(svg, {
-          defaultColor: 'currentColor',
-          callback: (_attr, colorStr, color) =>
-            !color || isEmptyColor(color) ? colorStr : 'currentColor'
-        })
-      }
       runSVGO(svg)
       iconSet.fromSVG(name, svg)
     } catch {

packages/design-system/src/css/iconifyDynamicPlugin.js

@@ -1,23 +0,0 @@
-import { getDynamicCSSRules } from '@iconify/tailwind4/lib/plugins/dynamic.js'
-import plugin from 'tailwindcss/plugin'
-
-import { COMFY_ICON_PREFIX, loadComfyIconSet } from './comfyIconSet.js'
-
-const SCALE = 1.2
-
-const options = {
-  iconSets: { [COMFY_ICON_PREFIX]: loadComfyIconSet() },
-  scale: SCALE
-}
-
-export default plugin(({ matchComponents }) => {
-  matchComponents({
-    icon: (icon) => {
-      try {
-        return getDynamicCSSRules(icon, options)
-      } catch {
-        return {}
-      }
-    }
-  })
-})