mirror of
https://github.com/Comfy-Org/ComfyUI_frontend.git
synced 2026-05-12 08:50:17 +00:00
5e3266e0c2
## Summary Add Playwright e2e tests for the node replacement feature (swap nodes UI in the errors tab). ## Changes - **What**: 6 e2e test cases across two describe blocks covering single and multi-type node replacement flows. Tests verify swap nodes group visibility, in-place replacement, widget value preservation, Replace All across multiple types, output connection preservation, and success toast display. Includes typed mock data for `/api/node_replacements` and two workflow fixture files with fake missing node types mapped to real core nodes. ## Review Focus - Mock setup pattern in `setupNodeReplacement` — enables feature flag via `page.evaluate` and routes the API endpoint - Workflow fixture design — uses fake node types (E2E_OldSampler, E2E_OldUpscaler) that map to real registered types (KSampler, ImageScaleBy) - Assertion coverage for link preservation after replacement ┆Issue is synchronized with this [Notion page](https://www.notion.so/PR-11242-test-add-e2e-tests-for-node-replacement-flows-3426d73d3650811e87d7f0d96fd66433) by [Unito](https://www.unito.io) --------- Co-authored-by: Connor Byrne <c.byrne@comfy.org>
Mock Data Fixtures
Deterministic mock data for browser (Playwright) tests. Each fixture
exports typed objects that conform to generated types from
packages/ingest-types or Zod schemas in src/schemas/.
Usage with page.route()
Note:
comfyPageFixturenavigates to the app duringsetup(), before the test body runs. Routes must be registered before navigation to intercept initial page-load requests. Set up routes in a custom fixture ortest.beforeEachthat runs beforecomfyPage.setup().
import { createMockNodeDefinitions } from '../fixtures/data/nodeDefinitions'
import { mockSystemStats } from '../fixtures/data/systemStats'
// Extend the base set with test-specific nodes
const nodeDefs = createMockNodeDefinitions({
MyCustomNode: {
/* ... */
}
})
await page.route('**/api/object_info', (route) =>
route.fulfill({ json: nodeDefs })
)
await page.route('**/api/system_stats', (route) =>
route.fulfill({ json: mockSystemStats })
)
Adding new fixtures
- Locate the generated type in
packages/ingest-typesor Zod schema insrc/schemas/for the endpoint you need. - Create a new
.tsfile here that imports and satisfies the corresponding TypeScript type. - Keep values realistic but stable — avoid dates, random IDs, or values that would cause test flakiness.