-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
+
+
+const hasNonEmptyValue = (current: string | string[] | undefined): boolean => {
+ if (current === undefined || current === '') return false
+ if (Array.isArray(current)) return current.length > 0
+ return true
+}
+
+const conditionMatches = (
+ condition: OnboardingSurveyFieldCondition | undefined,
+ values: SurveyValues
+): boolean => {
+ if (!condition) return true
+ const current = values[condition.field]
+ if (!hasNonEmptyValue(current)) return false
+ const expected = condition.equals
+ if (expected === undefined) return true
+ const expectedSet = Array.isArray(expected) ? expected : [expected]
+ if (Array.isArray(current)) {
+ return current.some((v) => expectedSet.includes(v))
+ }
+ return typeof current === 'string' && expectedSet.includes(current)
+}
+
+export const visibleFields = (
+ survey: OnboardingSurvey,
+ values: SurveyValues
+): OnboardingSurveyField[] =>
+ survey.fields.filter((field) => conditionMatches(field.showWhen, values))
+
+const PIN_LAST_VALUES = new Set(['other', 'not_sure'])
+
+const randomizeOptions = (field: OnboardingSurveyField) => {
+ if (!field.randomize || !field.options) return field
+ const pinned = field.options.filter((opt) => PIN_LAST_VALUES.has(opt.value))
+ const rest = field.options.filter((opt) => !PIN_LAST_VALUES.has(opt.value))
+ return {
+ ...field,
+ options: [...shuffle(rest), ...pinned]
+ }
+}
+
+export const prepareSurvey = (survey: OnboardingSurvey): OnboardingSurvey => ({
+ ...survey,
+ fields: survey.fields.map(randomizeOptions)
+})
+
+type Translator = (key: string) => string
+
+const identityTranslator: Translator = (key) => key
+
+const fieldSchema = (field: OnboardingSurveyField, t: Translator) => {
+ if (field.type === 'multi') {
+ const arr = z.array(z.string())
+ return field.required
+ ? arr.min(1, {
+ message: t('cloudOnboarding.survey.errors.selectAtLeastOne')
+ })
+ : arr.optional()
+ }
+ if (field.required) {
+ return z.string().min(1, {
+ message: t('cloudOnboarding.survey.errors.chooseAnOption')
+ })
+ }
+ return z.string().optional()
+}
+
+export const buildZodSchema = (
+ survey: OnboardingSurvey,
+ values: SurveyValues,
+ t: Translator = identityTranslator
+) => {
+ const shape: Record = {}
+ for (const field of survey.fields) {
+ if (!conditionMatches(field.showWhen, values)) continue
+ shape[field.id] = fieldSchema(field, t)
+ if (
+ field.allowOther &&
+ field.otherFieldId &&
+ values[field.id] === 'other'
+ ) {
+ shape[field.otherFieldId] = z.string().min(1, {
+ message: t('cloudOnboarding.survey.errors.describeAnswer')
+ })
+ } else if (field.otherFieldId) {
+ shape[field.otherFieldId] = z.string().optional()
+ }
+ }
+ return z.object(shape)
+}
+
+export const buildInitialValues = (survey: OnboardingSurvey): SurveyValues => {
+ const initial: SurveyValues = {}
+ for (const field of survey.fields) {
+ initial[field.id] = field.type === 'multi' ? [] : ''
+ if (field.otherFieldId) initial[field.otherFieldId] = ''
+ }
+ return initial
+}
+
+export const buildSubmissionPayload = (
+ survey: OnboardingSurvey,
+ values: SurveyValues
+): Record => {
+ const payload: Record = {}
+ for (const field of survey.fields) {
+ const visible = conditionMatches(field.showWhen, values)
+ if (!visible) {
+ payload[field.id] = field.type === 'multi' ? [] : ''
+ continue
+ }
+ const value = values[field.id]
+ const otherRaw = field.otherFieldId ? values[field.otherFieldId] : undefined
+ if (
+ field.allowOther &&
+ field.otherFieldId &&
+ value === 'other' &&
+ typeof otherRaw === 'string'
+ ) {
+ const other = otherRaw.trim()
+ payload[field.id] = other || 'other'
+ } else {
+ payload[field.id] = field.type === 'multi' ? (value ?? []) : (value ?? '')
+ }
+ }
+ return payload
+}
diff --git a/src/platform/remoteConfig/types.ts b/src/platform/remoteConfig/types.ts
index fbae538fdf..f2134aa513 100644
--- a/src/platform/remoteConfig/types.ts
+++ b/src/platform/remoteConfig/types.ts
@@ -23,6 +23,54 @@ type FirebaseRuntimeConfig = {
measurementId?: string
}
+/**
+ * Server-driven onboarding survey schema.
+ *
+ * The backend ships the entire form definition so onboarding questions can
+ * be tweaked without a frontend release. Field types map 1:1 to a component
+ * in our internal UI library — see `DynamicSurveyField.vue`.
+ */
+export type OnboardingSurveyFieldType = 'single' | 'multi' | 'text'
+
+/**
+ * A translatable string. Either:
+ * - a single literal (treated as the fallback in any locale), or
+ * - a locale → text map, e.g. `{ en: 'Personal use', ko: '개인 용도' }`,
+ * so the backend can ship translations without a frontend release.
+ */
+export type LocalizedString = string | Record
+
+export type OnboardingSurveyOption = {
+ value: string
+ label?: LocalizedString
+ labelKey?: string
+}
+
+export type OnboardingSurveyFieldCondition = {
+ field: string
+ equals?: string | string[]
+}
+
+export type OnboardingSurveyField = {
+ id: string
+ type: OnboardingSurveyFieldType
+ labelKey?: string
+ label?: LocalizedString
+ options?: OnboardingSurveyOption[]
+ required?: boolean
+ randomize?: boolean
+ allowOther?: boolean
+ otherFieldId?: string
+ placeholder?: string
+ showWhen?: OnboardingSurveyFieldCondition
+}
+
+export type OnboardingSurvey = {
+ version: number
+ introKey?: string
+ fields: OnboardingSurveyField[]
+}
+
/**
* Remote configuration type
* Configuration fetched from the server at runtime
@@ -45,6 +93,7 @@ export type RemoteConfig = {
asset_rename_enabled?: boolean
private_models_enabled?: boolean
onboarding_survey_enabled?: boolean
+ onboarding_survey?: OnboardingSurvey
linear_toggle_enabled?: boolean
team_workspaces_enabled?: boolean
user_secrets_enabled?: boolean
diff --git a/src/platform/telemetry/types.ts b/src/platform/telemetry/types.ts
index 2bdfbf0955..e606379eb5 100644
--- a/src/platform/telemetry/types.ts
+++ b/src/platform/telemetry/types.ts
@@ -40,6 +40,11 @@ export interface SurveyResponses {
industry?: string
useCase?: string
making?: string[]
+ role?: string
+ teamSize?: string
+ source?: string
+ usage?: string
+ intent?: string[]
}
export interface SurveyResponsesNormalized extends SurveyResponses {
From e831daae59a6de1ba7aab787b3bd9f14315f9ff8 Mon Sep 17 00:00:00 2001
From: Christian Byrne
Date: Fri, 1 May 2026 21:04:45 -0700
Subject: [PATCH 03/17] feat(website): point robots.txt at /sitemap-index.xml +
AI crawler rules (#11823)
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit
## Summary
Once
[comfy-router#22](https://github.com/Comfy-Org/comfy-router/pull/22)
ships, `comfy.org/sitemap-index.xml` will return a unified index
aggregating both the website (38 URLs) and workflow-templates sitemaps.
This PR:
1. Reverts `Sitemap:` back to `/sitemap-index.xml` (was `/sitemap-0.xml`
in #11802 as a workaround for the 404).
2. Adds explicit allow records for 21 search and AI/LLM crawlers
(GPTBot, ChatGPT-User, OAI-SearchBot, Google-Extended, ClaudeBot,
Claude-Web, anthropic-ai, PerplexityBot, Perplexity-User,
Applebot-Extended, Bytespider, Amazonbot, CCBot, Meta-ExternalAgent,
Meta-ExternalFetcher, Diffbot, etc.).
3. Adds `Disallow:` for `/_astro/`, `/_website/`, `/_vercel/` — Vercel
build artifacts that aren't useful to crawl.
## Why granular UAs
Stacked `User-agent:` records (per [RFC 9309
§2.2](https://datatracker.ietf.org/doc/html/rfc9309#section-2.2)) share
one rule block. Listing each bot explicitly:
- Signals intent to AI bots that look for their UA in robots.txt before
crawling more aggressively.
- Surfaces our crawl policy clearly to anyone inspecting the file.
- Lets us add per-bot Disallows in future without restructuring.
## Merge order
⚠️ **Do NOT merge until comfy-router#22 is deployed to production.**
Until then, `/sitemap-index.xml` returns 404 and this PR would re-break
the issue PR #11802 patched. Verification:
```bash
curl -sI https://comfy.org/sitemap-index.xml
# expect: HTTP/2 200, x-served-by: worker-sitemap-index
```
Once that returns 200, this is safe to merge.
## Verification (after merge + deploy)
```bash
# robots.txt is served and points at the unified index
curl -s https://comfy.org/robots.txt | grep '^Sitemap:'
# → Sitemap: https://comfy.org/sitemap-index.xml
# Each AI crawler can fetch it
for ua in 'GPTBot/1.0' 'ClaudeBot/1.0' 'PerplexityBot/1.0' 'Google-Extended' 'Applebot-Extended'; do
curl -s -o /dev/null -w "$ua → %{http_code}\n" -A "$ua" https://comfy.org/robots.txt
done
# Sitemap is reachable from robots.txt
SITEMAP=$(curl -s https://comfy.org/robots.txt | awk -F': ' '/^Sitemap:/ {print $2}')
curl -s "$SITEMAP" | xmllint --noout - && echo "valid XML"
```
## Linear / closes
- Closes FE-437 (AI crawler rules)
- Updates FE-432 — the robots.txt change in #11802 was a workaround
that's no longer needed once #22 ships
┆Issue is synchronized with this [Notion
page](https://app.notion.com/p/PR-11823-feat-website-point-robots-txt-at-sitemap-index-xml-AI-crawler-rules-3546d73d3650811dbceedd06c00db444)
by [Unito](https://www.unito.io)
---
apps/website/public/robots.txt | 35 +++++++++++++++++++++++++++++++---
1 file changed, 32 insertions(+), 3 deletions(-)
diff --git a/apps/website/public/robots.txt b/apps/website/public/robots.txt
index 1a250fa8e2..5e6114b55e 100644
--- a/apps/website/public/robots.txt
+++ b/apps/website/public/robots.txt
@@ -1,4 +1,33 @@
-User-agent: *
-Allow: /
+# robots.txt for comfy.org
+# Open to all crawlers — including AI/LLM bots — for maximum visibility
+# in AI-powered search, chat-based answer engines, and traditional search.
+# Granular UAs are listed explicitly to signal intent; rules are shared
+# via stacked user-agent records (RFC 9309 §2.2).
-Sitemap: https://comfy.org/sitemap-0.xml
+User-agent: *
+User-agent: Googlebot
+User-agent: Bingbot
+User-agent: DuckDuckBot
+User-agent: GPTBot
+User-agent: ChatGPT-User
+User-agent: OAI-SearchBot
+User-agent: Google-Extended
+User-agent: ClaudeBot
+User-agent: Claude-Web
+User-agent: anthropic-ai
+User-agent: PerplexityBot
+User-agent: Perplexity-User
+User-agent: Applebot
+User-agent: Applebot-Extended
+User-agent: Bytespider
+User-agent: Amazonbot
+User-agent: CCBot
+User-agent: Meta-ExternalAgent
+User-agent: Meta-ExternalFetcher
+User-agent: Diffbot
+Allow: /
+Disallow: /_astro/
+Disallow: /_website/
+Disallow: /_vercel/
+
+Sitemap: https://comfy.org/sitemap-index.xml
From e356addeb6e676cbcf39b4cae5bf7e48348c022f Mon Sep 17 00:00:00 2001
From: "Daxiong (Lin)"
Date: Sat, 2 May 2026 12:24:08 +0800
Subject: [PATCH 04/17] feat: add model links for default workflow (#11308)
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit
We now support detecting the missing models when loading the workflow.
But the default workflow didn't include an embedded model link,
so users don't know where to download the model or which one to use.
Users will see an error when loading the default workflow every time, so
I updated it to include the model link.
Before
After
┆Issue is synchronized with this [Notion
page](https://www.notion.so/PR-11308-feat-add-model-links-for-default-workflow-3446d73d365081188978e1d313c38ffe)
by [Unito](https://www.unito.io)
---------
Co-authored-by: GitHub Action
---
browser_tests/assets/default.json | 10 +++++++++-
src/scripts/defaultGraph.ts | 10 +++++++++-
2 files changed, 18 insertions(+), 2 deletions(-)
diff --git a/browser_tests/assets/default.json b/browser_tests/assets/default.json
index 9582c04f78..d8711bdcb2 100644
--- a/browser_tests/assets/default.json
+++ b/browser_tests/assets/default.json
@@ -119,7 +119,15 @@
{ "name": "CLIP", "type": "CLIP", "links": [3, 5], "slot_index": 1 },
{ "name": "VAE", "type": "VAE", "links": [8], "slot_index": 2 }
],
- "properties": {},
+ "properties": {
+ "models": [
+ {
+ "name": "v1-5-pruned-emaonly-fp16.safetensors",
+ "url": "https://huggingface.co/Comfy-Org/stable-diffusion-v1-5-archive/resolve/main/v1-5-pruned-emaonly-fp16.safetensors",
+ "directory": "checkpoints"
+ }
+ ]
+ },
"widgets_values": ["v1-5-pruned-emaonly-fp16.safetensors"]
}
],
diff --git a/src/scripts/defaultGraph.ts b/src/scripts/defaultGraph.ts
index bfec5f8c7f..67629f92e3 100644
--- a/src/scripts/defaultGraph.ts
+++ b/src/scripts/defaultGraph.ts
@@ -115,7 +115,15 @@ export const defaultGraph: ComfyWorkflowJSON = {
{ name: 'CLIP', type: 'CLIP', links: [3, 5], slot_index: 1 },
{ name: 'VAE', type: 'VAE', links: [8], slot_index: 2 }
],
- properties: {},
+ properties: {
+ models: [
+ {
+ name: 'v1-5-pruned-emaonly-fp16.safetensors',
+ url: 'https://huggingface.co/Comfy-Org/stable-diffusion-v1-5-archive/resolve/main/v1-5-pruned-emaonly-fp16.safetensors',
+ directory: 'checkpoints'
+ }
+ ]
+ },
widgets_values: ['v1-5-pruned-emaonly-fp16.safetensors']
}
],
From 5cad2c952b07fc70b991ef44435aef312b00a908 Mon Sep 17 00:00:00 2001
From: Christian Byrne
Date: Fri, 1 May 2026 21:50:44 -0700
Subject: [PATCH 05/17] refactor+test: extract useSubscriptionCheckout
composable, rewrite tests (#11396)
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit
## Summary
Adds 20 component tests for
`SubscriptionRequiredDialogContentWorkspace.vue` covering:
- **Initial rendering**: pricing table display, close/back button
visibility, out_of_credits reason message
- **Close button**: calls onClose callback
- **Subscribe click flow**: pricing→preview transitions (new
subscription & upgrade), error toasts for disallowed/missing/failed
previews, monthly billing cycle
- **Back button**: returns from preview to pricing step
- **Add credit card**: handles subscribed status (success toast +
close), needs_payment_method (opens Stripe URL), error state
- **Confirm transition**: success path with close emit, error toast on
failure
- **Resubscribe**: success path with toast + close, error toast on
failure
## Testing
```bash
pnpm test:unit -- src/platform/workspace/components/SubscriptionRequiredDialogContentWorkspace.test.ts
```
All 20 tests pass. Quality gates (typecheck, lint, format, knip) pass.
┆Issue is synchronized with this [Notion
page](https://www.notion.so/PR-11396-test-add-component-tests-for-SubscriptionRequiredDialogContentWorkspace-3476d73d36508156a218dcb67a2a334e)
by [Unito](https://www.unito.io)
---
...tionRequiredDialogContentWorkspace.test.ts | 198 ++++++++++
...criptionRequiredDialogContentWorkspace.vue | 255 +-----------
.../useSubscriptionCheckout.test.ts | 369 ++++++++++++++++++
.../composables/useSubscriptionCheckout.ts | 210 ++++++++++
4 files changed, 795 insertions(+), 237 deletions(-)
create mode 100644 src/platform/workspace/components/SubscriptionRequiredDialogContentWorkspace.test.ts
create mode 100644 src/platform/workspace/composables/useSubscriptionCheckout.test.ts
create mode 100644 src/platform/workspace/composables/useSubscriptionCheckout.ts
diff --git a/src/platform/workspace/components/SubscriptionRequiredDialogContentWorkspace.test.ts b/src/platform/workspace/components/SubscriptionRequiredDialogContentWorkspace.test.ts
new file mode 100644
index 0000000000..680af8da60
--- /dev/null
+++ b/src/platform/workspace/components/SubscriptionRequiredDialogContentWorkspace.test.ts
@@ -0,0 +1,198 @@
+import { createTestingPinia } from '@pinia/testing'
+import { render, screen } from '@testing-library/vue'
+import userEvent from '@testing-library/user-event'
+import { beforeEach, describe, expect, it, vi } from 'vitest'
+import { ref } from 'vue'
+import { createI18n } from 'vue-i18n'
+
+import type { SubscriptionDialogReason } from '@/platform/cloud/subscription/composables/useSubscriptionDialog'
+
+import SubscriptionRequiredDialogContentWorkspace from './SubscriptionRequiredDialogContentWorkspace.vue'
+
+const mockHandleSubscribeClick = vi.fn()
+const mockHandleBackToPricing = vi.fn()
+const mockHandleAddCreditCard = vi.fn()
+const mockHandleConfirmTransition = vi.fn()
+const mockHandleResubscribe = vi.fn()
+const mockCheckoutStep = ref<'pricing' | 'preview'>('pricing')
+const mockPreviewData = ref<{ transition_type: string } | null>(null)
+
+vi.mock('@/platform/workspace/composables/useSubscriptionCheckout', () => ({
+ useSubscriptionCheckout: () => ({
+ checkoutStep: mockCheckoutStep,
+ isLoadingPreview: ref(false),
+ loadingTier: ref(null),
+ isSubscribing: ref(false),
+ isResubscribing: ref(false),
+ previewData: mockPreviewData,
+ selectedTierKey: ref('standard'),
+ selectedBillingCycle: ref('yearly'),
+ isPolling: ref(false),
+ handleSubscribeClick: mockHandleSubscribeClick,
+ handleBackToPricing: mockHandleBackToPricing,
+ handleAddCreditCard: mockHandleAddCreditCard,
+ handleConfirmTransition: mockHandleConfirmTransition,
+ handleResubscribe: mockHandleResubscribe
+ })
+}))
+
+const i18n = createI18n({
+ legacy: false,
+ locale: 'en',
+ messages: {
+ en: {
+ g: { back: 'Back', close: 'Close' },
+ subscription: {
+ plansForWorkspace: 'Plans for {workspace}',
+ teamWorkspace: 'Team'
+ },
+ credits: {
+ topUp: {
+ insufficientTitle: 'Insufficient Credits',
+ insufficientMessage: 'You have run out of credits.'
+ }
+ }
+ }
+ }
+})
+
+const PricingTableStub = {
+ name: 'PricingTableWorkspace',
+ template: `
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
+
-
-
diff --git a/src/platform/cloud/onboarding/survey/DynamicSurveyField.vue b/src/platform/cloud/onboarding/survey/DynamicSurveyField.vue
new file mode 100644
index 0000000000..8148d00089
--- /dev/null
+++ b/src/platform/cloud/onboarding/survey/DynamicSurveyField.vue
@@ -0,0 +1,161 @@
+
+
+
+
+
+
+
+
+
diff --git a/src/platform/cloud/onboarding/survey/DynamicSurveyForm.test.ts b/src/platform/cloud/onboarding/survey/DynamicSurveyForm.test.ts
new file mode 100644
index 0000000000..72d91d24d0
--- /dev/null
+++ b/src/platform/cloud/onboarding/survey/DynamicSurveyForm.test.ts
@@ -0,0 +1,320 @@
+import userEvent from '@testing-library/user-event'
+import { render, screen } from '@testing-library/vue'
+import PrimeVue from 'primevue/config'
+import { describe, expect, it } from 'vitest'
+import { createI18n } from 'vue-i18n'
+
+import type { OnboardingSurvey } from '@/platform/remoteConfig/types'
+
+import DynamicSurveyForm from './DynamicSurveyForm.vue'
+
+const flushPromises = () => new Promise((resolve) => setTimeout(resolve, 0))
+
+const i18n = createI18n({
+ legacy: false,
+ locale: 'en',
+ messages: {
+ en: {
+ g: { back: 'Back', next: 'Next', submit: 'Submit' },
+ cloudOnboarding: {
+ survey: {
+ intro: 'Help us tailor your ComfyUI experience.',
+ errors: {
+ chooseAnOption: 'Please choose an option.',
+ selectAtLeastOne: 'Please select at least one option.',
+ describeAnswer: 'Please describe your answer.'
+ }
+ }
+ }
+ }
+ }
+})
+
+const renderForm = (survey: OnboardingSurvey) =>
+ render(DynamicSurveyForm, {
+ global: { plugins: [PrimeVue, i18n] },
+ props: { survey }
+ })
+
+const twoStepSurvey: OnboardingSurvey = {
+ version: 1,
+ introKey: 'cloudOnboarding.survey.intro',
+ fields: [
+ {
+ id: 'usage',
+ type: 'single',
+ label: 'How do you plan to use ComfyUI?',
+ required: true,
+ options: [
+ { value: 'personal', label: 'Personal use' },
+ { value: 'work', label: 'Work' }
+ ]
+ },
+ {
+ id: 'intent',
+ type: 'multi',
+ label: 'What do you want to create with ComfyUI?',
+ required: true,
+ options: [
+ { value: 'images', label: 'Images' },
+ { value: 'videos', label: 'Videos' }
+ ]
+ }
+ ]
+}
+
+describe('DynamicSurveyForm', () => {
+ it('renders the intro text and the first field options', () => {
+ renderForm(twoStepSurvey)
+
+ expect(
+ screen.getByText('Help us tailor your ComfyUI experience.')
+ ).toBeInTheDocument()
+ expect(screen.getByText('How do you plan to use ComfyUI?')).toBeVisible()
+ expect(screen.getByLabelText('Personal use')).toBeInTheDocument()
+ expect(screen.getByLabelText('Work')).toBeInTheDocument()
+ })
+
+ it('disables Next until the user selects an option, then advances', async () => {
+ const user = userEvent.setup()
+ renderForm(twoStepSurvey)
+
+ const next = screen.getByRole('button', { name: 'Next' })
+ expect(next).toBeDisabled()
+
+ await user.click(screen.getByLabelText('Personal use'))
+ expect(next).toBeEnabled()
+
+ await user.click(next)
+ await flushPromises()
+
+ expect(
+ screen.getByText('What do you want to create with ComfyUI?')
+ ).toBeVisible()
+ expect(screen.getByLabelText('Images')).toBeInTheDocument()
+ expect(screen.getByRole('button', { name: 'Back' })).toBeInTheDocument()
+ })
+
+ it('navigates back to the previous step', async () => {
+ const user = userEvent.setup()
+ renderForm(twoStepSurvey)
+
+ await user.click(screen.getByLabelText('Personal use'))
+ await user.click(screen.getByRole('button', { name: 'Next' }))
+ await flushPromises()
+ expect(
+ screen.getByText('What do you want to create with ComfyUI?')
+ ).toBeVisible()
+
+ await user.click(screen.getByRole('button', { name: 'Back' }))
+ await flushPromises()
+ expect(screen.getByText('How do you plan to use ComfyUI?')).toBeVisible()
+ })
+
+ it('resolves option and field labels via labelKey when provided', () => {
+ const localizedI18n = createI18n({
+ legacy: false,
+ locale: 'en',
+ messages: {
+ en: {
+ g: { back: 'Back', next: 'Next', submit: 'Submit' },
+ cloudOnboarding: {
+ survey: {
+ intro: 'Help us tailor your ComfyUI experience.',
+ errors: {
+ chooseAnOption: '',
+ selectAtLeastOne: '',
+ describeAnswer: ''
+ }
+ }
+ },
+ survey_label: 'Localized question?',
+ survey_a: 'Localized A',
+ survey_b: 'Localized B'
+ }
+ }
+ })
+
+ render(DynamicSurveyForm, {
+ global: { plugins: [PrimeVue, localizedI18n] },
+ props: {
+ survey: {
+ version: 1,
+ fields: [
+ {
+ id: 'q',
+ type: 'single',
+ labelKey: 'survey_label',
+ required: true,
+ options: [
+ { value: 'a', labelKey: 'survey_a' },
+ { value: 'b', labelKey: 'survey_b' }
+ ]
+ }
+ ]
+ }
+ }
+ })
+
+ expect(screen.getByText('Localized question?')).toBeVisible()
+ expect(screen.getByLabelText('Localized A')).toBeInTheDocument()
+ expect(screen.getByLabelText('Localized B')).toBeInTheDocument()
+ })
+
+ it('renders server-supplied translations from a label locale map', () => {
+ const koreanI18n = createI18n({
+ legacy: false,
+ locale: 'ko',
+ fallbackLocale: 'en',
+ messages: {
+ en: {
+ g: { back: 'Back', next: 'Next', submit: 'Submit' },
+ cloudOnboarding: {
+ survey: {
+ intro: '',
+ errors: {
+ chooseAnOption: '',
+ selectAtLeastOne: '',
+ describeAnswer: ''
+ }
+ }
+ }
+ },
+ ko: { g: { back: '뒤로', next: '다음', submit: '제출' } }
+ }
+ })
+
+ render(DynamicSurveyForm, {
+ global: { plugins: [PrimeVue, koreanI18n] },
+ props: {
+ survey: {
+ version: 1,
+ fields: [
+ {
+ id: 'usage',
+ type: 'single',
+ label: {
+ en: 'How will you use it?',
+ ko: '어떻게 사용하시겠어요?'
+ },
+ required: true,
+ options: [
+ {
+ value: 'personal',
+ label: { en: 'Personal use', ko: '개인 용도' }
+ },
+ { value: 'work', label: { en: 'Work', ko: '업무' } }
+ ]
+ }
+ ]
+ }
+ }
+ })
+
+ expect(screen.getByText('어떻게 사용하시겠어요?')).toBeVisible()
+ expect(screen.getByLabelText('개인 용도')).toBeInTheDocument()
+ expect(screen.getByLabelText('업무')).toBeInTheDocument()
+ })
+
+ it('falls back to English when current locale missing from label map', () => {
+ const fallbackI18n = createI18n({
+ legacy: false,
+ locale: 'fr',
+ fallbackLocale: 'en',
+ messages: {
+ en: {
+ g: { back: 'Back', next: 'Next', submit: 'Submit' },
+ cloudOnboarding: {
+ survey: {
+ intro: '',
+ errors: {
+ chooseAnOption: '',
+ selectAtLeastOne: '',
+ describeAnswer: ''
+ }
+ }
+ }
+ },
+ fr: {}
+ }
+ })
+
+ render(DynamicSurveyForm, {
+ global: { plugins: [PrimeVue, fallbackI18n] },
+ props: {
+ survey: {
+ version: 1,
+ fields: [
+ {
+ id: 'q',
+ type: 'single',
+ label: { en: 'English question', ko: '한국어' },
+ required: true,
+ options: [
+ { value: 'a', label: { en: 'English A', ko: '한국어 A' } }
+ ]
+ }
+ ]
+ }
+ }
+ })
+
+ // fr is not in the map → falls back to en
+ expect(screen.getByText('English question')).toBeVisible()
+ expect(screen.getByLabelText('English A')).toBeInTheDocument()
+ })
+
+ it('allows advancing past an optional field while still empty', async () => {
+ const user = userEvent.setup()
+ render(DynamicSurveyForm, {
+ global: { plugins: [PrimeVue, i18n] },
+ props: {
+ survey: {
+ version: 1,
+ fields: [
+ {
+ id: 'q1',
+ type: 'single',
+ label: 'Optional question?',
+ options: [
+ { value: 'a', label: 'A' },
+ { value: 'b', label: 'B' }
+ ]
+ // no required: true — should be skippable
+ },
+ {
+ id: 'q2',
+ type: 'single',
+ label: 'Required question?',
+ required: true,
+ options: [{ value: 'c', label: 'C' }]
+ }
+ ]
+ }
+ }
+ })
+
+ const next = screen.getByRole('button', { name: 'Next' })
+ expect(next).toBeEnabled()
+
+ await user.click(next)
+ await flushPromises()
+ expect(screen.getByText('Required question?')).toBeVisible()
+ })
+
+ it('enables Submit only after the multi-select field has at least one choice', async () => {
+ const user = userEvent.setup()
+ renderForm(twoStepSurvey)
+
+ await user.click(screen.getByLabelText('Work'))
+ await user.click(screen.getByRole('button', { name: 'Next' }))
+ await flushPromises()
+
+ const submitBtn = screen.getByRole('button', { name: 'Submit' })
+ expect(submitBtn).toBeDisabled()
+
+ await user.click(screen.getByRole('checkbox', { name: /Images/i }))
+ await flushPromises()
+ expect(submitBtn).toBeEnabled()
+ })
+})
diff --git a/src/platform/cloud/onboarding/survey/DynamicSurveyForm.vue b/src/platform/cloud/onboarding/survey/DynamicSurveyForm.vue
new file mode 100644
index 0000000000..9ed1148a72
--- /dev/null
+++ b/src/platform/cloud/onboarding/survey/DynamicSurveyForm.vue
@@ -0,0 +1,212 @@
+
+
+
+
+
diff --git a/src/platform/cloud/onboarding/survey/defaultSurveySchema.ts b/src/platform/cloud/onboarding/survey/defaultSurveySchema.ts
new file mode 100644
index 0000000000..69c05ce5e7
--- /dev/null
+++ b/src/platform/cloud/onboarding/survey/defaultSurveySchema.ts
@@ -0,0 +1,76 @@
+import type { OnboardingSurvey } from '@/platform/remoteConfig/types'
+
+const optionsFor = (
+ fieldId: string,
+ values: string[]
+): { value: string; labelKey: string }[] =>
+ values.map((value) => ({
+ value,
+ labelKey: `cloudOnboarding.survey.options.${fieldId}.${value}`
+ }))
+
+export const defaultOnboardingSurvey: OnboardingSurvey = {
+ version: 2,
+ introKey: 'cloudOnboarding.survey.intro',
+ fields: [
+ {
+ id: 'usage',
+ type: 'single',
+ labelKey: 'cloudSurvey_steps_usage',
+ required: true,
+ options: optionsFor('usage', ['personal', 'work', 'education'])
+ },
+ {
+ id: 'familiarity',
+ type: 'single',
+ labelKey: 'cloudSurvey_steps_familiarity',
+ required: true,
+ options: optionsFor('familiarity', [
+ 'new',
+ 'starting',
+ 'basics',
+ 'advanced',
+ 'expert'
+ ])
+ },
+ {
+ id: 'intent',
+ type: 'multi',
+ labelKey: 'cloudSurvey_steps_intent',
+ required: true,
+ randomize: true,
+ options: optionsFor('intent', [
+ 'workflows',
+ 'custom_nodes',
+ 'videos',
+ 'images',
+ '3d_game',
+ 'audio',
+ 'apps',
+ 'api',
+ 'not_sure'
+ ])
+ },
+ {
+ id: 'source',
+ type: 'single',
+ labelKey: 'cloudSurvey_steps_source',
+ required: true,
+ randomize: true,
+ options: optionsFor('source', [
+ 'youtube',
+ 'reddit',
+ 'twitter',
+ 'instagram',
+ 'linkedin',
+ 'friend',
+ 'search',
+ 'newsletter',
+ 'conference',
+ 'discord',
+ 'github',
+ 'other'
+ ])
+ }
+ ]
+}
diff --git a/src/platform/cloud/onboarding/survey/surveySchema.test.ts b/src/platform/cloud/onboarding/survey/surveySchema.test.ts
new file mode 100644
index 0000000000..1695c85132
--- /dev/null
+++ b/src/platform/cloud/onboarding/survey/surveySchema.test.ts
@@ -0,0 +1,248 @@
+import { describe, expect, it } from 'vitest'
+
+import type { OnboardingSurvey } from '@/platform/remoteConfig/types'
+
+import {
+ buildInitialValues,
+ buildSubmissionPayload,
+ buildZodSchema,
+ prepareSurvey,
+ visibleFields
+} from './surveySchema'
+
+const baseSurvey: OnboardingSurvey = {
+ version: 1,
+ fields: [
+ {
+ id: 'usage',
+ type: 'single',
+ required: true,
+ options: [
+ { value: 'work', label: 'Work' },
+ { value: 'personal', label: 'Personal' }
+ ]
+ },
+ {
+ id: 'role',
+ type: 'single',
+ required: true,
+ showWhen: { field: 'usage', equals: 'work' },
+ options: [{ value: 'engineer', label: 'Engineer' }]
+ },
+ {
+ id: 'industry',
+ type: 'single',
+ required: true,
+ allowOther: true,
+ otherFieldId: 'industryOther',
+ showWhen: { field: 'usage', equals: 'work' },
+ options: [
+ { value: 'tech', label: 'Tech' },
+ { value: 'other', label: 'Other' }
+ ]
+ },
+ {
+ id: 'making',
+ type: 'multi',
+ required: true,
+ options: [
+ { value: 'video', label: 'Video' },
+ { value: 'images', label: 'Images' }
+ ]
+ }
+ ]
+}
+
+describe('visibleFields', () => {
+ it('hides fields when showWhen does not match', () => {
+ const visible = visibleFields(baseSurvey, { usage: 'personal' })
+ expect(visible.map((f) => f.id)).toEqual(['usage', 'making'])
+ })
+
+ it('shows gated fields when showWhen matches', () => {
+ const visible = visibleFields(baseSurvey, { usage: 'work' })
+ expect(visible.map((f) => f.id)).toEqual([
+ 'usage',
+ 'role',
+ 'industry',
+ 'making'
+ ])
+ })
+
+ it('treats array equals as membership', () => {
+ const survey: OnboardingSurvey = {
+ version: 1,
+ fields: [
+ {
+ id: 'role',
+ type: 'single',
+ showWhen: { field: 'usage', equals: ['work', 'education'] }
+ }
+ ]
+ }
+ expect(visibleFields(survey, { usage: 'education' })).toHaveLength(1)
+ expect(visibleFields(survey, { usage: 'personal' })).toHaveLength(0)
+ })
+
+ it('intersects multi-select source values with expected set', () => {
+ const survey: OnboardingSurvey = {
+ version: 1,
+ fields: [
+ {
+ id: 'follow_up',
+ type: 'single',
+ showWhen: { field: 'making', equals: ['video', '3d'] }
+ }
+ ]
+ }
+ expect(visibleFields(survey, { making: [] })).toHaveLength(0)
+ expect(visibleFields(survey, { making: ['images'] })).toHaveLength(0)
+ expect(visibleFields(survey, { making: ['images', 'video'] })).toHaveLength(
+ 1
+ )
+ })
+})
+
+describe('buildInitialValues', () => {
+ it('initializes single fields to empty string and multi to empty array', () => {
+ expect(buildInitialValues(baseSurvey)).toMatchObject({
+ usage: '',
+ role: '',
+ industry: '',
+ industryOther: '',
+ making: []
+ })
+ })
+})
+
+describe('buildZodSchema', () => {
+ it('omits hidden fields from validation', () => {
+ const schema = buildZodSchema(baseSurvey, { usage: 'personal' })
+ const result = schema.safeParse({ usage: 'personal', making: ['video'] })
+ expect(result.success).toBe(true)
+ })
+
+ it('requires gated fields once visible', () => {
+ const schema = buildZodSchema(baseSurvey, { usage: 'work' })
+ const result = schema.safeParse({ usage: 'work', making: ['video'] })
+ expect(result.success).toBe(false)
+ })
+
+ it('requires "other" detail when option is selected', () => {
+ const schema = buildZodSchema(baseSurvey, {
+ usage: 'work',
+ role: 'engineer',
+ industry: 'other',
+ making: ['video']
+ })
+ expect(
+ schema.safeParse({
+ usage: 'work',
+ role: 'engineer',
+ industry: 'other',
+ industryOther: '',
+ making: ['video']
+ }).success
+ ).toBe(false)
+ expect(
+ schema.safeParse({
+ usage: 'work',
+ role: 'engineer',
+ industry: 'other',
+ industryOther: 'Aerospace',
+ making: ['video']
+ }).success
+ ).toBe(true)
+ })
+})
+
+describe('buildSubmissionPayload', () => {
+ it('clears hidden fields and prefers free-text "other" detail', () => {
+ const payload = buildSubmissionPayload(baseSurvey, {
+ usage: 'work',
+ role: 'engineer',
+ industry: 'other',
+ industryOther: ' Aerospace ',
+ making: ['video']
+ })
+ expect(payload).toEqual({
+ usage: 'work',
+ role: 'engineer',
+ industry: 'Aerospace',
+ making: ['video']
+ })
+ })
+
+ it('falls back to "other" when free-text is empty', () => {
+ const payload = buildSubmissionPayload(baseSurvey, {
+ usage: 'work',
+ role: 'engineer',
+ industry: 'other',
+ industryOther: '',
+ making: ['video']
+ })
+ expect(payload.industry).toBe('other')
+ })
+
+ it('zeroes out fields hidden by showWhen', () => {
+ const payload = buildSubmissionPayload(baseSurvey, {
+ usage: 'personal',
+ role: 'engineer',
+ making: ['video']
+ })
+ expect(payload).toMatchObject({
+ usage: 'personal',
+ role: '',
+ industry: '',
+ making: ['video']
+ })
+ })
+})
+
+describe('prepareSurvey', () => {
+ it('preserves option contents but may reorder when randomize=true', () => {
+ const survey: OnboardingSurvey = {
+ version: 1,
+ fields: [
+ {
+ id: 'making',
+ type: 'multi',
+ randomize: true,
+ options: [
+ { value: 'a', label: 'A' },
+ { value: 'b', label: 'B' },
+ { value: 'other', label: 'Other' }
+ ]
+ }
+ ]
+ }
+ const prepared = prepareSurvey(survey)
+ const values = prepared.fields[0]!.options!.map((o) => o.value)
+ expect(values).toContain('a')
+ expect(values).toContain('b')
+ expect(values[values.length - 1]).toBe('other')
+ })
+
+ it('pins both "other" and "not_sure" at the end while randomizing the rest', () => {
+ const survey: OnboardingSurvey = {
+ version: 1,
+ fields: [
+ {
+ id: 'intent',
+ type: 'multi',
+ randomize: true,
+ options: [
+ { value: 'a', label: 'A' },
+ { value: 'b', label: 'B' },
+ { value: 'other', label: 'Other' },
+ { value: 'not_sure', label: 'Not sure' }
+ ]
+ }
+ ]
+ }
+ const prepared = prepareSurvey(survey)
+ const values = prepared.fields[0]!.options!.map((o) => o.value)
+ expect(values.slice(-2).sort()).toEqual(['not_sure', 'other'])
+ expect(values.slice(0, -2).sort()).toEqual(['a', 'b'])
+ })
+})
diff --git a/src/platform/cloud/onboarding/survey/surveySchema.ts b/src/platform/cloud/onboarding/survey/surveySchema.ts
new file mode 100644
index 0000000000..d039d89139
--- /dev/null
+++ b/src/platform/cloud/onboarding/survey/surveySchema.ts
@@ -0,0 +1,137 @@
+import { shuffle } from 'es-toolkit'
+import { z } from 'zod'
+
+import type {
+ OnboardingSurvey,
+ OnboardingSurveyField,
+ OnboardingSurveyFieldCondition
+} from '@/platform/remoteConfig/types'
+
+export type SurveyValues = Record{{ errorMessage }}
+
+
+
+
`
+}
+
+const AddPaymentPreviewStub = {
+ name: 'SubscriptionAddPaymentPreviewWorkspace',
+ template: `
+
+
`
+}
+
+const TransitionPreviewStub = {
+ name: 'SubscriptionTransitionPreviewWorkspace',
+ template: `
+
+
`
+}
+
+function renderComponent(
+ props: { onClose?: () => void; reason?: SubscriptionDialogReason } = {}
+) {
+ return render(SubscriptionRequiredDialogContentWorkspace, {
+ props: {
+ onClose: props.onClose ?? vi.fn(),
+ ...(props.reason ? { reason: props.reason } : {})
+ },
+ global: {
+ plugins: [
+ createTestingPinia({ createSpy: vi.fn, stubActions: false }),
+ i18n
+ ],
+ stubs: {
+ PricingTableWorkspace: PricingTableStub,
+ SubscriptionAddPaymentPreviewWorkspace: AddPaymentPreviewStub,
+ SubscriptionTransitionPreviewWorkspace: TransitionPreviewStub
+ }
+ }
+ })
+}
+
+describe('SubscriptionRequiredDialogContentWorkspace', () => {
+ beforeEach(() => {
+ vi.clearAllMocks()
+ mockCheckoutStep.value = 'pricing'
+ mockPreviewData.value = null
+ })
+
+ it('shows pricing table on pricing step', () => {
+ renderComponent()
+ expect(screen.getByTestId('pricing-table')).toBeInTheDocument()
+ expect(screen.queryByTestId('add-payment-preview')).not.toBeInTheDocument()
+ expect(screen.queryByTestId('transition-preview')).not.toBeInTheDocument()
+ })
+
+ it('shows close button and hides back button on pricing step', () => {
+ renderComponent()
+ expect(screen.getByLabelText('Close')).toBeInTheDocument()
+ expect(screen.queryByLabelText('Back')).not.toBeInTheDocument()
+ })
+
+ it('calls onClose when close button is clicked', async () => {
+ const user = userEvent.setup()
+ const onClose = vi.fn()
+ renderComponent({ onClose })
+
+ await user.click(screen.getByLabelText('Close'))
+
+ expect(onClose).toHaveBeenCalledOnce()
+ })
+
+ it('shows back button on preview step', () => {
+ mockCheckoutStep.value = 'preview'
+ mockPreviewData.value = { transition_type: 'new_subscription' }
+ renderComponent()
+ expect(screen.getByLabelText('Back')).toBeInTheDocument()
+ })
+
+ it('shows insufficient credits message when reason is out_of_credits', () => {
+ renderComponent({ reason: 'out_of_credits' })
+ expect(screen.getByText('Insufficient Credits')).toBeInTheDocument()
+ expect(screen.getByText('You have run out of credits.')).toBeInTheDocument()
+ })
+
+ it('does not show insufficient credits message without reason', () => {
+ renderComponent()
+ expect(screen.queryByText('Insufficient Credits')).not.toBeInTheDocument()
+ })
+
+ it('shows new subscription preview when transition_type is new_subscription', () => {
+ mockCheckoutStep.value = 'preview'
+ mockPreviewData.value = { transition_type: 'new_subscription' }
+ renderComponent()
+ expect(screen.getByTestId('add-payment-preview')).toBeInTheDocument()
+ expect(screen.queryByTestId('transition-preview')).not.toBeInTheDocument()
+ })
+
+ it('shows transition preview when transition_type is upgrade', () => {
+ mockCheckoutStep.value = 'preview'
+ mockPreviewData.value = { transition_type: 'upgrade' }
+ renderComponent()
+ expect(screen.getByTestId('transition-preview')).toBeInTheDocument()
+ expect(screen.queryByTestId('add-payment-preview')).not.toBeInTheDocument()
+ })
+
+ it('wires subscribe event to handleSubscribeClick', async () => {
+ const user = userEvent.setup()
+ renderComponent()
+
+ await user.click(screen.getByTestId('subscribe-btn'))
+
+ expect(mockHandleSubscribeClick).toHaveBeenCalledWith({
+ tierKey: 'standard',
+ billingCycle: 'yearly'
+ })
+ })
+
+ it('wires resubscribe event to handleResubscribe', async () => {
+ const user = userEvent.setup()
+ renderComponent()
+
+ await user.click(screen.getByTestId('resubscribe-btn'))
+
+ expect(mockHandleResubscribe).toHaveBeenCalled()
+ })
+
+ it('wires back button to handleBackToPricing', async () => {
+ const user = userEvent.setup()
+ mockCheckoutStep.value = 'preview'
+ mockPreviewData.value = { transition_type: 'new_subscription' }
+ renderComponent()
+
+ await user.click(screen.getByLabelText('Back'))
+
+ expect(mockHandleBackToPricing).toHaveBeenCalled()
+ })
+})
diff --git a/src/platform/workspace/components/SubscriptionRequiredDialogContentWorkspace.vue b/src/platform/workspace/components/SubscriptionRequiredDialogContentWorkspace.vue
index bbceecd5b4..f8a815ac37 100644
--- a/src/platform/workspace/components/SubscriptionRequiredDialogContentWorkspace.vue
+++ b/src/platform/workspace/components/SubscriptionRequiredDialogContentWorkspace.vue
@@ -18,7 +18,7 @@
variant="muted-textonly"
class="absolute top-2.5 right-2.5 shrink-0 rounded-full text-text-secondary hover:bg-white/10"
:aria-label="$t('g.close')"
- @click="handleClose"
+ @click="onClose"
>
@@ -94,28 +94,14 @@