fix: adjust historyOffset when removing items to prevent skipping unseen rows

Addresses review feedback: removeHistoryItems() now decrements
historyOffset by the number of removed items so the next
loadMoreHistory() call does not skip unseen history rows.

https://github.com/Comfy-Org/ComfyUI_frontend/pull/9005#discussion_r2044741070

.claude/skills/ticket-intake/SKILL.md

@@ -0,0 +1,361 @@
+---
+name: ticket-intake
+description: 'Parse ticket URL (Notion or GitHub), extract all data, initialize pipeline run. Use when starting work on a new ticket or when asked to pick up a ticket.'
+---
+
+# Ticket Intake
+
+Parses a ticket URL from supported sources (Notion or GitHub), extracts all relevant information, and creates a ticket in the pipeline API.
+
+> **🚨 CRITICAL REQUIREMENT**: This skill MUST register the ticket in the Pipeline API and update the source (Notion/GitHub). If these steps are skipped, the entire pipeline breaks. See [Mandatory API Calls](#mandatory-api-calls-execute-all-three) below.
+
+## Supported Sources
+
+| Source | URL Pattern                                         | Provider File         |
+| ------ | --------------------------------------------------- | --------------------- |
+| Notion | `https://notion.so/...` `https://www.notion.so/...` | `providers/notion.md` |
+| GitHub | `https://github.com/{owner}/{repo}/issues/{n}`      | `providers/github.md` |
+
+## Quick Start
+
+When given a ticket URL:
+
+1. **Detect source type** from URL pattern
+2. **Load provider-specific logic** from `providers/` directory
+3. Fetch ticket content via appropriate API
+4. Extract and normalize properties to common schema
+5. **Register ticket in pipeline API** ← MANDATORY
+6. **Update source** (Notion status / GitHub comment) ← MANDATORY
+7. **Run verification script** to confirm API registration
+8. Output summary and handoff to `research-orchestrator`
+
+## Configuration
+
+Uses the **production API** by default. No configuration needed for read operations.
+
+**Defaults (no setup required):**
+
+- API URL: `https://api-gateway-856475788601.us-central1.run.app`
+- Read-only endpoints at `/public/*` require no authentication
+
+**For write operations** (transitions, creating tickets), set:
+
+```bash
+export PIPELINE_API_KEY="..."  # Get from GCP Secret Manager or ask admin
+```
+
+**Optional (for local working artifacts):**
+
+```bash
+PIPELINE_DIR="${PIPELINE_DIR:-$HOME/repos/ticket-to-pr-pipeline}"
+```
+
+## Mandatory API Calls (Execute ALL Three)
+
+**⚠️ These three API calls are the ENTIRE POINT of this skill. Without them, the ticket is invisible to the pipeline, downstream skills will fail, and Notion status won't update.**
+
+**You MUST make these HTTP requests.** Use `curl` from bash — do not just read this as documentation.
+
+### Call 1: Create Ticket
+
+```bash
+API_URL="${PIPELINE_API_URL:-https://api-gateway-856475788601.us-central1.run.app}"
+API_KEY="${PIPELINE_API_KEY}"
+
+curl -s -X POST "${API_URL}/v1/tickets" \
+  -H "Authorization: Bearer ${API_KEY}" \
+  -H "Content-Type: application/json" \
+  -H "X-Agent-ID: ${AGENT_ID:-amp-agent}" \
+  -d '{
+    "notion_page_id": "NOTION_PAGE_UUID_HERE",
+    "title": "TICKET_TITLE_HERE",
+    "source": "notion",
+    "metadata": {
+      "description": "DESCRIPTION_HERE",
+      "priority": "High",
+      "labels": [],
+      "acceptanceCriteria": []
+    }
+  }'
+```
+
+Save the returned `id` — you need it for the next two calls.
+
+### Call 2: Transition to RESEARCH
+
+```bash
+TICKET_ID="id-from-step-1"
+
+curl -s -X POST "${API_URL}/v1/tickets/${TICKET_ID}/transition" \
+  -H "Authorization: Bearer ${API_KEY}" \
+  -H "Content-Type: application/json" \
+  -H "X-Agent-ID: ${AGENT_ID:-amp-agent}" \
+  -d '{
+    "to_state": "RESEARCH",
+    "reason": "Intake complete, starting research"
+  }'
+```
+
+### Call 3: Queue Source Update
+
+```bash
+curl -s -X POST "${API_URL}/v1/sync/queue" \
+  -H "Authorization: Bearer ${API_KEY}" \
+  -H "Content-Type: application/json" \
+  -H "X-Agent-ID: ${AGENT_ID:-amp-agent}" \
+  -d '{
+    "ticket_id": "TICKET_ID_HERE",
+    "action": "update_status",
+    "payload": { "status": "In Progress" },
+    "priority": "normal"
+  }'
+```
+
+> **Note:** The action MUST be `"update_status"` (not `"UPDATE_NOTION_STATUS"`). Valid actions: `update_status`, `update_pr_url`, `mark_done`.
+
+### TypeScript Equivalent (if using pipeline client)
+
+```typescript
+import { PipelineClient } from '@pipeline/client'
+
+const client = new PipelineClient({
+  apiUrl:
+    process.env.PIPELINE_API_URL ||
+    'https://api-gateway-856475788601.us-central1.run.app',
+  agentId: process.env.AGENT_ID!
+})
+
+const ticket = await client.createTicket({
+  notion_page_id: pageId,
+  title: ticketTitle,
+  source: 'notion',
+  metadata: { description, priority, labels, acceptanceCriteria }
+})
+
+await client.transitionState(
+  ticket.id,
+  'RESEARCH',
+  'Intake complete, starting research'
+)
+
+await client.queueSync(ticket.id, 'update_status', { status: 'In Progress' })
+```
+
+## Workflow
+
+### Step 1: Detect Source Type
+
+Parse the URL to determine source:
+
+```javascript
+if (url.includes('notion.so')) {
+  source = 'notion'
+  // Load providers/notion.md
+} else if (url.match(/github\.com\/[^\/]+\/[^\/]+\/issues\/\d+/)) {
+  source = 'github'
+  // Load providers/github.md
+} else {
+  // Error: Unsupported URL format
+}
+```
+
+### Step 2: Load Provider and Fetch Data
+
+Read the appropriate provider file for source-specific instructions:
+
+- **Notion**: `providers/notion.md` - Uses Notion MCP, handles Slack links
+- **GitHub**: `providers/github.md` - Uses `gh` CLI, handles Dosu comments
+
+Follow the provider's instructions for:
+
+- Fetching content
+- Extracting properties
+- **Updating the source** (Notion status → "In Progress", Assignee → pipeline owner)
+
+### Step 3: Normalize to Common Schema
+
+All providers must extract normalized ticket data following `schema.md`:
+
+```json
+{
+  "id": "abc12345",
+  "url": "https://...",
+  "source": "notion | github",
+  "title": "Ticket title",
+  "description": "Full description",
+  "status": "Not Started",
+  "assignee": "username",
+  "priority": "High",
+  "area": "UI",
+  "labels": ["bug", "frontend"],
+  "acceptanceCriteria": ["Criterion 1", "Criterion 2"],
+  "fetchedAt": "2024-01-15T10:30:00Z"
+}
+```
+
+### Step 4: Register Ticket in Pipeline API (MANDATORY — DO NOT SKIP)
+
+**Execute all three API calls from [Mandatory API Calls](#mandatory-api-calls-execute-all-three) above.**
+
+This is not optional. This is not documentation. You MUST make these HTTP requests right now.
+
+1. `createTicket()` → save the returned ticket ID
+2. `transitionState(id, 'RESEARCH')` → confirm state changed
+3. `queueSync(id, 'update_status', { status: 'In Progress' })` → confirm queued
+
+**If any call fails**, retry once. If it still fails, report the error prominently — do NOT silently continue.
+
+### Step 5: Run Verification Script
+
+After making the API calls, run the verification script to confirm everything worked:
+
+```bash
+bash scripts/verify-intake.sh TICKET_ID_OR_NOTION_PAGE_ID
+```
+
+**If the script is not available locally**, verify manually via the public API:
+
+```bash
+curl -s "${API_URL}/public/tickets/${TICKET_ID}" | jq '{id, state, title, notion_page_id}'
+```
+
+Expected output:
+
+```json
+{
+  "id": "...",
+  "state": "RESEARCH",
+  "title": "...",
+  "notion_page_id": "..."
+}
+```
+
+**If `state` is not `RESEARCH`, go back to Step 4 and complete the missing calls.**
+
+### Step 6: Output Summary and Handoff
+
+Print a clear summary:
+
+```markdown
+## Ticket Intake Complete
+
+**Source:** Notion | GitHub
+**Title:** [Ticket title]
+**ID:** abc12345
+**Status:** In Progress (queued)
+**Priority:** High
+**Area:** UI
+
+### Description
+
+[Brief description or first 200 chars]
+
+### Acceptance Criteria
+
+- [ ] Criterion 1
+- [ ] Criterion 2
+
+### Links
+
+- **Ticket:** [Original URL]
+- **Slack:** [Slack thread content fetched via slackdump] (Notion only)
+
+### Pipeline
+
+- **API Ticket ID:** abc12345
+- **State:** RESEARCH
+- **Verified:** ✅ (via verify-intake.sh or public API)
+```
+
+**After printing the summary, immediately handoff** to continue the pipeline. Use the `handoff` tool with all necessary context (ticket ID, source, title, description, slack context if any):
+
+> **Handoff goal:** "Continue pipeline for ticket {ID} ({title}). Ticket is in RESEARCH state. Load skill: `research-orchestrator` to begin research phase. Ticket data: source={source}, notion_page_id={pageId}, priority={priority}. {slack context summary if available}"
+
+**Do NOT wait for human approval to proceed.** The intake phase is complete — handoff immediately.
+
+## Error Handling
+
+### Unsupported URL
+
+```
+❌ Unsupported ticket URL format.
+
+Supported formats:
+- Notion: https://notion.so/... or https://www.notion.so/...
+- GitHub: https://github.com/{owner}/{repo}/issues/{number}
+
+Received: [provided URL]
+```
+
+### Provider-Specific Errors
+
+See individual provider files for source-specific error handling:
+
+- `providers/notion.md` - Authentication, page not found
+- `providers/github.md` - Auth, rate limits, issue not found
+
+### Missing Properties
+
+Continue with available data and note what's missing:
+
+```
+⚠️ Some properties unavailable:
+- Priority: not found (using default: Medium)
+- Area: not found
+
+Proceeding with available data...
+```
+
+### API Call Failures
+
+```
+❌ Pipeline API call failed: {method} {endpoint}
+   Status: {status}
+   Error: {message}
+
+Retrying once...
+
+❌ Retry also failed. INTAKE IS INCOMPLETE.
+   The ticket was NOT registered in the pipeline.
+   Downstream skills will not work until this is fixed.
+```
+
+## Notes
+
+- This skill focuses ONLY on intake — it does not do research
+- Slack thread content is fetched automatically via the `slackdump` skill — no manual copy-paste needed
+- ALL API calls (createTicket, transitionState, queueSync) are MANDATORY — never skip them
+- The `queueSync` action must be `"update_status"`, NOT `"UPDATE_NOTION_STATUS"`
+- Pipeline state is tracked via the API, not local files
+- Working artifacts (research-report.md, plan.md) can be saved locally to `$PIPELINE_DIR/runs/{ticket-id}/`
+- The `source` field in the ticket determines which research strategies to use
+
+## API Client Reference
+
+### Available Methods
+
+| Method                                                      | Description                                                         |
+| ----------------------------------------------------------- | ------------------------------------------------------------------- |
+| `createTicket({ notion_page_id, title, source, metadata })` | Create a new ticket in the API                                      |
+| `getTicket(id)`                                             | Retrieve a ticket by ID                                             |
+| `findByNotionId(notionPageId)`                              | Look up a ticket by its Notion page ID                              |
+| `listTickets({ state, agent_id, limit, offset })`           | List tickets with optional filters                                  |
+| `transitionState(id, state, reason)`                        | Move ticket to a new state (e.g., `'RESEARCH'`)                     |
+| `setPRCreated(id, prUrl)`                                   | Mark ticket as having a PR created                                  |
+| `queueSync(id, action, payload)`                            | Queue a sync action (`update_status`, `update_pr_url`, `mark_done`) |
+| `registerBranch(id, branch, repo)`                          | Register working branch for automatic PR detection                  |
+
+### Error Handling
+
+```typescript
+import { PipelineClient, PipelineAPIError } from '@pipeline/client';
+
+try {
+  await client.createTicket({ ... });
+} catch (error) {
+  if (error instanceof PipelineAPIError) {
+    console.error(`API Error ${error.status}: ${error.message}`);
+  }
+  throw error;
+}
+```

.claude/skills/ticket-intake/providers/github.md

@@ -0,0 +1,194 @@
+# GitHub Provider - Ticket Intake
+
+Provider-specific logic for ingesting tickets from GitHub Issues.
+
+## URL Pattern
+
+```
+https://github.com/{owner}/{repo}/issues/{number}
+https://www.github.com/{owner}/{repo}/issues/{number}
+```
+
+Extract: `owner`, `repo`, `issue_number` from URL.
+
+## Prerequisites
+
+- `gh` CLI authenticated (`gh auth status`)
+- Access to the repository
+
+## Fetch Issue Content
+
+Use `gh` CLI to fetch issue details:
+
+```bash
+# Get issue details in JSON
+gh issue view {number} --repo {owner}/{repo} --json title,body,state,labels,assignees,milestone,author,createdAt,comments,linkedPRs
+
+# Get comments separately if needed
+gh issue view {number} --repo {owner}/{repo} --comments
+```
+
+## Extract Ticket Data
+
+Map GitHub issue fields to normalized ticket data (stored via API):
+
+| GitHub Field | ticket.json Field | Notes                      |
+| ------------ | ----------------- | -------------------------- |
+| title        | title             | Direct mapping             |
+| body         | description       | Issue body/description     |
+| state        | status            | Map: open → "Not Started"  |
+| labels       | labels            | Array of label names       |
+| assignees    | assignee          | First assignee login       |
+| author       | author            | Issue author login         |
+| milestone    | milestone         | Milestone title if present |
+| comments     | comments          | Array of comment objects   |
+| linkedPRs    | linkedPRs         | PRs linked to this issue   |
+
+### Priority Mapping
+
+Infer priority from labels:
+
+- `priority:critical`, `P0` → "Critical"
+- `priority:high`, `P1` → "High"
+- `priority:medium`, `P2` → "Medium"
+- `priority:low`, `P3` → "Low"
+- No priority label → "Medium" (default)
+
+### Area Mapping
+
+Infer area from labels:
+
+- `area:ui`, `frontend`, `component:*` → "UI"
+- `area:api`, `backend` → "API"
+- `area:docs`, `documentation` → "Docs"
+- `bug`, `fix` → "Bug"
+- `enhancement`, `feature` → "Feature"
+
+## Update Source
+
+**For GitHub issues, update is optional but recommended.**
+
+Add a comment to indicate work has started:
+
+```bash
+gh issue comment {number} --repo {owner}/{repo} --body "🤖 Pipeline started processing this issue."
+```
+
+Optionally assign to self:
+
+```bash
+gh issue edit {number} --repo {owner}/{repo} --add-assignee @me
+```
+
+Log any updates via the Pipeline API:
+
+```typescript
+await client.updateTicket(ticketId, {
+  metadata: {
+    ...ticket.metadata,
+    githubWrites: [
+      ...(ticket.metadata?.githubWrites || []),
+      {
+        action: 'comment',
+        issueNumber: 123,
+        at: new Date().toISOString(),
+        skill: 'ticket-intake',
+        success: true
+      }
+    ]
+  }
+})
+```
+
+## GitHub-Specific Ticket Fields
+
+Store via API using `client.createTicket()`:
+
+```json
+{
+  "source": "github",
+  "githubOwner": "Comfy-Org",
+  "githubRepo": "ComfyUI_frontend",
+  "githubIssueNumber": 123,
+  "githubIssueUrl": "https://github.com/Comfy-Org/ComfyUI_frontend/issues/123",
+  "labels": ["bug", "area:ui", "priority:high"],
+  "linkedPRs": [456, 789],
+  "dosuComment": "..." // Extracted Dosu bot analysis if present
+}
+```
+
+## Dosu Bot Detection
+
+Many repositories use Dosu bot for automated issue analysis. Check comments for Dosu:
+
+```bash
+gh issue view {number} --repo {owner}/{repo} --comments | grep -A 100 "dosu"
+```
+
+Look for comments from:
+
+- `dosu[bot]`
+- `dosu-bot`
+
+Extract Dosu analysis which typically includes:
+
+- Root cause analysis
+- Suggested files to modify
+- Related issues/PRs
+- Potential solutions
+
+Store in ticket data via API:
+
+```json
+{
+  "dosuComment": {
+    "found": true,
+    "analysis": "...",
+    "suggestedFiles": ["src/file1.ts", "src/file2.ts"],
+    "relatedIssues": [100, 101]
+  }
+}
+```
+
+## Extract Linked Issues/PRs
+
+Parse issue body and comments for references:
+
+- `#123` → Issue or PR reference
+- `fixes #123`, `closes #123` → Linked issue
+- `https://github.com/.../issues/123` → Full URL reference
+
+Store in ticket data via API for research phase:
+
+```json
+{
+  "referencedIssues": [100, 101, 102],
+  "referencedPRs": [200, 201]
+}
+```
+
+## Error Handling
+
+### Authentication Error
+
+```
+⚠️ GitHub CLI not authenticated.
+Run: gh auth login
+```
+
+### Issue Not Found
+
+```
+❌ GitHub issue not found or inaccessible.
+- Check the URL is correct
+- Ensure you have access to this repository
+- Run: gh auth status
+```
+
+### Rate Limiting
+
+```
+⚠️ GitHub API rate limited.
+Wait a few minutes and try again.
+Check status: gh api rate_limit
+```

.claude/skills/ticket-intake/providers/notion.md

@@ -0,0 +1,202 @@
+# Notion Provider - Ticket Intake
+
+Provider-specific logic for ingesting tickets from Notion.
+
+## URL Pattern
+
+```
+https://www.notion.so/workspace/Page-Title-abc123def456...
+https://notion.so/Page-Title-abc123def456...
+https://www.notion.so/abc123def456...
+```
+
+Page ID is the 32-character hex string (with or without hyphens).
+
+## Prerequisites
+
+- Notion MCP connected and authenticated
+- If not setup: `claude mcp add --transport http notion https://mcp.notion.com/mcp`
+- Authenticate via `/mcp` command if prompted
+
+## Fetch Ticket Content
+
+Use `Notion:notion-fetch` with the page URL or ID:
+
+```
+Fetch the full page content including all properties
+```
+
+## Extract Ticket Data
+
+Extract these properties (names may vary):
+
+| Property      | Expected Name             | Type         |
+| ------------- | ------------------------- | ------------ |
+| Title         | Name / Title              | Title        |
+| Status        | Status                    | Select       |
+| Assignee      | Assignee / Assigned To    | Person       |
+| Description   | -                         | Page content |
+| Slack Link    | Slack Link / Slack Thread | URL          |
+| GitHub PR     | GitHub PR / PR Link       | URL          |
+| Priority      | Priority                  | Select       |
+| Area          | Area / Category           | Select       |
+| Related Tasks | Related Tasks             | Relation     |
+
+**If properties are missing**: Note what's unavailable and continue with available data.
+
+## Update Source (REQUIRED)
+
+**⚠️ DO NOT SKIP THIS STEP. This is a required action, not optional.**
+
+**⚠️ Notion Write Safety rules apply (see `$PIPELINE_DIR/docs/notion-write-safety.md` for full reference):**
+
+- **Whitelist**: Only `Status`, `GitHub PR`, and `Assignee` fields may be written
+- **Valid transitions**: Not Started → In Progress, In Progress → In Review, In Review → Done
+- **Logging**: Every write attempt MUST be logged with timestamp, field, value, previous value, skill name, and success status
+
+Use `Notion:notion-update-page` to update the ticket:
+
+1. **Status**: Set to "In Progress" (only valid from "Not Started")
+2. **Assignee**: Assign to pipeline owner (Notion ID: `175d872b-594c-81d4-ba5a-0002911c5966`)
+
+```json
+{
+  "page_id": "{page_id_from_ticket}",
+  "command": "update_properties",
+  "properties": {
+    "Status": "In Progress",
+    "Assignee": "175d872b-594c-81d4-ba5a-0002911c5966"
+  }
+}
+```
+
+**After the update succeeds**, log the write via the Pipeline API:
+
+```typescript
+await client.updateTicket(ticketId, {
+  metadata: {
+    ...ticket.metadata,
+    notionWrites: [
+      ...(ticket.metadata?.notionWrites || []),
+      {
+        field: 'Status',
+        value: 'In Progress',
+        previousValue: 'Not Started',
+        at: new Date().toISOString(),
+        skill: 'ticket-intake',
+        success: true
+      }
+    ]
+  }
+})
+```
+
+If update fails, log with `success: false` and continue.
+
+## Notion-Specific Ticket Fields
+
+Store via API using `client.createTicket()`:
+
+```json
+{
+  "source": "notion",
+  "notionPageId": "abc123def456...",
+  "slackLink": "https://slack.com/...",
+  "relatedTasks": ["page-id-1", "page-id-2"]
+}
+```
+
+## Slack Thread Handling
+
+If a Slack link exists, use the `slackdump` skill to fetch the thread content programmatically.
+
+### Slack URL Conversion
+
+Notion stores Slack links in `slackMessage://` format:
+
+```
+slackMessage://comfy-organization.slack.com/CHANNEL_ID/THREAD_TS/MESSAGE_TS
+```
+
+Convert to browser-clickable format:
+
+```
+https://comfy-organization.slack.com/archives/CHANNEL_ID/pMESSAGE_TS_NO_DOT
+```
+
+**Example:**
+
+- Input: `slackMessage://comfy-organization.slack.com/C075ANWQ8KS/1766022478.450909/1764772881.854829`
+- Output: `https://comfy-organization.slack.com/archives/C075ANWQ8KS/p1764772881854829`
+
+(Remove the dot from the last timestamp and prefix with `p`)
+
+### Fetching Thread Content
+
+Load the `slackdump` skill and use the **export-thread** workflow:
+
+```bash
+# Export thread by URL
+slackdump dump "https://comfy-organization.slack.com/archives/CHANNEL_ID/pMESSAGE_TS"
+
+# Or by colon notation (channel_id:thread_ts)
+slackdump dump CHANNEL_ID:THREAD_TS
+```
+
+Save the thread content to `$RUN_DIR/slack-context.md` and include it in the ticket metadata.
+
+> **No manual action required.** The slackdump CLI handles authentication via stored credentials at `~/.cache/slackdump/comfy-organization.bin`.
+
+## Database Reference: Comfy Tasks
+
+The "Comfy Tasks" database has these properties (verify via `notion-search`):
+
+- **Status values**: Not Started, In Progress, In Review, Done
+- **Team assignment**: "Frontend Team" for unassigned tickets
+- **Filtering note**: Team filtering in Notion may have quirks - handle gracefully
+
+### Pipeline Owner Details
+
+When assigning tickets, use these identifiers:
+
+| Platform        | Identifier                             |
+| --------------- | -------------------------------------- |
+| Notion User ID  | `175d872b-594c-81d4-ba5a-0002911c5966` |
+| Notion Name     | Christian Byrne                        |
+| Notion Email    | cbyrne@comfy.org                       |
+| Slack User ID   | U087MJCDHHC                            |
+| GitHub Username | christian-byrne                        |
+
+**To update Assignee**, use the Notion User ID (not name):
+
+```
+properties: {"Assignee": "175d872b-594c-81d4-ba5a-0002911c5966"}
+```
+
+### Finding Active Tickets
+
+To list your active tickets:
+
+```
+Use Notion:notion-search for "Comfy Tasks"
+Filter by Assignee = current user OR Team = "Frontend Team"
+```
+
+## Error Handling
+
+### Authentication Error
+
+```
+⚠️ Notion authentication required.
+Run: claude mcp add --transport http notion https://mcp.notion.com/mcp
+Then authenticate via /mcp command.
+```
+
+### Page Not Found
+
+```
+❌ Notion page not found or inaccessible.
+- Check the URL is correct
+- Ensure you have access to this page
+- Try re-authenticating via /mcp
+```

.claude/skills/ticket-intake/schema.md

@@ -0,0 +1,81 @@
+# Ticket Schema
+
+Common schema for normalized ticket data across all sources. This data is stored and retrieved via the Pipeline API, not local files.
+
+## Ticket Data Schema
+
+```json
+{
+  // Required fields (all sources)
+  "id": "string", // Unique identifier (short form)
+  "url": "string", // Original URL
+  "source": "notion | github", // Source type
+  "title": "string", // Ticket title
+  "description": "string", // Full description/body
+  "fetchedAt": "ISO8601", // When ticket was fetched
+
+  // Common optional fields
+  "status": "string", // Current status
+  "assignee": "string", // Assigned user
+  "priority": "string", // Priority level
+  "area": "string", // Category/area
+  "labels": ["string"], // Tags/labels
+  "acceptanceCriteria": ["string"] // List of AC items
+
+  // Source-specific fields (see providers)
+  // Notion: notionPageId, slackLink, relatedTasks, notionWrites
+  // GitHub: githubOwner, githubRepo, githubIssueNumber, linkedPRs, dosuComment, referencedIssues
+}
+```
+
+## Ticket State Schema (via API)
+
+State is managed via the Pipeline API using `client.transitionState()`:
+
+```json
+{
+  "ticketId": "string",
+  "state": "intake | research | planning | implementation | pr_created | done | failed",
+  "stateChangedAt": "ISO8601",
+
+  // Timestamps tracked by API
+  "createdAt": "ISO8601",
+  "updatedAt": "ISO8601"
+}
+```
+
+## Priority Normalization
+
+All sources should normalize to these values:
+
+| Normalized | Description               |
+| ---------- | ------------------------- |
+| Critical   | Production down, security |
+| High       | Blocking work, urgent     |
+| Medium     | Normal priority (default) |
+| Low        | Nice to have, backlog     |
+
+## Status Normalization
+
+Pipeline tracks these statuses internally:
+
+| Status         | Description                  |
+| -------------- | ---------------------------- |
+| research       | Gathering context            |
+| planning       | Creating implementation plan |
+| implementation | Writing code                 |
+| review         | Code review in progress      |
+| qa             | Quality assurance            |
+| done           | PR merged or completed       |
+
+## ID Generation
+
+IDs are generated by the API when creating tickets. For reference:
+
+- **Notion**: First 8 characters of page ID
+- **GitHub**: `gh-{owner}-{repo}-{issue_number}` (sanitized)
+
+Examples:
+
+- Notion: `abc12345`
+- GitHub: `gh-comfy-org-frontend-123`

.github/actions/lint-format-verify/action.yml

@@ -1,31 +0,0 @@
-name: 'Lint and format verify'
-description: >
-  Runs the lint/format/knip verification suite plus a conditional
-  browser-tests typecheck. Shared by ci-lint-format.yaml (PR) and
-  ci-lint-format-queue.yaml (merge queue) so both paths run the exact
-  same checks. The caller is responsible for checkout and frontend setup
-  before invoking this action.
-
-runs:
-  using: composite
-  steps:
-    - name: Detect browser_tests changes
-      id: changed-paths
-      uses: dorny/paths-filter@de90cc6fb38fc0963ad72b210f1f284cd68cea36 # v3.0.2
-      with:
-        filters: |
-          browser_tests:
-            - 'browser_tests/**'
-
-    - name: Verify lint and format
-      shell: bash
-      run: |
-        pnpm lint
-        pnpm stylelint
-        pnpm format:check
-        pnpm knip
-
-    - name: Typecheck browser tests
-      if: steps.changed-paths.outputs.browser_tests == 'true'
-      shell: bash
-      run: pnpm typecheck:browser

.github/workflows/ci-lint-format-queue.yaml

@@ -1,29 +0,0 @@
-# Description: Lint and format verification for GitHub merge queue runs.
-# Paired with ci-lint-format.yaml — workflow name and job name must match
-# so branch protection resolves a single required check in both the
-# pull_request and merge_group contexts. This file runs verify-only steps
-# with a read-only token; auto-fix and PR comments live in the PR workflow.
-name: 'CI: Lint Format'
-
-on:
-  merge_group:
-
-concurrency:
-  group: ${{ github.workflow }}-${{ github.ref }}
-  cancel-in-progress: true
-
-permissions:
-  contents: read
-
-jobs:
-  lint-and-format:
-    runs-on: ubuntu-latest
-    steps:
-      - name: Checkout merge group ref
-        uses: actions/checkout@v6
-
-      - name: Setup frontend
-        uses: ./.github/actions/setup-frontend
-
-      - name: Verify lint and format
-        uses: ./.github/actions/lint-format-verify

.github/workflows/ci-lint-format.yaml

@@ -1,7 +1,4 @@
-# Description: Linting and code formatting validation for pull requests.
-# Paired with ci-lint-format-queue.yaml - workflow name and job name must
-# match so branch protection resolves a single required check in both the
-# pull_request and merge_group contexts.
+# Description: Linting and code formatting validation for pull requests
 name: 'CI: Lint Format'
 
 on:
@@ -29,6 +26,14 @@ jobs:
       - name: Setup frontend
         uses: ./.github/actions/setup-frontend
 
+      - name: Detect browser_tests changes
+        id: changed-paths
+        uses: dorny/paths-filter@de90cc6fb38fc0963ad72b210f1f284cd68cea36 # v3.0.2
+        with:
+          filters: |
+            browser_tests:
+              - 'browser_tests/**'
+
       - name: Run ESLint with auto-fix
         run: pnpm lint:fix
 
@@ -72,8 +77,16 @@ jobs:
           echo "See CONTRIBUTING.md for more details."
           exit 1
 
-      - name: Verify lint and format
-        uses: ./.github/actions/lint-format-verify
+      - name: Final validation
+        run: |
+          pnpm lint
+          pnpm stylelint
+          pnpm format:check
+          pnpm knip
+
+      - name: Typecheck browser tests
+        if: steps.changed-paths.outputs.browser_tests == 'true'
+        run: pnpm typecheck:browser
 
       - name: Comment on PR about auto-fix
         if: steps.verify-changed-files.outputs.changed == 'true' && github.event.pull_request.head.repo.full_name == github.repository

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

@@ -8,7 +8,6 @@ on:
   pull_request:
     branches-ignore: [wip/*, draft/*, temp/*]
     paths-ignore: ['**/*.md']
-  merge_group:
   workflow_dispatch:
 
 concurrency:

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

@@ -8,7 +8,6 @@ on:
   pull_request:
     branches-ignore: [wip/*, draft/*, temp/*]
     paths-ignore: ['**/*.md']
-  merge_group:
 
 concurrency:
   group: ${{ github.workflow }}-${{ github.ref }}

AGENTS.md

@@ -318,9 +318,6 @@ When referencing Comfy-Org repos:
   - Find existing `!important` classes that are interfering with the styling and propose corrections of those instead.
 - NEVER use arbitrary percentage values like `w-[80%]` when a Tailwind fraction utility exists
   - Use `w-4/5` instead of `w-[80%]`, `w-1/2` instead of `w-[50%]`, etc.
-- NEVER use font-size classes (`text-xs`, `text-sm`, etc.) to size `icon-[...]` (iconify) icons
-  - Iconify icons size via `width`/`height: 1.2em`, so font-size produces unpredictable results
-  - Use `size-*` classes for explicit sizing, or set font-size on the **parent** container and let `1.2em` scale naturally
 
 ## Agent-only rules
 

apps/website/src/components/AcademySection.vue

@@ -17,7 +17,7 @@ const features = computed(() => [
     <div class="mx-auto max-w-3xl px-6 text-center">
       <!-- Badge -->
       <span
-        class="inline-block rounded-full bg-brand-yellow/10 px-4 py-1.5 text-xs tracking-widest text-brand-yellow uppercase"
+        class="inline-block rounded-full bg-brand-yellow/10 px-4 py-1.5 text-xs uppercase tracking-widest text-brand-yellow"
       >
         {{ t('academy.badge', locale) }}
       </span>

apps/website/src/components/GetStartedSection.vue

@@ -40,7 +40,7 @@ const steps = computed(() => [
           <!-- Connecting line between steps (desktop only) -->
           <div
             v-if="index < steps.length - 1"
-            class="absolute top-8 right-0 hidden w-full translate-x-1/2 border-t border-brand-yellow/20 md:block"
+            class="absolute right-0 top-8 hidden w-full translate-x-1/2 border-t border-brand-yellow/20 md:block"
           />
 
           <div class="relative">

apps/website/src/components/HeroSection.vue

@@ -31,11 +31,11 @@ const ctaButtons = computed(() => [
       <div class="flex w-full items-center justify-center md:w-[55%]">
         <div class="relative -ml-12 -rotate-15 md:-ml-24" aria-hidden="true">
           <div
-            class="size-64 rounded-full border-40 border-brand-yellow md:h-112 md:w-md md:border-64 lg:h-144 lg:w-xl lg:border-80"
+            class="h-64 w-64 rounded-full border-[40px] border-brand-yellow md:h-[28rem] md:w-[28rem] md:border-[64px] lg:h-[36rem] lg:w-[36rem] lg:border-[80px]"
           >
             <!-- Gap on the right side to form "C" shape -->
             <div
-              class="absolute top-1/2 right-0 h-32 w-24 translate-x-1/2 -translate-y-1/2 bg-black md:h-48 md:w-36 lg:h-64 lg:w-48"
+              class="absolute right-0 top-1/2 h-32 w-24 -translate-y-1/2 translate-x-1/2 bg-black md:h-48 md:w-36 lg:h-64 lg:w-48"
             />
           </div>
         </div>
@@ -44,7 +44,7 @@ const ctaButtons = computed(() => [
       <!-- Right: Text content -->
       <div class="flex w-full flex-col items-start md:w-[45%]">
         <h1
-          class="text-5xl/tight font-bold tracking-tight text-white md:text-6xl lg:text-7xl"
+          class="text-5xl font-bold leading-tight tracking-tight text-white md:text-6xl lg:text-7xl"
         >
           {{ t('hero.headline', locale) }}
         </h1>

apps/website/src/components/ManifestoSection.vue

@@ -17,7 +17,7 @@ const { locale = 'en' } = defineProps<{ locale?: Locale }>()
         {{ t('manifesto.heading', locale) }}
       </h2>
 
-      <p class="mx-auto mt-6 max-w-2xl text-lg/relaxed text-smoke-700">
+      <p class="mx-auto mt-6 max-w-2xl text-lg leading-relaxed text-smoke-700">
         {{ t('manifesto.body', locale) }}
       </p>
 

apps/website/src/components/ProductShowcase.vue

@@ -33,11 +33,11 @@ const features = computed(() => [
         <div class="flex flex-col items-center gap-4">
           <!-- Play button triangle -->
           <div
-            class="flex size-16 items-center justify-center rounded-full border-2 border-white/20"
+            class="flex h-16 w-16 items-center justify-center rounded-full border-2 border-white/20"
             aria-hidden="true"
           >
             <div
-              class="ml-1 size-0 border-y-8 border-l-14 border-y-transparent border-l-white"
+              class="ml-1 h-0 w-0 border-y-8 border-l-[14px] border-y-transparent border-l-white"
             />
           </div>
           <p class="text-sm text-smoke-700">
@@ -54,7 +54,7 @@ const features = computed(() => [
           class="flex items-center gap-2"
         >
           <span
-            class="size-2 rounded-full bg-brand-yellow"
+            class="h-2 w-2 rounded-full bg-brand-yellow"
             aria-hidden="true"
           />
           <span class="text-sm text-smoke-700">{{ feature }}</span>

apps/website/src/components/SocialProofBar.vue

@@ -32,7 +32,7 @@ const metrics = computed(() => [
     <div class="mx-auto max-w-7xl px-6">
       <!-- Heading -->
       <p
-        class="text-center text-xs font-medium tracking-widest text-smoke-700 uppercase"
+        class="text-center text-xs font-medium uppercase tracking-widest text-smoke-700"
       >
         {{ t('social.heading', locale) }}
       </p>

apps/website/src/components/TestimonialsSection.vue

@@ -90,7 +90,7 @@ const filteredTestimonials = computed(() => {
           :key="testimonial.name"
           class="rounded-xl border border-white/10 bg-charcoal-600 p-6"
         >
-          <blockquote class="text-base text-white italic">
+          <blockquote class="text-base italic text-white">
             &ldquo;{{ testimonial.quote }}&rdquo;
           </blockquote>
 

apps/website/src/components/UseCaseSection.vue

@@ -24,12 +24,12 @@ const activeCategory = ref(0)
         <!-- Left placeholder image (desktop only) -->
         <div class="hidden flex-1 lg:block">
           <div
-            class="aspect-2/3 rounded-full border border-white/10 bg-charcoal-600"
+            class="aspect-[2/3] rounded-full border border-white/10 bg-charcoal-600"
           />
         </div>
 
         <!-- Center content -->
-        <div class="flex flex-col items-center text-center lg:flex-2">
+        <div class="flex flex-col items-center text-center lg:flex-[2]">
           <h2 class="text-3xl font-bold text-white">
             {{ t('useCase.heading', locale) }}
           </h2>
@@ -70,7 +70,7 @@ const activeCategory = ref(0)
         <!-- Right placeholder image (desktop only) -->
         <div class="hidden flex-1 lg:block">
           <div
-            class="aspect-2/3 rounded-3xl border border-white/10 bg-charcoal-600"
+            class="aspect-[2/3] rounded-3xl border border-white/10 bg-charcoal-600"
           />
         </div>
       </div>

apps/website/src/components/ValuePillars.vue

@@ -53,7 +53,7 @@ const pillars = computed(() => [
           class="rounded-xl border border-white/10 bg-charcoal-600 p-6 transition-colors hover:border-brand-yellow"
         >
           <div
-            class="flex size-12 items-center justify-center rounded-full bg-brand-yellow text-xl"
+            class="flex h-12 w-12 items-center justify-center rounded-full bg-brand-yellow text-xl"
           >
             {{ pillar.icon }}
           </div>

browser_tests/AGENTS.md

@@ -40,39 +40,6 @@ browser_tests/
 - **`fixtures/helpers/`** — Focused helper classes. Domain-specific actions that coordinate multiple page objects (e.g. canvas operations, workflow loading).
 - **`fixtures/utils/`** — Pure utility functions. No `Page` dependency; stateless helpers that can be used anywhere.
 
-## Page Object Locator Style
-
-Define UI element locators as `public readonly` properties assigned in the constructor — not as getter methods. Getters that simply return a locator add unnecessary indirection and hide the object shape from IDE auto-complete.
-
-```typescript
-// ✅ Correct — public readonly, assigned in constructor
-export class MyDialog extends BaseDialog {
-  public readonly submitButton: Locator
-  public readonly cancelButton: Locator
-
-  constructor(page: Page) {
-    super(page)
-    this.submitButton = this.root.getByRole('button', { name: 'Submit' })
-    this.cancelButton = this.root.getByRole('button', { name: 'Cancel' })
-  }
-}
-
-// ❌ Avoid — getter-based locators
-export class MyDialog extends BaseDialog {
-  get submitButton() {
-    return this.root.getByRole('button', { name: 'Submit' })
-  }
-}
-```
-
-**Keep as getters only when:**
-
-- Lazy initialization is needed (`this._tab ??= new Tab(this.page)`)
-- The value is computed from runtime state (e.g. `get id() { return this.userIds[index] }`)
-- It's a private convenience accessor (e.g. `private get page() { return this.comfyPage.page }`)
-
-When a class has cached locator properties, prefer reusing them in methods rather than rebuilding locators from scratch.
-
 ## Polling Assertions
 
 Prefer `expect.poll()` over `expect(async () => { ... }).toPass()` when the block contains a single async call with a single assertion. `expect.poll()` is more readable and gives better error messages (shows actual vs expected on failure).

browser_tests/fixtures/ComfyMouse.ts

@@ -26,10 +26,11 @@ export class ComfyMouse implements Omit<Mouse, 'move'> {
   static defaultSteps = 5
   static defaultOptions: DragOptions = { steps: ComfyMouse.defaultSteps }
 
-  readonly mouse: Mouse
+  constructor(readonly comfyPage: ComfyPage) {}
 
-  constructor(readonly comfyPage: ComfyPage) {
-    this.mouse = comfyPage.page.mouse
+  /** The normal Playwright {@link Mouse} property from {@link ComfyPage.page}. */
+  get mouse() {
+    return this.comfyPage.page.mouse
   }
 
   async nextFrame() {

browser_tests/fixtures/ComfyPage.ts

@@ -73,13 +73,15 @@ class ComfyMenu {
   public readonly sideToolbar: Locator
   public readonly propertiesPanel: ComfyPropertiesPanel
   public readonly modeToggleButton: Locator
-  public readonly buttons: Locator
 
   constructor(public readonly page: Page) {
     this.sideToolbar = page.getByTestId(TestIds.sidebar.toolbar)
     this.modeToggleButton = page.getByTestId(TestIds.sidebar.modeToggle)
     this.propertiesPanel = new ComfyPropertiesPanel(page)
-    this.buttons = this.sideToolbar.locator('.side-bar-button')
+  }
+
+  get buttons() {
+    return this.sideToolbar.locator('.side-bar-button')
   }
 
   get modelLibraryTab() {
@@ -181,7 +183,6 @@ export class ComfyPage {
   public readonly assetApi: AssetHelper
   public readonly modelLibrary: ModelLibraryHelper
   public readonly cloudAuth: CloudAuthHelper
-  public readonly visibleToasts: Locator
 
   /** Worker index to test user ID */
   public readonly userIds: string[] = []
@@ -224,7 +225,6 @@ export class ComfyPage {
     this.workflow = new WorkflowHelper(this)
     this.contextMenu = new ContextMenu(page)
     this.toast = new ToastHelper(page)
-    this.visibleToasts = this.toast.visibleToasts
     this.dragDrop = new DragDropHelper(page)
     this.featureFlags = new FeatureFlagHelper(page)
     this.command = new CommandHelper(page)
@@ -237,6 +237,10 @@ export class ComfyPage {
     this.cloudAuth = new CloudAuthHelper(page)
   }
 
+  get visibleToasts() {
+    return this.toast.visibleToasts
+  }
+
   async setupUser(username: string) {
     const res = await this.request.get(`${this.url}/api/users`)
     if (res.status() !== 200)

browser_tests/fixtures/UserSelectPage.ts

@@ -1,22 +1,30 @@
-import type { Locator, Page } from '@playwright/test'
+import type { Page } from '@playwright/test'
 import { test as base } from '@playwright/test'
 
 export class UserSelectPage {
-  public readonly selectionUrl: string
-  public readonly container: Locator
-  public readonly newUserInput: Locator
-  public readonly existingUserSelect: Locator
-  public readonly nextButton: Locator
-
   constructor(
     public readonly url: string,
     public readonly page: Page
-  ) {
-    this.selectionUrl = url + '/user-select'
-    this.container = page.locator('#comfy-user-selection')
-    this.newUserInput = this.container.locator('#new-user-input')
-    this.existingUserSelect = this.container.locator('#existing-user-select')
-    this.nextButton = this.container.getByText('Next')
+  ) {}
+
+  get selectionUrl() {
+    return this.url + '/user-select'
+  }
+
+  get container() {
+    return this.page.locator('#comfy-user-selection')
+  }
+
+  get newUserInput() {
+    return this.container.locator('#new-user-input')
+  }
+
+  get existingUserSelect() {
+    return this.container.locator('#existing-user-select')
+  }
+
+  get nextButton() {
+    return this.container.getByText('Next')
   }
 }
 

browser_tests/fixtures/VueNodeHelpers.ts

@@ -7,20 +7,13 @@ import { TestIds } from '@e2e/fixtures/selectors'
 import { VueNodeFixture } from '@e2e/fixtures/utils/vueNodeFixtures'
 
 export class VueNodeHelpers {
+  constructor(private page: Page) {}
+
   /**
    * Get locator for all Vue node components in the DOM
    */
-  public readonly nodes: Locator
-  /**
-   * Get locator for selected Vue node components (using visual selection indicators)
-   */
-  public readonly selectedNodes: Locator
-
-  constructor(private page: Page) {
-    this.nodes = page.locator('[data-node-id]')
-    this.selectedNodes = page.locator(
-      '[data-node-id].outline-node-component-outline'
-    )
+  get nodes(): Locator {
+    return this.page.locator('[data-node-id]')
   }
 
   /**
@@ -30,6 +23,13 @@ export class VueNodeHelpers {
     return this.page.locator(`[data-node-id="${nodeId}"]`)
   }
 
+  /**
+   * Get locator for selected Vue node components (using visual selection indicators)
+   */
+  get selectedNodes(): Locator {
+    return this.page.locator('[data-node-id].outline-node-component-outline')
+  }
+
   /**
    * Get locator for Vue nodes by the node's title (displayed name in the header).
    * Matches against the actual title element, not the full node body.

browser_tests/fixtures/components/ComfyNodeSearchBox.ts

@@ -3,11 +3,13 @@ import type { Locator, Page } from '@playwright/test'
 
 export class ComfyNodeSearchFilterSelectionPanel {
   readonly root: Locator
-  readonly header: Locator
 
   constructor(public readonly page: Page) {
     this.root = page.getByRole('dialog')
-    this.header = this.root
+  }
+
+  get header() {
+    return this.root
       .locator('div')
       .filter({ hasText: 'Add node filter condition' })
   }
@@ -39,8 +41,6 @@ export class ComfyNodeSearchFilterSelectionPanel {
 export class ComfyNodeSearchBox {
   public readonly input: Locator
   public readonly dropdown: Locator
-  public readonly filterButton: Locator
-  public readonly filterChips: Locator
   public readonly filterSelectionPanel: ComfyNodeSearchFilterSelectionPanel
 
   constructor(public readonly page: Page) {
@@ -50,15 +50,13 @@ export class ComfyNodeSearchBox {
     this.dropdown = page.locator(
       '.comfy-vue-node-search-container .p-autocomplete-list'
     )
-    this.filterButton = page.locator(
-      '.comfy-vue-node-search-container .filter-button'
-    )
-    this.filterChips = page.locator(
-      '.comfy-vue-node-search-container .p-autocomplete-chip-item'
-    )
     this.filterSelectionPanel = new ComfyNodeSearchFilterSelectionPanel(page)
   }
 
+  get filterButton() {
+    return this.page.locator('.comfy-vue-node-search-container .filter-button')
+  }
+
   async fillAndSelectFirstNode(
     nodeName: string,
     options?: { suggestionIndex?: number; exact?: boolean }
@@ -80,6 +78,12 @@ export class ComfyNodeSearchBox {
     await this.filterSelectionPanel.addFilter(filterValue, filterType)
   }
 
+  get filterChips() {
+    return this.page.locator(
+      '.comfy-vue-node-search-container .p-autocomplete-chip-item'
+    )
+  }
+
   async removeFilter(index: number) {
     await this.filterChips.nth(index).locator('.p-chip-remove-icon').click()
   }

browser_tests/fixtures/components/ContextMenu.ts

@@ -2,14 +2,18 @@ import { expect } from '@playwright/test'
 import type { Locator, Page } from '@playwright/test'
 
 export class ContextMenu {
-  public readonly primeVueMenu: Locator
-  public readonly litegraphMenu: Locator
-  public readonly menuItems: Locator
+  constructor(public readonly page: Page) {}
 
-  constructor(public readonly page: Page) {
-    this.primeVueMenu = page.locator('.p-contextmenu, .p-menu')
-    this.litegraphMenu = page.locator('.litemenu')
-    this.menuItems = page.locator('.p-menuitem, .litemenu-entry')
+  get primeVueMenu() {
+    return this.page.locator('.p-contextmenu, .p-menu')
+  }
+
+  get litegraphMenu() {
+    return this.page.locator('.litemenu')
+  }
+
+  get menuItems() {
+    return this.page.locator('.p-menuitem, .litemenu-entry')
   }
 
   async clickMenuItem(name: string): Promise<void> {

browser_tests/fixtures/components/OutputHistory.ts

@@ -1,97 +0,0 @@
-import type { Locator, Page } from '@playwright/test'
-
-import { TestIds } from '../selectors'
-
-const ids = TestIds.outputHistory
-
-export class OutputHistoryComponent {
-  constructor(private readonly page: Page) {}
-
-  get outputs(): Locator {
-    return this.page.getByTestId(ids.outputs)
-  }
-
-  get welcome(): Locator {
-    return this.page.getByTestId(ids.welcome)
-  }
-
-  get outputInfo(): Locator {
-    return this.page.getByTestId(ids.outputInfo)
-  }
-
-  get activeQueue(): Locator {
-    return this.page.getByTestId(ids.activeQueue)
-  }
-
-  get queueBadge(): Locator {
-    return this.page.getByTestId(ids.queueBadge)
-  }
-
-  get inProgressItems(): Locator {
-    return this.page.getByTestId(ids.inProgressItem)
-  }
-
-  get historyItems(): Locator {
-    return this.page.getByTestId(ids.historyItem)
-  }
-
-  get skeletons(): Locator {
-    return this.page.getByTestId(ids.skeleton)
-  }
-
-  get latentPreviews(): Locator {
-    return this.page.getByTestId(ids.latentPreview)
-  }
-
-  get imageOutputs(): Locator {
-    return this.page.getByTestId(ids.imageOutput)
-  }
-
-  get videoOutputs(): Locator {
-    return this.page.getByTestId(ids.videoOutput)
-  }
-
-  /** The currently selected (checked) in-progress item. */
-  get selectedInProgressItem(): Locator {
-    return this.page.locator(
-      `[data-testid="${ids.inProgressItem}"][data-state="checked"]`
-    )
-  }
-
-  /** The currently selected (checked) history item. */
-  get selectedHistoryItem(): Locator {
-    return this.page.locator(
-      `[data-testid="${ids.historyItem}"][data-state="checked"]`
-    )
-  }
-
-  /** The header-level progress bar. */
-  get headerProgressBar(): Locator {
-    return this.page.getByTestId(ids.headerProgressBar)
-  }
-
-  /** The in-progress item's progress bar (inside the thumbnail). */
-  get itemProgressBar(): Locator {
-    return this.inProgressItems.first().getByTestId(ids.itemProgressBar)
-  }
-
-  /** Overall progress in the header bar. */
-  get headerOverallProgress(): Locator {
-    return this.headerProgressBar.getByTestId(ids.progressOverall)
-  }
-
-  /** Node progress in the header bar. */
-  get headerNodeProgress(): Locator {
-    return this.headerProgressBar.getByTestId(ids.progressNode)
-  }
-
-  /** Overall progress in the in-progress item bar. */
-  get itemOverallProgress(): Locator {
-    return this.itemProgressBar.getByTestId(ids.progressOverall)
-  }
-
-  /** Node progress in the in-progress item bar. */
-  get itemNodeProgress(): Locator {
-    return this.itemProgressBar.getByTestId(ids.progressNode)
-  }
-}

browser_tests/fixtures/components/SettingDialog.ts

@@ -1,22 +1,15 @@
-import type { Locator, Page } from '@playwright/test'
+import type { Page } from '@playwright/test'
 
 import type { ComfyPage } from '@e2e/fixtures/ComfyPage'
 import { TestIds } from '@e2e/fixtures/selectors'
 import { BaseDialog } from '@e2e/fixtures/components/BaseDialog'
 
 export class SettingDialog extends BaseDialog {
-  public readonly searchBox: Locator
-  public readonly categories: Locator
-  public readonly contentArea: Locator
-
   constructor(
     page: Page,
     public readonly comfyPage: ComfyPage
   ) {
     super(page, TestIds.dialogs.settings)
-    this.searchBox = this.root.getByPlaceholder(/Search/)
-    this.categories = this.root.locator('nav').getByRole('button')
-    this.contentArea = this.root.getByRole('main')
   }
 
   async open() {
@@ -43,10 +36,22 @@ export class SettingDialog extends BaseDialog {
     await settingInputDiv.locator('input').click()
   }
 
+  get searchBox() {
+    return this.root.getByPlaceholder(/Search/)
+  }
+
+  get categories() {
+    return this.root.locator('nav').getByRole('button')
+  }
+
   category(name: string) {
     return this.root.locator('nav').getByRole('button', { name })
   }
 
+  get contentArea() {
+    return this.root.getByRole('main')
+  }
+
   async goToAboutPanel() {
     const aboutButton = this.root.locator('nav').getByRole('button', {
       name: 'About'

browser_tests/fixtures/components/SidebarTab.ts

@@ -5,16 +5,18 @@ import type { WorkspaceStore } from '@e2e/types/globals'
 import { TestIds } from '@e2e/fixtures/selectors'
 
 class SidebarTab {
-  public readonly tabButton: Locator
-  public readonly selectedTabButton: Locator
-
   constructor(
     public readonly page: Page,
     public readonly tabId: string
-  ) {
-    this.tabButton = page.locator(`.${tabId}-tab-button`)
-    this.selectedTabButton = page.locator(
-      `.${tabId}-tab-button.side-bar-button-selected`
+  ) {}
+
+  get tabButton() {
+    return this.page.locator(`.${this.tabId}-tab-button`)
+  }
+
+  get selectedTabButton() {
+    return this.page.locator(
+      `.${this.tabId}-tab-button.side-bar-button-selected`
     )
   }
 
@@ -33,19 +35,28 @@ class SidebarTab {
 }
 
 export class NodeLibrarySidebarTab extends SidebarTab {
-  public readonly nodeLibrarySearchBoxInput: Locator
-  public readonly nodeLibraryTree: Locator
-  public readonly nodePreview: Locator
-  public readonly tabContainer: Locator
-  public readonly newFolderButton: Locator
-
   constructor(public override readonly page: Page) {
     super(page, 'node-library')
-    this.nodeLibrarySearchBoxInput = page.getByPlaceholder('Search Nodes...')
-    this.nodeLibraryTree = page.getByTestId(TestIds.sidebar.nodeLibrary)
-    this.nodePreview = page.locator('.node-lib-node-preview')
-    this.tabContainer = page.locator('.sidebar-content-container')
-    this.newFolderButton = this.tabContainer.locator('.new-folder-button')
+  }
+
+  get nodeLibrarySearchBoxInput() {
+    return this.page.getByPlaceholder('Search Nodes...')
+  }
+
+  get nodeLibraryTree() {
+    return this.page.getByTestId(TestIds.sidebar.nodeLibrary)
+  }
+
+  get nodePreview() {
+    return this.page.locator('.node-lib-node-preview')
+  }
+
+  get tabContainer() {
+    return this.page.locator('.sidebar-content-container')
+  }
+
+  get newFolderButton() {
+    return this.tabContainer.locator('.new-folder-button')
   }
 
   override async open() {
@@ -90,25 +101,34 @@ export class NodeLibrarySidebarTab extends SidebarTab {
 }
 
 export class NodeLibrarySidebarTabV2 extends SidebarTab {
-  public readonly searchInput: Locator
-  public readonly sidebarContent: Locator
-  public readonly allTab: Locator
-  public readonly blueprintsTab: Locator
-  public readonly sortButton: Locator
-
   constructor(public override readonly page: Page) {
     super(page, 'node-library')
-    this.searchInput = page.getByPlaceholder('Search...')
-    this.sidebarContent = page.locator('.sidebar-content-container')
-    this.allTab = this.getTab('All')
-    this.blueprintsTab = this.getTab('Blueprints')
-    this.sortButton = this.sidebarContent.getByRole('button', { name: 'Sort' })
+  }
+
+  get searchInput() {
+    return this.page.getByPlaceholder('Search...')
+  }
+
+  get sidebarContent() {
+    return this.page.locator('.sidebar-content-container')
   }
 
   getTab(name: string) {
     return this.sidebarContent.getByRole('tab', { name, exact: true })
   }
 
+  get allTab() {
+    return this.getTab('All')
+  }
+
+  get blueprintsTab() {
+    return this.getTab('Blueprints')
+  }
+
+  get sortButton() {
+    return this.sidebarContent.getByRole('button', { name: 'Sort' })
+  }
+
   getFolder(folderName: string) {
     return this.sidebarContent
       .getByRole('treeitem', { name: folderName })
@@ -134,15 +154,12 @@ export class NodeLibrarySidebarTabV2 extends SidebarTab {
 }
 
 export class WorkflowsSidebarTab extends SidebarTab {
-  public readonly root: Locator
-  public readonly activeWorkflowLabel: Locator
-
   constructor(public override readonly page: Page) {
     super(page, 'workflows')
-    this.root = page.getByTestId(TestIds.sidebar.workflows)
-    this.activeWorkflowLabel = this.root.locator(
-      '.comfyui-workflows-open .p-tree-node-selected .node-label'
-    )
+  }
+
+  get root() {
+    return this.page.getByTestId(TestIds.sidebar.workflows)
   }
 
   async getOpenedWorkflowNames() {
@@ -151,6 +168,12 @@ export class WorkflowsSidebarTab extends SidebarTab {
       .allInnerTexts()
   }
 
+  get activeWorkflowLabel(): Locator {
+    return this.root.locator(
+      '.comfyui-workflows-open .p-tree-node-selected .node-label'
+    )
+  }
+
   async getActiveWorkflowName() {
     return await this.activeWorkflowLabel.innerText()
   }
@@ -205,27 +228,36 @@ export class WorkflowsSidebarTab extends SidebarTab {
 }
 
 export class ModelLibrarySidebarTab extends SidebarTab {
-  public readonly searchInput: Locator
-  public readonly modelTree: Locator
-  public readonly refreshButton: Locator
-  public readonly loadAllFoldersButton: Locator
-  public readonly folderNodes: Locator
-  public readonly leafNodes: Locator
-  public readonly modelPreview: Locator
-
   constructor(public override readonly page: Page) {
     super(page, 'model-library')
-    this.searchInput = page.getByPlaceholder('Search Models...')
-    this.modelTree = page.locator('.model-lib-tree-explorer')
-    this.refreshButton = page.getByRole('button', { name: 'Refresh' })
-    this.loadAllFoldersButton = page.getByRole('button', {
-      name: 'Load All Folders'
-    })
-    this.folderNodes = this.modelTree.locator(
-      '.p-tree-node:not(.p-tree-node-leaf)'
-    )
-    this.leafNodes = this.modelTree.locator('.p-tree-node-leaf')
-    this.modelPreview = page.locator('.model-lib-model-preview')
+  }
+
+  get searchInput() {
+    return this.page.getByPlaceholder('Search Models...')
+  }
+
+  get modelTree() {
+    return this.page.locator('.model-lib-tree-explorer')
+  }
+
+  get refreshButton() {
+    return this.page.getByRole('button', { name: 'Refresh' })
+  }
+
+  get loadAllFoldersButton() {
+    return this.page.getByRole('button', { name: 'Load All Folders' })
+  }
+
+  get folderNodes() {
+    return this.modelTree.locator('.p-tree-node:not(.p-tree-node-leaf)')
+  }
+
+  get leafNodes() {
+    return this.modelTree.locator('.p-tree-node-leaf')
+  }
+
+  get modelPreview() {
+    return this.page.locator('.model-lib-model-preview')
   }
 
   override async open() {
@@ -249,95 +281,137 @@ export class ModelLibrarySidebarTab extends SidebarTab {
 }
 
 export class AssetsSidebarTab extends SidebarTab {
-  // --- Tab navigation ---
-  public readonly generatedTab: Locator
-  public readonly importedTab: Locator
-
-  // --- Empty state ---
-  public readonly emptyStateMessage: Locator
-
-  // --- Search & filter ---
-  public readonly searchInput: Locator
-  public readonly settingsButton: Locator
-
-  // --- View mode ---
-  public readonly listViewOption: Locator
-  public readonly gridViewOption: Locator
-
-  // --- Sort options (cloud-only, shown inside settings popover) ---
-  public readonly sortNewestFirst: Locator
-  public readonly sortOldestFirst: Locator
-
-  // --- Asset cards ---
-  public readonly assetCards: Locator
-  public readonly selectedCards: Locator
-
-  // --- List view items ---
-  public readonly listViewItems: Locator
-
-  // --- Selection footer ---
-  public readonly selectionFooter: Locator
-  public readonly selectionCountButton: Locator
-  public readonly deselectAllButton: Locator
-  public readonly deleteSelectedButton: Locator
-  public readonly downloadSelectedButton: Locator
-
-  // --- Folder view ---
-  public readonly backToAssetsButton: Locator
-
-  // --- Loading ---
-  public readonly skeletonLoaders: Locator
-
   constructor(public override readonly page: Page) {
     super(page, 'assets')
-    this.generatedTab = page.getByRole('tab', { name: 'Generated' })
-    this.importedTab = page.getByRole('tab', { name: 'Imported' })
-    this.emptyStateMessage = page.getByText(
+  }
+
+  // --- Tab navigation ---
+
+  get generatedTab() {
+    return this.page.getByRole('tab', { name: 'Generated' })
+  }
+
+  get importedTab() {
+    return this.page.getByRole('tab', { name: 'Imported' })
+  }
+
+  // --- Empty state ---
+
+  get emptyStateMessage() {
+    return this.page.getByText(
       'Upload files or generate content to see them here'
     )
-    this.searchInput = page.getByPlaceholder('Search Assets...')
-    this.settingsButton = page.getByRole('button', { name: 'View settings' })
-    this.listViewOption = page.getByText('List view')
-    this.gridViewOption = page.getByText('Grid view')
-    this.sortNewestFirst = page.getByText('Newest first')
-    this.sortOldestFirst = page.getByText('Oldest first')
-    this.assetCards = page.locator('[role="button"][data-selected]')
-    this.selectedCards = page.locator('[data-selected="true"]')
-    this.listViewItems = page.locator(
-      '.sidebar-content-container [role="button"][tabindex="0"]'
-    )
-    this.selectionFooter = page
-      .locator('.sidebar-content-container')
-      .locator('..')
-      .locator('[class*="h-18"]')
-    this.selectionCountButton = page.getByText(/Assets Selected: \d+/)
-    this.deselectAllButton = page.getByText('Deselect all')
-    this.deleteSelectedButton = page
-      .getByTestId('assets-delete-selected')
-      .or(page.locator('button:has(.icon-\\[lucide--trash-2\\])').last())
-      .first()
-    this.downloadSelectedButton = page
-      .getByTestId('assets-download-selected')
-      .or(page.locator('button:has(.icon-\\[lucide--download\\])').last())
-      .first()
-    this.backToAssetsButton = page.getByText('Back to all assets')
-    this.skeletonLoaders = page.locator(
-      '.sidebar-content-container .animate-pulse'
-    )
   }
 
   emptyStateTitle(title: string) {
     return this.page.getByText(title)
   }
 
-  getAssetCardByName(name: string) {
-    return this.assetCards.filter({ hasText: name })
+  // --- Search & filter ---
+
+  get searchInput() {
+    return this.page.getByPlaceholder('Search Assets...')
   }
 
+  get settingsButton() {
+    return this.page.getByRole('button', { name: 'View settings' })
+  }
+
+  // --- View mode ---
+
+  get listViewOption() {
+    return this.page.getByText('List view')
+  }
+
+  get gridViewOption() {
+    return this.page.getByText('Grid view')
+  }
+
+  // --- Sort options (cloud-only, shown inside settings popover) ---
+
+  get sortNewestFirst() {
+    return this.page.getByText('Newest first')
+  }
+
+  get sortOldestFirst() {
+    return this.page.getByText('Oldest first')
+  }
+
+  // --- Asset cards ---
+
+  get assetCards() {
+    return this.page.locator('[role="button"][data-selected]')
+  }
+
+  getAssetCardByName(name: string) {
+    return this.page.locator('[role="button"][data-selected]', {
+      hasText: name
+    })
+  }
+
+  get selectedCards() {
+    return this.page.locator('[data-selected="true"]')
+  }
+
+  // --- List view items ---
+
+  get listViewItems() {
+    return this.page.locator(
+      '.sidebar-content-container [role="button"][tabindex="0"]'
+    )
+  }
+
+  // --- Selection footer ---
+
+  get selectionFooter() {
+    return this.page
+      .locator('.sidebar-content-container')
+      .locator('..')
+      .locator('[class*="h-18"]')
+  }
+
+  get selectionCountButton() {
+    return this.page.getByText(/Assets Selected: \d+/)
+  }
+
+  get deselectAllButton() {
+    return this.page.getByText('Deselect all')
+  }
+
+  get deleteSelectedButton() {
+    return this.page
+      .getByTestId('assets-delete-selected')
+      .or(this.page.locator('button:has(.icon-\\[lucide--trash-2\\])').last())
+      .first()
+  }
+
+  get downloadSelectedButton() {
+    return this.page
+      .getByTestId('assets-download-selected')
+      .or(this.page.locator('button:has(.icon-\\[lucide--download\\])').last())
+      .first()
+  }
+
+  // --- Context menu ---
+
   contextMenuItem(label: string) {
     return this.page.locator('.p-contextmenu').getByText(label)
   }
 
+  // --- Folder view ---
+
+  get backToAssetsButton() {
+    return this.page.getByText('Back to all assets')
+  }
+
+  // --- Loading ---
+
+  get skeletonLoaders() {
+    return this.page.locator('.sidebar-content-container .animate-pulse')
+  }
+
+  // --- Helpers ---
+
   override async open() {
     // Remove any toast notifications that may overlay the sidebar button
     await this.dismissToasts()
@@ -353,20 +427,24 @@ export class AssetsSidebarTab extends SidebarTab {
     }
     // Wait for all toast elements to fully animate out and detach from DOM
     await expect(this.page.locator('.p-toast-message'))
-      .toHaveCount(0)
+      .toHaveCount(0, { timeout: 5000 })
       .catch(() => {})
   }
 
   async switchToImported() {
     await this.dismissToasts()
     await this.importedTab.click()
-    await expect(this.importedTab).toHaveAttribute('aria-selected', 'true')
+    await expect(this.importedTab).toHaveAttribute('aria-selected', 'true', {
+      timeout: 3000
+    })
   }
 
   async switchToGenerated() {
     await this.dismissToasts()
     await this.generatedTab.click()
-    await expect(this.generatedTab).toHaveAttribute('aria-selected', 'true')
+    await expect(this.generatedTab).toHaveAttribute('aria-selected', 'true', {
+      timeout: 3000
+    })
   }
 
   async openSettingsMenu() {
@@ -389,7 +467,7 @@ export class AssetsSidebarTab extends SidebarTab {
 
   async waitForAssets(count?: number) {
     if (count !== undefined) {
-      await expect(this.assetCards).toHaveCount(count)
+      await expect(this.assetCards).toHaveCount(count, { timeout: 5000 })
     } else {
       await this.assetCards.first().waitFor({ state: 'visible', timeout: 5000 })
     }

browser_tests/fixtures/components/SignInDialog.ts

@@ -10,17 +10,6 @@ export class SignInDialog extends BaseDialog {
   readonly apiKeyButton: Locator
   readonly termsLink: Locator
   readonly privacyLink: Locator
-  readonly heading: Locator
-  readonly signUpLink: Locator
-  readonly signInLink: Locator
-  readonly signUpEmailInput: Locator
-  readonly signUpPasswordInput: Locator
-  readonly signUpConfirmPasswordInput: Locator
-  readonly signUpButton: Locator
-  readonly apiKeyHeading: Locator
-  readonly apiKeyInput: Locator
-  readonly backButton: Locator
-  readonly dividerText: Locator
 
   constructor(page: Page) {
     super(page)
@@ -33,22 +22,6 @@ export class SignInDialog extends BaseDialog {
     })
     this.termsLink = this.root.getByRole('link', { name: 'Terms of Use' })
     this.privacyLink = this.root.getByRole('link', { name: 'Privacy Policy' })
-    this.heading = this.root.getByRole('heading').first()
-    this.signUpLink = this.root.getByText('Sign up', { exact: true })
-    this.signInLink = this.root.getByText('Sign in', { exact: true })
-    this.signUpEmailInput = this.root.locator('#comfy-org-sign-up-email')
-    this.signUpPasswordInput = this.root.locator('#comfy-org-sign-up-password')
-    this.signUpConfirmPasswordInput = this.root.locator(
-      '#comfy-org-sign-up-confirm-password'
-    )
-    this.signUpButton = this.root.getByRole('button', {
-      name: 'Sign up',
-      exact: true
-    })
-    this.apiKeyHeading = this.root.getByRole('heading', { name: 'API Key' })
-    this.apiKeyInput = this.root.locator('#comfy-org-api-key')
-    this.backButton = this.root.getByRole('button', { name: 'Back' })
-    this.dividerText = this.root.getByText('Or continue with')
   }
 
   async open() {
@@ -57,4 +30,48 @@ export class SignInDialog extends BaseDialog {
     })
     await this.waitForVisible()
   }
+
+  get heading() {
+    return this.root.getByRole('heading').first()
+  }
+
+  get signUpLink() {
+    return this.root.getByText('Sign up', { exact: true })
+  }
+
+  get signInLink() {
+    return this.root.getByText('Sign in', { exact: true })
+  }
+
+  get signUpEmailInput() {
+    return this.root.locator('#comfy-org-sign-up-email')
+  }
+
+  get signUpPasswordInput() {
+    return this.root.locator('#comfy-org-sign-up-password')
+  }
+
+  get signUpConfirmPasswordInput() {
+    return this.root.locator('#comfy-org-sign-up-confirm-password')
+  }
+
+  get signUpButton() {
+    return this.root.getByRole('button', { name: 'Sign up', exact: true })
+  }
+
+  get apiKeyHeading() {
+    return this.root.getByRole('heading', { name: 'API Key' })
+  }
+
+  get apiKeyInput() {
+    return this.root.locator('#comfy-org-api-key')
+  }
+
+  get backButton() {
+    return this.root.getByRole('button', { name: 'Back' })
+  }
+
+  get dividerText() {
+    return this.root.getByText('Or continue with')
+  }
 }

browser_tests/fixtures/components/Topbar.ts

@@ -5,12 +5,10 @@ import type { WorkspaceStore } from '@e2e/types/globals'
 export class Topbar {
   private readonly menuLocator: Locator
   private readonly menuTrigger: Locator
-  readonly newWorkflowButton: Locator
 
   constructor(public readonly page: Page) {
     this.menuLocator = page.locator('.comfy-command-menu')
     this.menuTrigger = page.locator('.comfy-menu-button-wrapper')
-    this.newWorkflowButton = page.locator('.new-blank-workflow-button')
   }
 
   async getTabNames(): Promise<string[]> {
@@ -52,6 +50,10 @@ export class Topbar {
     return classes ? !classes.includes('invisible') : false
   }
 
+  get newWorkflowButton(): Locator {
+    return this.page.locator('.new-blank-workflow-button')
+  }
+
   getWorkflowTab(tabName: string): Locator {
     return this.page
       .locator(`.workflow-tabs .workflow-label:has-text("${tabName}")`)
@@ -105,7 +107,7 @@ export class Topbar {
       { timeout: 3000 }
     )
     // Wait for the dialog to close.
-    await this.getSaveDialog().waitFor({ state: 'hidden' })
+    await this.getSaveDialog().waitFor({ state: 'hidden', timeout: 500 })
 
     // Check if a confirmation dialog appeared (e.g., "Overwrite existing file?")
     // If so, return early to let the test handle the confirmation

browser_tests/fixtures/helpers/AppModeHelper.ts

@@ -3,7 +3,6 @@ import type { Locator, Page } from '@playwright/test'
 import type { ComfyPage } from '@e2e/fixtures/ComfyPage'
 import { TestIds } from '@e2e/fixtures/selectors'
 
-import { OutputHistoryComponent } from '@e2e/fixtures/components/OutputHistory'
 import { AppModeWidgetHelper } from '@e2e/fixtures/helpers/AppModeWidgetHelper'
 import { BuilderFooterHelper } from '@e2e/fixtures/helpers/BuilderFooterHelper'
 import { BuilderSaveAsHelper } from '@e2e/fixtures/helpers/BuilderSaveAsHelper'
@@ -15,66 +14,14 @@ export class AppModeHelper {
   readonly footer: BuilderFooterHelper
   readonly saveAs: BuilderSaveAsHelper
   readonly select: BuilderSelectHelper
-  readonly outputHistory: OutputHistoryComponent
   readonly widgets: AppModeWidgetHelper
-  /** The "Connect an output" popover shown when saving without outputs. */
-  public readonly connectOutputPopover: Locator
-  /** The empty-state placeholder shown when no outputs are selected. */
-  public readonly outputPlaceholder: Locator
-  /** The linear-mode widget list container (visible in app mode). */
-  public readonly linearWidgets: Locator
-  /** The PrimeVue Popover for the image picker (renders with role="dialog"). */
-  public readonly imagePickerPopover: Locator
-  /** The Run button in the app mode footer. */
-  public readonly runButton: Locator
-  /** The welcome screen shown when app mode has no outputs or no nodes. */
-  public readonly welcome: Locator
-  /** The empty workflow message shown when no nodes exist. */
-  public readonly emptyWorkflowText: Locator
-  /** The "Build app" button shown when nodes exist but no outputs. */
-  public readonly buildAppButton: Locator
-  /** The "Back to workflow" button on the welcome screen. */
-  public readonly backToWorkflowButton: Locator
-  /** The "Load template" button shown when no nodes exist. */
-  public readonly loadTemplateButton: Locator
-  /** The cancel button for an in-progress run in the output history. */
-  public readonly cancelRunButton: Locator
 
   constructor(private readonly comfyPage: ComfyPage) {
     this.steps = new BuilderStepsHelper(comfyPage)
     this.footer = new BuilderFooterHelper(comfyPage)
     this.saveAs = new BuilderSaveAsHelper(comfyPage)
     this.select = new BuilderSelectHelper(comfyPage)
-    this.outputHistory = new OutputHistoryComponent(comfyPage.page)
     this.widgets = new AppModeWidgetHelper(comfyPage)
-    this.connectOutputPopover = this.page.getByTestId(
-      TestIds.builder.connectOutputPopover
-    )
-    this.outputPlaceholder = this.page.getByTestId(
-      TestIds.builder.outputPlaceholder
-    )
-    this.linearWidgets = this.page.locator('[data-testid="linear-widgets"]')
-    this.imagePickerPopover = this.page
-      .getByRole('dialog')
-      .filter({ has: this.page.getByRole('button', { name: 'All' }) })
-      .first()
-    this.runButton = this.page
-      .getByTestId('linear-run-button')
-      .getByRole('button', { name: /run/i })
-    this.welcome = this.page.getByTestId(TestIds.appMode.welcome)
-    this.emptyWorkflowText = this.page.getByTestId(
-      TestIds.appMode.emptyWorkflow
-    )
-    this.buildAppButton = this.page.getByTestId(TestIds.appMode.buildApp)
-    this.backToWorkflowButton = this.page.getByTestId(
-      TestIds.appMode.backToWorkflow
-    )
-    this.loadTemplateButton = this.page.getByTestId(
-      TestIds.appMode.loadTemplate
-    )
-    this.cancelRunButton = this.page.getByTestId(
-      TestIds.outputHistory.cancelRun
-    )
   }
 
   private get page(): Page {
@@ -146,6 +93,61 @@ export class AppModeHelper {
     await this.toggleAppMode()
   }
 
+  /** The "Connect an output" popover shown when saving without outputs. */
+  get connectOutputPopover(): Locator {
+    return this.page.getByTestId(TestIds.builder.connectOutputPopover)
+  }
+
+  /** The empty-state placeholder shown when no outputs are selected. */
+  get outputPlaceholder(): Locator {
+    return this.page.getByTestId(TestIds.builder.outputPlaceholder)
+  }
+
+  /** The linear-mode widget list container (visible in app mode). */
+  get linearWidgets(): Locator {
+    return this.page.locator('[data-testid="linear-widgets"]')
+  }
+
+  /** The PrimeVue Popover for the image picker (renders with role="dialog"). */
+  get imagePickerPopover(): Locator {
+    return this.page
+      .getByRole('dialog')
+      .filter({ has: this.page.getByRole('button', { name: 'All' }) })
+      .first()
+  }
+
+  /** The Run button in the app mode footer. */
+  get runButton(): Locator {
+    return this.page
+      .getByTestId('linear-run-button')
+      .getByRole('button', { name: /run/i })
+  }
+
+  /** The welcome screen shown when app mode has no outputs or no nodes. */
+  get welcome(): Locator {
+    return this.page.getByTestId(TestIds.appMode.welcome)
+  }
+
+  /** The empty workflow message shown when no nodes exist. */
+  get emptyWorkflowText(): Locator {
+    return this.page.getByTestId(TestIds.appMode.emptyWorkflow)
+  }
+
+  /** The "Build app" button shown when nodes exist but no outputs. */
+  get buildAppButton(): Locator {
+    return this.page.getByTestId(TestIds.appMode.buildApp)
+  }
+
+  /** The "Back to workflow" button on the welcome screen. */
+  get backToWorkflowButton(): Locator {
+    return this.page.getByTestId(TestIds.appMode.backToWorkflow)
+  }
+
+  /** The "Load template" button shown when no nodes exist. */
+  get loadTemplateButton(): Locator {
+    return this.page.getByTestId(TestIds.appMode.loadTemplate)
+  }
+
   /**
    * Get the actions menu trigger for a widget in the app mode widget list.
    * @param widgetName Text shown in the widget label (e.g. "seed").

browser_tests/fixtures/helpers/BuilderFooterHelper.ts

@@ -4,32 +4,48 @@ import type { ComfyPage } from '@e2e/fixtures/ComfyPage'
 import { TestIds } from '@e2e/fixtures/selectors'
 
 export class BuilderFooterHelper {
-  public readonly nav: Locator
-  public readonly exitButton: Locator
-  public readonly nextButton: Locator
-  public readonly backButton: Locator
-  public readonly saveButton: Locator
-  public readonly saveGroup: Locator
-  public readonly saveAsButton: Locator
-  public readonly saveAsChevron: Locator
-  public readonly opensAsPopover: Locator
-
-  constructor(private readonly comfyPage: ComfyPage) {
-    this.nav = this.page.getByTestId(TestIds.builder.footerNav)
-    this.exitButton = this.buttonByName('Exit app builder')
-    this.nextButton = this.buttonByName('Next')
-    this.backButton = this.buttonByName('Back')
-    this.saveButton = this.page.getByTestId(TestIds.builder.saveButton)
-    this.saveGroup = this.page.getByTestId(TestIds.builder.saveGroup)
-    this.saveAsButton = this.page.getByTestId(TestIds.builder.saveAsButton)
-    this.saveAsChevron = this.page.getByTestId(TestIds.builder.saveAsChevron)
-    this.opensAsPopover = this.page.getByTestId(TestIds.builder.opensAs)
-  }
+  constructor(private readonly comfyPage: ComfyPage) {}
 
   private get page(): Page {
     return this.comfyPage.page
   }
 
+  get nav(): Locator {
+    return this.page.getByTestId(TestIds.builder.footerNav)
+  }
+
+  get exitButton(): Locator {
+    return this.buttonByName('Exit app builder')
+  }
+
+  get nextButton(): Locator {
+    return this.buttonByName('Next')
+  }
+
+  get backButton(): Locator {
+    return this.buttonByName('Back')
+  }
+
+  get saveButton(): Locator {
+    return this.page.getByTestId(TestIds.builder.saveButton)
+  }
+
+  get saveGroup(): Locator {
+    return this.page.getByTestId(TestIds.builder.saveGroup)
+  }
+
+  get saveAsButton(): Locator {
+    return this.page.getByTestId(TestIds.builder.saveAsButton)
+  }
+
+  get saveAsChevron(): Locator {
+    return this.page.getByTestId(TestIds.builder.saveAsChevron)
+  }
+
+  get opensAsPopover(): Locator {
+    return this.page.getByTestId(TestIds.builder.opensAs)
+  }
+
   private buttonByName(name: string): Locator {
     return this.nav.getByRole('button', { name })
   }

browser_tests/fixtures/helpers/BuilderSaveAsHelper.ts

@@ -3,61 +3,73 @@ import type { Locator, Page } from '@playwright/test'
 import type { ComfyPage } from '@e2e/fixtures/ComfyPage'
 
 export class BuilderSaveAsHelper {
-  /** The save-as dialog (scoped by aria-labelledby). */
-  public readonly dialog: Locator
-  /** The post-save success dialog (scoped by aria-labelledby). */
-  public readonly successDialog: Locator
-  public readonly title: Locator
-  public readonly radioGroup: Locator
-  public readonly nameInput: Locator
-  public readonly saveButton: Locator
-  public readonly successMessage: Locator
-  public readonly viewAppButton: Locator
-  public readonly closeButton: Locator
-  /** The X button to dismiss the success dialog without any action. */
-  public readonly dismissButton: Locator
-  public readonly exitBuilderButton: Locator
-  public readonly overwriteDialog: Locator
-  public readonly overwriteButton: Locator
-
-  constructor(private readonly comfyPage: ComfyPage) {
-    this.dialog = this.page.locator('[aria-labelledby="builder-save"]')
-    this.successDialog = this.page.locator(
-      '[aria-labelledby="builder-save-success"]'
-    )
-    this.title = this.dialog.getByText('Save as')
-    this.radioGroup = this.dialog.getByRole('radiogroup')
-    this.nameInput = this.dialog.getByRole('textbox')
-    this.saveButton = this.dialog.getByRole('button', { name: 'Save' })
-    this.successMessage = this.successDialog.getByText('Successfully saved')
-    this.viewAppButton = this.successDialog.getByRole('button', {
-      name: 'View app'
-    })
-    this.closeButton = this.successDialog
-      .getByRole('button', { name: 'Close', exact: true })
-      .filter({ hasText: 'Close' })
-    this.dismissButton = this.successDialog.locator(
-      'button.p-dialog-close-button'
-    )
-    this.exitBuilderButton = this.successDialog.getByRole('button', {
-      name: 'Exit builder'
-    })
-    this.overwriteDialog = this.page.getByRole('dialog', {
-      name: 'Overwrite existing file?'
-    })
-    this.overwriteButton = this.overwriteDialog.getByRole('button', {
-      name: 'Overwrite'
-    })
-  }
+  constructor(private readonly comfyPage: ComfyPage) {}
 
   private get page(): Page {
     return this.comfyPage.page
   }
 
+  /** The save-as dialog (scoped by aria-labelledby). */
+  get dialog(): Locator {
+    return this.page.locator('[aria-labelledby="builder-save"]')
+  }
+
+  /** The post-save success dialog (scoped by aria-labelledby). */
+  get successDialog(): Locator {
+    return this.page.locator('[aria-labelledby="builder-save-success"]')
+  }
+
+  get title(): Locator {
+    return this.dialog.getByText('Save as')
+  }
+
+  get radioGroup(): Locator {
+    return this.dialog.getByRole('radiogroup')
+  }
+
+  get nameInput(): Locator {
+    return this.dialog.getByRole('textbox')
+  }
+
   viewTypeRadio(viewType: 'App' | 'Node graph'): Locator {
     return this.dialog.getByRole('radio', { name: viewType })
   }
 
+  get saveButton(): Locator {
+    return this.dialog.getByRole('button', { name: 'Save' })
+  }
+
+  get successMessage(): Locator {
+    return this.successDialog.getByText('Successfully saved')
+  }
+
+  get viewAppButton(): Locator {
+    return this.successDialog.getByRole('button', { name: 'View app' })
+  }
+
+  get closeButton(): Locator {
+    return this.successDialog
+      .getByRole('button', { name: 'Close', exact: true })
+      .filter({ hasText: 'Close' })
+  }
+
+  /** The X button to dismiss the success dialog without any action. */
+  get dismissButton(): Locator {
+    return this.successDialog.locator('button.p-dialog-close-button')
+  }
+
+  get exitBuilderButton(): Locator {
+    return this.successDialog.getByRole('button', { name: 'Exit builder' })
+  }
+
+  get overwriteDialog(): Locator {
+    return this.page.getByRole('dialog', { name: 'Overwrite existing file?' })
+  }
+
+  get overwriteButton(): Locator {
+    return this.overwriteDialog.getByRole('button', { name: 'Overwrite' })
+  }
+
   async fillAndSave(workflowName: string, viewType: 'App' | 'Node graph') {
     await this.nameInput.fill(workflowName)
     await this.viewTypeRadio(viewType).click()

browser_tests/fixtures/helpers/BuilderSelectHelper.ts

@@ -32,20 +32,7 @@ async function dragByIndex(items: Locator, fromIndex: number, toIndex: number) {
 }
 
 export class BuilderSelectHelper {
-  /** All IoItem locators in the current step sidebar. */
-  public readonly inputItems: Locator
-  /** All IoItem title locators in the inputs step sidebar. */
-  public readonly inputItemTitles: Locator
-  /** All widget label locators in the preview/arrange sidebar. */
-  public readonly previewWidgetLabels: Locator
-
-  constructor(private readonly comfyPage: ComfyPage) {
-    this.inputItems = this.page.getByTestId(TestIds.builder.ioItem)
-    this.inputItemTitles = this.page.getByTestId(TestIds.builder.ioItemTitle)
-    this.previewWidgetLabels = this.page.getByTestId(
-      TestIds.builder.widgetLabel
-    )
-  }
+  constructor(private readonly comfyPage: ComfyPage) {}
 
   private get page(): Page {
     return this.comfyPage.page
@@ -56,9 +43,12 @@ export class BuilderSelectHelper {
    * @param title The widget title shown in the IoItem.
    */
   getInputItemMenu(title: string): Locator {
-    return this.inputItems
+    return this.page
+      .getByTestId(TestIds.builder.ioItem)
       .filter({
-        has: this.inputItemTitles.getByText(title, { exact: true })
+        has: this.page
+          .getByTestId(TestIds.builder.ioItemTitle)
+          .getByText(title, { exact: true })
       })
       .getByTestId(TestIds.builder.widgetActionsMenu)
   }
@@ -160,19 +150,38 @@ export class BuilderSelectHelper {
    * Useful for asserting "Widget not visible" on disconnected inputs.
    */
   getInputItemSubtitle(title: string): Locator {
-    return this.inputItems
+    return this.page
+      .getByTestId(TestIds.builder.ioItem)
       .filter({
-        has: this.inputItemTitles.getByText(title, { exact: true })
+        has: this.page
+          .getByTestId(TestIds.builder.ioItemTitle)
+          .getByText(title, { exact: true })
       })
       .getByTestId(TestIds.builder.ioItemSubtitle)
   }
 
+  /** All IoItem locators in the current step sidebar. */
+  get inputItems(): Locator {
+    return this.page.getByTestId(TestIds.builder.ioItem)
+  }
+
+  /** All IoItem title locators in the inputs step sidebar. */
+  get inputItemTitles(): Locator {
+    return this.page.getByTestId(TestIds.builder.ioItemTitle)
+  }
+
+  /** All widget label locators in the preview/arrange sidebar. */
+  get previewWidgetLabels(): Locator {
+    return this.page.getByTestId(TestIds.builder.widgetLabel)
+  }
+
   /**
    * Drag an IoItem from one index to another in the inputs step.
    * Items are identified by their 0-based position among visible IoItems.
    */
   async dragInputItem(fromIndex: number, toIndex: number) {
-    await dragByIndex(this.inputItems, fromIndex, toIndex)
+    const items = this.page.getByTestId(TestIds.builder.ioItem)
+    await dragByIndex(items, fromIndex, toIndex)
     await this.comfyPage.nextFrame()
   }
 

browser_tests/fixtures/helpers/BuilderStepsHelper.ts

@@ -3,16 +3,16 @@ import type { Locator, Page } from '@playwright/test'
 import type { ComfyPage } from '@e2e/fixtures/ComfyPage'
 
 export class BuilderStepsHelper {
-  public readonly toolbar: Locator
-
-  constructor(private readonly comfyPage: ComfyPage) {
-    this.toolbar = this.page.getByRole('navigation', { name: 'App Builder' })
-  }
+  constructor(private readonly comfyPage: ComfyPage) {}
 
   private get page(): Page {
     return this.comfyPage.page
   }
 
+  get toolbar(): Locator {
+    return this.page.getByRole('navigation', { name: 'App Builder' })
+  }
+
   async goToInputs() {
     await this.toolbar.getByRole('button', { name: 'Inputs' }).click()
     await this.comfyPage.nextFrame()

browser_tests/fixtures/helpers/ExecutionHelper.ts

@@ -1,211 +0,0 @@
-import type { WebSocketRoute } from '@playwright/test'
-
-import type { RawJobListItem } from '@/platform/remote/comfyui/jobs/jobTypes'
-import type { ComfyPage } from '../ComfyPage'
-import { createMockJob } from './AssetsHelper'
-
-/**
- * Helper for simulating prompt execution in e2e tests.
- */
-export class ExecutionHelper {
-  private jobCounter = 0
-  private readonly completedJobs: RawJobListItem[] = []
-  private readonly page: ComfyPage['page']
-  private readonly command: ComfyPage['command']
-  private readonly assets: ComfyPage['assets']
-
-  constructor(
-    comfyPage: ComfyPage,
-    private readonly ws: WebSocketRoute
-  ) {
-    this.page = comfyPage.page
-    this.command = comfyPage.command
-    this.assets = comfyPage.assets
-  }
-
-  /**
-   * Intercept POST /api/prompt, execute Comfy.QueuePrompt, and return
-   * the synthetic job ID.
-   *
-   * The app receives a valid PromptResponse so storeJob() fires
-   * and registers the job against the active workflow path.
-   */
-  async run(): Promise<string> {
-    const jobId = `test-job-${++this.jobCounter}`
-
-    let fulfilled!: () => void
-    const prompted = new Promise<void>((r) => {
-      fulfilled = r
-    })
-
-    await this.page.route(
-      '**/api/prompt',
-      async (route) => {
-        await route.fulfill({
-          status: 200,
-          contentType: 'application/json',
-          body: JSON.stringify({
-            prompt_id: jobId,
-            node_errors: {}
-          })
-        })
-        fulfilled()
-      },
-      { times: 1 }
-    )
-
-    await this.command.executeCommand('Comfy.QueuePrompt')
-    await prompted
-
-    return jobId
-  }
-
-  /**
-   * Send a binary `b_preview_with_metadata` WS message (type 4).
-   * Encodes the metadata and a tiny 1x1 PNG so the app creates a blob URL.
-   */
-  latentPreview(jobId: string, nodeId: string): void {
-    const metadata = JSON.stringify({
-      node_id: nodeId,
-      display_node_id: nodeId,
-      parent_node_id: nodeId,
-      real_node_id: nodeId,
-      prompt_id: jobId,
-      image_type: 'image/png'
-    })
-    const metadataBytes = new TextEncoder().encode(metadata)
-
-    // 1x1 red PNG
-    const png = Buffer.from(
-      'iVBORw0KGgoAAAANSUhEUgAAAAEAAAABCAYAAAAfFcSJAAAADUlEQVR42mP8z8BQDwADhQGAWjR9awAAAABJRU5ErkJggg==',
-      'base64'
-    )
-
-    // Binary format: [type:uint32][metadataLength:uint32][metadata][imageData]
-    const buf = new ArrayBuffer(8 + metadataBytes.length + png.length)
-    const view = new DataView(buf)
-    view.setUint32(0, 4) // type 4 = PREVIEW_IMAGE_WITH_METADATA
-    view.setUint32(4, metadataBytes.length)
-    new Uint8Array(buf, 8, metadataBytes.length).set(metadataBytes)
-    new Uint8Array(buf, 8 + metadataBytes.length).set(png)
-
-    this.ws.send(Buffer.from(buf))
-  }
-
-  /** Send `execution_start` WS event. */
-  executionStart(jobId: string): void {
-    this.ws.send(
-      JSON.stringify({
-        type: 'execution_start',
-        data: { prompt_id: jobId, timestamp: Date.now() }
-      })
-    )
-  }
-
-  /** Send `executing` WS event to signal which node is currently running. */
-  executing(jobId: string, nodeId: string | null): void {
-    this.ws.send(
-      JSON.stringify({
-        type: 'executing',
-        data: { prompt_id: jobId, node: nodeId }
-      })
-    )
-  }
-
-  /** Send `executed` WS event with node output. */
-  executed(
-    jobId: string,
-    nodeId: string,
-    output: Record<string, unknown>
-  ): void {
-    this.ws.send(
-      JSON.stringify({
-        type: 'executed',
-        data: {
-          prompt_id: jobId,
-          node: nodeId,
-          display_node: nodeId,
-          output
-        }
-      })
-    )
-  }
-
-  /** Send `execution_success` WS event. */
-  executionSuccess(jobId: string): void {
-    this.ws.send(
-      JSON.stringify({
-        type: 'execution_success',
-        data: { prompt_id: jobId, timestamp: Date.now() }
-      })
-    )
-  }
-
-  /** Send `execution_error` WS event. */
-  executionError(jobId: string, nodeId: string, message: string): void {
-    this.ws.send(
-      JSON.stringify({
-        type: 'execution_error',
-        data: {
-          prompt_id: jobId,
-          timestamp: Date.now(),
-          node_id: nodeId,
-          node_type: 'Unknown',
-          exception_message: message,
-          exception_type: 'RuntimeError',
-          traceback: []
-        }
-      })
-    )
-  }
-
-  /** Send `progress` WS event. */
-  progress(jobId: string, nodeId: string, value: number, max: number): void {
-    this.ws.send(
-      JSON.stringify({
-        type: 'progress',
-        data: { prompt_id: jobId, node: nodeId, value, max }
-      })
-    )
-  }
-
-  /**
-   * Complete a job by adding it to mock history, sending execution_success,
-   * and triggering a history refresh via a status event.
-   *
-   * Requires an {@link AssetsHelper} to be passed in the constructor.
-   */
-  async completeWithHistory(
-    jobId: string,
-    nodeId: string,
-    filename: string
-  ): Promise<void> {
-    this.completedJobs.push(
-      createMockJob({
-        id: jobId,
-        preview_output: {
-          filename,
-          subfolder: '',
-          type: 'output',
-          nodeId,
-          mediaType: 'images'
-        }
-      })
-    )
-
-    await this.assets.mockOutputHistory(this.completedJobs)
-    this.executionSuccess(jobId)
-    // Trigger queue/history refresh
-    this.status(0)
-  }
-
-  /** Send `status` WS event to update queue count. */
-  status(queueRemaining: number): void {
-    this.ws.send(
-      JSON.stringify({
-        type: 'status',
-        data: { status: { exec_info: { queue_remaining: queueRemaining } } }
-      })
-    )
-  }
-}

browser_tests/fixtures/helpers/NodeOperationsHelper.ts

@@ -8,13 +8,7 @@ import type { Position, Size } from '@e2e/fixtures/types'
 import { NodeReference } from '@e2e/fixtures/utils/litegraphUtils'
 
 export class NodeOperationsHelper {
-  public readonly promptDialogInput: Locator
-
-  constructor(private comfyPage: ComfyPage) {
-    this.promptDialogInput = this.page.locator(
-      '.p-dialog-content input[type="text"]'
-    )
-  }
+  constructor(private comfyPage: ComfyPage) {}
 
   private get page() {
     return this.comfyPage.page
@@ -161,6 +155,10 @@ export class NodeOperationsHelper {
     await this.comfyPage.nextFrame()
   }
 
+  get promptDialogInput(): Locator {
+    return this.page.locator('.p-dialog-content input[type="text"]')
+  }
+
   async fillPromptDialog(value: string): Promise<void> {
     await this.promptDialogInput.fill(value)
     await this.page.keyboard.press('Enter')

browser_tests/fixtures/helpers/ToastHelper.ts

@@ -2,12 +2,14 @@ import { expect } from '@playwright/test'
 import type { Locator, Page } from '@playwright/test'
 
 export class ToastHelper {
-  public readonly visibleToasts: Locator
-  public readonly toastErrors: Locator
+  constructor(private readonly page: Page) {}
 
-  constructor(private readonly page: Page) {
-    this.visibleToasts = page.locator('.p-toast-message:visible')
-    this.toastErrors = page.locator('.p-toast-message.p-toast-message-error')
+  get visibleToasts(): Locator {
+    return this.page.locator('.p-toast-message:visible')
+  }
+
+  get toastErrors(): Locator {
+    return this.page.locator('.p-toast-message.p-toast-message-error')
   }
 
   async closeToasts(requireCount = 0): Promise<void> {
@@ -26,6 +28,6 @@ export class ToastHelper {
     }
 
     // Assert all toasts are closed
-    await expect(this.visibleToasts).toHaveCount(0)
+    await expect(this.visibleToasts).toHaveCount(0, { timeout: 1000 })
   }
 }

browser_tests/fixtures/selectors.ts

@@ -130,24 +130,6 @@ export const TestIds = {
     outputPlaceholder: 'builder-output-placeholder',
     connectOutputPopover: 'builder-connect-output-popover'
   },
-  outputHistory: {
-    outputs: 'linear-outputs',
-    welcome: 'linear-welcome',
-    outputInfo: 'linear-output-info',
-    activeQueue: 'linear-job',
-    queueBadge: 'linear-job-badge',
-    inProgressItem: 'linear-in-progress-item',
-    historyItem: 'linear-history-item',
-    skeleton: 'linear-skeleton',
-    latentPreview: 'linear-latent-preview',
-    imageOutput: 'linear-image-output',
-    videoOutput: 'linear-video-output',
-    cancelRun: 'linear-cancel-run',
-    headerProgressBar: 'linear-header-progress-bar',
-    itemProgressBar: 'linear-item-progress-bar',
-    progressOverall: 'linear-progress-overall',
-    progressNode: 'linear-progress-node'
-  },
   appMode: {
     widgetItem: 'app-mode-widget-item',
     welcome: 'linear-welcome',
@@ -198,7 +180,6 @@ export type TestIdValue =
   | (typeof TestIds.selectionToolbox)[keyof typeof TestIds.selectionToolbox]
   | (typeof TestIds.widgets)[keyof typeof TestIds.widgets]
   | (typeof TestIds.builder)[keyof typeof TestIds.builder]
-  | (typeof TestIds.outputHistory)[keyof typeof TestIds.outputHistory]
   | (typeof TestIds.appMode)[keyof typeof TestIds.appMode]
   | (typeof TestIds.breadcrumb)[keyof typeof TestIds.breadcrumb]
   | Exclude<

browser_tests/fixtures/utils/customMatchers.ts

@@ -18,7 +18,7 @@ function makeMatcher<T>(
         ? expect(value, 'Node is ' + type).not
         : expect(value, 'Node is not ' + type)
       assertion.toBeTruthy()
-    }).toPass({ timeout: 5000, ...options })
+    }).toPass({ timeout: 250, ...options })
     return {
       pass: !this.isNot,
       message: () => 'Node is ' + (this.isNot ? 'not ' : '') + type
@@ -30,7 +30,7 @@ export const comfyExpect = expect.extend({
   toBePinned: makeMatcher((n) => n.isPinned(), 'pinned'),
   toBeBypassed: makeMatcher((n) => n.isBypassed(), 'bypassed'),
   toBeCollapsed: makeMatcher((n) => n.isCollapsed(), 'collapsed'),
-  async toHaveFocus(locator: Locator, options = {}) {
+  async toHaveFocus(locator: Locator, options = { timeout: 256 }) {
     await expect
       .poll(
         () => locator.evaluate((el) => el === document.activeElement),

browser_tests/fixtures/utils/vueNodeFixtures.ts

@@ -4,26 +4,38 @@ import { TestIds } from '@e2e/fixtures/selectors'
 
 /** DOM-centric helper for a single Vue-rendered node on the canvas. */
 export class VueNodeFixture {
-  public readonly header: Locator
-  public readonly title: Locator
-  public readonly titleInput: Locator
-  public readonly body: Locator
-  public readonly pinIndicator: Locator
-  public readonly collapseButton: Locator
-  public readonly collapseIcon: Locator
-  public readonly root: Locator
+  constructor(private readonly locator: Locator) {}
 
-  constructor(private readonly locator: Locator) {
-    this.header = locator.locator('[data-testid^="node-header-"]')
-    this.title = locator.locator('[data-testid="node-title"]')
-    this.titleInput = locator.locator('[data-testid="node-title-input"]')
-    this.body = locator.locator('[data-testid^="node-body-"]')
-    this.pinIndicator = locator.getByTestId(TestIds.node.pinIndicator)
-    this.collapseButton = locator.locator(
-      '[data-testid="node-collapse-button"]'
-    )
-    this.collapseIcon = this.collapseButton.locator('i')
-    this.root = locator
+  get header(): Locator {
+    return this.locator.locator('[data-testid^="node-header-"]')
+  }
+
+  get title(): Locator {
+    return this.locator.locator('[data-testid="node-title"]')
+  }
+
+  get titleInput(): Locator {
+    return this.locator.locator('[data-testid="node-title-input"]')
+  }
+
+  get body(): Locator {
+    return this.locator.locator('[data-testid^="node-body-"]')
+  }
+
+  get pinIndicator(): Locator {
+    return this.locator.getByTestId(TestIds.node.pinIndicator)
+  }
+
+  get collapseButton(): Locator {
+    return this.locator.locator('[data-testid="node-collapse-button"]')
+  }
+
+  get collapseIcon(): Locator {
+    return this.collapseButton.locator('i')
+  }
+
+  get root(): Locator {
+    return this.locator
   }
 
   async getTitle(): Promise<string> {

browser_tests/fixtures/ws.ts

@@ -1,31 +1,53 @@
 import { test as base } from '@playwright/test'
-import type { WebSocketRoute } from '@playwright/test'
 
 export const webSocketFixture = base.extend<{
-  getWebSocket: () => Promise<WebSocketRoute>
+  ws: { trigger(data: unknown, url?: string): Promise<void> }
 }>({
-  getWebSocket: [
-    async ({ context }, use) => {
-      let latest: WebSocketRoute | undefined
-      let resolve: ((ws: WebSocketRoute) => void) | undefined
-
-      await context.routeWebSocket(/\/ws/, (ws) => {
-        const server = ws.connectToServer()
-        server.onMessage((message) => {
-          ws.send(message)
+  ws: [
+    async ({ page }, use) => {
+      // Each time a page loads, to catch navigations
+      page.on('load', async () => {
+        await page.evaluate(function () {
+          // Create a wrapper for WebSocket that stores them globally
+          // so we can look it up to trigger messages
+          const store: Record<string, WebSocket> = (window.__ws__ = {})
+          window.WebSocket = class extends window.WebSocket {
+            constructor(
+              ...rest: ConstructorParameters<typeof window.WebSocket>
+            ) {
+              super(...rest)
+              store[this.url] = this
+            }
+          }
         })
-
-        latest = ws
-        resolve?.(ws)
       })
 
-      await use(() => {
-        if (latest) return Promise.resolve(latest)
-        return new Promise<WebSocketRoute>((r) => {
-          resolve = r
-        })
+      await use({
+        async trigger(data, url) {
+          // Trigger a websocket event on the page
+          await page.evaluate(
+            function ([data, url]) {
+              if (!url) {
+                // If no URL specified, use page URL
+                const u = new URL(window.location.href)
+                u.hash = ''
+                u.protocol = 'ws:'
+                u.pathname = '/'
+                url = u.toString() + 'ws'
+              }
+              const ws: WebSocket = window.__ws__![url]
+              ws.dispatchEvent(
+                new MessageEvent('message', {
+                  data
+                })
+              )
+            },
+            [JSON.stringify(data), url]
+          )
+        }
       })
     },
+    // We need this to run automatically as the first thing so it adds handlers as soon as the page loads
     { auto: true }
   ]
 })

browser_tests/helpers/builderTestUtils.ts

@@ -82,9 +82,11 @@ export async function builderSaveAs(
   viewType: 'App' | 'Node graph' = 'App'
 ) {
   await appMode.footer.saveAsButton.click()
-  await comfyExpect(appMode.saveAs.nameInput).toBeVisible()
+  await comfyExpect(appMode.saveAs.nameInput).toBeVisible({ timeout: 5000 })
   await appMode.saveAs.fillAndSave(workflowName, viewType)
-  await comfyExpect(appMode.saveAs.successMessage).toBeVisible()
+  await comfyExpect(appMode.saveAs.successMessage).toBeVisible({
+    timeout: 5000
+  })
 }
 
 /**
@@ -122,21 +124,3 @@ export async function saveAndReopenInAppMode(
 
   await comfyPage.appMode.toggleAppMode()
 }
-
-/**
- * Enter builder, select the given widgets as inputs + SaveImage as output,
- * save as an app, and close the success dialog.
- *
- * Returns on the builder arrange/preview step.
- */
-export async function createAndSaveApp(
-  comfyPage: ComfyPage,
-  appName: string,
-  widgetNames: string[] = ['seed']
-): Promise<void> {
-  await setupBuilder(comfyPage, undefined, widgetNames)
-  await comfyPage.appMode.steps.goToPreview()
-  await builderSaveAs(comfyPage.appMode, appName)
-  await comfyPage.appMode.saveAs.closeButton.click()
-  await comfyPage.nextFrame()
-}

browser_tests/tests/actionbar.spec.ts

@@ -1,6 +1,7 @@
 import type { Response } from '@playwright/test'
 import { expect, mergeTests } from '@playwright/test'
 
+import type { StatusWsMessage } from '@/schemas/apiSchema'
 import { comfyPageFixture } from '@e2e/fixtures/ComfyPage'
 import { webSocketFixture } from '@e2e/fixtures/ws'
 import type { WorkspaceStore } from '@e2e/types/globals'
@@ -17,10 +18,8 @@ test.describe('Actionbar', { tag: '@ui' }, () => {
    */
   test('Does not auto-queue multiple changes at a time', async ({
     comfyPage,
-    getWebSocket
+    ws
   }) => {
-    const ws = await getWebSocket()
-
     // Enable change auto-queue mode
     const queueOpts = await comfyPage.actionbar.queueButton.toggleOptions()
     await expect.poll(() => queueOpts.getMode()).toBe('disabled')
@@ -63,19 +62,17 @@ test.describe('Actionbar', { tag: '@ui' }, () => {
     }
 
     // Trigger a status websocket message
-    const triggerStatus = (queueSize: number) => {
-      ws.send(
-        JSON.stringify({
-          type: 'status',
-          data: {
-            status: {
-              exec_info: {
-                queue_remaining: queueSize
-              }
+    const triggerStatus = async (queueSize: number) => {
+      await ws.trigger({
+        type: 'status',
+        data: {
+          status: {
+            exec_info: {
+              queue_remaining: queueSize
             }
           }
-        })
-      )
+        }
+      } as StatusWsMessage)
     }
 
     // Extract the width from the queue response
@@ -107,8 +104,8 @@ test.describe('Actionbar', { tag: '@ui' }, () => {
     ).toBe(1)
 
     // Trigger a status update so auto-queue re-runs
-    triggerStatus(1)
-    triggerStatus(0)
+    await triggerStatus(1)
+    await triggerStatus(0)
 
     // Ensure the queued width is the last queued value
     expect(

browser_tests/tests/appModeDropdownClipping.spec.ts

@@ -75,7 +75,9 @@ test.describe('App mode dropdown clipping', { tag: '@ui' }, () => {
     ]
     await comfyPage.appMode.enterAppModeWithInputs(inputs)
 
-    await expect(comfyPage.appMode.linearWidgets).toBeVisible()
+    await expect(comfyPage.appMode.linearWidgets).toBeVisible({
+      timeout: 5000
+    })
 
     // Scroll to bottom so the codec widget is at the clipping edge
     const widgetList = comfyPage.appMode.linearWidgets
@@ -88,7 +90,7 @@ test.describe('App mode dropdown clipping', { tag: '@ui' }, () => {
     await codecSelect.click()
 
     const overlay = comfyPage.page.locator('.p-select-overlay').first()
-    await expect(overlay).toBeVisible()
+    await expect(overlay).toBeVisible({ timeout: 5000 })
 
     await expect
       .poll(() =>
@@ -121,7 +123,9 @@ test.describe('App mode dropdown clipping', { tag: '@ui' }, () => {
     ]
     await comfyPage.appMode.enterAppModeWithInputs(inputs)
 
-    await expect(comfyPage.appMode.linearWidgets).toBeVisible()
+    await expect(comfyPage.appMode.linearWidgets).toBeVisible({
+      timeout: 5000
+    })
 
     // Scroll to bottom so the image widget is at the clipping edge
     const widgetList = comfyPage.appMode.linearWidgets
@@ -140,7 +144,7 @@ test.describe('App mode dropdown clipping', { tag: '@ui' }, () => {
     // The unstyled PrimeVue Popover renders with role="dialog".
     // Locate the one containing the image grid (filter buttons like "All", "Inputs").
     const popover = comfyPage.appMode.imagePickerPopover
-    await expect(popover).toBeVisible()
+    await expect(popover).toBeVisible({ timeout: 5000 })
 
     await expect
       .poll(() =>

browser_tests/tests/appModeWidgetRename.spec.ts

@@ -26,7 +26,7 @@ test.describe('App mode widget rename', { tag: ['@ui', '@subgraph'] }, () => {
     await appMode.steps.goToInputs()
 
     const menu = appMode.select.getInputItemMenu('seed')
-    await expect(menu).toBeVisible()
+    await expect(menu).toBeVisible({ timeout: 5000 })
     await appMode.select.renameInputViaMenu('seed', 'Builder Input Seed')
 
     // Verify in app mode after save/reload
@@ -34,7 +34,7 @@ test.describe('App mode widget rename', { tag: ['@ui', '@subgraph'] }, () => {
     const workflowName = `${new Date().getTime()} builder-input-menu`
     await saveAndReopenInAppMode(comfyPage, workflowName)
 
-    await expect(appMode.linearWidgets).toBeVisible()
+    await expect(appMode.linearWidgets).toBeVisible({ timeout: 5000 })
     await expect(
       appMode.linearWidgets.getByText('Builder Input Seed')
     ).toBeVisible()
@@ -54,7 +54,7 @@ test.describe('App mode widget rename', { tag: ['@ui', '@subgraph'] }, () => {
     const workflowName = `${new Date().getTime()} builder-input-dblclick`
     await saveAndReopenInAppMode(comfyPage, workflowName)
 
-    await expect(appMode.linearWidgets).toBeVisible()
+    await expect(appMode.linearWidgets).toBeVisible({ timeout: 5000 })
     await expect(appMode.linearWidgets.getByText('Dblclick Seed')).toBeVisible()
   })
 
@@ -65,7 +65,7 @@ test.describe('App mode widget rename', { tag: ['@ui', '@subgraph'] }, () => {
     await appMode.steps.goToPreview()
 
     const menu = appMode.select.getPreviewWidgetMenu('seed — New Subgraph')
-    await expect(menu).toBeVisible()
+    await expect(menu).toBeVisible({ timeout: 5000 })
     await appMode.select.renameWidget(menu, 'Preview Seed')
 
     // Verify in app mode after save/reload
@@ -73,7 +73,7 @@ test.describe('App mode widget rename', { tag: ['@ui', '@subgraph'] }, () => {
     const workflowName = `${new Date().getTime()} builder-preview`
     await saveAndReopenInAppMode(comfyPage, workflowName)
 
-    await expect(appMode.linearWidgets).toBeVisible()
+    await expect(appMode.linearWidgets).toBeVisible({ timeout: 5000 })
     await expect(appMode.linearWidgets.getByText('Preview Seed')).toBeVisible()
   })
 
@@ -85,7 +85,7 @@ test.describe('App mode widget rename', { tag: ['@ui', '@subgraph'] }, () => {
     await appMode.footer.exitBuilder()
     await appMode.toggleAppMode()
 
-    await expect(appMode.linearWidgets).toBeVisible()
+    await expect(appMode.linearWidgets).toBeVisible({ timeout: 5000 })
 
     const menu = appMode.getAppModeWidgetMenu('seed')
     await appMode.select.renameWidget(menu, 'App Mode Seed')
@@ -97,7 +97,7 @@ test.describe('App mode widget rename', { tag: ['@ui', '@subgraph'] }, () => {
     const workflowName = `${new Date().getTime()} app-mode`
     await saveAndReopenInAppMode(comfyPage, workflowName)
 
-    await expect(appMode.linearWidgets).toBeVisible()
+    await expect(appMode.linearWidgets).toBeVisible({ timeout: 5000 })
     await expect(appMode.linearWidgets.getByText('App Mode Seed')).toBeVisible()
   })
 })

browser_tests/tests/appModeWidgetValues.spec.ts

@@ -63,7 +63,7 @@ test.describe('App mode widget values in prompt', { tag: '@ui' }, () => {
       ({ nodeId, widgetName }) => [nodeId, widgetName]
     )
     await appMode.enterAppModeWithInputs(inputs)
-    await expect(appMode.linearWidgets).toBeVisible()
+    await expect(appMode.linearWidgets).toBeVisible({ timeout: 5000 })
 
     for (const { nodeId, widgetName, type, fill } of WIDGET_TEST_DATA) {
       const key = `${nodeId}:${widgetName}`

browser_tests/tests/builderReorder.spec.ts

@@ -6,7 +6,6 @@ import type { ComfyPage } from '@e2e/fixtures/ComfyPage'
 import type { AppModeHelper } from '@e2e/fixtures/helpers/AppModeHelper'
 import {
   builderSaveAs,
-  createAndSaveApp,
   openWorkflowFromSidebar,
   setupBuilder
 } from '@e2e/helpers/builderTestUtils'
@@ -123,7 +122,7 @@ test.describe('Builder input reordering', { tag: '@ui' }, () => {
     const workflowName = `${Date.now()} reorder-preview`
     await saveCloseAndReopenAsApp(comfyPage, appMode, workflowName)
 
-    await expect(appMode.linearWidgets).toBeVisible()
+    await expect(appMode.linearWidgets).toBeVisible({ timeout: 5000 })
     await expect(appMode.select.previewWidgetLabels).toHaveText([
       'steps',
       'cfg',
@@ -148,58 +147,11 @@ test.describe('Builder input reordering', { tag: '@ui' }, () => {
     const workflowName = `${Date.now()} reorder-persist`
     await saveCloseAndReopenAsApp(comfyPage, appMode, workflowName)
 
-    await expect(appMode.linearWidgets).toBeVisible()
+    await expect(appMode.linearWidgets).toBeVisible({ timeout: 5000 })
     await expect(appMode.select.previewWidgetLabels).toHaveText([
       'steps',
       'cfg',
       'seed'
     ])
   })
-
-  test('Reordering inputs in one app does not corrupt another app', async ({
-    comfyPage
-  }) => {
-    const { appMode } = comfyPage
-    const suffix = String(Date.now())
-    const app1Name = `app1-${suffix}`
-    const app2Name = `app2-${suffix}`
-    const app2Widgets = ['seed', 'steps']
-
-    // Create and save app1 with [seed, steps, cfg]
-    await createAndSaveApp(comfyPage, app1Name, WIDGETS)
-    await appMode.footer.exitBuilder()
-
-    // Create app2 in a new tab so both apps are open simultaneously
-    await comfyPage.menu.topbar.triggerTopbarCommand(['New'])
-    await createAndSaveApp(comfyPage, app2Name, app2Widgets)
-    await appMode.footer.exitBuilder()
-
-    // Switch to app1 tab and enter builder
-    await comfyPage.menu.topbar.getWorkflowTab(app1Name).click()
-    await appMode.enterBuilder()
-    await appMode.steps.goToInputs()
-    await expect(appMode.select.inputItemTitles).toHaveText(WIDGETS)
-
-    // Reorder app1 inputs: drag 'seed' from first to last
-    await appMode.select.dragInputItem(0, 2)
-    const app1Reordered = ['steps', 'cfg', 'seed']
-    await expect(appMode.select.inputItemTitles).toHaveText(app1Reordered)
-
-    // Switch to app2 tab and enter builder
-    await appMode.footer.exitBuilder()
-    await comfyPage.menu.topbar.getWorkflowTab(app2Name).click()
-    await appMode.enterBuilder()
-    await appMode.steps.goToInputs()
-
-    // Verify app2 inputs are not corrupted — still [seed, steps]
-    await expect(appMode.select.inputItemTitles).toHaveText(app2Widgets)
-
-    // Switch back to app1 and verify reorder persisted
-    await appMode.footer.exitBuilder()
-    await comfyPage.menu.topbar.getWorkflowTab(app1Name).click()
-    await appMode.enterBuilder()
-    await appMode.steps.goToInputs()
-
-    await expect(appMode.select.inputItemTitles).toHaveText(app1Reordered)
-  })
 })

browser_tests/tests/builderSaveFlow.spec.ts

@@ -21,7 +21,7 @@ async function reSaveAs(
   viewType: 'App' | 'Node graph'
 ) {
   await appMode.footer.openSaveAsFromChevron()
-  await expect(appMode.saveAs.nameInput).toBeVisible()
+  await expect(appMode.saveAs.nameInput).toBeVisible({ timeout: 5000 })
   await appMode.saveAs.fillAndSave(workflowName, viewType)
 }
 
@@ -48,7 +48,7 @@ test.describe('Builder save flow', { tag: ['@ui'] }, () => {
     await setupBuilder(comfyPage)
     await comfyPage.appMode.footer.saveAsButton.click()
 
-    await expect(saveAs.dialog).toBeVisible()
+    await expect(saveAs.dialog).toBeVisible({ timeout: 5000 })
     await expect(saveAs.nameInput).toBeVisible()
     await expect(saveAs.title).toBeVisible()
     await expect(saveAs.radioGroup).toBeVisible()
@@ -68,7 +68,7 @@ test.describe('Builder save flow', { tag: ['@ui'] }, () => {
     await setupBuilder(comfyPage)
     await comfyPage.appMode.footer.saveAsButton.click()
 
-    await expect(saveAs.dialog).toBeVisible()
+    await expect(saveAs.dialog).toBeVisible({ timeout: 5000 })
     await saveAs.nameInput.fill('')
     await expect(saveAs.saveButton).toBeDisabled()
   })
@@ -78,7 +78,7 @@ test.describe('Builder save flow', { tag: ['@ui'] }, () => {
     await setupBuilder(comfyPage)
     await comfyPage.appMode.footer.saveAsButton.click()
 
-    await expect(saveAs.dialog).toBeVisible()
+    await expect(saveAs.dialog).toBeVisible({ timeout: 5000 })
 
     const appRadio = saveAs.viewTypeRadio('App')
     await expect(appRadio).toHaveAttribute('aria-checked', 'true')
@@ -136,12 +136,12 @@ test.describe('Builder save flow', { tag: ['@ui'] }, () => {
     // Modify the workflow so the save button becomes enabled
     await comfyPage.appMode.steps.goToInputs()
     await comfyPage.appMode.select.deleteInput('seed')
-    await expect(footer.saveButton).toBeEnabled()
+    await expect(footer.saveButton).toBeEnabled({ timeout: 5000 })
 
     await footer.saveButton.click()
     await comfyPage.nextFrame()
 
-    await expect(saveAs.dialog).not.toBeVisible()
+    await expect(saveAs.dialog).not.toBeVisible({ timeout: 2000 })
     await expect(footer.saveButton).toBeDisabled()
   })
 
@@ -156,7 +156,7 @@ test.describe('Builder save flow', { tag: ['@ui'] }, () => {
 
     await footer.openSaveAsFromChevron()
 
-    await expect(saveAs.title).toBeVisible()
+    await expect(saveAs.title).toBeVisible({ timeout: 5000 })
     await expect(saveAs.nameInput).toBeVisible()
   })
 
@@ -209,7 +209,7 @@ test.describe('Builder save flow', { tag: ['@ui'] }, () => {
 
     await expect(
       comfyPage.page.getByText('Connect an output', { exact: false })
-    ).toBeVisible()
+    ).toBeVisible({ timeout: 5000 })
   })
 
   test('save as app produces correct extension and linearMode', async ({
@@ -291,7 +291,7 @@ test.describe('Builder save flow', { tag: ['@ui'] }, () => {
 
     // Re-save as node graph — creates a copy
     await reSaveAs(appMode, `${Date.now()} copy`, 'Node graph')
-    await expect(appMode.saveAs.successMessage).toBeVisible()
+    await expect(appMode.saveAs.successMessage).toBeVisible({ timeout: 5000 })
 
     await expect
       .poll(() => comfyPage.workflow.getActiveWorkflowPath())
@@ -325,11 +325,11 @@ test.describe('Builder save flow', { tag: ['@ui'] }, () => {
 
     await reSaveAs(appMode, name, 'App')
 
-    await expect(appMode.saveAs.overwriteDialog).toBeVisible()
+    await expect(appMode.saveAs.overwriteDialog).toBeVisible({ timeout: 5000 })
     await appMode.saveAs.overwriteButton.click()
     await expect(appMode.saveAs.overwriteDialog).not.toBeVisible()
 
-    await expect(appMode.saveAs.successMessage).toBeVisible()
+    await expect(appMode.saveAs.successMessage).toBeVisible({ timeout: 5000 })
 
     await expect
       .poll(() => comfyPage.workflow.getActiveWorkflowPath())
@@ -351,7 +351,7 @@ test.describe('Builder save flow', { tag: ['@ui'] }, () => {
     await dismissSuccessDialog(appMode.saveAs)
 
     await reSaveAs(appMode, name, 'Node graph')
-    await expect(appMode.saveAs.successMessage).toBeVisible()
+    await expect(appMode.saveAs.successMessage).toBeVisible({ timeout: 5000 })
 
     await expect
       .poll(() => comfyPage.workflow.getActiveWorkflowPath())

browser_tests/tests/changeTracker.spec.ts

@@ -206,8 +206,8 @@ test.describe('Change Tracker', { tag: '@workflow' }, () => {
 
     // Ensure undo reverts both changes
     await comfyPage.keyboard.undo()
-    await expect(node).not.toBeBypassed()
-    await expect(node).not.toBeCollapsed()
+    await expect(node).not.toBeBypassed({ timeout: 5000 })
+    await expect(node).not.toBeCollapsed({ timeout: 5000 })
     await waitForChangeTrackerSettled(comfyPage, {
       isModified: false,
       redoQueueSize: 1,

browser_tests/tests/cloud-asset-default.spec.ts

@@ -75,18 +75,15 @@ test.describe('Asset-supported node default value', { tag: '@cloud' }, () => {
     })
 
     await expect
-      .poll(
-        async () => {
-          return await comfyPage.page.evaluate((id) => {
-            const node = window.app!.graph.getNodeById(id)
-            const widget = node?.widgets?.find(
-              (w: { name: string }) => w.name === 'ckpt_name'
-            )
-            return String(widget?.value ?? '')
-          }, nodeId)
-        },
-        { timeout: 10_000 }
-      )
+      .poll(async () => {
+        return await comfyPage.page.evaluate((id) => {
+          const node = window.app!.graph.getNodeById(id)
+          const widget = node?.widgets?.find(
+            (w: { name: string }) => w.name === 'ckpt_name'
+          )
+          return String(widget?.value ?? '')
+        }, nodeId)
+      })
       .toBe(CLOUD_ASSETS[0].name)
   })
 })

browser_tests/tests/copyPaste.spec.ts

@@ -149,7 +149,11 @@ test.describe('Copy Paste', { tag: ['@screenshot', '@workflow'] }, () => {
       await comfyPage.canvas.click({ position: { x: 50, y: 500 } })
       await comfyPage.nextFrame()
       await comfyPage.clipboard.paste()
-      await expect.poll(() => comfyPage.nodeOps.getGraphNodesCount()).toBe(3)
+      await expect
+        .poll(() => comfyPage.nodeOps.getGraphNodesCount(), {
+          timeout: 5_000
+        })
+        .toBe(3)
 
       // Step 2: Paste image onto selected LoadImage node
       const loadImageNodes =
@@ -167,10 +171,13 @@ test.describe('Copy Paste', { tag: ['@screenshot', '@workflow'] }, () => {
       await uploadPromise
 
       await expect
-        .poll(async () => {
-          const fileWidget = await loadImageNodes[0].getWidget(0)
-          return fileWidget.getValue()
-        })
+        .poll(
+          async () => {
+            const fileWidget = await loadImageNodes[0].getWidget(0)
+            return fileWidget.getValue()
+          },
+          { timeout: 5_000 }
+        )
         .toContain('image32x32')
       await expect.poll(() => comfyPage.nodeOps.getGraphNodesCount()).toBe(3)
 
@@ -187,7 +194,11 @@ test.describe('Copy Paste', { tag: ['@screenshot', '@workflow'] }, () => {
       )
       await uploadPromise2
 
-      await expect.poll(() => comfyPage.nodeOps.getGraphNodesCount()).toBe(4)
+      await expect
+        .poll(() => comfyPage.nodeOps.getGraphNodesCount(), {
+          timeout: 5_000
+        })
+        .toBe(4)
       const allLoadImageNodes =
         await comfyPage.nodeOps.getNodeRefsByType('LoadImage')
       expect(allLoadImageNodes).toHaveLength(2)

browser_tests/tests/defaultKeybindings.spec.ts

@@ -250,7 +250,7 @@ test.describe('Default Keybindings', { tag: '@keyboard' }, () => {
 
       // The Save As dialog should appear (p-dialog overlay)
       const dialogOverlay = comfyPage.page.locator('.p-dialog-mask')
-      await expect(dialogOverlay).toBeVisible()
+      await expect(dialogOverlay).toBeVisible({ timeout: 3000 })
 
       // Dismiss the dialog
       await comfyPage.page.keyboard.press('Escape')
@@ -303,7 +303,9 @@ test.describe('Default Keybindings', { tag: '@keyboard' }, () => {
       // After conversion, node count should decrease
       // (multiple nodes replaced by single subgraph node)
       await expect
-        .poll(() => comfyPage.nodeOps.getGraphNodesCount())
+        .poll(() => comfyPage.nodeOps.getGraphNodesCount(), {
+          timeout: 5000
+        })
         .toBeLessThan(initialCount)
     })
 

browser_tests/tests/dialogs/settingsDialog.spec.ts

@@ -153,7 +153,7 @@ test.describe('Settings dialog', { tag: '@ui' }, () => {
         const expanded = await select.getAttribute('aria-expanded')
         if (expanded !== 'true') await select.click()
         await expect(select).toHaveAttribute('aria-expanded', 'true')
-      }).toPass({ timeout: 5000 })
+      }).toPass({ timeout: 3000 })
 
       // Pick the option that is not the current value
       const targetValue = initialValue === 'Top' ? 'Disabled' : 'Top'

browser_tests/tests/errorOverlay.spec.ts

@@ -112,10 +112,10 @@ test.describe('Error overlay', { tag: '@ui' }, () => {
       await comfyPage.nextFrame()
 
       await comfyPage.keyboard.undo()
-      await expect(errorOverlay).not.toBeVisible()
+      await expect(errorOverlay).not.toBeVisible({ timeout: 5000 })
 
       await comfyPage.keyboard.redo()
-      await expect(errorOverlay).not.toBeVisible()
+      await expect(errorOverlay).not.toBeVisible({ timeout: 5000 })
     })
   })
 

browser_tests/tests/execution.spec.ts

@@ -63,13 +63,19 @@ test.describe(
 
       await comfyPage.command.executeCommand('Comfy.QueueSelectedOutputNodes')
       await expect
-        .poll(async () => (await input.getWidget(0)).getValue())
+        .poll(async () => (await input.getWidget(0)).getValue(), {
+          timeout: 2_000
+        })
         .toBe('foo')
       await expect
-        .poll(async () => (await output1.getWidget(0)).getValue())
+        .poll(async () => (await output1.getWidget(0)).getValue(), {
+          timeout: 2_000
+        })
         .toBe('foo')
       await expect
-        .poll(async () => (await output2.getWidget(0)).getValue())
+        .poll(async () => (await output2.getWidget(0)).getValue(), {
+          timeout: 2_000
+        })
         .toBe('')
     })
   }

browser_tests/tests/interaction.spec.ts

@@ -351,20 +351,16 @@ test.describe('Node Interaction', () => {
       await expect(comfyPage.canvas).toHaveScreenshot(
         'text-encode-toggled-off.png'
       )
-      // Wait for the double-click window (300ms) to expire so the next
-      // click at the same position isn't interpreted as a double-click.
-      await expect
-        .poll(() =>
-          comfyPage.page.evaluate(() => {
-            const pointer = window.app!.canvas.pointer
-            if (!pointer.eLastDown) return true
-            return performance.now() - pointer.eLastDown.timeStamp > 300
-          })
-        )
-        .toBe(true)
-      await comfyPage.canvas.click({
-        position: togglerPos
-      })
+      // Re-expand: clicking the canvas toggler on a collapsed node is
+      // unreliable because DOM widget overlays may intercept the pointer
+      // event. Use programmatic collapse() for the expand step.
+      // TODO(#11006): Restore click-to-expand once DOM widget overlay pointer interception is fixed
+      await comfyPage.page.evaluate((nodeId) => {
+        const node = window.app!.graph.getNodeById(nodeId)!
+        node.collapse()
+        window.app!.canvas.setDirty(true, true)
+      }, targetNode.id)
+      await comfyPage.nextFrame()
       await expect.poll(() => targetNode.isCollapsed()).toBe(false)
       // Move mouse away to avoid hover highlight differences.
       await comfyPage.canvasOps.moveMouseToEmptyArea()

browser_tests/tests/keybindingPresets.spec.ts

@@ -79,7 +79,9 @@ test.describe('Keybinding Presets', { tag: '@keyboard' }, () => {
     await expect(presetTrigger).toContainText('test-preset')
 
     // Wait for toast to auto-dismiss, then close settings via Escape
-    await expect(comfyPage.toast.visibleToasts).toHaveCount(0)
+    await expect(comfyPage.toast.visibleToasts).toHaveCount(0, {
+      timeout: 5000
+    })
     await page.keyboard.press('Escape')
     await comfyPage.settingDialog.waitForHidden()
 
@@ -131,7 +133,9 @@ test.describe('Keybinding Presets', { tag: '@keyboard' }, () => {
     await expect(presetTrigger).toContainText('test-preset')
 
     // Wait for toast to auto-dismiss
-    await expect(comfyPage.toast.visibleToasts).toHaveCount(0)
+    await expect(comfyPage.toast.visibleToasts).toHaveCount(0, {
+      timeout: 5000
+    })
 
     // Export via ellipsis menu
     await menuButton.click()
@@ -179,7 +183,9 @@ test.describe('Keybinding Presets', { tag: '@keyboard' }, () => {
     await expect(presetTrigger).toContainText('test-preset')
 
     // Wait for toast to auto-dismiss
-    await expect(comfyPage.toast.visibleToasts).toHaveCount(0)
+    await expect(comfyPage.toast.visibleToasts).toHaveCount(0, {
+      timeout: 5000
+    })
 
     // Delete via ellipsis menu
     await menuButton.click()
@@ -217,7 +223,9 @@ test.describe('Keybinding Presets', { tag: '@keyboard' }, () => {
     await expect(presetTrigger).toContainText('test-preset')
 
     // Wait for toast to auto-dismiss
-    await expect(comfyPage.toast.visibleToasts).toHaveCount(0)
+    await expect(comfyPage.toast.visibleToasts).toHaveCount(0, {
+      timeout: 5000
+    })
 
     // Save as new preset via ellipsis menu
     await menuButton.click()
@@ -229,7 +237,9 @@ test.describe('Keybinding Presets', { tag: '@keyboard' }, () => {
     await promptInput.press('Enter')
 
     // Wait for toast to auto-dismiss
-    await expect(comfyPage.toast.visibleToasts).toHaveCount(0)
+    await expect(comfyPage.toast.visibleToasts).toHaveCount(0, {
+      timeout: 5000
+    })
 
     // Verify preset trigger shows my-custom-preset
     await expect(presetTrigger).toContainText('my-custom-preset')

browser_tests/tests/linearMode.spec.ts

@@ -16,7 +16,7 @@ test.describe('Linear Mode', { tag: '@ui' }, () => {
 
     await expect(
       comfyPage.page.locator('[data-testid="linear-widgets"]')
-    ).toBeVisible()
+    ).toBeVisible({ timeout: 5000 })
   })
 
   test('Run button visible in linear mode', async ({ comfyPage }) => {
@@ -24,7 +24,7 @@ test.describe('Linear Mode', { tag: '@ui' }, () => {
 
     await expect(
       comfyPage.page.locator('[data-testid="linear-run-button"]')
-    ).toBeVisible()
+    ).toBeVisible({ timeout: 5000 })
   })
 
   test('Workflow info section visible', async ({ comfyPage }) => {
@@ -32,7 +32,7 @@ test.describe('Linear Mode', { tag: '@ui' }, () => {
 
     await expect(
       comfyPage.page.locator('[data-testid="linear-workflow-info"]')
-    ).toBeVisible()
+    ).toBeVisible({ timeout: 5000 })
   })
 
   test('Returns to graph mode', async ({ comfyPage }) => {
@@ -40,11 +40,11 @@ test.describe('Linear Mode', { tag: '@ui' }, () => {
 
     await expect(
       comfyPage.page.locator('[data-testid="linear-widgets"]')
-    ).toBeVisible()
+    ).toBeVisible({ timeout: 5000 })
 
     await comfyPage.appMode.toggleAppMode()
 
-    await expect(comfyPage.canvas).toBeVisible()
+    await expect(comfyPage.canvas).toBeVisible({ timeout: 5000 })
     await expect(
       comfyPage.page.locator('[data-testid="linear-widgets"]')
     ).not.toBeVisible()
@@ -55,7 +55,7 @@ test.describe('Linear Mode', { tag: '@ui' }, () => {
 
     await expect(
       comfyPage.page.locator('[data-testid="linear-widgets"]')
-    ).toBeVisible()
+    ).toBeVisible({ timeout: 5000 })
     await expect(comfyPage.canvas).not.toBeVisible()
   })
 })

browser_tests/tests/load3d/Load3DViewerHelper.ts

@@ -25,6 +25,6 @@ export class Load3DViewerHelper {
   }
 
   async waitForClosed(): Promise<void> {
-    await expect(this.dialog).toBeHidden()
+    await expect(this.dialog).toBeHidden({ timeout: 5000 })
   }
 }

browser_tests/tests/load3d/load3d.spec.ts

@@ -66,14 +66,16 @@ test.describe('Load3D', () => {
       await comfyPage.nextFrame()
 
       await expect
-        .poll(() =>
-          comfyPage.page.evaluate(() => {
-            const n = window.app!.graph.getNodeById(1)
-            const config = n?.properties?.['Scene Config'] as
-              | Record<string, string>
-              | undefined
-            return config?.backgroundColor
-          })
+        .poll(
+          () =>
+            comfyPage.page.evaluate(() => {
+              const n = window.app!.graph.getNodeById(1)
+              const config = n?.properties?.['Scene Config'] as
+                | Record<string, string>
+                | undefined
+              return config?.backgroundColor
+            }),
+          { timeout: 3000 }
         )
         .toBe('#cc3333')
 
@@ -109,7 +111,9 @@ test.describe('Load3D', () => {
 
       const node = await comfyPage.nodeOps.getNodeRefById(1)
       const modelFileWidget = await node.getWidget(0)
-      await expect.poll(() => modelFileWidget.getValue()).toContain('cube.obj')
+      await expect
+        .poll(() => modelFileWidget.getValue(), { timeout: 5000 })
+        .toContain('cube.obj')
 
       await load3d.waitForModelLoaded()
       await comfyPage.nextFrame()
@@ -139,7 +143,9 @@ test.describe('Load3D', () => {
 
       const node = await comfyPage.nodeOps.getNodeRefById(1)
       const modelFileWidget = await node.getWidget(0)
-      await expect.poll(() => modelFileWidget.getValue()).toContain('cube.obj')
+      await expect
+        .poll(() => modelFileWidget.getValue(), { timeout: 5000 })
+        .toContain('cube.obj')
 
       await load3d.waitForModelLoaded()
       await comfyPage.nextFrame()

browser_tests/tests/load3d/load3dViewer.spec.ts

@@ -18,7 +18,9 @@ test.describe('Load3D Viewer', () => {
 
     const nodeRef = await comfyPage.nodeOps.getNodeRefById(1)
     const modelFileWidget = await nodeRef.getWidget(0)
-    await expect.poll(() => modelFileWidget.getValue()).toContain('cube.obj')
+    await expect
+      .poll(() => modelFileWidget.getValue(), { timeout: 5000 })
+      .toContain('cube.obj')
 
     await load3d.waitForModelLoaded()
   })

browser_tests/tests/nodeContextMenuOverflow.spec.ts

@@ -37,17 +37,19 @@ test.describe(
       await ksamplerNodes[0].click('title')
       await comfyPage.nextFrame()
 
-      await expect(comfyPage.page.locator('.selection-toolbox')).toBeVisible()
+      await expect(comfyPage.page.locator('.selection-toolbox')).toBeVisible({
+        timeout: 5000
+      })
 
       const moreOptionsBtn = comfyPage.page.locator(
         '[data-testid="more-options-button"]'
       )
-      await expect(moreOptionsBtn).toBeVisible()
+      await expect(moreOptionsBtn).toBeVisible({ timeout: 3000 })
       await moreOptionsBtn.click()
       await comfyPage.nextFrame()
 
       const menu = comfyPage.page.locator('.p-contextmenu')
-      await expect(menu).toBeVisible()
+      await expect(menu).toBeVisible({ timeout: 3000 })
 
       // Wait for constrainMenuHeight (runs via requestAnimationFrame in onMenuShow)
       await comfyPage.nextFrame()
@@ -66,7 +68,8 @@ test.describe(
           () => rootList.evaluate((el) => el.scrollHeight > el.clientHeight),
           {
             message:
-              'Menu should overflow vertically so this test exercises the viewport clamp'
+              'Menu should overflow vertically so this test exercises the viewport clamp',
+            timeout: 3000
           }
         )
         .toBe(true)
@@ -94,7 +97,9 @@ test.describe(
       await comfyPage.nextFrame()
 
       // The node should be removed from the graph
-      await expect.poll(() => comfyPage.nodeOps.getGraphNodesCount()).toBe(0)
+      await expect
+        .poll(() => comfyPage.nodeOps.getGraphNodesCount(), { timeout: 3000 })
+        .toBe(0)
     })
   }
 )

browser_tests/tests/outputHistory.spec.ts

@@ -1,413 +0,0 @@
-import type { WebSocketRoute } from '@playwright/test'
-import { mergeTests } from '@playwright/test'
-
-import type { RawJobListItem } from '@/platform/remote/comfyui/jobs/jobTypes'
-import { comfyPageFixture, comfyExpect as expect } from '../fixtures/ComfyPage'
-import type { ComfyPage } from '../fixtures/ComfyPage'
-import { webSocketFixture } from '../fixtures/ws'
-import { ExecutionHelper } from '../fixtures/helpers/ExecutionHelper'
-
-const test = mergeTests(comfyPageFixture, webSocketFixture)
-
-// Node IDs from the default workflow (browser_tests/assets/default.json, 7 nodes)
-const SAVE_IMAGE_NODE = '9'
-const KSAMPLER_NODE = '3'
-const ALL_NODE_IDS = ['4', '6', '7', '5', KSAMPLER_NODE, '8', SAVE_IMAGE_NODE]
-
-/** Queue a prompt, intercept it, and send execution_start. */
-async function startExecution(
-  comfyPage: ComfyPage,
-  ws: WebSocketRoute,
-  exec?: ExecutionHelper
-) {
-  exec ??= new ExecutionHelper(comfyPage, ws)
-  const jobId = await exec.run()
-  // Allow storeJob() to complete before sending WS events
-  await comfyPage.nextFrame()
-  exec.executionStart(jobId)
-  return { exec, jobId }
-}
-
-function imageOutput(...filenames: string[]) {
-  return {
-    images: filenames.map((filename) => ({
-      filename,
-      subfolder: '',
-      type: 'output'
-    }))
-  }
-}
-
-test.describe('Output History', { tag: '@ui' }, () => {
-  test.beforeEach(async ({ comfyPage }) => {
-    await comfyPage.settings.setSetting('Comfy.UseNewMenu', 'Top')
-    await comfyPage.appMode.enterAppModeWithInputs([[KSAMPLER_NODE, 'seed']])
-    await expect(comfyPage.appMode.linearWidgets).toBeVisible()
-    await comfyPage.nextFrame()
-  })
-
-  test('Skeleton appears on execution start', async ({
-    comfyPage,
-    getWebSocket
-  }) => {
-    const ws = await getWebSocket()
-    await startExecution(comfyPage, ws)
-
-    await expect(
-      comfyPage.appMode.outputHistory.skeletons.first()
-    ).toBeVisible()
-  })
-
-  test('Latent preview replaces skeleton', async ({
-    comfyPage,
-    getWebSocket
-  }) => {
-    const ws = await getWebSocket()
-    const { exec, jobId } = await startExecution(comfyPage, ws)
-
-    await expect(
-      comfyPage.appMode.outputHistory.skeletons.first()
-    ).toBeVisible()
-
-    exec.latentPreview(jobId, SAVE_IMAGE_NODE)
-
-    await expect(
-      comfyPage.appMode.outputHistory.latentPreviews.first()
-    ).toBeVisible()
-    await expect(comfyPage.appMode.outputHistory.skeletons).toHaveCount(0)
-  })
-
-  test('Image output replaces skeleton on executed', async ({
-    comfyPage,
-    getWebSocket
-  }) => {
-    const ws = await getWebSocket()
-    const { exec, jobId } = await startExecution(comfyPage, ws)
-
-    await expect(
-      comfyPage.appMode.outputHistory.inProgressItems.first()
-    ).toBeVisible()
-
-    exec.executed(jobId, SAVE_IMAGE_NODE, imageOutput('test_output.png'))
-
-    await expect(
-      comfyPage.appMode.outputHistory.imageOutputs.first()
-    ).toBeVisible()
-    await expect(comfyPage.appMode.outputHistory.skeletons).toHaveCount(0)
-  })
-
-  test('Multiple outputs from single execution', async ({
-    comfyPage,
-    getWebSocket
-  }) => {
-    const ws = await getWebSocket()
-    const { exec, jobId } = await startExecution(comfyPage, ws)
-
-    await expect(
-      comfyPage.appMode.outputHistory.inProgressItems.first()
-    ).toBeVisible()
-
-    exec.executed(
-      jobId,
-      SAVE_IMAGE_NODE,
-      imageOutput('output_001.png', 'output_002.png', 'output_003.png')
-    )
-
-    await expect(comfyPage.appMode.outputHistory.imageOutputs).toHaveCount(3)
-  })
-
-  test('Video output renders video element', async ({
-    comfyPage,
-    getWebSocket
-  }) => {
-    const ws = await getWebSocket()
-    const { exec, jobId } = await startExecution(comfyPage, ws)
-
-    await expect(
-      comfyPage.appMode.outputHistory.inProgressItems.first()
-    ).toBeVisible()
-
-    exec.executed(jobId, SAVE_IMAGE_NODE, {
-      gifs: [{ filename: 'output.mp4', subfolder: '', type: 'output' }]
-    })
-
-    await expect(
-      comfyPage.appMode.outputHistory.videoOutputs.first()
-    ).toBeVisible()
-  })
-
-  test('Cancel button sends interrupt during execution', async ({
-    comfyPage,
-    getWebSocket
-  }) => {
-    const ws = await getWebSocket()
-    const { exec, jobId } = await startExecution(comfyPage, ws)
-
-    const job: RawJobListItem = {
-      id: jobId,
-      status: 'in_progress',
-      create_time: Date.now() / 1000,
-      priority: 0
-    }
-    await comfyPage.page.route(
-      /\/api\/jobs\?status=in_progress/,
-      async (route) => {
-        await route.fulfill({
-          status: 200,
-          contentType: 'application/json',
-          body: JSON.stringify({
-            jobs: [job],
-            pagination: { offset: 0, limit: 200, total: 1, has_more: false }
-          })
-        })
-      },
-      { times: 1 }
-    )
-    // Trigger queue refresh
-    exec.status(1)
-    await comfyPage.nextFrame()
-
-    await expect(comfyPage.appMode.cancelRunButton).toBeVisible()
-
-    await comfyPage.page.route('**/interrupt', (route) =>
-      route.fulfill({ status: 200 })
-    )
-    const interruptRequest = comfyPage.page.waitForRequest('**/interrupt')
-    await comfyPage.appMode.cancelRunButton.click()
-    await interruptRequest
-  })
-
-  test('Full execution lifecycle cleans up in-progress items', async ({
-    comfyPage,
-    getWebSocket
-  }) => {
-    const ws = await getWebSocket()
-    const { exec, jobId } = await startExecution(comfyPage, ws)
-
-    // Skeleton appears
-    await expect(
-      comfyPage.appMode.outputHistory.skeletons.first()
-    ).toBeVisible()
-
-    // Latent preview replaces skeleton
-    exec.latentPreview(jobId, SAVE_IMAGE_NODE)
-    await expect(
-      comfyPage.appMode.outputHistory.latentPreviews.first()
-    ).toBeVisible()
-
-    // Image output replaces latent
-    exec.executed(jobId, SAVE_IMAGE_NODE, imageOutput('lifecycle_out.png'))
-    await expect(
-      comfyPage.appMode.outputHistory.imageOutputs.first()
-    ).toBeVisible()
-
-    // Job completes with history mock - in-progress items fully resolved
-    await exec.completeWithHistory(jobId, SAVE_IMAGE_NODE, 'lifecycle_out.png')
-
-    await expect(comfyPage.appMode.outputHistory.inProgressItems).toHaveCount(0)
-    // Output now appears as a history item
-    await expect(
-      comfyPage.appMode.outputHistory.historyItems.first()
-    ).toBeVisible()
-  })
-
-  test('Auto-selection follows latest in-progress item', async ({
-    comfyPage,
-    getWebSocket
-  }) => {
-    const ws = await getWebSocket()
-    const { exec, jobId } = await startExecution(comfyPage, ws)
-
-    // Skeleton is auto-selected
-    await expect(
-      comfyPage.appMode.outputHistory.selectedInProgressItem
-    ).toBeVisible()
-
-    // First image is auto-selected
-    exec.executed(jobId, SAVE_IMAGE_NODE, imageOutput('first.png'))
-    await expect(
-      comfyPage.appMode.outputHistory.selectedInProgressItem.getByTestId(
-        'linear-image-output'
-      )
-    ).toHaveAttribute('src', /first\.png/)
-
-    // Second image arrives - selection auto-follows without user click
-    exec.executed(jobId, SAVE_IMAGE_NODE, imageOutput('second.png'))
-    await expect(
-      comfyPage.appMode.outputHistory.selectedInProgressItem.getByTestId(
-        'linear-image-output'
-      )
-    ).toHaveAttribute('src', /second\.png/)
-  })
-
-  test('Clicking item breaks auto-follow during execution', async ({
-    comfyPage,
-    getWebSocket
-  }) => {
-    const ws = await getWebSocket()
-    const { exec, jobId } = await startExecution(comfyPage, ws)
-
-    // Send first image
-    exec.executed(jobId, SAVE_IMAGE_NODE, imageOutput('first.png'))
-    await expect(comfyPage.appMode.outputHistory.imageOutputs).toHaveCount(1)
-
-    // Click the first image to break auto-follow
-    await comfyPage.appMode.outputHistory.inProgressItems.first().click()
-
-    // Send second image - selection should NOT move to it
-    exec.executed(jobId, SAVE_IMAGE_NODE, imageOutput('second.png'))
-    await expect(comfyPage.appMode.outputHistory.imageOutputs).toHaveCount(2)
-
-    // The first item should still be selected (not auto-followed to second)
-    await expect(
-      comfyPage.appMode.outputHistory.selectedInProgressItem
-    ).toHaveCount(1)
-    await expect(
-      comfyPage.appMode.outputHistory.selectedInProgressItem.getByTestId(
-        'linear-image-output'
-      )
-    ).toHaveAttribute('src', /first\.png/)
-  })
-
-  test('Non-output node executed events are filtered', async ({
-    comfyPage,
-    getWebSocket
-  }) => {
-    const ws = await getWebSocket()
-    const { exec, jobId } = await startExecution(comfyPage, ws)
-
-    await expect(
-      comfyPage.appMode.outputHistory.inProgressItems.first()
-    ).toBeVisible()
-
-    // KSampler is not an output node - should be filtered
-    exec.executed(jobId, KSAMPLER_NODE, imageOutput('ksampler_out.png'))
-    await comfyPage.nextFrame()
-
-    // KSampler output should not create image outputs
-    await expect(comfyPage.appMode.outputHistory.imageOutputs).toHaveCount(0)
-
-    // Now send from the actual output node (SaveImage)
-    exec.executed(jobId, SAVE_IMAGE_NODE, imageOutput('save_image_out.png'))
-    await expect(
-      comfyPage.appMode.outputHistory.imageOutputs.first()
-    ).toBeVisible()
-  })
-
-  test('In-progress items are outside the scrollable area', async ({
-    comfyPage,
-    getWebSocket
-  }) => {
-    const ws = await getWebSocket()
-
-    // Complete one execution with 100 image outputs
-    const { exec, jobId } = await startExecution(comfyPage, ws)
-    exec.executed(
-      jobId,
-      SAVE_IMAGE_NODE,
-      imageOutput(
-        ...Array.from(
-          { length: 100 },
-          (_, i) => `image_${String(i).padStart(3, '0')}.png`
-        )
-      )
-    )
-    await exec.completeWithHistory(jobId, SAVE_IMAGE_NODE, 'image_000.png')
-
-    await expect(comfyPage.appMode.outputHistory.historyItems).toHaveCount(100)
-
-    // First history item is visible before scrolling
-    const firstItem = comfyPage.appMode.outputHistory.historyItems.first()
-    await expect(firstItem).toBeInViewport()
-
-    // Scroll the history feed all the way to the right
-    await comfyPage.appMode.outputHistory.outputs.evaluate((el) => {
-      el.scrollLeft = el.scrollWidth
-    })
-
-    // First history item is now off-screen
-    await expect(firstItem).not.toBeInViewport()
-
-    // Start a new execution to get an in-progress item
-    await startExecution(comfyPage, ws, exec)
-
-    // In-progress item is visible despite scrolling
-    await expect(
-      comfyPage.appMode.outputHistory.inProgressItems.first()
-    ).toBeInViewport()
-  })
-
-  test('Execution error cleans up in-progress items', async ({
-    comfyPage,
-    getWebSocket
-  }) => {
-    const ws = await getWebSocket()
-    const { exec, jobId } = await startExecution(comfyPage, ws)
-
-    await expect(
-      comfyPage.appMode.outputHistory.inProgressItems.first()
-    ).toBeVisible()
-
-    exec.executionError(jobId, KSAMPLER_NODE, 'Test error')
-
-    await expect(comfyPage.appMode.outputHistory.inProgressItems).toHaveCount(0)
-  })
-
-  test('Progress bars update for both node and overall progress', async ({
-    comfyPage,
-    getWebSocket
-  }) => {
-    const ws = await getWebSocket()
-    const { exec, jobId } = await startExecution(comfyPage, ws)
-
-    const {
-      inProgressItems,
-      headerOverallProgress,
-      headerNodeProgress,
-      itemOverallProgress,
-      itemNodeProgress
-    } = comfyPage.appMode.outputHistory
-
-    await expect(inProgressItems.first()).toBeVisible()
-
-    // Initially both bars are at 0%
-    await expect(headerOverallProgress).toHaveAttribute('style', /width:\s*0%/)
-    await expect(headerNodeProgress).toHaveAttribute('style', /width:\s*0%/)
-
-    // KSampler starts executing - node progress at 50%
-    exec.executing(jobId, KSAMPLER_NODE)
-    exec.progress(jobId, KSAMPLER_NODE, 5, 10)
-
-    await expect(headerNodeProgress).toHaveAttribute('style', /width:\s*50%/)
-    await expect(itemNodeProgress).toHaveAttribute('style', /width:\s*50%/)
-    // Overall still 0% - no nodes completed yet
-    await expect(headerOverallProgress).toHaveAttribute('style', /width:\s*0%/)
-
-    // KSampler finishes - overall advances (1 of 7 nodes)
-    exec.executed(jobId, KSAMPLER_NODE, {})
-
-    const oneNodePercent = Math.round((1 / ALL_NODE_IDS.length) * 100)
-    const pct = new RegExp(`width:\\s*${oneNodePercent}%`)
-    await expect(headerOverallProgress).toHaveAttribute('style', pct)
-    await expect(itemOverallProgress).toHaveAttribute('style', pct)
-
-    // Node progress reaches 100%
-    exec.progress(jobId, KSAMPLER_NODE, 10, 10)
-
-    await expect(headerNodeProgress).toHaveAttribute('style', /width:\s*100%/)
-    await expect(itemNodeProgress).toHaveAttribute('style', /width:\s*100%/)
-
-    // Complete remaining nodes - overall reaches 100%
-    const remainingNodes = ALL_NODE_IDS.filter((id) => id !== KSAMPLER_NODE)
-    for (const nodeId of remainingNodes) {
-      exec.executing(jobId, nodeId)
-      exec.executed(jobId, nodeId, {})
-    }
-
-    await expect(headerOverallProgress).toHaveAttribute(
-      'style',
-      /width:\s*100%/
-    )
-    await expect(itemOverallProgress).toHaveAttribute('style', /width:\s*100%/)
-  })
-})

browser_tests/tests/recordAudio.spec.ts

@@ -25,7 +25,10 @@ test.describe('Record Audio Node', { tag: '@screenshot' }, () => {
     await expect
       .poll(
         async () =>
-          (await comfyPage.nodeOps.getNodeRefsByType('RecordAudio')).length
+          (await comfyPage.nodeOps.getNodeRefsByType('RecordAudio')).length,
+        {
+          timeout: 5000
+        }
       )
       .toBe(1)
 

browser_tests/tests/selectionToolboxSubmenus.spec.ts

@@ -45,12 +45,14 @@ test.describe(
       await ksamplerNodes[0].click('title')
       await comfyPage.nextFrame()
 
-      await expect(comfyPage.page.locator('.selection-toolbox')).toBeVisible()
+      await expect(comfyPage.page.locator('.selection-toolbox')).toBeVisible({
+        timeout: 5000
+      })
 
       const moreOptionsBtn = comfyPage.page.locator(
         '[data-testid="more-options-button"]'
       )
-      await expect(moreOptionsBtn).toBeVisible()
+      await expect(moreOptionsBtn).toBeVisible({ timeout: 3000 })
 
       await comfyPage.page.click('[data-testid="more-options-button"]')
 
@@ -97,7 +99,9 @@ test.describe(
       await comfyPage.page.getByText('Shape', { exact: true }).hover()
       await expect(
         comfyPage.page.getByText('Box', { exact: true })
-      ).toBeVisible()
+      ).toBeVisible({
+        timeout: 5000
+      })
       await comfyPage.page.getByText('Box', { exact: true }).click()
       await comfyPage.nextFrame()
 
@@ -114,7 +118,7 @@ test.describe(
       await openMoreOptions(comfyPage)
       await comfyPage.page.getByText('Color', { exact: true }).click()
       const blueSwatch = comfyPage.page.locator('[title="Blue"]')
-      await expect(blueSwatch.first()).toBeVisible()
+      await expect(blueSwatch.first()).toBeVisible({ timeout: 5000 })
       await blueSwatch.first().click()
       await comfyPage.nextFrame()
 
@@ -148,7 +152,7 @@ test.describe(
     }) => {
       await openMoreOptions(comfyPage)
       const renameItem = comfyPage.page.getByText('Rename', { exact: true })
-      await expect(renameItem).toBeVisible()
+      await expect(renameItem).toBeVisible({ timeout: 5000 })
 
       // Wait for multiple frames to allow PrimeVue's outside click handler to initialize
       for (let i = 0; i < 30; i++) {
@@ -171,7 +175,7 @@ test.describe(
       await openMoreOptions(comfyPage)
       await expect(
         comfyPage.page.getByText('Rename', { exact: true })
-      ).toBeVisible()
+      ).toBeVisible({ timeout: 5000 })
 
       await comfyPage.page.evaluate(() => {
         const btn = document.querySelector(

browser_tests/tests/sidebar/assets.spec.ts

@@ -187,7 +187,7 @@ test.describe('Assets sidebar - grid view display', () => {
     await tab.switchToImported()
 
     // Wait for imported assets to render
-    await expect(tab.assetCards.first()).toBeVisible()
+    await expect(tab.assetCards.first()).toBeVisible({ timeout: 5000 })
 
     // Imported tab should show the mocked files
     await expect.poll(() => tab.assetCards.count()).toBeGreaterThanOrEqual(1)
@@ -242,7 +242,7 @@ test.describe('Assets sidebar - view mode toggle', () => {
     await tab.listViewOption.click()
 
     // List view items should now be visible
-    await expect(tab.listViewItems.first()).toBeVisible()
+    await expect(tab.listViewItems.first()).toBeVisible({ timeout: 5000 })
   })
 
   test('Can switch back to grid view', async ({ comfyPage }) => {
@@ -253,14 +253,14 @@ test.describe('Assets sidebar - view mode toggle', () => {
     // Switch to list view
     await tab.openSettingsMenu()
     await tab.listViewOption.click()
-    await expect(tab.listViewItems.first()).toBeVisible()
+    await expect(tab.listViewItems.first()).toBeVisible({ timeout: 5000 })
 
     // Switch back to grid view (settings popover is still open)
     await tab.gridViewOption.click()
     await tab.waitForAssets()
 
     // Grid cards (with data-selected attribute) should be visible again
-    await expect(tab.assetCards.first()).toBeVisible()
+    await expect(tab.assetCards.first()).toBeVisible({ timeout: 5000 })
   })
 })
 
@@ -299,7 +299,9 @@ test.describe('Assets sidebar - search', () => {
     await tab.searchInput.fill('landscape')
 
     // Wait for filter to reduce the count
-    await expect.poll(() => tab.assetCards.count()).toBeLessThan(initialCount)
+    await expect
+      .poll(() => tab.assetCards.count(), { timeout: 5000 })
+      .toBeLessThan(initialCount)
   })
 
   test('Clearing search restores all assets', async ({ comfyPage }) => {
@@ -314,7 +316,7 @@ test.describe('Assets sidebar - search', () => {
     await expect.poll(() => tab.assetCards.count()).toBeLessThan(initialCount)
 
     await tab.searchInput.fill('')
-    await expect(tab.assetCards).toHaveCount(initialCount)
+    await expect(tab.assetCards).toHaveCount(initialCount, { timeout: 5000 })
   })
 
   test('Search with no matches shows empty state', async ({ comfyPage }) => {
@@ -323,7 +325,7 @@ test.describe('Assets sidebar - search', () => {
     await tab.waitForAssets()
 
     await tab.searchInput.fill('nonexistent_file_xyz')
-    await expect(tab.assetCards).toHaveCount(0)
+    await expect(tab.assetCards).toHaveCount(0, { timeout: 5000 })
   })
 })
 
@@ -382,7 +384,7 @@ test.describe('Assets sidebar - selection', () => {
     await tab.assetCards.first().click()
 
     // Footer should show selection count
-    await expect(tab.selectionCountButton).toBeVisible()
+    await expect(tab.selectionCountButton).toBeVisible({ timeout: 3000 })
   })
 
   test('Deselect all clears selection', async ({ comfyPage }) => {
@@ -396,7 +398,7 @@ test.describe('Assets sidebar - selection', () => {
 
     // Hover over the selection count button to reveal "Deselect all"
     await tab.selectionCountButton.hover()
-    await expect(tab.deselectAllButton).toBeVisible()
+    await expect(tab.deselectAllButton).toBeVisible({ timeout: 3000 })
 
     // Click "Deselect all"
     await tab.deselectAllButton.click()
@@ -447,7 +449,7 @@ test.describe('Assets sidebar - context menu', () => {
 
     // Context menu should appear with standard items
     const contextMenu = comfyPage.page.locator('.p-contextmenu')
-    await expect(contextMenu).toBeVisible()
+    await expect(contextMenu).toBeVisible({ timeout: 3000 })
   })
 
   test('Context menu contains Download action for output asset', async ({
@@ -520,7 +522,7 @@ test.describe('Assets sidebar - context menu', () => {
     await tab.assetCards.first().click({ button: 'right' })
 
     const contextMenu = comfyPage.page.locator('.p-contextmenu')
-    await expect(contextMenu).toBeVisible()
+    await expect(contextMenu).toBeVisible({ timeout: 3000 })
 
     await expect(
       tab.contextMenuItem('Open as workflow in new tab')
@@ -550,8 +552,8 @@ test.describe('Assets sidebar - context menu', () => {
     await comfyPage.page.keyboard.up('Control')
 
     // Verify multi-selection took effect and footer is stable before right-clicking
-    await expect(tab.selectedCards).toHaveCount(2)
-    await expect(tab.selectionFooter).toBeVisible()
+    await expect(tab.selectedCards).toHaveCount(2, { timeout: 3000 })
+    await expect(tab.selectionFooter).toBeVisible({ timeout: 3000 })
 
     // Use dispatchEvent instead of click({ button: 'right' }) to avoid any
     // overlay intercepting the event, and assert directly without toPass.
@@ -593,7 +595,7 @@ test.describe('Assets sidebar - bulk actions', () => {
     await tab.assetCards.first().click()
 
     // Download button in footer should be visible
-    await expect(tab.downloadSelectedButton).toBeVisible()
+    await expect(tab.downloadSelectedButton).toBeVisible({ timeout: 3000 })
   })
 
   test('Footer shows delete button when output assets selected', async ({
@@ -606,7 +608,7 @@ test.describe('Assets sidebar - bulk actions', () => {
     await tab.assetCards.first().click()
 
     // Delete button in footer should be visible
-    await expect(tab.deleteSelectedButton).toBeVisible()
+    await expect(tab.deleteSelectedButton).toBeVisible({ timeout: 3000 })
   })
 
   test('Selection count displays correct number', async ({ comfyPage }) => {
@@ -627,7 +629,7 @@ test.describe('Assets sidebar - bulk actions', () => {
     await comfyPage.page.keyboard.up('Control')
 
     // Selection count should show the count
-    await expect(tab.selectionCountButton).toBeVisible()
+    await expect(tab.selectionCountButton).toBeVisible({ timeout: 3000 })
     await expect(tab.selectionCountButton).toHaveText(/Assets Selected:\s*2\b/)
   })
 })
@@ -746,10 +748,12 @@ test.describe('Assets sidebar - delete confirmation', () => {
     await comfyPage.confirmDialog.delete.click()
 
     await expect(dialog).not.toBeVisible()
-    await expect(tab.assetCards).toHaveCount(initialCount - 1)
+    await expect(tab.assetCards).toHaveCount(initialCount - 1, {
+      timeout: 5000
+    })
 
     const successToast = comfyPage.page.locator('.p-toast-message-success')
-    await expect(successToast).toBeVisible()
+    await expect(successToast).toBeVisible({ timeout: 5000 })
   })
 
   test('Cancelling delete preserves asset', async ({ comfyPage }) => {

browser_tests/tests/sidebar/modelLibrary.spec.ts

@@ -76,7 +76,9 @@ test.describe('Model library sidebar - folders', () => {
     await tab.getFolderByLabel('checkpoints').click()
 
     // Models should appear as leaf nodes
-    await expect(tab.getLeafByLabel('sd_xl_base_1.0')).toBeVisible()
+    await expect(tab.getLeafByLabel('sd_xl_base_1.0')).toBeVisible({
+      timeout: 5000
+    })
     await expect(tab.getLeafByLabel('dreamshaper_8')).toBeVisible()
     await expect(tab.getLeafByLabel('realisticVision_v51')).toBeVisible()
   })
@@ -89,7 +91,9 @@ test.describe('Model library sidebar - folders', () => {
 
     await tab.getFolderByLabel('loras').click()
 
-    await expect(tab.getLeafByLabel('detail_tweaker_xl')).toBeVisible()
+    await expect(tab.getLeafByLabel('detail_tweaker_xl')).toBeVisible({
+      timeout: 5000
+    })
     await expect(tab.getLeafByLabel('add_brightness')).toBeVisible()
   })
 })
@@ -115,7 +119,9 @@ test.describe('Model library sidebar - search', () => {
     await tab.searchInput.fill('dreamshaper')
 
     // Wait for debounce (300ms) + load + render
-    await expect(tab.getLeafByLabel('dreamshaper_8')).toBeVisible()
+    await expect(tab.getLeafByLabel('dreamshaper_8')).toBeVisible({
+      timeout: 5000
+    })
 
     // Other models should not be visible
     await expect(tab.getLeafByLabel('sd_xl_base_1.0')).not.toBeVisible()
@@ -126,13 +132,17 @@ test.describe('Model library sidebar - search', () => {
     await tab.open()
 
     await tab.searchInput.fill('dreamshaper')
-    await expect(tab.getLeafByLabel('dreamshaper_8')).toBeVisible()
+    await expect(tab.getLeafByLabel('dreamshaper_8')).toBeVisible({
+      timeout: 5000
+    })
 
     // Clear the search
     await tab.searchInput.fill('')
 
     // Folders should be visible again (collapsed)
-    await expect(tab.getFolderByLabel('checkpoints')).toBeVisible()
+    await expect(tab.getFolderByLabel('checkpoints')).toBeVisible({
+      timeout: 5000
+    })
     await expect(tab.getFolderByLabel('loras')).toBeVisible()
   })
 
@@ -142,7 +152,7 @@ test.describe('Model library sidebar - search', () => {
 
     // Expand a folder and verify models are present before searching
     await tab.getFolderByLabel('checkpoints').click()
-    await expect(tab.leafNodes).not.toHaveCount(0)
+    await expect(tab.leafNodes).not.toHaveCount(0, { timeout: 5000 })
 
     await tab.searchInput.fill('nonexistent_model_xyz')
 
@@ -186,7 +196,7 @@ test.describe('Model library sidebar - refresh', () => {
     await tab.refreshButton.click()
     await refreshRequest
 
-    await expect(tab.getFolderByLabel('loras')).toBeVisible()
+    await expect(tab.getFolderByLabel('loras')).toBeVisible({ timeout: 5000 })
   })
 
   test('Load all folders button triggers loading all model data', async ({

browser_tests/tests/sidebar/nodeLibraryV2.spec.ts

@@ -45,7 +45,9 @@ test.describe('Node library sidebar V2', () => {
     await expect(tab.getNode('KSampler (Advanced)')).not.toBeVisible()
 
     await tab.searchInput.fill('KSampler')
-    await expect(tab.getNode('KSampler (Advanced)')).toBeVisible()
+    await expect(tab.getNode('KSampler (Advanced)')).toBeVisible({
+      timeout: 5000
+    })
     await expect(tab.getNode('CLIPLoader')).not.toBeVisible()
   })
 
@@ -94,7 +96,7 @@ test.describe('Node library sidebar V2', () => {
     const contextMenu = comfyPage.page.getByRole('menuitem', {
       name: /Bookmark Node/
     })
-    await expect(contextMenu).toBeVisible()
+    await expect(contextMenu).toBeVisible({ timeout: 3000 })
   })
 
   test('Search clear restores folder view', async ({ comfyPage }) => {
@@ -103,12 +105,14 @@ test.describe('Node library sidebar V2', () => {
     await expect(tab.getFolder('sampling')).toBeVisible()
 
     await tab.searchInput.fill('KSampler')
-    await expect(tab.getNode('KSampler (Advanced)')).toBeVisible()
+    await expect(tab.getNode('KSampler (Advanced)')).toBeVisible({
+      timeout: 5000
+    })
 
     await tab.searchInput.clear()
     await tab.searchInput.press('Enter')
 
-    await expect(tab.getFolder('sampling')).toBeVisible()
+    await expect(tab.getFolder('sampling')).toBeVisible({ timeout: 5000 })
   })
 
   test('Sort dropdown shows sorting options', async ({ comfyPage }) => {
@@ -118,7 +122,7 @@ test.describe('Node library sidebar V2', () => {
 
     // Reka UI DropdownMenuRadioItem renders with role="menuitemradio"
     const options = comfyPage.page.getByRole('menuitemradio')
-    await expect(options.first()).toBeVisible()
+    await expect(options.first()).toBeVisible({ timeout: 3000 })
     await expect.poll(() => options.count()).toBeGreaterThanOrEqual(2)
   })
 })

browser_tests/tests/sidebar/workflows.spec.ts

@@ -289,7 +289,9 @@ test.describe('Workflows sidebar', () => {
     )
     await closeButton.click()
     await expect
-      .poll(() => comfyPage.menu.workflowsTab.getOpenedWorkflowNames())
+      .poll(() => comfyPage.menu.workflowsTab.getOpenedWorkflowNames(), {
+        timeout: 5000
+      })
       .toEqual(['*Unsaved Workflow'])
   })
 
@@ -368,7 +370,7 @@ test.describe('Workflows sidebar', () => {
     // Wait for workflow to appear in Browse section after sync
     const workflowItem =
       comfyPage.menu.workflowsTab.getPersistedItem('workflow1')
-    await expect(workflowItem).toBeVisible()
+    await expect(workflowItem).toBeVisible({ timeout: 3000 })
 
     const nodeCount = await comfyPage.nodeOps.getGraphNodesCount()
 

browser_tests/tests/subgraph/subgraphNavigation.spec.ts

@@ -219,7 +219,9 @@ test.describe('Subgraph Navigation', { tag: ['@slow', '@subgraph'] }, () => {
       await subgraphNode.navigateIntoSubgraph()
 
       await expect
-        .poll(() => comfyPage.page.evaluate(hasVisibleNodeInViewport))
+        .poll(() => comfyPage.page.evaluate(hasVisibleNodeInViewport), {
+          timeout: 5_000
+        })
         .toBe(true)
     })
 
@@ -235,7 +237,9 @@ test.describe('Subgraph Navigation', { tag: ['@slow', '@subgraph'] }, () => {
       await comfyPage.vueNodes.enterSubgraph('11')
 
       await expect
-        .poll(() => comfyPage.page.evaluate(hasVisibleNodeInViewport))
+        .poll(() => comfyPage.page.evaluate(hasVisibleNodeInViewport), {
+          timeout: 5_000
+        })
         .toBe(true)
     })
 
@@ -259,11 +263,13 @@ test.describe('Subgraph Navigation', { tag: ['@slow', '@subgraph'] }, () => {
       await comfyPage.subgraph.exitViaBreadcrumb()
 
       await expect
-        .poll(() =>
-          comfyPage.page.evaluate(() => {
-            const ds = window.app!.canvas.ds
-            return { scale: ds.scale, offset: [...ds.offset] }
-          })
+        .poll(
+          () =>
+            comfyPage.page.evaluate(() => {
+              const ds = window.app!.canvas.ds
+              return { scale: ds.scale, offset: [...ds.offset] }
+            }),
+          { timeout: 5_000 }
         )
         .toEqual({
           scale: expect.closeTo(rootViewport.scale, 2),
@@ -308,10 +314,12 @@ test.describe('Subgraph Navigation', { tag: ['@slow', '@subgraph'] }, () => {
       await comfyPage.nextFrame()
 
       await expect
-        .poll(() =>
-          comfyPage.page.evaluate((nodeId) => {
-            return window.app!.canvas.graph!.getNodeById(nodeId)!.progress
-          }, subgraphNodeId)
+        .poll(
+          () =>
+            comfyPage.page.evaluate((nodeId) => {
+              return window.app!.canvas.graph!.getNodeById(nodeId)!.progress
+            }, subgraphNodeId),
+          { timeout: 2_000 }
         )
         .toBeUndefined()
     })
@@ -342,18 +350,20 @@ test.describe('Subgraph Navigation', { tag: ['@slow', '@subgraph'] }, () => {
       await comfyPage.nextFrame()
 
       await expect
-        .poll(() =>
-          comfyPage.page.evaluate(() => {
-            const graph = window.app!.canvas.graph!
-            const subgraphNode = graph.nodes.find(
-              (node) =>
-                typeof node.isSubgraphNode === 'function' &&
-                node.isSubgraphNode()
-            )
-            if (!subgraphNode) return { exists: false, progress: null }
+        .poll(
+          () =>
+            comfyPage.page.evaluate(() => {
+              const graph = window.app!.canvas.graph!
+              const subgraphNode = graph.nodes.find(
+                (node) =>
+                  typeof node.isSubgraphNode === 'function' &&
+                  node.isSubgraphNode()
+              )
+              if (!subgraphNode) return { exists: false, progress: null }
 
-            return { exists: true, progress: subgraphNode.progress }
-          })
+              return { exists: true, progress: subgraphNode.progress }
+            }),
+          { timeout: 5_000 }
         )
         .toEqual({ exists: true, progress: undefined })
     })

browser_tests/tests/subgraph/subgraphPromotion.spec.ts

@@ -15,7 +15,9 @@ async function expectPromotedWidgetNamesToContain(
   widgetName: string
 ) {
   await expect
-    .poll(() => getPromotedWidgetNames(comfyPage, nodeId))
+    .poll(() => getPromotedWidgetNames(comfyPage, nodeId), {
+      timeout: 5000
+    })
     .toContain(widgetName)
 }
 
@@ -25,7 +27,9 @@ async function expectPromotedWidgetCountToBeGreaterThan(
   count: number
 ) {
   await expect
-    .poll(() => getPromotedWidgetCount(comfyPage, nodeId))
+    .poll(() => getPromotedWidgetCount(comfyPage, nodeId), {
+      timeout: 5000
+    })
     .toBeGreaterThan(count)
 }
 
@@ -284,7 +288,9 @@ test.describe(
         await comfyPage.subgraph.exitViaBreadcrumb()
 
         await expect
-          .poll(() => getPromotedWidgetCount(comfyPage, '2'))
+          .poll(() => getPromotedWidgetCount(comfyPage, '2'), {
+            timeout: 5000
+          })
           .toBeLessThan(initialWidgetCount)
       })
     })
@@ -326,7 +332,7 @@ test.describe(
           .locator('.p-contextmenu')
           .locator('text=Promote Widget')
 
-        await expect(promoteEntry.first()).toBeVisible()
+        await expect(promoteEntry.first()).toBeVisible({ timeout: 5000 })
       })
     })
 
@@ -530,7 +536,9 @@ test.describe(
         expectedNames.splice(removedIndex, 1)
 
         await expect
-          .poll(() => getPromotedWidgetNames(comfyPage, '5'))
+          .poll(() => getPromotedWidgetNames(comfyPage, '5'), {
+            timeout: 5000
+          })
           .toEqual(expectedNames)
       })
 
@@ -545,7 +553,9 @@ test.describe(
 
         let initialWidgetCount = 0
         await expect
-          .poll(() => getPromotedWidgetCount(comfyPage, '11'))
+          .poll(() => getPromotedWidgetCount(comfyPage, '11'), {
+            timeout: 5000
+          })
           .toBeGreaterThan(0)
         initialWidgetCount = await getPromotedWidgetCount(comfyPage, '11')
 
@@ -561,7 +571,9 @@ test.describe(
 
         // Widget count should be reduced
         await expect
-          .poll(() => getPromotedWidgetCount(comfyPage, '11'))
+          .poll(() => getPromotedWidgetCount(comfyPage, '11'), {
+            timeout: 5000
+          })
           .toBeLessThan(initialWidgetCount)
       })
     })

browser_tests/tests/subgraph/subgraphPromotionDom.spec.ts

@@ -22,11 +22,13 @@ async function openSubgraphById(comfyPage: ComfyPage, nodeId: string) {
   }, nodeId)
 
   await expect
-    .poll(() =>
-      comfyPage.page.evaluate(() => {
-        const graph = window.app!.canvas.graph
-        return !!graph && 'inputNode' in graph
-      })
+    .poll(
+      () =>
+        comfyPage.page.evaluate(() => {
+          const graph = window.app!.canvas.graph
+          return !!graph && 'inputNode' in graph
+        }),
+      { timeout: 5_000 }
     )
     .toBe(true)
 }
@@ -147,7 +149,7 @@ test.describe('Subgraph Promotion DOM', { tag: ['@subgraph'] }, () => {
       )
 
       const visibleWidgets = comfyPage.page.locator(VISIBLE_DOM_WIDGET_SELECTOR)
-      await expect(visibleWidgets).toHaveCount(2)
+      await expect(visibleWidgets).toHaveCount(2, { timeout: 5_000 })
       const parentCount = await visibleWidgets.count()
 
       const subgraphNode = await comfyPage.nodeOps.getNodeRefById('11')

browser_tests/tests/subgraph/subgraphSearch.spec.ts

@@ -23,7 +23,7 @@ async function exitSubgraphAndPublish(
     name: blueprintName
   })
 
-  await expect(comfyPage.visibleToasts).toHaveCount(1)
+  await expect(comfyPage.visibleToasts).toHaveCount(1, { timeout: 5_000 })
   await comfyPage.toast.closeToasts(1)
 }
 

browser_tests/tests/templates.spec.ts

@@ -106,7 +106,7 @@ test.describe('Templates', { tag: ['@slow', '@workflow'] }, () => {
     await comfyPage.setup({ clearStorage: true })
 
     // Expect the templates dialog to be shown
-    await expect(comfyPage.templates.content).toBeVisible()
+    await expect(comfyPage.templates.content).toBeVisible({ timeout: 5000 })
   })
 
   test('Uses proper locale files for templates', async ({ comfyPage }) => {
@@ -305,7 +305,7 @@ test.describe('Templates', { tag: ['@slow', '@workflow'] }, () => {
         comfyPage.page.locator(
           '[data-testid="template-workflow-short-description"]'
         )
-      ).toBeVisible()
+      ).toBeVisible({ timeout: 5000 })
 
       // Verify all three cards with different descriptions are visible
       const shortDescCard = comfyPage.page.locator(
@@ -399,7 +399,7 @@ test.describe('Templates', { tag: ['@slow', '@workflow'] }, () => {
       const taggedCard = comfyPage.page.getByTestId(
         TestIds.templates.workflowCard('tagged-template')
       )
-      await expect(taggedCard).toBeVisible()
+      await expect(taggedCard).toBeVisible({ timeout: 5000 })
       await expect(taggedCard.getByText('Relight')).toBeVisible()
       await expect(taggedCard.getByText('Image Edit')).toBeVisible()
 

browser_tests/tests/topbar/workflowTabs.spec.ts

@@ -67,7 +67,7 @@ test.describe('Workflow tabs', () => {
     const contextMenu = comfyPage.page.locator(
       '[role="menu"][data-state="open"]'
     )
-    await expect(contextMenu).toBeVisible()
+    await expect(contextMenu).toBeVisible({ timeout: 5000 })
 
     await expect(
       contextMenu.getByRole('menuitem', { name: /Close Tab/i }).first()
@@ -89,7 +89,7 @@ test.describe('Workflow tabs', () => {
     const contextMenu = comfyPage.page.locator(
       '[role="menu"][data-state="open"]'
     )
-    await expect(contextMenu).toBeVisible()
+    await expect(contextMenu).toBeVisible({ timeout: 5000 })
 
     await contextMenu
       .getByRole('menuitem', { name: /Close Tab/i })
@@ -123,7 +123,7 @@ test.describe('Workflow tabs', () => {
 
     // WorkflowTab renders "•" when the workflow has unsaved changes
     const activeTab = topbar.getActiveTab()
-    await expect(activeTab.locator('text=•')).toBeVisible()
+    await expect(activeTab.locator('text=•')).toBeVisible({ timeout: 5000 })
   })
 
   test('Multiple tabs can be created, switched, and closed', async ({

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

@@ -217,12 +217,14 @@ test.describe('Vue Node Context Menu', () => {
       if (!loadImageNode) throw new Error('Load Image node not found')
 
       await expect
-        .poll(() =>
-          comfyPage.page.evaluate(
-            (nodeId) =>
-              window.app!.graph.getNodeById(nodeId)?.imgs?.length ?? 0,
-            loadImageNode.id
-          )
+        .poll(
+          () =>
+            comfyPage.page.evaluate(
+              (nodeId) =>
+                window.app!.graph.getNodeById(nodeId)?.imgs?.length ?? 0,
+              loadImageNode.id
+            ),
+          { timeout: 5_000 }
         )
         .toBeGreaterThan(0)
     })

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

@@ -102,7 +102,7 @@ test.describe('Vue Nodes - Delete Key Interaction', () => {
 
     // Node count should remain the same
     await expect
-      .poll(() => comfyPage.nodeOps.getGraphNodesCount())
+      .poll(() => comfyPage.nodeOps.getGraphNodesCount(), { timeout: 1000 })
       .toBe(initialNodeCount)
   })
 

browser_tests/tests/widget.spec.ts

@@ -132,7 +132,9 @@ test.describe('Slider widget', { tag: ['@screenshot', '@widget'] }, () => {
     await expect(comfyPage.canvas).toHaveScreenshot('slider_widget_dragged.png')
 
     await expect
-      .poll(() => comfyPage.page.evaluate(() => window.widgetValue))
+      .poll(() => comfyPage.page.evaluate(() => window.widgetValue), {
+        timeout: 2_000
+      })
       .toBeDefined()
   })
 })
@@ -154,7 +156,9 @@ test.describe('Number widget', { tag: ['@screenshot', '@widget'] }, () => {
     await expect(comfyPage.canvas).toHaveScreenshot('seed_widget_dragged.png')
 
     await expect
-      .poll(() => comfyPage.page.evaluate(() => window.widgetValue))
+      .poll(() => comfyPage.page.evaluate(() => window.widgetValue), {
+        timeout: 2_000
+      })
       .toBeDefined()
   })
 })

browser_tests/tests/workflowPersistence.spec.ts

@@ -134,7 +134,11 @@ test.describe('Workflow Persistence', () => {
     await tab.switchToWorkflow('outputs-test')
     await comfyPage.workflow.waitForWorkflowIdle()
 
-    await expect.poll(() => getNodeOutputImageCount(comfyPage, nodeId)).toBe(1)
+    await expect
+      .poll(() => getNodeOutputImageCount(comfyPage, nodeId), {
+        timeout: 5_000
+      })
+      .toBe(1)
   })
 
   test('Loading a new workflow cleanly replaces the previous graph', async ({
@@ -187,7 +191,9 @@ test.describe('Workflow Persistence', () => {
     await comfyPage.workflow.waitForWorkflowIdle()
 
     await expect
-      .poll(() => getWidgetValueSnapshot(comfyPage))
+      .poll(() => getWidgetValueSnapshot(comfyPage), {
+        timeout: 5_000
+      })
       .toEqual(widgetValuesBefore)
   })
 

browser_tests/tests/workflowTabThumbnail.spec.ts

@@ -30,7 +30,7 @@ test.describe('Workflow Tab Thumbnails', { tag: '@workflow' }, () => {
 
     const popover = comfyPage.page.locator('.workflow-popover-fade')
     await expect(popover).toHaveCount(1)
-    await expect(popover).toBeVisible()
+    await expect(popover).toBeVisible({ timeout: 500 })
     if (name) {
       await expect(popover).toContainText(name)
     }

package.json

@@ -1,6 +1,6 @@
 {
   "name": "@comfyorg/comfyui-frontend",
-  "version": "1.44.1",
+  "version": "1.44.0",
   "private": true,
   "description": "Official front-end implementation of ComfyUI",
   "homepage": "https://comfy.org",

src/components/builder/AppModeWidgetList.vue

@@ -1,8 +1,6 @@
 <script setup lang="ts">
 import { useEventListener } from '@vueuse/core'
 import { computed, provide, shallowRef } from 'vue'
-
-import { useAppModeWidgetResizing } from '@/components/builder/useAppModeWidgetResizing'
 import { useI18n } from 'vue-i18n'
 
 import Popover from '@/components/ui/Popover.vue'
@@ -10,7 +8,7 @@ import Button from '@/components/ui/button/Button.vue'
 import { extractVueNodeData } from '@/composables/graph/useGraphNodeManager'
 import { OverlayAppendToKey } from '@/composables/useTransformCompatOverlayProps'
 import { isPromotedWidgetView } from '@/core/graph/subgraph/promotedWidgetTypes'
-import type { LGraphNode, NodeId } from '@/lib/litegraph/src/LGraphNode'
+import type { LGraphNode } from '@/lib/litegraph/src/LGraphNode'
 import { LGraphEventMode } from '@/lib/litegraph/src/types/globalEnums'
 import type { IBaseWidget } from '@/lib/litegraph/src/types/widgets'
 import { useMaskEditor } from '@/composables/maskeditor/useMaskEditor'
@@ -30,9 +28,6 @@ import { promptRenameWidget } from '@/utils/widgetUtil'
 
 interface WidgetEntry {
   key: string
-  nodeId: NodeId
-  widgetName: string
-  persistedHeight: number | undefined
   nodeData: ReturnType<typeof nodeToNodeData> & {
     widgets: NonNullable<ReturnType<typeof nodeToNodeData>['widgets']>
   }
@@ -49,11 +44,6 @@ const executionErrorStore = useExecutionErrorStore()
 const appModeStore = useAppModeStore()
 const maskEditor = useMaskEditor()
 
-const { onPointerDown } = useAppModeWidgetResizing(
-  (nodeId, widgetName, config) =>
-    appModeStore.updateInputConfig(nodeId, widgetName, config)
-)
-
 provide(HideLayoutFieldKey, true)
 provide(OverlayAppendToKey, 'body')
 
@@ -71,7 +61,7 @@ const mappedSelections = computed((): WidgetEntry[] => {
     ReturnType<typeof nodeToNodeData>
   >()
 
-  return appModeStore.selectedInputs.flatMap(([nodeId, widgetName, config]) => {
+  return appModeStore.selectedInputs.flatMap(([nodeId, widgetName]) => {
     const [node, widget] = resolveNodeWidget(nodeId, widgetName)
     if (!widget || !node || node.mode !== LGraphEventMode.ALWAYS) return []
 
@@ -100,9 +90,6 @@ const mappedSelections = computed((): WidgetEntry[] => {
     return [
       {
         key: `${nodeId}:${widgetName}`,
-        nodeId,
-        widgetName,
-        persistedHeight: config?.height,
         nodeData: {
           ...fullNodeData,
           widgets: [matchingWidget]
@@ -170,14 +157,7 @@ defineExpose({ handleDragDrop })
 </script>
 <template>
   <div
-    v-for="{
-      key,
-      nodeId,
-      widgetName,
-      persistedHeight,
-      nodeData,
-      action
-    } in mappedSelections"
+    v-for="{ key, nodeData, action } in mappedSelections"
     :key
     :class="
       cn(
@@ -242,20 +222,8 @@ defineExpose({ handleDragDrop })
       </Popover>
     </div>
     <div
-      :style="
-        persistedHeight
-          ? { '--persisted-height': `${persistedHeight}px` }
-          : undefined
-      "
-      :class="
-        cn(
-          builderMode && 'pointer-events-none',
-          persistedHeight &&
-            '**:data-[slot=drop-zone-indicator]:h-(--persisted-height) [&_textarea]:h-(--persisted-height)'
-        )
-      "
+      :class="builderMode && 'pointer-events-none'"
       :inert="builderMode || undefined"
-      @pointerdown.capture="(e) => onPointerDown(nodeId, widgetName, e)"
     >
       <DropZone
         :on-drag-over="nodeData.onDragOver"

src/components/builder/useAppModeWidgetResizing.test.ts

@@ -1,210 +0,0 @@
-import { describe, expect, it, vi } from 'vitest'
-import { effectScope } from 'vue'
-
-import type { NodeId } from '@/lib/litegraph/src/LGraphNode'
-import type { InputWidgetConfig } from '@/platform/workflow/management/stores/comfyWorkflow'
-
-import { useAppModeWidgetResizing } from './useAppModeWidgetResizing'
-
-function setHeight(el: HTMLElement, height: number) {
-  Object.defineProperty(el, 'offsetHeight', {
-    value: height,
-    configurable: true
-  })
-}
-
-function wrapWithTextarea(initialHeight = 100): {
-  wrapper: HTMLDivElement
-  textarea: HTMLTextAreaElement
-} {
-  const wrapper = document.createElement('div')
-  const textarea = document.createElement('textarea')
-  wrapper.appendChild(textarea)
-  document.body.appendChild(wrapper)
-  setHeight(textarea, initialHeight)
-  return { wrapper, textarea }
-}
-
-describe('useAppModeWidgetResizing', () => {
-  function setup() {
-    const onResize =
-      vi.fn<
-        (nodeId: NodeId, widgetName: string, config: InputWidgetConfig) => void
-      >()
-    const { onPointerDown } = useAppModeWidgetResizing(onResize)
-
-    function bind(wrapper: HTMLElement, nodeId: NodeId, widgetName: string) {
-      wrapper.addEventListener(
-        'pointerdown',
-        (e) => onPointerDown(nodeId, widgetName, e as PointerEvent),
-        { capture: true }
-      )
-    }
-
-    return { onResize, bind }
-  }
-
-  it('persists height when textarea is resized via drag', () => {
-    const { bind, onResize } = setup()
-    const { wrapper, textarea } = wrapWithTextarea()
-    bind(wrapper, 1 as NodeId, 'prompt')
-
-    textarea.dispatchEvent(new PointerEvent('pointerdown', { bubbles: true }))
-    setHeight(textarea, 250)
-    window.dispatchEvent(new PointerEvent('pointerup'))
-
-    expect(onResize).toHaveBeenCalledWith(1, 'prompt', { height: 250 })
-  })
-
-  it('does not persist when no height change occurs (e.g. a click)', () => {
-    const { bind, onResize } = setup()
-    const { wrapper, textarea } = wrapWithTextarea()
-    bind(wrapper, 1 as NodeId, 'prompt')
-
-    textarea.dispatchEvent(new PointerEvent('pointerdown', { bubbles: true }))
-    window.dispatchEvent(new PointerEvent('pointerup'))
-
-    expect(onResize).not.toHaveBeenCalled()
-  })
-
-  it('persists once per drag gesture; stray pointerup is a no-op', () => {
-    const { bind, onResize } = setup()
-    const { wrapper, textarea } = wrapWithTextarea()
-    bind(wrapper, 1 as NodeId, 'prompt')
-
-    textarea.dispatchEvent(new PointerEvent('pointerdown', { bubbles: true }))
-    setHeight(textarea, 250)
-    window.dispatchEvent(new PointerEvent('pointerup'))
-    window.dispatchEvent(new PointerEvent('pointerup'))
-
-    expect(onResize).toHaveBeenCalledTimes(1)
-  })
-
-  it('ignores pointerdown on non-resizable targets (label, button, popover)', () => {
-    const { bind, onResize } = setup()
-    const wrapper = document.createElement('div')
-    const button = document.createElement('button')
-    wrapper.appendChild(button)
-    document.body.appendChild(wrapper)
-    bind(wrapper, 1 as NodeId, 'prompt')
-
-    button.dispatchEvent(new PointerEvent('pointerdown', { bubbles: true }))
-    window.dispatchEvent(new PointerEvent('pointerup'))
-
-    expect(onResize).not.toHaveBeenCalled()
-  })
-
-  it('persists when target is a descendant of the drop-zone-indicator', () => {
-    const { bind, onResize } = setup()
-    const wrapper = document.createElement('div')
-    const indicator = document.createElement('div')
-    indicator.setAttribute('data-slot', 'drop-zone-indicator')
-    const inner = document.createElement('span')
-    indicator.appendChild(inner)
-    wrapper.appendChild(indicator)
-    document.body.appendChild(wrapper)
-    setHeight(indicator, 100)
-    bind(wrapper, 1 as NodeId, 'image')
-
-    inner.dispatchEvent(new PointerEvent('pointerdown', { bubbles: true }))
-    setHeight(indicator, 250)
-    window.dispatchEvent(new PointerEvent('pointerup'))
-
-    expect(onResize).toHaveBeenCalledWith(1, 'image', { height: 250 })
-  })
-
-  it('drops a stale gesture when a new pointerdown starts before pointerup arrives', () => {
-    const { bind, onResize } = setup()
-    const first = wrapWithTextarea()
-    const second = wrapWithTextarea()
-    bind(first.wrapper, 1 as NodeId, 'prompt')
-    bind(second.wrapper, 2 as NodeId, 'other')
-
-    first.textarea.dispatchEvent(
-      new PointerEvent('pointerdown', { bubbles: true })
-    )
-    setHeight(first.textarea, 250)
-
-    second.textarea.dispatchEvent(
-      new PointerEvent('pointerdown', { bubbles: true })
-    )
-    setHeight(second.textarea, 300)
-    window.dispatchEvent(new PointerEvent('pointerup'))
-
-    expect(onResize).toHaveBeenCalledTimes(1)
-    expect(onResize).toHaveBeenCalledWith(2, 'other', { height: 300 })
-  })
-
-  it('treats pointercancel as the end of a gesture and persists the new height', () => {
-    const { bind, onResize } = setup()
-    const { wrapper, textarea } = wrapWithTextarea()
-    bind(wrapper, 1 as NodeId, 'prompt')
-
-    textarea.dispatchEvent(new PointerEvent('pointerdown', { bubbles: true }))
-    setHeight(textarea, 250)
-    window.dispatchEvent(new PointerEvent('pointercancel'))
-
-    expect(onResize).toHaveBeenCalledWith(1, 'prompt', { height: 250 })
-  })
-
-  it('after pointercancel, a subsequent stray pointerup is a no-op', () => {
-    const { bind, onResize } = setup()
-    const { wrapper, textarea } = wrapWithTextarea()
-    bind(wrapper, 1 as NodeId, 'prompt')
-
-    textarea.dispatchEvent(new PointerEvent('pointerdown', { bubbles: true }))
-    setHeight(textarea, 250)
-    window.dispatchEvent(new PointerEvent('pointercancel'))
-    setHeight(textarea, 400)
-    window.dispatchEvent(new PointerEvent('pointerup'))
-
-    expect(onResize).toHaveBeenCalledTimes(1)
-    expect(onResize).toHaveBeenCalledWith(1, 'prompt', { height: 250 })
-  })
-
-  it('removes global listeners when the owning scope is disposed mid-gesture', () => {
-    const onResize =
-      vi.fn<
-        (nodeId: NodeId, widgetName: string, config: InputWidgetConfig) => void
-      >()
-    const scope = effectScope()
-    const { onPointerDown } = scope.run(() =>
-      useAppModeWidgetResizing(onResize)
-    )!
-    const { wrapper, textarea } = wrapWithTextarea()
-    wrapper.addEventListener(
-      'pointerdown',
-      (e) => onPointerDown(1 as NodeId, 'prompt', e as PointerEvent),
-      { capture: true }
-    )
-
-    textarea.dispatchEvent(new PointerEvent('pointerdown', { bubbles: true }))
-    setHeight(textarea, 250)
-    scope.stop()
-    window.dispatchEvent(new PointerEvent('pointerup'))
-    window.dispatchEvent(new PointerEvent('pointercancel'))
-
-    expect(onResize).not.toHaveBeenCalled()
-  })
-
-  it('does not match a resizable that is an ancestor of the wrapper', () => {
-    const { bind, onResize } = setup()
-    // An unrelated drop-zone-indicator outside the wrapper would otherwise be
-    // returned by target.closest(...) walking up the tree.
-    const outerIndicator = document.createElement('div')
-    outerIndicator.setAttribute('data-slot', 'drop-zone-indicator')
-    const wrapper = document.createElement('div')
-    const inner = document.createElement('span')
-    wrapper.appendChild(inner)
-    outerIndicator.appendChild(wrapper)
-    document.body.appendChild(outerIndicator)
-    setHeight(outerIndicator, 100)
-    bind(wrapper, 1 as NodeId, 'prompt')
-
-    inner.dispatchEvent(new PointerEvent('pointerdown', { bubbles: true }))
-    setHeight(outerIndicator, 250)
-    window.dispatchEvent(new PointerEvent('pointerup'))
-
-    expect(onResize).not.toHaveBeenCalled()
-  })
-})

src/components/builder/useAppModeWidgetResizing.ts

@@ -1,55 +0,0 @@
-import { onScopeDispose } from 'vue'
-
-import type { NodeId } from '@/lib/litegraph/src/LGraphNode'
-import type { InputWidgetConfig } from '@/platform/workflow/management/stores/comfyWorkflow'
-
-const RESIZABLE_SELECTOR = 'textarea, [data-slot="drop-zone-indicator"]'
-
-export function useAppModeWidgetResizing(
-  onResize: (
-    nodeId: NodeId,
-    widgetName: string,
-    config: InputWidgetConfig
-  ) => void
-) {
-  let pendingHandler: (() => void) | null = null
-
-  function clearPendingHandler() {
-    if (!pendingHandler) return
-    window.removeEventListener('pointerup', pendingHandler)
-    window.removeEventListener('pointercancel', pendingHandler)
-    pendingHandler = null
-  }
-
-  onScopeDispose(clearPendingHandler)
-
-  function onPointerDown(
-    nodeId: NodeId,
-    widgetName: string,
-    event: PointerEvent
-  ) {
-    const wrapper = event.currentTarget
-    const target = event.target
-    if (!(wrapper instanceof HTMLElement) || !(target instanceof HTMLElement))
-      return
-    const resizable = target.closest<HTMLElement>(RESIZABLE_SELECTOR)
-    if (!resizable || !wrapper.contains(resizable)) return
-
-    clearPendingHandler()
-
-    const startHeight = resizable.offsetHeight
-    const handler = () => {
-      window.removeEventListener('pointerup', handler)
-      window.removeEventListener('pointercancel', handler)
-      pendingHandler = null
-      const height = resizable.offsetHeight
-      if (height === startHeight) return
-      onResize(nodeId, widgetName, { height })
-    }
-    pendingHandler = handler
-    window.addEventListener('pointerup', handler)
-    window.addEventListener('pointercancel', handler)
-  }
-
-  return { onPointerDown }
-}

src/components/common/TreeExplorerV2Node.vue

@@ -32,14 +32,21 @@
           :aria-label="$t('g.delete')"
           @click.stop="deleteBlueprint"
         >
-          <i class="icon-[lucide--trash-2]" />
+          <i class="icon-[lucide--trash-2] text-xs" />
         </button>
         <button
           :class="cn(ACTION_BTN_CLASS, 'text-muted-foreground')"
           :aria-label="$t('icon.bookmark')"
           @click.stop="toggleBookmark"
         >
-          <i :class="isBookmarked ? 'pi pi-bookmark-fill' : 'pi pi-bookmark'" />
+          <i
+            :class="
+              cn(
+                isBookmarked ? 'pi pi-bookmark-fill' : 'pi pi-bookmark',
+                'text-xs'
+              )
+            "
+          />
         </button>
       </div>
     </div>
@@ -108,7 +115,7 @@ const ROW_CLASS =
   'group/tree-node flex w-full min-w-0 cursor-pointer select-none items-center gap-3 overflow-hidden py-2 outline-none hover:bg-comfy-input rounded'
 
 const ACTION_BTN_CLASS =
-  'flex size-4 shrink-0 cursor-pointer items-center justify-center rounded-sm border-none bg-transparent text-sm opacity-0 group-hover/tree-node:opacity-100 hover:text-foreground'
+  'flex size-4 shrink-0 cursor-pointer items-center justify-center rounded-sm border-none bg-transparent opacity-0 group-hover/tree-node:opacity-100 hover:text-foreground'
 
 const { item } = defineProps<{
   item: FlattenedItem<RenderedTreeExplorerNode<ComfyNodeDefImpl>>

src/components/graph/widgets/DomWidget.test.ts

@@ -114,21 +114,4 @@ describe('DomWidget disabled style', () => {
     expect(root.style.pointerEvents).toBe('none')
     expect(root.style.opacity).toBe('0.5')
   })
-
-  it('disables pointer events when widget is not visible', async () => {
-    const widgetState = createWidgetState(false)
-    widgetState.visible = false
-    const { container } = render(DomWidget, {
-      props: {
-        widgetState
-      }
-    })
-
-    widgetState.zIndex = 3
-    await nextTick()
-
-    // eslint-disable-next-line testing-library/no-container, testing-library/no-node-access
-    const root = container.querySelector('.dom-widget') as HTMLElement
-    expect(root.style.pointerEvents).toBe('none')
-  })
 })

src/components/graph/widgets/DomWidget.vue

@@ -113,10 +113,7 @@ function composeStyle() {
     ...positionStyle.value,
     ...(enableDomClipping.value ? clippingStyle.value : {}),
     zIndex: widgetState.zIndex,
-    pointerEvents:
-      !widgetState.visible || widgetState.readonly || isDisabled
-        ? 'none'
-        : 'auto',
+    pointerEvents: widgetState.readonly || isDisabled ? 'none' : 'auto',
     opacity: isDisabled ? 0.5 : 1
   }
 }

src/components/sidebar/tabs/nodeLibrary/NodeTreeLeaf.vue

@@ -25,7 +25,7 @@
           :aria-label="$t('g.delete')"
           @click.stop="deleteBlueprint"
         >
-          <i class="icon-[lucide--trash-2] size-4" />
+          <i class="icon-[lucide--trash-2] size-3.5" />
         </Button>
         <Button
           variant="muted-textonly"
@@ -33,7 +33,7 @@
           :aria-label="$t('g.edit')"
           @click.stop="editBlueprint"
         >
-          <i class="icon-[lucide--square-pen] size-4" />
+          <i class="icon-[lucide--square-pen] size-3.5" />
         </Button>
       </template>
       <template v-else #actions>

src/composables/useCoreCommands.test.ts

@@ -4,7 +4,6 @@ import { ref } from 'vue'
 
 import { useCoreCommands } from '@/composables/useCoreCommands'
 import type { LGraphNode } from '@/lib/litegraph/src/litegraph'
-import { LiteGraph } from '@/lib/litegraph/src/litegraph'
 import { useSettingStore } from '@/platform/settings/settingStore'
 import { api } from '@/scripts/api'
 import { app } from '@/scripts/app'
@@ -27,51 +26,23 @@ vi.mock('@/scripts/app', () => {
   const mockCanvas = {
     subgraph: undefined,
     selectedItems: new Set(),
-    selected_nodes: null as Record<string, unknown> | null,
     copyToClipboard: vi.fn(),
     pasteFromClipboard: vi.fn(),
-    selectItems: vi.fn(),
-    deleteSelected: vi.fn(),
-    setDirty: vi.fn(),
-    fitViewToSelectionAnimated: vi.fn(),
-    empty: false,
-    ds: {
-      scale: 1,
-      element: { width: 800, height: 600 },
-      changeScale: vi.fn()
-    },
-    state: {
-      readOnly: false,
-      selectionChanged: false
-    },
-    graph: {
-      add: vi.fn(),
-      convertToSubgraph: vi.fn(),
-      rootGraph: {}
-    },
-    select: vi.fn(),
-    canvas: {
-      dispatchEvent: vi.fn()
-    },
-    setGraph: vi.fn()
+    selectItems: vi.fn()
   }
 
   return {
     app: {
       clean: vi.fn(() => {
+        // Simulate app.clean() calling graph.clear() only when not in subgraph
         if (!mockCanvas.subgraph) {
           mockGraphClear()
         }
       }),
       canvas: mockCanvas,
       rootGraph: {
-        clear: mockGraphClear,
-        _nodes: []
-      },
-      queuePrompt: vi.fn(),
-      refreshComboInNodes: vi.fn(),
-      openClipspace: vi.fn(),
-      ui: { loadFile: vi.fn() }
+        clear: mockGraphClear
+      }
     }
   }
 })
@@ -79,9 +50,7 @@ vi.mock('@/scripts/app', () => {
 vi.mock('@/scripts/api', () => ({
   api: {
     dispatchCustomEvent: vi.fn(),
-    apiURL: vi.fn(() => 'http://localhost:8188'),
-    interrupt: vi.fn(),
-    freeMemory: vi.fn()
+    apiURL: vi.fn(() => 'http://localhost:8188')
   }
 }))
 
@@ -120,17 +89,12 @@ vi.mock('@/stores/executionStore', () => ({
   useExecutionStore: vi.fn(() => ({}))
 }))
 
-const mockToastStore = vi.hoisted(() => ({
-  add: vi.fn()
-}))
-vi.mock('@/platform/updates/common/toastStore', () => ({
-  useToastStore: vi.fn(() => mockToastStore)
+vi.mock('@/stores/toastStore', () => ({
+  useToastStore: vi.fn(() => ({}))
 }))
 
 const mockChangeTracker = vi.hoisted(() => ({
-  checkState: vi.fn(),
-  undo: vi.fn(),
-  redo: vi.fn()
+  checkState: vi.fn()
 }))
 const mockWorkflowStore = vi.hoisted(() => ({
   activeWorkflow: {
@@ -145,29 +109,22 @@ vi.mock('@/stores/subgraphStore', () => ({
   useSubgraphStore: vi.fn(() => ({}))
 }))
 
-const mockCanvasStore = vi.hoisted(() => ({
-  getCanvas: vi.fn(),
-  canvas: null as unknown,
-  linearMode: false,
-  updateSelectedItems: vi.fn()
-}))
 vi.mock('@/renderer/core/canvas/canvasStore', () => ({
-  useCanvasStore: vi.fn(() => mockCanvasStore),
+  useCanvasStore: vi.fn(() => ({
+    getCanvas: () => app.canvas,
+    canvas: app.canvas
+  })),
   useTitleEditorStore: vi.fn(() => ({
     titleEditorTarget: null
   }))
 }))
 
 vi.mock('@/stores/workspace/colorPaletteStore', () => ({
-  useColorPaletteStore: vi.fn(() => ({
-    completedActivePalette: { id: 'dark-default', light_theme: false }
-  }))
+  useColorPaletteStore: vi.fn(() => ({}))
 }))
 
 vi.mock('@/composables/auth/useAuthActions', () => ({
-  useAuthActions: vi.fn(() => ({
-    logout: vi.fn()
-  }))
+  useAuthActions: vi.fn(() => ({}))
 }))
 
 vi.mock('@/platform/cloud/subscription/composables/useSubscription', () => ({
@@ -177,88 +134,10 @@ vi.mock('@/platform/cloud/subscription/composables/useSubscription', () => ({
   }))
 }))
 
-const mockIsActiveSubscription = vi.hoisted(() => ({ value: true }))
-const mockShowSubscriptionDialog = vi.hoisted(() => vi.fn())
 vi.mock('@/composables/billing/useBillingContext', () => ({
   useBillingContext: vi.fn(() => ({
-    isActiveSubscription: mockIsActiveSubscription,
-    showSubscriptionDialog: mockShowSubscriptionDialog
-  }))
-}))
-
-vi.mock('@/composables/auth/useCurrentUser', () => ({
-  useCurrentUser: vi.fn(() => ({
-    userEmail: ref(''),
-    resolvedUserInfo: ref(null)
-  }))
-}))
-
-const mockSelectedItems = vi.hoisted(() => ({
-  getSelectedNodes: vi.fn((): unknown[] => []),
-  toggleSelectedNodesMode: vi.fn()
-}))
-vi.mock('@/composables/canvas/useSelectedLiteGraphItems', () => ({
-  useSelectedLiteGraphItems: vi.fn(() => mockSelectedItems)
-}))
-
-vi.mock('@/composables/graph/useSubgraphOperations', () => ({
-  useSubgraphOperations: vi.fn(() => ({
-    unpackSubgraph: vi.fn()
-  }))
-}))
-
-vi.mock('@/composables/useExternalLink', () => ({
-  useExternalLink: vi.fn(() => ({
-    staticUrls: {
-      githubIssues: 'https://github.com/issues',
-      discord: 'https://discord.gg/test',
-      forum: 'https://forum.test.com'
-    },
-    buildDocsUrl: vi.fn(() => 'https://docs.test.com')
-  }))
-}))
-
-vi.mock('@/composables/useModelSelectorDialog', () => ({
-  useModelSelectorDialog: vi.fn(() => ({
-    show: vi.fn()
-  }))
-}))
-
-vi.mock('@/composables/useWorkflowTemplateSelectorDialog', () => ({
-  useWorkflowTemplateSelectorDialog: vi.fn(() => ({
-    show: vi.fn()
-  }))
-}))
-
-vi.mock('@/platform/assets/composables/useAssetBrowserDialog', () => ({
-  useAssetBrowserDialog: vi.fn(() => ({
-    browse: vi.fn()
-  }))
-}))
-
-vi.mock('@/platform/assets/utils/createModelNodeFromAsset', () => ({
-  createModelNodeFromAsset: vi.fn()
-}))
-
-vi.mock('@/platform/support/config', () => ({
-  buildSupportUrl: vi.fn(() => 'https://support.test.com')
-}))
-
-const mockTelemetry = vi.hoisted(() => ({
-  trackWorkflowCreated: vi.fn(),
-  trackRunButton: vi.fn(),
-  trackWorkflowExecution: vi.fn(),
-  trackHelpResourceClicked: vi.fn(),
-  trackEnterLinear: vi.fn()
-}))
-vi.mock('@/platform/telemetry', () => ({
-  useTelemetry: vi.fn(() => mockTelemetry)
-}))
-
-vi.mock('@/platform/settings/composables/useSettingsDialog', () => ({
-  useSettingsDialog: vi.fn(() => ({
-    show: vi.fn(),
-    showAbout: vi.fn()
+    isActiveSubscription: { value: true },
+    showSubscriptionDialog: vi.fn()
   }))
 }))
 
@@ -275,9 +154,13 @@ describe('useCoreCommands', () => {
 
   const createMockSubgraph = () => {
     const mockNodes = [
+      // Mock input node
       createMockNode(1, 'SubgraphInputNode'),
+      // Mock output node
       createMockNode(2, 'SubgraphOutputNode'),
+      // Mock user node
       createMockNode(3, 'SomeUserNode'),
+      // Another mock user node
       createMockNode(4, 'AnotherUserNode')
     ]
 
@@ -346,38 +229,31 @@ describe('useCoreCommands', () => {
     } satisfies ReturnType<typeof useSettingStore>
   }
 
-  function findCommand(id: string) {
-    const cmd = useCoreCommands().find((c) => c.id === id)
-    if (!cmd) throw new Error(`Command '${id}' not found`)
-    return cmd
-  }
-
   beforeEach(() => {
     vi.clearAllMocks()
 
+    // Set up Pinia
     setActivePinia(createPinia())
 
+    // Reset app state
     app.canvas.subgraph = undefined
-    app.canvas.selectedItems = new Set()
-    app.canvas.state.readOnly = false
-    app.canvas.state.selectionChanged = false
-    Object.defineProperty(app.canvas, 'empty', { value: false, writable: true })
-    mockCanvasStore.linearMode = false
-    mockCanvasStore.getCanvas.mockReturnValue(app.canvas)
-    mockIsActiveSubscription.value = true
 
+    // Mock settings store
     vi.mocked(useSettingStore).mockReturnValue(createMockSettingStore(false))
 
-    vi.stubGlobal('confirm', vi.fn().mockReturnValue(true))
-    vi.stubGlobal(
-      'open',
-      vi.fn().mockReturnValue({ focus: vi.fn(), closed: false })
-    )
+    // Mock global confirm
+    global.confirm = vi.fn().mockReturnValue(true)
   })
 
   describe('ClearWorkflow command', () => {
     it('should clear main graph when not in subgraph', async () => {
-      await findCommand('Comfy.ClearWorkflow').function()
+      const commands = useCoreCommands()
+      const clearCommand = commands.find(
+        (cmd) => cmd.id === 'Comfy.ClearWorkflow'
+      )!
+
+      // Execute the command
+      await clearCommand.function()
 
       expect(app.clean).toHaveBeenCalled()
       expect(app.rootGraph.clear).toHaveBeenCalled()
@@ -385,29 +261,46 @@ describe('useCoreCommands', () => {
     })
 
     it('should preserve input/output nodes when clearing subgraph', async () => {
+      // Set up subgraph context
       app.canvas.subgraph = mockSubgraph
 
-      await findCommand('Comfy.ClearWorkflow').function()
+      const commands = useCoreCommands()
+      const clearCommand = commands.find(
+        (cmd) => cmd.id === 'Comfy.ClearWorkflow'
+      )!
+
+      // Execute the command
+      await clearCommand.function()
 
       expect(app.clean).toHaveBeenCalled()
       expect(app.rootGraph.clear).not.toHaveBeenCalled()
 
+      // Should only remove user nodes, not input/output nodes
       const subgraph = app.canvas.subgraph!
       expect(subgraph.remove).toHaveBeenCalledTimes(2)
-      expect(subgraph.remove).toHaveBeenCalledWith(subgraph.nodes[2])
-      expect(subgraph.remove).toHaveBeenCalledWith(subgraph.nodes[3])
-      expect(subgraph.remove).not.toHaveBeenCalledWith(subgraph.nodes[0])
-      expect(subgraph.remove).not.toHaveBeenCalledWith(subgraph.nodes[1])
+      expect(subgraph.remove).toHaveBeenCalledWith(subgraph.nodes[2]) // user1
+      expect(subgraph.remove).toHaveBeenCalledWith(subgraph.nodes[3]) // user2
+      expect(subgraph.remove).not.toHaveBeenCalledWith(subgraph.nodes[0]) // input1
+      expect(subgraph.remove).not.toHaveBeenCalledWith(subgraph.nodes[1]) // output1
 
       expect(api.dispatchCustomEvent).toHaveBeenCalledWith('graphCleared')
     })
 
     it('should respect confirmation setting', async () => {
+      // Mock confirmation required
       vi.mocked(useSettingStore).mockReturnValue(createMockSettingStore(true))
-      vi.stubGlobal('confirm', vi.fn().mockReturnValue(false))
 
-      await findCommand('Comfy.ClearWorkflow').function()
+      global.confirm = vi.fn().mockReturnValue(false) // User cancels
 
+      const commands = useCoreCommands()
+      const clearCommand = commands.find(
+        (cmd) => cmd.id === 'Comfy.ClearWorkflow'
+      )!
+
+      // Execute the command
+      await clearCommand.function()
+
+      // Should not clear anything when user cancels
       expect(app.clean).not.toHaveBeenCalled()
       expect(app.rootGraph.clear).not.toHaveBeenCalled()
       expect(api.dispatchCustomEvent).not.toHaveBeenCalled()
@@ -415,6 +308,17 @@ describe('useCoreCommands', () => {
   })
 
   describe('Canvas clipboard commands', () => {
+    function findCommand(id: string) {
+      return useCoreCommands().find((cmd) => cmd.id === id)!
+    }
+
+    beforeEach(() => {
+      app.canvas.selectedItems = new Set()
+      vi.mocked(app.canvas.copyToClipboard).mockClear()
+      vi.mocked(app.canvas.pasteFromClipboard).mockClear()
+      vi.mocked(app.canvas.selectItems).mockClear()
+    })
+
     it('should copy selected items when selection exists', async () => {
       app.canvas.selectedItems = new Set([
         {}
@@ -437,540 +341,14 @@ describe('useCoreCommands', () => {
       expect(app.canvas.pasteFromClipboard).toHaveBeenCalledWith()
     })
 
-    it('should paste with connect option', async () => {
-      await findCommand('Comfy.Canvas.PasteFromClipboardWithConnect').function()
-
-      expect(app.canvas.pasteFromClipboard).toHaveBeenCalledWith({
-        connectInputs: true
-      })
-    })
-
     it('should select all items', async () => {
       await findCommand('Comfy.Canvas.SelectAll').function()
 
+      // No arguments means "select all items on canvas"
       expect(app.canvas.selectItems).toHaveBeenCalledWith()
     })
   })
 
-  describe('Undo/Redo commands', () => {
-    it('Undo should call changeTracker.undo', async () => {
-      await findCommand('Comfy.Undo').function()
-
-      expect(mockChangeTracker.undo).toHaveBeenCalled()
-    })
-
-    it('Redo should call changeTracker.redo', async () => {
-      await findCommand('Comfy.Redo').function()
-
-      expect(mockChangeTracker.redo).toHaveBeenCalled()
-    })
-  })
-
-  describe('Zoom commands', () => {
-    it('ZoomIn should increase scale and mark dirty', async () => {
-      await findCommand('Comfy.Canvas.ZoomIn').function()
-
-      expect(app.canvas.ds.changeScale).toHaveBeenCalled()
-      expect(app.canvas.setDirty).toHaveBeenCalledWith(true, true)
-    })
-
-    it('ZoomOut should decrease scale and mark dirty', async () => {
-      await findCommand('Comfy.Canvas.ZoomOut').function()
-
-      expect(app.canvas.ds.changeScale).toHaveBeenCalled()
-      expect(app.canvas.setDirty).toHaveBeenCalledWith(true, true)
-    })
-
-    it('ToggleLock should toggle readOnly state', async () => {
-      app.canvas.state.readOnly = false
-
-      await findCommand('Comfy.Canvas.ToggleLock').function()
-      expect(app.canvas.state.readOnly).toBe(true)
-
-      await findCommand('Comfy.Canvas.ToggleLock').function()
-      expect(app.canvas.state.readOnly).toBe(false)
-    })
-
-    it('Lock should set readOnly to true', async () => {
-      await findCommand('Comfy.Canvas.Lock').function()
-      expect(app.canvas.state.readOnly).toBe(true)
-    })
-
-    it('Unlock should set readOnly to false', async () => {
-      app.canvas.state.readOnly = true
-      await findCommand('Comfy.Canvas.Unlock').function()
-      expect(app.canvas.state.readOnly).toBe(false)
-    })
-  })
-
-  describe('Canvas delete command', () => {
-    it('should delete selected items when selection exists', async () => {
-      app.canvas.selectedItems = new Set([
-        {}
-      ]) as typeof app.canvas.selectedItems
-
-      await findCommand('Comfy.Canvas.DeleteSelectedItems').function()
-
-      expect(app.canvas.deleteSelected).toHaveBeenCalled()
-      expect(app.canvas.setDirty).toHaveBeenCalledWith(true, true)
-    })
-
-    it('should dispatch no-items-selected event when nothing selected', async () => {
-      app.canvas.selectedItems = new Set()
-
-      await findCommand('Comfy.Canvas.DeleteSelectedItems').function()
-
-      expect(app.canvas.canvas.dispatchEvent).toHaveBeenCalled()
-      expect(app.canvas.deleteSelected).not.toHaveBeenCalled()
-    })
-  })
-
-  describe('ToggleLinkVisibility command', () => {
-    it('should hide links when currently visible', async () => {
-      const mockStore = createMockSettingStore(false)
-      mockStore.get = vi.fn().mockReturnValue(LiteGraph.SPLINE_LINK)
-      vi.mocked(useSettingStore).mockReturnValue(mockStore)
-
-      await findCommand('Comfy.Canvas.ToggleLinkVisibility').function()
-
-      expect(mockStore.set).toHaveBeenCalledWith(
-        'Comfy.LinkRenderMode',
-        LiteGraph.HIDDEN_LINK
-      )
-    })
-
-    it('should restore links when currently hidden', async () => {
-      const mockStore = createMockSettingStore(false)
-      mockStore.get = vi.fn().mockReturnValue(LiteGraph.HIDDEN_LINK)
-      vi.mocked(useSettingStore).mockReturnValue(mockStore)
-
-      await findCommand('Comfy.Canvas.ToggleLinkVisibility').function()
-
-      expect(mockStore.set).toHaveBeenCalledWith(
-        'Comfy.LinkRenderMode',
-        expect.any(Number)
-      )
-    })
-  })
-
-  describe('ToggleMinimap command', () => {
-    it('should toggle minimap visibility setting', async () => {
-      const mockStore = createMockSettingStore(false)
-      mockStore.get = vi.fn().mockReturnValue(false)
-      vi.mocked(useSettingStore).mockReturnValue(mockStore)
-
-      await findCommand('Comfy.Canvas.ToggleMinimap').function()
-
-      expect(mockStore.set).toHaveBeenCalledWith('Comfy.Minimap.Visible', true)
-    })
-  })
-
-  describe('QueuePrompt commands', () => {
-    it('should show subscription dialog when not subscribed', async () => {
-      mockIsActiveSubscription.value = false
-
-      await findCommand('Comfy.QueuePrompt').function()
-
-      expect(mockShowSubscriptionDialog).toHaveBeenCalled()
-      expect(app.queuePrompt).not.toHaveBeenCalled()
-
-      mockIsActiveSubscription.value = true
-    })
-
-    it('should queue prompt when subscribed', async () => {
-      await findCommand('Comfy.QueuePrompt').function()
-
-      expect(app.queuePrompt).toHaveBeenCalledWith(0, 1)
-      expect(mockTelemetry.trackRunButton).toHaveBeenCalled()
-      expect(mockTelemetry.trackWorkflowExecution).toHaveBeenCalled()
-    })
-
-    it('should queue prompt at front', async () => {
-      await findCommand('Comfy.QueuePromptFront').function()
-
-      expect(app.queuePrompt).toHaveBeenCalledWith(-1, 1)
-    })
-  })
-
-  describe('QueueSelectedOutputNodes command', () => {
-    it('should show error toast when no output nodes selected', async () => {
-      await findCommand('Comfy.QueueSelectedOutputNodes').function()
-
-      expect(mockToastStore.add).toHaveBeenCalledWith(
-        expect.objectContaining({ severity: 'error' })
-      )
-      expect(app.queuePrompt).not.toHaveBeenCalled()
-    })
-  })
-
-  describe('MoveSelectedNodes commands', () => {
-    function setupMoveTest() {
-      const mockNode = createMockLGraphNode({ id: 1 })
-      mockNode.pos = [100, 200] as [number, number]
-      mockSelectedItems.getSelectedNodes.mockReturnValue([mockNode])
-
-      const mockStore = createMockSettingStore(false)
-      mockStore.get = vi.fn().mockReturnValue(10)
-      vi.mocked(useSettingStore).mockReturnValue(mockStore)
-
-      return mockNode
-    }
-
-    it('should move nodes up by grid size', async () => {
-      const mockNode = setupMoveTest()
-
-      await findCommand('Comfy.Canvas.MoveSelectedNodes.Up').function()
-
-      expect(mockNode.pos).toEqual([100, 190])
-      expect(app.canvas.setDirty).toHaveBeenCalledWith(true, true)
-    })
-
-    it('should move nodes down by grid size', async () => {
-      const mockNode = setupMoveTest()
-
-      await findCommand('Comfy.Canvas.MoveSelectedNodes.Down').function()
-
-      expect(mockNode.pos).toEqual([100, 210])
-    })
-
-    it('should move nodes left by grid size', async () => {
-      const mockNode = setupMoveTest()
-
-      await findCommand('Comfy.Canvas.MoveSelectedNodes.Left').function()
-
-      expect(mockNode.pos).toEqual([90, 200])
-    })
-
-    it('should move nodes right by grid size', async () => {
-      const mockNode = setupMoveTest()
-
-      await findCommand('Comfy.Canvas.MoveSelectedNodes.Right').function()
-
-      expect(mockNode.pos).toEqual([110, 200])
-    })
-
-    it('should not move when no nodes selected', async () => {
-      mockSelectedItems.getSelectedNodes.mockReturnValue([])
-
-      await findCommand('Comfy.Canvas.MoveSelectedNodes.Up').function()
-
-      expect(app.canvas.setDirty).not.toHaveBeenCalled()
-    })
-  })
-
-  describe('ToggleLinear command', () => {
-    it('should toggle linear mode and track telemetry when entering', async () => {
-      mockCanvasStore.linearMode = false
-
-      await findCommand('Comfy.ToggleLinear').function()
-
-      expect(mockCanvasStore.linearMode).toBe(true)
-      expect(mockTelemetry.trackEnterLinear).toHaveBeenCalledWith({
-        source: 'keybind'
-      })
-    })
-
-    it('should use provided source metadata', async () => {
-      mockCanvasStore.linearMode = false
-
-      await findCommand('Comfy.ToggleLinear').function({
-        source: 'menu'
-      })
-
-      expect(mockTelemetry.trackEnterLinear).toHaveBeenCalledWith({
-        source: 'menu'
-      })
-    })
-  })
-
-  describe('ToggleQPOV2 command', () => {
-    it('should toggle queue panel v2 setting', async () => {
-      const mockStore = createMockSettingStore(false)
-      mockStore.get = vi.fn().mockReturnValue(false)
-      vi.mocked(useSettingStore).mockReturnValue(mockStore)
-
-      await findCommand('Comfy.ToggleQPOV2').function()
-
-      expect(mockStore.set).toHaveBeenCalledWith('Comfy.Queue.QPOV2', true)
-    })
-  })
-
-  describe('Memory commands', () => {
-    it('UnloadModels should show error when setting is disabled', async () => {
-      const mockStore = createMockSettingStore(false)
-      mockStore.get = vi.fn().mockReturnValue(false)
-      vi.mocked(useSettingStore).mockReturnValue(mockStore)
-
-      await findCommand('Comfy.Memory.UnloadModels').function()
-
-      expect(mockToastStore.add).toHaveBeenCalledWith(
-        expect.objectContaining({ severity: 'error' })
-      )
-      expect(api.freeMemory).not.toHaveBeenCalled()
-    })
-
-    it('UnloadModels should call api.freeMemory when setting is enabled', async () => {
-      const mockStore = createMockSettingStore(false)
-      mockStore.get = vi.fn().mockReturnValue(true)
-      vi.mocked(useSettingStore).mockReturnValue(mockStore)
-
-      await findCommand('Comfy.Memory.UnloadModels').function()
-
-      expect(api.freeMemory).toHaveBeenCalledWith({
-        freeExecutionCache: false
-      })
-    })
-
-    it('UnloadModelsAndExecutionCache should call api.freeMemory with cache flag', async () => {
-      const mockStore = createMockSettingStore(false)
-      mockStore.get = vi.fn().mockReturnValue(true)
-      vi.mocked(useSettingStore).mockReturnValue(mockStore)
-
-      await findCommand('Comfy.Memory.UnloadModelsAndExecutionCache').function()
-
-      expect(api.freeMemory).toHaveBeenCalledWith({
-        freeExecutionCache: true
-      })
-    })
-  })
-
-  describe('FitView command', () => {
-    it('should show error toast when canvas is empty', async () => {
-      Object.defineProperty(app.canvas, 'empty', {
-        value: true,
-        writable: true
-      })
-
-      await findCommand('Comfy.Canvas.FitView').function()
-
-      expect(mockToastStore.add).toHaveBeenCalledWith(
-        expect.objectContaining({ severity: 'error' })
-      )
-      expect(app.canvas.fitViewToSelectionAnimated).not.toHaveBeenCalled()
-    })
-
-    it('should fit view when canvas has content', async () => {
-      Object.defineProperty(app.canvas, 'empty', {
-        value: false,
-        writable: true
-      })
-
-      await findCommand('Comfy.Canvas.FitView').function()
-
-      expect(app.canvas.fitViewToSelectionAnimated).toHaveBeenCalled()
-    })
-  })
-
-  describe('Interrupt command', () => {
-    it('should call api.interrupt and show toast', async () => {
-      await findCommand('Comfy.Interrupt').function()
-
-      expect(api.interrupt).toHaveBeenCalled()
-      expect(mockToastStore.add).toHaveBeenCalledWith(
-        expect.objectContaining({ severity: 'info' })
-      )
-    })
-  })
-
-  describe('OpenWorkflow command', () => {
-    it('should call app.ui.loadFile', async () => {
-      await findCommand('Comfy.OpenWorkflow').function()
-
-      expect(app.ui.loadFile).toHaveBeenCalled()
-    })
-  })
-
-  describe('RefreshNodeDefinitions command', () => {
-    it('should call app.refreshComboInNodes', async () => {
-      await findCommand('Comfy.RefreshNodeDefinitions').function()
-
-      expect(app.refreshComboInNodes).toHaveBeenCalled()
-    })
-  })
-
-  describe('OpenClipspace command', () => {
-    it('should call app.openClipspace', async () => {
-      await findCommand('Comfy.OpenClipspace').function()
-
-      expect(app.openClipspace).toHaveBeenCalled()
-    })
-  })
-
-  describe('ToggleTheme command', () => {
-    it('should switch from dark to light theme', async () => {
-      const mockStore = createMockSettingStore(false)
-      vi.mocked(useSettingStore).mockReturnValue(mockStore)
-
-      await findCommand('Comfy.ToggleTheme').function()
-
-      expect(mockStore.set).toHaveBeenCalledWith(
-        'Comfy.ColorPalette',
-        expect.any(String)
-      )
-    })
-  })
-
-  describe('ToggleSelectedNodes commands', () => {
-    it('Mute should toggle selected nodes mode and mark dirty', async () => {
-      await findCommand('Comfy.Canvas.ToggleSelectedNodes.Mute').function()
-
-      expect(mockSelectedItems.toggleSelectedNodesMode).toHaveBeenCalled()
-      expect(app.canvas.setDirty).toHaveBeenCalledWith(true, true)
-    })
-
-    it('Bypass should toggle selected nodes mode and mark dirty', async () => {
-      await findCommand('Comfy.Canvas.ToggleSelectedNodes.Bypass').function()
-
-      expect(mockSelectedItems.toggleSelectedNodesMode).toHaveBeenCalled()
-      expect(app.canvas.setDirty).toHaveBeenCalledWith(true, true)
-    })
-
-    it('Pin should toggle pin state on each selected node', async () => {
-      const mockNode = createMockLGraphNode({ id: 1 })
-      Object.defineProperty(mockNode, 'pinned', {
-        value: false,
-        writable: true
-      })
-      mockNode.pin = vi.fn()
-      mockSelectedItems.getSelectedNodes.mockReturnValue([mockNode])
-
-      await findCommand('Comfy.Canvas.ToggleSelectedNodes.Pin').function()
-
-      expect(mockNode.pin).toHaveBeenCalledWith(true)
-      expect(app.canvas.setDirty).toHaveBeenCalledWith(true, true)
-    })
-
-    it('Collapse should collapse each selected node', async () => {
-      const mockNode = createMockLGraphNode({ id: 1 })
-      mockNode.collapse = vi.fn()
-      mockSelectedItems.getSelectedNodes.mockReturnValue([mockNode])
-
-      await findCommand('Comfy.Canvas.ToggleSelectedNodes.Collapse').function()
-
-      expect(mockNode.collapse).toHaveBeenCalled()
-      expect(app.canvas.setDirty).toHaveBeenCalledWith(true, true)
-    })
-
-    it('Resize should compute and set optimal size', async () => {
-      const mockNode = createMockLGraphNode({ id: 1 })
-      mockNode.computeSize = vi.fn().mockReturnValue([200, 100])
-      mockNode.setSize = vi.fn()
-      mockSelectedItems.getSelectedNodes.mockReturnValue([mockNode])
-
-      await findCommand('Comfy.Canvas.Resize').function()
-
-      expect(mockNode.computeSize).toHaveBeenCalled()
-      expect(mockNode.setSize).toHaveBeenCalledWith([200, 100])
-      expect(app.canvas.setDirty).toHaveBeenCalledWith(true, true)
-    })
-  })
-
-  describe('Help commands', () => {
-    it('OpenComfyUIIssues should open GitHub issues and track telemetry', async () => {
-      await findCommand('Comfy.Help.OpenComfyUIIssues').function()
-
-      expect(mockTelemetry.trackHelpResourceClicked).toHaveBeenCalledWith({
-        resource_type: 'github',
-        is_external: true,
-        source: 'menu'
-      })
-      expect(window.open).toHaveBeenCalledWith(
-        'https://github.com/issues',
-        '_blank'
-      )
-    })
-
-    it('OpenComfyUIDocs should open docs and track telemetry', async () => {
-      await findCommand('Comfy.Help.OpenComfyUIDocs').function()
-
-      expect(mockTelemetry.trackHelpResourceClicked).toHaveBeenCalledWith({
-        resource_type: 'docs',
-        is_external: true,
-        source: 'menu'
-      })
-      expect(window.open).toHaveBeenCalledWith(
-        'https://docs.test.com',
-        '_blank'
-      )
-    })
-
-    it('OpenComfyOrgDiscord should open Discord and track telemetry', async () => {
-      await findCommand('Comfy.Help.OpenComfyOrgDiscord').function()
-
-      expect(mockTelemetry.trackHelpResourceClicked).toHaveBeenCalledWith({
-        resource_type: 'discord',
-        is_external: true,
-        source: 'menu'
-      })
-      expect(window.open).toHaveBeenCalledWith(
-        'https://discord.gg/test',
-        '_blank'
-      )
-    })
-
-    it('OpenComfyUIForum should open forum and track telemetry', async () => {
-      await findCommand('Comfy.Help.OpenComfyUIForum').function()
-
-      expect(mockTelemetry.trackHelpResourceClicked).toHaveBeenCalledWith({
-        resource_type: 'help_feedback',
-        is_external: true,
-        source: 'menu'
-      })
-      expect(window.open).toHaveBeenCalledWith(
-        'https://forum.test.com',
-        '_blank'
-      )
-    })
-  })
-
-  describe('GroupSelectedNodes command', () => {
-    it('should show error toast when nothing selected', async () => {
-      app.canvas.selectedItems = new Set()
-
-      await findCommand('Comfy.Graph.GroupSelectedNodes').function()
-
-      expect(mockToastStore.add).toHaveBeenCalledWith(
-        expect.objectContaining({ severity: 'error' })
-      )
-    })
-  })
-
-  describe('ConvertToSubgraph command', () => {
-    it('should show error toast when conversion fails', async () => {
-      app.canvas.graph!.convertToSubgraph = vi.fn().mockReturnValue(null)
-
-      await findCommand('Comfy.Graph.ConvertToSubgraph').function()
-
-      expect(mockToastStore.add).toHaveBeenCalledWith(
-        expect.objectContaining({ severity: 'error' })
-      )
-    })
-
-    it('should select the new subgraph node on success', async () => {
-      const mockNode = createMockLGraphNode({ id: 1 })
-      app.canvas.graph!.convertToSubgraph = vi
-        .fn()
-        .mockReturnValue({ node: mockNode })
-
-      await findCommand('Comfy.Graph.ConvertToSubgraph').function()
-
-      expect(app.canvas.select).toHaveBeenCalledWith(mockNode)
-      expect(mockCanvasStore.updateSelectedItems).toHaveBeenCalled()
-    })
-  })
-
-  describe('ContactSupport command', () => {
-    it('should open support URL in new window', async () => {
-      await findCommand('Comfy.ContactSupport').function()
-
-      expect(window.open).toHaveBeenCalledWith(
-        'https://support.test.com',
-        '_blank',
-        'noopener,noreferrer'
-      )
-    })
-  })
-
   describe('Subgraph metadata commands', () => {
     beforeEach(() => {
       mockSubgraph.extra = {}

src/platform/assets/composables/useMediaAssetActions.ts

@@ -633,6 +633,14 @@ export function useMediaAssetActions() {
               )
 
               if (hasOutputAssets) {
+                const succeededOutputIds = assetArray
+                  .filter(
+                    (a, i) =>
+                      getAssetType(a) === 'output' &&
+                      results[i].status === 'fulfilled'
+                  )
+                  .map((a) => a.id)
+                assetsStore.removeHistoryItems(succeededOutputIds)
                 await assetsStore.updateHistory()
               }
               if (hasInputAssets) {

src/platform/workflow/management/stores/comfyWorkflow.ts

@@ -9,14 +9,8 @@ import type { ComfyWorkflowJSON } from '@/platform/workflow/validation/schemas/w
 import type { MissingModelCandidate } from '@/platform/missingModel/types'
 import type { MissingNodeType } from '@/types/comfy'
 
-export interface InputWidgetConfig {
-  height?: number
-}
-
-export type LinearInput = [NodeId, string, InputWidgetConfig?]
-
 export interface LinearData {
-  inputs: LinearInput[]
+  inputs: [NodeId, string][]
   outputs: NodeId[]
 }
 

src/platform/workflow/validation/schemas/workflowSchema.test.ts

@@ -67,69 +67,6 @@ describe('parseComfyWorkflow', () => {
     await expect(validateComfyWorkflow(workflow)).resolves.not.toBeNull()
   })
 
-  describe('linearData.inputs schema', () => {
-    it('validates 2-tuple format (legacy)', async () => {
-      const workflow = JSON.parse(JSON.stringify(defaultGraph))
-      workflow.extra = {
-        linearData: { inputs: [[1, 'prompt']], outputs: [1] }
-      }
-      const result = await validateComfyWorkflow(workflow)
-      expect(result).not.toBeNull()
-      expect(result!.extra!.linearData!.inputs).toEqual([[1, 'prompt']])
-    })
-
-    it('validates 3-tuple format with config', async () => {
-      const workflow = JSON.parse(JSON.stringify(defaultGraph))
-      workflow.extra = {
-        linearData: { inputs: [[1, 'prompt', { height: 200 }]], outputs: [] }
-      }
-      const result = await validateComfyWorkflow(workflow)
-      expect(result).not.toBeNull()
-      expect(result!.extra!.linearData!.inputs![0]).toEqual([
-        1,
-        'prompt',
-        { height: 200 }
-      ])
-    })
-
-    it('validates 3-tuple format with empty config', async () => {
-      const workflow = JSON.parse(JSON.stringify(defaultGraph))
-      workflow.extra = {
-        linearData: { inputs: [[1, 'prompt', {}]], outputs: [] }
-      }
-      const result = await validateComfyWorkflow(workflow)
-      expect(result).not.toBeNull()
-    })
-
-    it('validates mixed 2-tuple and 3-tuple entries', async () => {
-      const workflow = JSON.parse(JSON.stringify(defaultGraph))
-      workflow.extra = {
-        linearData: {
-          inputs: [
-            [1, 'prompt'],
-            [2, 'seed', { height: 100 }]
-          ],
-          outputs: []
-        }
-      }
-      const result = await validateComfyWorkflow(workflow)
-      expect(result).not.toBeNull()
-      expect(result!.extra!.linearData!.inputs).toEqual([
-        [1, 'prompt'],
-        [2, 'seed', { height: 100 }]
-      ])
-    })
-
-    it('rejects invalid config shape', async () => {
-      const workflow = JSON.parse(JSON.stringify(defaultGraph))
-      workflow.extra = {
-        linearData: { inputs: [[1, 'prompt', 'invalid']], outputs: [] }
-      }
-      const result = await validateComfyWorkflow(workflow)
-      expect(result).toBeNull()
-    })
-  })
-
   it('workflow.nodes.pos', async () => {
     const workflow = JSON.parse(JSON.stringify(defaultGraph))
     workflow.nodes[0].pos = [1, 2, 3]

src/platform/workflow/validation/schemas/workflowSchema.ts

@@ -285,18 +285,7 @@ const zExtra = z
     linearMode: z.boolean().optional(),
     linearData: z
       .object({
-        inputs: z
-          .array(
-            z.union([
-              z.tuple([
-                zNodeId,
-                z.string(),
-                z.object({ height: z.number().optional() }).passthrough()
-              ]),
-              z.tuple([zNodeId, z.string()])
-            ])
-          )
-          .optional(),
+        inputs: z.array(z.tuple([zNodeId, z.string()])).optional(),
         outputs: z.array(zNodeId).optional()
       })
       .optional()

src/renderer/extensions/linearMode/AppInput.vue

@@ -2,7 +2,7 @@
 import { remove } from 'es-toolkit'
 import { computed } from 'vue'
 
-import type { LinearInput } from '@/platform/workflow/management/stores/comfyWorkflow'
+import type { NodeId } from '@/lib/litegraph/src/LGraphNode'
 import { useAppModeStore } from '@/stores/appModeStore'
 import { cn } from '@/utils/tailwindUtil'
 
@@ -15,7 +15,7 @@ const { id, name } = defineProps<{
 const appModeStore = useAppModeStore()
 const isPromoted = computed(() => appModeStore.selectedInputs.some(matchesThis))
 
-function matchesThis([nodeId, widgetName]: LinearInput) {
+function matchesThis([nodeId, widgetName]: [NodeId, string]) {
   return id == nodeId && name === widgetName
 }
 function togglePromotion() {

src/renderer/extensions/linearMode/LinearPreview.vue

@@ -103,7 +103,6 @@ async function rerun(e: Event) {
     </Button>
     <Button
       v-if="isWorkflowActive && !selectedItem"
-      data-testid="linear-cancel-run"
       variant="destructive"
       @click="cancelActiveWorkflowJobs()"
     >

src/renderer/extensions/linearMode/LinearProgressBar.vue

@@ -3,6 +3,8 @@ import { useQueueProgress } from '@/composables/queue/useQueueProgress'
 import { useExecutionStore } from '@/stores/executionStore'
 import { cn } from '@/utils/tailwindUtil'
 
+defineOptions({ inheritAttrs: false })
+
 const {
   class: className,
   overallOpacity = 1,
@@ -30,13 +32,11 @@ const executionStore = useExecutionStore()
     "
   >
     <div
-      data-testid="linear-progress-overall"
       class="absolute inset-0 h-full bg-interface-panel-job-progress-primary transition-[width]"
       :class="cn(rounded && 'rounded-sm')"
       :style="{ width: `${totalPercent}%`, opacity: overallOpacity }"
     />
     <div
-      data-testid="linear-progress-node"
       class="absolute inset-0 h-full bg-interface-panel-job-progress-secondary transition-[width]"
       :class="cn(rounded && 'rounded-sm')"
       :style="{ width: `${currentNodePercent}%`, opacity: activeOpacity }"

src/renderer/extensions/linearMode/OutputHistory.vue

@@ -327,7 +327,6 @@ useEventListener(document.body, 'keydown', (e: KeyboardEvent) => {
         :key="`${item.id}-${item.state}`"
         :ref="selectedRef(`slot:${item.id}`)"
         v-bind="itemAttrs(`slot:${item.id}`)"
-        data-testid="linear-in-progress-item"
         :class="itemClass"
         @click="store.select(`slot:${item.id}`)"
       >
@@ -360,7 +359,6 @@ useEventListener(document.body, 'keydown', (e: KeyboardEvent) => {
             :key
             :ref="selectedRef(`history:${asset.id}:${key}`)"
             v-bind="itemAttrs(`history:${asset.id}:${key}`)"
-            data-testid="linear-history-item"
             :class="itemClass"
             @click="store.select(`history:${asset.id}:${key}`)"
           >

src/renderer/extensions/linearMode/OutputHistoryActiveQueueItem.vue

@@ -58,7 +58,6 @@ function clearQueue(close: () => void) {
     <div
       v-if="queueCount > 1"
       aria-hidden="true"
-      data-testid="linear-job-badge"
       class="absolute top-0 right-0 flex h-4 min-w-4 items-center justify-center rounded-full bg-primary-background text-xs text-text-primary"
       v-text="queueCount"
     />