mirror of
https://github.com/Comfy-Org/ComfyUI_frontend.git
synced 2026-04-20 14:30:41 +00:00
fix: type API mock responses in browser tests
Add guideline requiring typed mock data in route.fulfill() calls and refactor existing untyped mocks to use schema-derived types. Refs #10656
This commit is contained in:
@@ -216,6 +216,7 @@ See @docs/testing/\*.md for detailed patterns.
|
||||
1. Follow the Best Practices described [in the Playwright documentation](https://playwright.dev/docs/best-practices)
|
||||
2. Do not use waitForTimeout, use Locator actions and [retrying assertions](https://playwright.dev/docs/test-assertions#auto-retrying-assertions)
|
||||
3. Tags like `@mobile`, `@2x` are respected by config and should be used for relevant tests
|
||||
4. Type all API mock responses in `route.fulfill()` using schemas from `src/schemas/`, `packages/ingest-types`, or `packages/registry-types` — see `docs/guidance/playwright.md` for details
|
||||
|
||||
## External Resources
|
||||
|
||||
|
||||
@@ -1,8 +1,21 @@
|
||||
import { expect } from '@playwright/test'
|
||||
|
||||
import type { ReleaseNote } from '../../src/platform/updates/common/releaseService'
|
||||
import { comfyPageFixture as test } from '../fixtures/ComfyPage'
|
||||
import { TestIds } from '../fixtures/selectors'
|
||||
|
||||
function createMockRelease(overrides?: Partial<ReleaseNote>): ReleaseNote {
|
||||
return {
|
||||
id: 1,
|
||||
project: 'comfyui',
|
||||
version: 'v0.3.44',
|
||||
attention: 'medium',
|
||||
content: '## New Features\n\n- Added awesome feature',
|
||||
published_at: new Date().toISOString(),
|
||||
...overrides
|
||||
}
|
||||
}
|
||||
|
||||
test.describe('Release Notifications', () => {
|
||||
test.beforeEach(async ({ comfyPage }) => {
|
||||
await comfyPage.settings.setSetting('Comfy.UseNewMenu', 'Top')
|
||||
@@ -22,15 +35,10 @@ test.describe('Release Notifications', () => {
|
||||
status: 200,
|
||||
contentType: 'application/json',
|
||||
body: JSON.stringify([
|
||||
{
|
||||
id: 1,
|
||||
project: 'comfyui',
|
||||
version: 'v0.3.44',
|
||||
attention: 'medium',
|
||||
createMockRelease({
|
||||
content:
|
||||
'## New Features\n\n- Added awesome feature\n- Fixed important bug',
|
||||
published_at: new Date().toISOString()
|
||||
}
|
||||
'## New Features\n\n- Added awesome feature\n- Fixed important bug'
|
||||
})
|
||||
])
|
||||
})
|
||||
} else {
|
||||
@@ -157,16 +165,7 @@ test.describe('Release Notifications', () => {
|
||||
await route.fulfill({
|
||||
status: 200,
|
||||
contentType: 'application/json',
|
||||
body: JSON.stringify([
|
||||
{
|
||||
id: 1,
|
||||
project: 'comfyui',
|
||||
version: 'v0.3.44',
|
||||
attention: 'high',
|
||||
content: '## New Features\n\n- Added awesome feature',
|
||||
published_at: new Date().toISOString()
|
||||
}
|
||||
])
|
||||
body: JSON.stringify([createMockRelease({ attention: 'high' })])
|
||||
})
|
||||
} else {
|
||||
await route.continue()
|
||||
@@ -250,16 +249,7 @@ test.describe('Release Notifications', () => {
|
||||
await route.fulfill({
|
||||
status: 200,
|
||||
contentType: 'application/json',
|
||||
body: JSON.stringify([
|
||||
{
|
||||
id: 1,
|
||||
project: 'comfyui',
|
||||
version: 'v0.3.44',
|
||||
attention: 'medium',
|
||||
content: '## New Features\n\n- Added awesome feature',
|
||||
published_at: new Date().toISOString()
|
||||
}
|
||||
])
|
||||
body: JSON.stringify([createMockRelease()])
|
||||
})
|
||||
} else {
|
||||
await route.continue()
|
||||
@@ -303,14 +293,10 @@ test.describe('Release Notifications', () => {
|
||||
status: 200,
|
||||
contentType: 'application/json',
|
||||
body: JSON.stringify([
|
||||
{
|
||||
id: 1,
|
||||
project: 'comfyui',
|
||||
version: 'v0.3.44',
|
||||
createMockRelease({
|
||||
attention: 'low',
|
||||
content: '## Bug Fixes\n\n- Fixed minor issue',
|
||||
published_at: new Date().toISOString()
|
||||
}
|
||||
content: '## Bug Fixes\n\n- Fixed minor issue'
|
||||
})
|
||||
])
|
||||
})
|
||||
} else {
|
||||
|
||||
@@ -1,6 +1,7 @@
|
||||
import type { Page } from '@playwright/test'
|
||||
import { expect } from '@playwright/test'
|
||||
|
||||
import type { WorkflowTemplates } from '../../src/platform/workflow/templates/types/template'
|
||||
import { comfyPageFixture as test } from '../fixtures/ComfyPage'
|
||||
|
||||
async function checkTemplateFileExists(
|
||||
@@ -239,7 +240,7 @@ test.describe('Templates', { tag: ['@slow', '@workflow'] }, () => {
|
||||
await comfyPage.page.route(
|
||||
'**/templates/index.json',
|
||||
async (route, _) => {
|
||||
const response = [
|
||||
const response: WorkflowTemplates[] = [
|
||||
{
|
||||
moduleName: 'default',
|
||||
title: 'Test Templates',
|
||||
|
||||
@@ -87,6 +87,43 @@ Tags are respected by config:
|
||||
- Check `browser_tests/assets/` for test data and fixtures
|
||||
- Use realistic ComfyUI workflows for E2E tests
|
||||
|
||||
## Typed API Mocks
|
||||
|
||||
When mocking API responses with `route.fulfill()`, always type the response body
|
||||
using existing schemas or generated types. This catches shape mismatches at compile
|
||||
time instead of through flaky runtime failures.
|
||||
|
||||
### Sources of truth
|
||||
|
||||
| Endpoint category | Type source |
|
||||
| --------------------------------------------------- | -------------------------------------------------------- |
|
||||
| Cloud-only (hub, billing, workflows) | `@comfyorg/ingest-types` (auto-generated from OpenAPI) |
|
||||
| Registry (releases, nodes, publishers) | `@comfyorg/registry-types` (auto-generated from OpenAPI) |
|
||||
| Manager (queue tasks, packages) | `generatedManagerTypes.ts` (auto-generated from OpenAPI) |
|
||||
| Python backend (queue, history, settings, features) | Manual Zod schemas in `src/schemas/apiSchema.ts` |
|
||||
| Node definitions | `src/schemas/nodeDefSchema.ts` |
|
||||
| Templates | `src/platform/workflow/templates/types/template.ts` |
|
||||
|
||||
### Patterns
|
||||
|
||||
```typescript
|
||||
// ✅ Import the type and annotate mock data
|
||||
import type { ReleaseNote } from '@/platform/updates/common/releaseService'
|
||||
|
||||
const mockRelease: ReleaseNote = {
|
||||
id: 1,
|
||||
project: 'comfyui',
|
||||
version: 'v0.3.44',
|
||||
attention: 'medium',
|
||||
content: '## New Features',
|
||||
published_at: new Date().toISOString()
|
||||
}
|
||||
body: JSON.stringify([mockRelease])
|
||||
|
||||
// ❌ Untyped inline JSON — schema drift goes unnoticed
|
||||
body: JSON.stringify([{ id: 1, project: 'comfyui', version: 'v0.3.44', ... }])
|
||||
```
|
||||
|
||||
## Running Tests
|
||||
|
||||
```bash
|
||||
|
||||
Reference in New Issue
Block a user