Fix cannot check widget value if undefined (#4433)

Co-authored-by: webfiltered <176114999+webfiltered@users.noreply.github.com>

.claude/commands/comprehensive-pr-review.md

@@ -1,708 +0,0 @@
-# Comprehensive PR Review for ComfyUI Frontend
-
-<task>
-You are performing a comprehensive code review for PR #$1 in the ComfyUI frontend repository. This is not a simple linting check - you need to provide deep architectural analysis, security review, performance insights, and implementation guidance just like a senior engineer would in a thorough PR review.
-
-Your review should cover:
-1. Architecture and design patterns
-2. Security vulnerabilities and risks
-3. Performance implications
-4. Code quality and maintainability
-5. Integration with existing systems
-6. Best practices and conventions
-7. Testing considerations
-8. Documentation needs
-</task>
-
-Arguments: PR number passed via PR_NUMBER environment variable
-
-## Phase 0: Initialize Variables and Helper Functions
-
-```bash
-# Validate PR_NUMBER first thing
-if [ -z "$PR_NUMBER" ]; then
-  echo "Error: PR_NUMBER environment variable is not set"
-  echo "Usage: PR_NUMBER=<number> claude run /comprehensive-pr-review"
-  exit 1
-fi
-
-# Initialize all counters at the start
-CRITICAL_COUNT=0
-HIGH_COUNT=0
-MEDIUM_COUNT=0
-LOW_COUNT=0
-ARCHITECTURE_ISSUES=0
-SECURITY_ISSUES=0
-PERFORMANCE_ISSUES=0
-QUALITY_ISSUES=0
-
-# Helper function for posting review comments
-post_review_comment() {
-  local file_path=$1
-  local line_number=$2
-  local severity=$3  # critical/high/medium/low
-  local category=$4  # architecture/security/performance/quality
-  local issue=$5
-  local context=$6
-  local suggestion=$7
-  
-  # Update counters
-  case $severity in
-    "critical") ((CRITICAL_COUNT++)) ;;
-    "high") ((HIGH_COUNT++)) ;;
-    "medium") ((MEDIUM_COUNT++)) ;;
-    "low") ((LOW_COUNT++)) ;;
-  esac
-  
-  case $category in
-    "architecture") ((ARCHITECTURE_ISSUES++)) ;;
-    "security") ((SECURITY_ISSUES++)) ;;
-    "performance") ((PERFORMANCE_ISSUES++)) ;;
-    "quality") ((QUALITY_ISSUES++)) ;;
-  esac
-  
-  # Post inline comment via GitHub CLI
-  local comment="${issue}\n${context}\n${suggestion}"
-  gh pr review $PR_NUMBER --comment --body "$comment" -F - <<< "$comment"
-}
-```
-
-## Phase 1: Environment Setup and PR Context
-
-```bash
-# Pre-flight checks
-check_prerequisites() {
-  # Check gh CLI is available
-  if ! command -v gh &> /dev/null; then
-    echo "Error: gh CLI is not installed"
-    exit 1
-  fi
-  
-  # In GitHub Actions, auth is handled via GITHUB_TOKEN
-  if [ -n "$GITHUB_ACTIONS" ] && [ -z "$GITHUB_TOKEN" ]; then
-    echo "Error: GITHUB_TOKEN is not set in GitHub Actions"
-    exit 1
-  fi
-  
-  # Check if we're authenticated
-  if ! gh auth status &> /dev/null; then
-    echo "Error: Not authenticated with GitHub. Run 'gh auth login'"
-    exit 1
-  fi
-  
-  # Set repository if not already set
-  if [ -z "$REPOSITORY" ]; then
-    REPOSITORY="Comfy-Org/ComfyUI_frontend"
-  fi
-  
-  # Check PR exists and is open
-  PR_STATE=$(gh pr view $PR_NUMBER --repo $REPOSITORY --json state -q .state 2>/dev/null || echo "NOT_FOUND")
-  if [ "$PR_STATE" = "NOT_FOUND" ]; then
-    echo "Error: PR #$PR_NUMBER not found in $REPOSITORY"
-    exit 1
-  elif [ "$PR_STATE" != "OPEN" ]; then
-    echo "Error: PR #$PR_NUMBER is not open (state: $PR_STATE)"
-    exit 1
-  fi
-  
-  # Check API rate limits
-  RATE_REMAINING=$(gh api /rate_limit --jq '.rate.remaining' 2>/dev/null || echo "5000")
-  if [ "$RATE_REMAINING" -lt 100 ]; then
-    echo "Warning: Low API rate limit: $RATE_REMAINING remaining"
-    if [ "$RATE_REMAINING" -lt 50 ]; then
-      echo "Error: Insufficient API rate limit for comprehensive review"
-      exit 1
-    fi
-  fi
-  
-  echo "Pre-flight checks passed"
-}
-
-# Run pre-flight checks
-check_prerequisites
-
-echo "Starting comprehensive review of PR #$PR_NUMBER"
-
-# Fetch PR information with error handling
-echo "Fetching PR information..."
-if ! gh pr view $PR_NUMBER --repo $REPOSITORY --json files,title,body,additions,deletions,baseRefName,headRefName > pr_info.json; then
-  echo "Error: Failed to fetch PR information"
-  exit 1
-fi
-
-# Extract branch names
-BASE_BRANCH=$(jq -r '.baseRefName' < pr_info.json)
-HEAD_BRANCH=$(jq -r '.headRefName' < pr_info.json)
-
-# Checkout PR branch locally for better file inspection
-echo "Checking out PR branch..."
-git fetch origin "pull/$PR_NUMBER/head:pr-$PR_NUMBER"
-git checkout "pr-$PR_NUMBER"
-
-# Get changed files using git locally (much faster)
-git diff --name-only "origin/$BASE_BRANCH" > changed_files.txt
-
-# Get the diff using git locally
-git diff "origin/$BASE_BRANCH" > pr_diff.txt
-
-# Get detailed file changes with line numbers
-git diff --name-status "origin/$BASE_BRANCH" > file_changes.txt
-
-# For API compatibility, create a simplified pr_files.json
-echo '[]' > pr_files.json
-while IFS=$'\t' read -r status file; do
-  if [[ "$status" != "D" ]]; then  # Skip deleted files
-    # Get the patch for this file
-    patch=$(git diff "origin/$BASE_BRANCH" -- "$file" | jq -Rs .)
-    additions=$(git diff --numstat "origin/$BASE_BRANCH" -- "$file" | awk '{print $1}')
-    deletions=$(git diff --numstat "origin/$BASE_BRANCH" -- "$file" | awk '{print $2}')
-    
-    jq --arg file "$file" \
-       --arg patch "$patch" \
-       --arg additions "$additions" \
-       --arg deletions "$deletions" \
-       '. += [{
-         "filename": $file,
-         "patch": $patch,
-         "additions": ($additions | tonumber),
-         "deletions": ($deletions | tonumber)
-       }]' pr_files.json > pr_files.json.tmp
-    mv pr_files.json.tmp pr_files.json
-  fi
-done < file_changes.txt
-
-# Setup caching directory
-CACHE_DIR=".claude-review-cache"
-mkdir -p "$CACHE_DIR"
-
-# Function to cache analysis results
-cache_analysis() {
-  local file_path=$1
-  local analysis_result=$2
-  local file_hash=$(git hash-object "$file_path" 2>/dev/null || echo "no-hash")
-  
-  if [ "$file_hash" != "no-hash" ]; then
-    echo "$analysis_result" > "$CACHE_DIR/${file_hash}.cache"
-  fi
-}
-
-# Function to get cached analysis
-get_cached_analysis() {
-  local file_path=$1
-  local file_hash=$(git hash-object "$file_path" 2>/dev/null || echo "no-hash")
-  
-  if [ "$file_hash" != "no-hash" ] && [ -f "$CACHE_DIR/${file_hash}.cache" ]; then
-    cat "$CACHE_DIR/${file_hash}.cache"
-    return 0
-  fi
-  return 1
-}
-
-# Clean old cache entries (older than 7 days)
-find "$CACHE_DIR" -name "*.cache" -mtime +7 -delete 2>/dev/null || true
-```
-
-## Phase 2: Load Comprehensive Knowledge Base
-
-```bash
-# Don't create knowledge directory until we know we need it
-KNOWLEDGE_FOUND=false
-
-# Use local cache for knowledge base to avoid repeated downloads
-KNOWLEDGE_CACHE_DIR=".claude-knowledge-cache"
-mkdir -p "$KNOWLEDGE_CACHE_DIR"
-
-# Option to use cloned prompt library for better performance
-PROMPT_LIBRARY_PATH="../comfy-claude-prompt-library"
-if [ -d "$PROMPT_LIBRARY_PATH" ]; then
-  echo "Using local prompt library at $PROMPT_LIBRARY_PATH"
-  USE_LOCAL_PROMPT_LIBRARY=true
-else
-  echo "No local prompt library found, will use GitHub API"
-  USE_LOCAL_PROMPT_LIBRARY=false
-fi
-
-# Function to fetch with cache
-fetch_with_cache() {
-  local url=$1
-  local output_file=$2
-  local cache_file="$KNOWLEDGE_CACHE_DIR/$(echo "$url" | sed 's/[^a-zA-Z0-9]/_/g')"
-  
-  # Check if cached version exists and is less than 1 day old
-  if [ -f "$cache_file" ] && [ $(find "$cache_file" -mtime -1 2>/dev/null | wc -l) -gt 0 ]; then
-    # Create knowledge directory only when we actually have content
-    if [ "$KNOWLEDGE_FOUND" = "false" ]; then
-      mkdir -p review_knowledge
-      KNOWLEDGE_FOUND=true
-    fi
-    cp "$cache_file" "$output_file"
-    echo "Using cached version of $(basename "$output_file")"
-    return 0
-  fi
-  
-  # Try to fetch fresh version
-  if curl -s -f "$url" > "$output_file.tmp"; then
-    # Create knowledge directory only when we actually have content
-    if [ "$KNOWLEDGE_FOUND" = "false" ]; then
-      mkdir -p review_knowledge
-      KNOWLEDGE_FOUND=true
-    fi
-    mv "$output_file.tmp" "$output_file"
-    cp "$output_file" "$cache_file"
-    echo "Downloaded fresh version of $(basename "$output_file")"
-    return 0
-  else
-    # If fetch failed but we have a cache, use it
-    if [ -f "$cache_file" ]; then
-      if [ "$KNOWLEDGE_FOUND" = "false" ]; then
-        mkdir -p review_knowledge
-        KNOWLEDGE_FOUND=true
-      fi
-      cp "$cache_file" "$output_file"
-      echo "Using stale cache for $(basename "$output_file") (download failed)"
-      return 0
-    fi
-    echo "Failed to load $(basename "$output_file")"
-    return 1
-  fi
-}
-
-# Load REPOSITORY_GUIDE.md for deep architectural understanding
-echo "Loading ComfyUI Frontend repository guide..."
-if [ "$USE_LOCAL_PROMPT_LIBRARY" = "true" ] && [ -f "$PROMPT_LIBRARY_PATH/project-summaries-for-agents/ComfyUI_frontend/REPOSITORY_GUIDE.md" ]; then
-  if [ "$KNOWLEDGE_FOUND" = "false" ]; then
-    mkdir -p review_knowledge
-    KNOWLEDGE_FOUND=true
-  fi
-  cp "$PROMPT_LIBRARY_PATH/project-summaries-for-agents/ComfyUI_frontend/REPOSITORY_GUIDE.md" "review_knowledge/repository_guide.md"
-  echo "Loaded repository guide from local prompt library"
-else
-  fetch_with_cache "https://raw.githubusercontent.com/Comfy-Org/comfy-claude-prompt-library/master/project-summaries-for-agents/ComfyUI_frontend/REPOSITORY_GUIDE.md" "review_knowledge/repository_guide.md"
-fi
-
-# 3. Discover and load relevant knowledge folders from GitHub API
-echo "Discovering available knowledge folders..."
-KNOWLEDGE_API_URL="https://api.github.com/repos/Comfy-Org/comfy-claude-prompt-library/contents/.claude/knowledge"
-if KNOWLEDGE_FOLDERS=$(curl -s "$KNOWLEDGE_API_URL" | jq -r '.[] | select(.type=="dir") | .name' 2>/dev/null); then
-  echo "Available knowledge folders: $KNOWLEDGE_FOLDERS"
-  
-  # Analyze changed files to determine which knowledge folders might be relevant
-  CHANGED_FILES=$(cat changed_files.txt)
-  PR_TITLE=$(jq -r '.title' < pr_info.json)
-  PR_BODY=$(jq -r '.body // ""' < pr_info.json)
-  
-  # For each knowledge folder, check if it might be relevant to the PR
-  for folder in $KNOWLEDGE_FOLDERS; do
-    # Simple heuristic: if folder name appears in changed file paths or PR context
-    if echo "$CHANGED_FILES $PR_TITLE $PR_BODY" | grep -qi "$folder"; then
-      echo "Loading knowledge folder: $folder"
-      # Fetch all files in that knowledge folder
-      FOLDER_API_URL="https://api.github.com/repos/Comfy-Org/comfy-claude-prompt-library/contents/.claude/knowledge/$folder"
-      curl -s "$FOLDER_API_URL" | jq -r '.[] | select(.type=="file") | .download_url' 2>/dev/null | \
-        while read url; do
-          if [ -n "$url" ]; then
-            filename=$(basename "$url")
-            fetch_with_cache "$url" "review_knowledge/${folder}_${filename}"
-          fi
-        done
-    fi
-  done
-else
-  echo "Could not discover knowledge folders"
-fi
-
-# 4. Load validation rules from the repository
-echo "Loading validation rules..."
-VALIDATION_API_URL="https://api.github.com/repos/Comfy-Org/comfy-claude-prompt-library/contents/.claude/commands/validation"
-if VALIDATION_FILES=$(curl -s "$VALIDATION_API_URL" | jq -r '.[] | select(.name | contains("frontend") or contains("security") or contains("performance")) | .download_url' 2>/dev/null); then
-  for url in $VALIDATION_FILES; do
-    if [ -n "$url" ]; then
-      filename=$(basename "$url")
-      fetch_with_cache "$url" "review_knowledge/validation_${filename}"
-    fi
-  done
-else
-  echo "Could not load validation rules"
-fi
-
-# 5. Load local project guidelines
-if [ -f "CLAUDE.md" ]; then
-  if [ "$KNOWLEDGE_FOUND" = "false" ]; then
-    mkdir -p review_knowledge
-    KNOWLEDGE_FOUND=true
-  fi
-  cp CLAUDE.md review_knowledge/local_claude.md
-fi
-if [ -f ".github/CLAUDE.md" ]; then
-  if [ "$KNOWLEDGE_FOUND" = "false" ]; then
-    mkdir -p review_knowledge
-    KNOWLEDGE_FOUND=true
-  fi
-  cp .github/CLAUDE.md review_knowledge/github_claude.md
-fi
-```
-
-## Phase 3: Deep Analysis Instructions
-
-Perform a comprehensive analysis covering these areas:
-
-### 3.1 Architectural Analysis
-Based on the repository guide and project summary, evaluate:
-- Does this change align with the established architecture patterns?
-- Are domain boundaries respected?
-- Is the extension system used appropriately?
-- Are components properly organized by feature?
-- Does it follow the established service/composable/store patterns?
-
-### 3.2 Code Quality Beyond Linting
-- Cyclomatic complexity and cognitive load
-- SOLID principles adherence
-- DRY violations that aren't caught by simple duplication checks
-- Proper abstraction levels
-- Interface design and API clarity
-- No leftover debug code (console.log, commented code, TODO comments)
-
-### 3.3 Library Usage Enforcement
-CRITICAL: Never re-implement functionality that exists in our standard libraries:
-- **Tailwind CSS**: Use utility classes instead of custom CSS or style attributes
-- **PrimeVue**: Never re-implement components that exist in PrimeVue (buttons, modals, dropdowns, etc.)
-- **VueUse**: Never re-implement composables that exist in VueUse (useLocalStorage, useDebounceFn, etc.)
-- **Lodash**: Never re-implement utility functions (debounce, throttle, cloneDeep, etc.)
-- **Common components**: Reuse components from src/components/common/
-- **DOMPurify**: Always use for HTML sanitization
-- **Fuse.js**: Use for fuzzy search functionality
-- **Marked**: Use for markdown parsing
-- **Pinia**: Use for global state management, not custom solutions
-- **Zod**: Use for form validation with zodResolver pattern
-- **Tiptap**: Use for rich text/markdown editing
-- **Xterm.js**: Use for terminal emulation
-- **Axios**: Use for HTTP client initialization
-
-### 3.4 Security Deep Dive
-Beyond obvious vulnerabilities:
-- Authentication/authorization implications
-- Data validation completeness
-- State management security
-- Cross-origin concerns
-- Extension security boundaries
-
-### 3.5 Performance Analysis
-- Render performance implications
-- Layout thrashing prevention
-- Memory leak potential
-- Network request optimization
-- State management efficiency
-
-### 3.6 Integration Concerns
-- Breaking changes to internal APIs
-- Extension compatibility
-- Backward compatibility
-- Migration requirements
-
-## Phase 4: Create Detailed Review Comments
-
-CRITICAL: Keep comments extremely concise and effective. Use only as many words as absolutely necessary.
-- NO markdown formatting (no #, ##, ###, **, etc.)
-- NO emojis
-- Get to the point immediately
-- Burden the reader as little as possible
-
-For each issue found, create a concise inline comment with:
-1. What's wrong (one line)
-2. Why it matters (one line)
-3. How to fix it (one line)
-4. Code example only if essential
-
-```bash
-# Helper function for comprehensive comments
-post_review_comment() {
-  local file_path=$1
-  local line_number=$2
-  local severity=$3  # critical/high/medium/low
-  local category=$4  # architecture/security/performance/quality
-  local issue=$5
-  local context=$6
-  local suggestion=$7
-  local example=$8
-  
-  local body="### [$category] $severity Priority
-
-**Issue**: $issue
-
-**Context**: $context
-
-**Suggestion**: $suggestion"
-
-  if [ -n "$example" ]; then
-    body="$body
-
-**Example**:
-\`\`\`typescript
-$example
-\`\`\`"
-  fi
-
-  body="$body
-
-*Related: See [repository guide](https://github.com/Comfy-Org/comfy-claude-prompt-library/blob/master/project-summaries-for-agents/ComfyUI_frontend/REPOSITORY_GUIDE.md) for patterns*"
-
-  gh api -X POST /repos/$REPOSITORY/pulls/$PR_NUMBER/comments \
-    -f path="$file_path" \
-    -f line=$line_number \
-    -f body="$body" \
-    -f commit_id="$COMMIT_SHA" \
-    -f side='RIGHT' || echo "Failed to post comment at $file_path:$line_number"
-}
-```
-
-## Phase 5: Validation Rules Application
-
-Apply ALL validation rules from the loaded knowledge, but focus on the changed lines:
-
-### From Frontend Standards
-- Vue 3 Composition API patterns
-- Component communication patterns
-- Proper use of composables
-- TypeScript strict mode compliance
-- Bundle optimization
-
-### From Security Audit
-- Input validation
-- XSS prevention
-- CSRF protection
-- Secure state management
-- API security
-
-### From Performance Check
-- Render optimization
-- Memory management
-- Network efficiency
-- Bundle size impact
-
-## Phase 6: Contextual Review Based on PR Type
-
-Analyze the PR description and changes to determine the type:
-
-```bash
-# Extract PR metadata with error handling
-if [ ! -f pr_info.json ]; then
-  echo "Error: pr_info.json not found"
-  exit 1
-fi
-
-PR_TITLE=$(jq -r '.title // "Unknown"' < pr_info.json)
-PR_BODY=$(jq -r '.body // ""' < pr_info.json)
-FILE_COUNT=$(wc -l < changed_files.txt)
-ADDITIONS=$(jq -r '.additions // 0' < pr_info.json)
-DELETIONS=$(jq -r '.deletions // 0' < pr_info.json)
-
-# Determine PR type and apply specific review criteria
-if echo "$PR_TITLE $PR_BODY" | grep -qiE "(feature|feat)"; then
-  echo "Detected feature PR - applying feature review criteria"
-  # Check for tests, documentation, backward compatibility
-elif echo "$PR_TITLE $PR_BODY" | grep -qiE "(fix|bug)"; then
-  echo "Detected bug fix - checking root cause and regression tests"
-  # Verify fix addresses root cause, includes tests
-elif echo "$PR_TITLE $PR_BODY" | grep -qiE "(refactor)"; then
-  echo "Detected refactoring - ensuring behavior preservation"
-  # Check that tests still pass, no behavior changes
-fi
-```
-
-## Phase 7: Generate Comprehensive Summary
-
-After all inline comments, create a detailed summary:
-
-```bash
-# Initialize metrics tracking
-REVIEW_START_TIME=$(date +%s)
-
-# Create the comprehensive summary
-gh pr review $PR_NUMBER --comment --body "# Comprehensive PR Review
-
-This review is generated by Claude. It may not always be accurate, as with human reviewers. If you believe that any of the comments are invalid or incorrect, please state why for each. For others, please implement the changes in one way or another.
-
-## Review Summary
-
-**PR**: $PR_TITLE (#$PR_NUMBER)
-**Impact**: $ADDITIONS additions, $DELETIONS deletions across $FILE_COUNT files
-
-### Issue Distribution
-- Critical: $CRITICAL_COUNT
-- High: $HIGH_COUNT
-- Medium: $MEDIUM_COUNT
-- Low: $LOW_COUNT
-
-### Category Breakdown
-- Architecture: $ARCHITECTURE_ISSUES issues
-- Security: $SECURITY_ISSUES issues
-- Performance: $PERFORMANCE_ISSUES issues
-- Code Quality: $QUALITY_ISSUES issues
-
-## Key Findings
-
-### Architecture & Design
-[Detailed architectural analysis based on repository patterns]
-
-### Security Considerations
-[Security implications beyond basic vulnerabilities]
-
-### Performance Impact
-[Performance analysis including bundle size, render impact]
-
-### Integration Points
-[How this affects other systems, extensions, etc.]
-
-## Positive Observations
-[What was done well, good patterns followed]
-
-## References
-- [Repository Architecture Guide](https://github.com/Comfy-Org/comfy-claude-prompt-library/blob/master/project-summaries-for-agents/ComfyUI_frontend/REPOSITORY_GUIDE.md)
-- [Frontend Standards](https://github.com/Comfy-Org/comfy-claude-prompt-library/blob/master/.claude/commands/validation/frontend-code-standards.md)
-- [Security Guidelines](https://github.com/Comfy-Org/comfy-claude-prompt-library/blob/master/.claude/commands/validation/security-audit.md)
-
-## Next Steps
-1. Address critical issues before merge
-2. Consider architectural feedback for long-term maintainability
-3. Add tests for uncovered scenarios
-4. Update documentation if needed
-
----
-*This is a comprehensive automated review. For architectural decisions requiring human judgment, please request additional manual review.*"
-```
-
-## Important: Think Deeply
-
-When reviewing:
-1. **Think hard** about architectural implications
-2. Consider how changes affect the entire system
-3. Look for subtle bugs and edge cases
-4. Evaluate maintainability over time
-5. Consider extension developer experience
-6. Think about migration paths
-
-This is a COMPREHENSIVE review, not a linting pass. Provide the same quality feedback a senior engineer would give after careful consideration.
-
-## Phase 8: Track Review Metrics
-
-After completing the review, save metrics for analysis:
-
-```bash
-# Calculate review duration
-REVIEW_END_TIME=$(date +%s)
-REVIEW_DURATION=$((REVIEW_END_TIME - REVIEW_START_TIME))
-
-# Calculate total issues
-TOTAL_ISSUES=$((CRITICAL_COUNT + HIGH_COUNT + MEDIUM_COUNT + LOW_COUNT))
-
-# Create metrics directory if it doesn't exist
-METRICS_DIR=".claude/review-metrics"
-mkdir -p "$METRICS_DIR"
-
-# Generate metrics file
-METRICS_FILE="$METRICS_DIR/metrics-$(date +%Y%m).json"
-
-# Create or update monthly metrics file
-if [ -f "$METRICS_FILE" ]; then
-  # Append to existing file
-  jq -n \
-    --arg pr "$PR_NUMBER" \
-    --arg title "$PR_TITLE" \
-    --arg timestamp "$(date -u +%Y-%m-%dT%H:%M:%SZ)" \
-    --arg duration "$REVIEW_DURATION" \
-    --arg files "$FILE_COUNT" \
-    --arg additions "$ADDITIONS" \
-    --arg deletions "$DELETIONS" \
-    --arg total "$TOTAL_ISSUES" \
-    --arg critical "$CRITICAL_COUNT" \
-    --arg high "$HIGH_COUNT" \
-    --arg medium "$MEDIUM_COUNT" \
-    --arg low "$LOW_COUNT" \
-    --arg architecture "$ARCHITECTURE_ISSUES" \
-    --arg security "$SECURITY_ISSUES" \
-    --arg performance "$PERFORMANCE_ISSUES" \
-    --arg quality "$QUALITY_ISSUES" \
-    '{
-      pr_number: $pr,
-      pr_title: $title,
-      timestamp: $timestamp,
-      review_duration_seconds: ($duration | tonumber),
-      files_reviewed: ($files | tonumber),
-      lines_added: ($additions | tonumber),
-      lines_deleted: ($deletions | tonumber),
-      issues: {
-        total: ($total | tonumber),
-        by_severity: {
-          critical: ($critical | tonumber),
-          high: ($high | tonumber),
-          medium: ($medium | tonumber),
-          low: ($low | tonumber)
-        },
-        by_category: {
-          architecture: ($architecture | tonumber),
-          security: ($security | tonumber),
-          performance: ($performance | tonumber),
-          quality: ($quality | tonumber)
-        }
-      }
-    }' > "$METRICS_FILE.new"
-  
-  # Merge with existing data
-  jq -s '.[0] + [.[1]]' "$METRICS_FILE" "$METRICS_FILE.new" > "$METRICS_FILE.tmp"
-  mv "$METRICS_FILE.tmp" "$METRICS_FILE"
-  rm "$METRICS_FILE.new"
-else
-  # Create new file
-  jq -n \
-    --arg pr "$PR_NUMBER" \
-    --arg title "$PR_TITLE" \
-    --arg timestamp "$(date -u +%Y-%m-%dT%H:%M:%SZ)" \
-    --arg duration "$REVIEW_DURATION" \
-    --arg files "$FILE_COUNT" \
-    --arg additions "$ADDITIONS" \
-    --arg deletions "$DELETIONS" \
-    --arg total "$TOTAL_ISSUES" \
-    --arg critical "$CRITICAL_COUNT" \
-    --arg high "$HIGH_COUNT" \
-    --arg medium "$MEDIUM_COUNT" \
-    --arg low "$LOW_COUNT" \
-    --arg architecture "$ARCHITECTURE_ISSUES" \
-    --arg security "$SECURITY_ISSUES" \
-    --arg performance "$PERFORMANCE_ISSUES" \
-    --arg quality "$QUALITY_ISSUES" \
-    '[{
-      pr_number: $pr,
-      pr_title: $title,
-      timestamp: $timestamp,
-      review_duration_seconds: ($duration | tonumber),
-      files_reviewed: ($files | tonumber),
-      lines_added: ($additions | tonumber),
-      lines_deleted: ($deletions | tonumber),
-      issues: {
-        total: ($total | tonumber),
-        by_severity: {
-          critical: ($critical | tonumber),
-          high: ($high | tonumber),
-          medium: ($medium | tonumber),
-          low: ($low | tonumber)
-        },
-        by_category: {
-          architecture: ($architecture | tonumber),
-          security: ($security | tonumber),
-          performance: ($performance | tonumber),
-          quality: ($quality | tonumber)
-        }
-      }
-    }]' > "$METRICS_FILE"
-fi
-
-echo "Review metrics saved to $METRICS_FILE"
-```
-
-This creates monthly metrics files (e.g., `metrics-202407.json`) that track:
-- Which PRs were reviewed
-- How long reviews took
-- Types and severity of issues found
-- Trends over time
-
-You can later analyze these to see patterns and improve your development process.

.github/CLAUDE.md

@@ -1,36 +0,0 @@
-# ComfyUI Frontend - Claude Review Context
-
-This file provides additional context for the automated PR review system.
-
-## Quick Reference
-
-### PrimeVue Component Migrations
-
-When reviewing, flag these deprecated components:
-- `Dropdown` → Use `Select` from 'primevue/select'
-- `OverlayPanel` → Use `Popover` from 'primevue/popover'
-- `Calendar` → Use `DatePicker` from 'primevue/datepicker'
-- `InputSwitch` → Use `ToggleSwitch` from 'primevue/toggleswitch'
-- `Sidebar` → Use `Drawer` from 'primevue/drawer'
-- `Chips` → Use `AutoComplete` with multiple enabled and typeahead disabled
-- `TabMenu` → Use `Tabs` without panels
-- `Steps` → Use `Stepper` without panels
-- `InlineMessage` → Use `Message` component
-
-### API Utilities Reference
-
-- `api.apiURL()` - Backend API calls (/prompt, /queue, /view, etc.)
-- `api.fileURL()` - Static file access (templates, extensions)
-- `$t()` / `i18n.global.t()` - Internationalization
-- `DOMPurify.sanitize()` - HTML sanitization
-
-## Review Scope
-
-This automated review performs comprehensive analysis including:
-- Architecture and design patterns
-- Security vulnerabilities
-- Performance implications
-- Code quality and maintainability
-- Integration concerns
-
-For implementation details, see `.claude/commands/comprehensive-pr-review.md`.

.github/workflows/claude-pr-review.yml

@@ -1,75 +0,0 @@
-name: Claude PR Review
-
-permissions:
-  contents: read
-  pull-requests: write
-  issues: write
-
-on:
-  pull_request:
-    types: [labeled]
-
-jobs:
-  wait-for-ci:
-    runs-on: ubuntu-latest
-    if: github.event.label.name == 'claude-review'
-    outputs:
-      should-proceed: ${{ steps.check-status.outputs.proceed }}
-    steps:
-      - name: Wait for other CI checks
-        uses: lewagon/wait-on-check-action@v1.3.1
-        with:
-          ref: ${{ github.event.pull_request.head.sha }}
-          check-regexp: '^(ESLint|Prettier Check|Tests CI|Vitest Tests)'
-          wait-interval: 30
-          repo-token: ${{ secrets.GITHUB_TOKEN }}
-      
-      - name: Check if we should proceed
-        id: check-status
-        run: |
-          # Get all check runs for this commit
-          CHECK_RUNS=$(gh api repos/${{ github.repository }}/commits/${{ github.event.pull_request.head.sha }}/check-runs --jq '.check_runs[] | select(.name | test("ESLint|Prettier Check|Tests CI|Vitest Tests")) | {name, conclusion}')
-          
-          # Check if any required checks failed
-          if echo "$CHECK_RUNS" | grep -q '"conclusion": "failure"'; then
-            echo "Some CI checks failed - skipping Claude review"
-            echo "proceed=false" >> $GITHUB_OUTPUT
-          else
-            echo "All CI checks passed - proceeding with Claude review"
-            echo "proceed=true" >> $GITHUB_OUTPUT
-          fi
-        env:
-          GH_TOKEN: ${{ secrets.GITHUB_TOKEN }}
-
-  claude-review:
-    needs: wait-for-ci
-    if: needs.wait-for-ci.outputs.should-proceed == 'true'
-    runs-on: ubuntu-latest
-    steps:
-      - name: Checkout repository
-        uses: actions/checkout@v4
-        with:
-          fetch-depth: 0
-
-      - name: Setup Node.js
-        uses: actions/setup-node@v4
-        with:
-          node-version: '20'
-
-      - name: Install dependencies for analysis tools
-        run: |
-          npm install -g typescript @vue/compiler-sfc
-
-      - name: Run Claude PR Review
-        uses: anthropics/claude-code-action@main
-        with:
-          prompt_file: .claude/commands/comprehensive-pr-review.md
-          anthropic_api_key: ${{ secrets.ANTHROPIC_API_KEY }}
-          max_turns: 1
-          timeout_minutes: 30
-        env:
-          PR_NUMBER: ${{ github.event.pull_request.number }}
-          GITHUB_TOKEN: ${{ secrets.GITHUB_TOKEN }}
-          COMMIT_SHA: ${{ github.event.pull_request.head.sha }}
-          BASE_SHA: ${{ github.event.pull_request.base.sha }}
-          REPOSITORY: ${{ github.repository }}

.github/workflows/danger.yaml

@@ -1,27 +0,0 @@
-name: Danger PR Review
-on:
-  pull_request:
-    types: [opened, edited, synchronize]
-
-jobs:
-  danger:
-    runs-on: ubuntu-latest
-    steps:
-      - name: Checkout code
-        uses: actions/checkout@v4
-        with:
-          fetch-depth: 0
-
-      - name: Setup Node.js
-        uses: actions/setup-node@v4
-        with:
-          node-version: 'lts/*'
-
-      - name: Install dependencies
-        run: npm ci
-
-      - name: Run Danger
-        run: npx danger ci
-        env:
-          GITHUB_TOKEN: ${{ secrets.GITHUB_TOKEN }}
-          DANGER_GITHUB_API_TOKEN: ${{ secrets.GITHUB_TOKEN }}

browser_tests/assets/nested-subgraph.json

@@ -1,716 +0,0 @@
-{
-  "id": "976d6e9a-927d-42db-abd4-96bfc0ecf8d9",
-  "revision": 0,
-  "last_node_id": 10,
-  "last_link_id": 11,
-  "nodes": [
-    {
-      "id": 10,
-      "type": "8beb610f-ddd1-4489-ae0d-2f732a4042ae",
-      "pos": [
-        532,
-        412.5
-      ],
-      "size": [
-        140,
-        46
-      ],
-      "flags": {},
-      "order": 0,
-      "mode": 0,
-      "inputs": [],
-      "outputs": [
-        {
-          "name": "LATENT",
-          "type": "LATENT",
-          "links": [
-            10
-          ]
-        },
-        {
-          "name": "VAE",
-          "type": "VAE",
-          "links": [
-            11
-          ]
-        }
-      ],
-      "title": "subgraph 2",
-      "properties": {},
-      "widgets_values": []
-    },
-    {
-      "id": 8,
-      "type": "VAEDecode",
-      "pos": [
-        758.2109985351562,
-        398.3681335449219
-      ],
-      "size": [
-        210,
-        46
-      ],
-      "flags": {},
-      "order": 1,
-      "mode": 0,
-      "inputs": [
-        {
-          "name": "samples",
-          "type": "LATENT",
-          "link": 10
-        },
-        {
-          "name": "vae",
-          "type": "VAE",
-          "link": 11
-        }
-      ],
-      "outputs": [
-        {
-          "name": "IMAGE",
-          "type": "IMAGE",
-          "slot_index": 0,
-          "links": [
-            9
-          ]
-        }
-      ],
-      "properties": {
-        "Node name for S&R": "VAEDecode"
-      },
-      "widgets_values": []
-    },
-    {
-      "id": 9,
-      "type": "SaveImage",
-      "pos": [
-        1028.9615478515625,
-        381.83746337890625
-      ],
-      "size": [
-        210,
-        270
-      ],
-      "flags": {},
-      "order": 2,
-      "mode": 0,
-      "inputs": [
-        {
-          "name": "images",
-          "type": "IMAGE",
-          "link": 9
-        }
-      ],
-      "outputs": [],
-      "properties": {},
-      "widgets_values": [
-        "ComfyUI"
-      ]
-    }
-  ],
-  "links": [
-    [
-      9,
-      8,
-      0,
-      9,
-      0,
-      "IMAGE"
-    ],
-    [
-      10,
-      10,
-      0,
-      8,
-      0,
-      "LATENT"
-    ],
-    [
-      11,
-      10,
-      1,
-      8,
-      1,
-      "VAE"
-    ]
-  ],
-  "groups": [],
-  "definitions": {
-    "subgraphs": [
-      {
-        "id": "8beb610f-ddd1-4489-ae0d-2f732a4042ae",
-        "version": 1,
-        "state": {
-          "lastGroupId": 0,
-          "lastNodeId": 10,
-          "lastLinkId": 14,
-          "lastRerouteId": 0
-        },
-        "revision": 0,
-        "config": {},
-        "name": "subgraph 2",
-        "inputNode": {
-          "id": -10,
-          "bounding": [
-            -154,
-            415.5,
-            120,
-            40
-          ]
-        },
-        "outputNode": {
-          "id": -20,
-          "bounding": [
-            1238,
-            395.5,
-            120,
-            80
-          ]
-        },
-        "inputs": [],
-        "outputs": [
-          {
-            "id": "4d6c7e4e-971e-4f78-9218-9a604db53a4b",
-            "name": "LATENT",
-            "type": "LATENT",
-            "linkIds": [
-              7
-            ],
-            "localized_name": "LATENT",
-            "pos": {
-              "0": 1258,
-              "1": 415.5
-            }
-          },
-          {
-            "id": "f8201d4f-7fc6-4a1b-b8c9-9f0716d9c09a",
-            "name": "VAE",
-            "type": "VAE",
-            "linkIds": [
-              14
-            ],
-            "localized_name": "VAE",
-            "pos": {
-              "0": 1258,
-              "1": 435.5
-            }
-          }
-        ],
-        "widgets": [],
-        "nodes": [
-          {
-            "id": 6,
-            "type": "CLIPTextEncode",
-            "pos": [
-              415,
-              186
-            ],
-            "size": [
-              422.84503173828125,
-              164.31304931640625
-            ],
-            "flags": {},
-            "order": 0,
-            "mode": 0,
-            "inputs": [
-              {
-                "localized_name": "clip",
-                "name": "clip",
-                "type": "CLIP",
-                "link": 13
-              }
-            ],
-            "outputs": [
-              {
-                "localized_name": "CONDITIONING",
-                "name": "CONDITIONING",
-                "type": "CONDITIONING",
-                "slot_index": 0,
-                "links": [
-                  4
-                ]
-              }
-            ],
-            "properties": {
-              "Node name for S&R": "CLIPTextEncode"
-            },
-            "widgets_values": [
-              "beautiful scenery nature glass bottle landscape, , purple galaxy bottle,"
-            ]
-          },
-          {
-            "id": 3,
-            "type": "KSampler",
-            "pos": [
-              863,
-              186
-            ],
-            "size": [
-              315,
-              262
-            ],
-            "flags": {},
-            "order": 2,
-            "mode": 0,
-            "inputs": [
-              {
-                "localized_name": "model",
-                "name": "model",
-                "type": "MODEL",
-                "link": 12
-              },
-              {
-                "localized_name": "positive",
-                "name": "positive",
-                "type": "CONDITIONING",
-                "link": 4
-              },
-              {
-                "localized_name": "negative",
-                "name": "negative",
-                "type": "CONDITIONING",
-                "link": 10
-              },
-              {
-                "localized_name": "latent_image",
-                "name": "latent_image",
-                "type": "LATENT",
-                "link": 11
-              }
-            ],
-            "outputs": [
-              {
-                "localized_name": "LATENT",
-                "name": "LATENT",
-                "type": "LATENT",
-                "slot_index": 0,
-                "links": [
-                  7
-                ]
-              }
-            ],
-            "properties": {
-              "Node name for S&R": "KSampler"
-            },
-            "widgets_values": [
-              32115495257102,
-              "randomize",
-              20,
-              8,
-              "euler",
-              "normal",
-              1
-            ]
-          },
-          {
-            "id": 10,
-            "type": "dbe5763f-440b-47b4-82ac-454f1f98b0e3",
-            "pos": [
-              194.13900756835938,
-              657.3333740234375
-            ],
-            "size": [
-              140,
-              106
-            ],
-            "flags": {},
-            "order": 1,
-            "mode": 0,
-            "inputs": [],
-            "outputs": [
-              {
-                "localized_name": "CONDITIONING",
-                "name": "CONDITIONING",
-                "type": "CONDITIONING",
-                "links": [
-                  10
-                ]
-              },
-              {
-                "localized_name": "LATENT",
-                "name": "LATENT",
-                "type": "LATENT",
-                "links": [
-                  11
-                ]
-              },
-              {
-                "localized_name": "MODEL",
-                "name": "MODEL",
-                "type": "MODEL",
-                "links": [
-                  12
-                ]
-              },
-              {
-                "localized_name": "CLIP",
-                "name": "CLIP",
-                "type": "CLIP",
-                "links": [
-                  13
-                ]
-              },
-              {
-                "localized_name": "VAE",
-                "name": "VAE",
-                "type": "VAE",
-                "links": [
-                  14
-                ]
-              }
-            ],
-            "title": "subgraph 3",
-            "properties": {},
-            "widgets_values": []
-          }
-        ],
-        "groups": [],
-        "links": [
-          {
-            "id": 4,
-            "origin_id": 6,
-            "origin_slot": 0,
-            "target_id": 3,
-            "target_slot": 1,
-            "type": "CONDITIONING"
-          },
-          {
-            "id": 7,
-            "origin_id": 3,
-            "origin_slot": 0,
-            "target_id": -20,
-            "target_slot": 0,
-            "type": "LATENT"
-          },
-          {
-            "id": 10,
-            "origin_id": 10,
-            "origin_slot": 0,
-            "target_id": 3,
-            "target_slot": 2,
-            "type": "CONDITIONING"
-          },
-          {
-            "id": 11,
-            "origin_id": 10,
-            "origin_slot": 1,
-            "target_id": 3,
-            "target_slot": 3,
-            "type": "LATENT"
-          },
-          {
-            "id": 12,
-            "origin_id": 10,
-            "origin_slot": 2,
-            "target_id": 3,
-            "target_slot": 0,
-            "type": "MODEL"
-          },
-          {
-            "id": 13,
-            "origin_id": 10,
-            "origin_slot": 3,
-            "target_id": 6,
-            "target_slot": 0,
-            "type": "CLIP"
-          },
-          {
-            "id": 14,
-            "origin_id": 10,
-            "origin_slot": 4,
-            "target_id": -20,
-            "target_slot": 1,
-            "type": "VAE"
-          }
-        ],
-        "extra": {}
-      },
-      {
-        "id": "dbe5763f-440b-47b4-82ac-454f1f98b0e3",
-        "version": 1,
-        "state": {
-          "lastGroupId": 0,
-          "lastNodeId": 9,
-          "lastLinkId": 9,
-          "lastRerouteId": 0
-        },
-        "revision": 0,
-        "config": {},
-        "name": "subgraph 3",
-        "inputNode": {
-          "id": -10,
-          "bounding": [
-            -154,
-            517,
-            120,
-            40
-          ]
-        },
-        "outputNode": {
-          "id": -20,
-          "bounding": [
-            898.2780151367188,
-            467,
-            128.6640625,
-            140
-          ]
-        },
-        "inputs": [],
-        "outputs": [
-          {
-            "id": "b4882169-329b-43f6-a373-81abfbdea55b",
-            "name": "CONDITIONING",
-            "type": "CONDITIONING",
-            "linkIds": [
-              6
-            ],
-            "localized_name": "CONDITIONING",
-            "pos": {
-              "0": 918.2780151367188,
-              "1": 487
-            }
-          },
-          {
-            "id": "01f51f96-a741-428e-8772-9557ee50b609",
-            "name": "LATENT",
-            "type": "LATENT",
-            "linkIds": [
-              2
-            ],
-            "localized_name": "LATENT",
-            "pos": {
-              "0": 918.2780151367188,
-              "1": 507
-            }
-          },
-          {
-            "id": "47fa906e-d80b-45c3-a596-211a0e59d4a1",
-            "name": "MODEL",
-            "type": "MODEL",
-            "linkIds": [
-              1
-            ],
-            "localized_name": "MODEL",
-            "pos": {
-              "0": 918.2780151367188,
-              "1": 527
-            }
-          },
-          {
-            "id": "f03dccd7-10e8-4513-9994-15854a92d192",
-            "name": "CLIP",
-            "type": "CLIP",
-            "linkIds": [
-              3
-            ],
-            "localized_name": "CLIP",
-            "pos": {
-              "0": 918.2780151367188,
-              "1": 547
-            }
-          },
-          {
-            "id": "a666877f-e34f-49bc-8a78-b26156656b83",
-            "name": "VAE",
-            "type": "VAE",
-            "linkIds": [
-              8
-            ],
-            "localized_name": "VAE",
-            "pos": {
-              "0": 918.2780151367188,
-              "1": 567
-            }
-          }
-        ],
-        "widgets": [],
-        "nodes": [
-          {
-            "id": 7,
-            "type": "CLIPTextEncode",
-            "pos": [
-              413,
-              389
-            ],
-            "size": [
-              425.27801513671875,
-              180.6060791015625
-            ],
-            "flags": {},
-            "order": 2,
-            "mode": 0,
-            "inputs": [
-              {
-                "localized_name": "clip",
-                "name": "clip",
-                "type": "CLIP",
-                "link": 5
-              }
-            ],
-            "outputs": [
-              {
-                "localized_name": "CONDITIONING",
-                "name": "CONDITIONING",
-                "type": "CONDITIONING",
-                "slot_index": 0,
-                "links": [
-                  6
-                ]
-              }
-            ],
-            "properties": {
-              "Node name for S&R": "CLIPTextEncode"
-            },
-            "widgets_values": [
-              "text, watermark"
-            ]
-          },
-          {
-            "id": 5,
-            "type": "EmptyLatentImage",
-            "pos": [
-              473,
-              609
-            ],
-            "size": [
-              315,
-              106
-            ],
-            "flags": {},
-            "order": 0,
-            "mode": 0,
-            "inputs": [],
-            "outputs": [
-              {
-                "localized_name": "LATENT",
-                "name": "LATENT",
-                "type": "LATENT",
-                "slot_index": 0,
-                "links": [
-                  2
-                ]
-              }
-            ],
-            "properties": {
-              "Node name for S&R": "EmptyLatentImage"
-            },
-            "widgets_values": [
-              512,
-              512,
-              1
-            ]
-          },
-          {
-            "id": 4,
-            "type": "CheckpointLoaderSimple",
-            "pos": [
-              26,
-              474
-            ],
-            "size": [
-              315,
-              98
-            ],
-            "flags": {},
-            "order": 1,
-            "mode": 0,
-            "inputs": [],
-            "outputs": [
-              {
-                "localized_name": "MODEL",
-                "name": "MODEL",
-                "type": "MODEL",
-                "slot_index": 0,
-                "links": [
-                  1
-                ]
-              },
-              {
-                "localized_name": "CLIP",
-                "name": "CLIP",
-                "type": "CLIP",
-                "slot_index": 1,
-                "links": [
-                  3,
-                  5
-                ]
-              },
-              {
-                "localized_name": "VAE",
-                "name": "VAE",
-                "type": "VAE",
-                "slot_index": 2,
-                "links": [
-                  8
-                ]
-              }
-            ],
-            "properties": {
-              "Node name for S&R": "CheckpointLoaderSimple"
-            },
-            "widgets_values": [
-              "v1-5-pruned-emaonly-fp16.safetensors"
-            ]
-          }
-        ],
-        "groups": [],
-        "links": [
-          {
-            "id": 5,
-            "origin_id": 4,
-            "origin_slot": 1,
-            "target_id": 7,
-            "target_slot": 0,
-            "type": "CLIP"
-          },
-          {
-            "id": 6,
-            "origin_id": 7,
-            "origin_slot": 0,
-            "target_id": -20,
-            "target_slot": 0,
-            "type": "CONDITIONING"
-          },
-          {
-            "id": 2,
-            "origin_id": 5,
-            "origin_slot": 0,
-            "target_id": -20,
-            "target_slot": 1,
-            "type": "LATENT"
-          },
-          {
-            "id": 1,
-            "origin_id": 4,
-            "origin_slot": 0,
-            "target_id": -20,
-            "target_slot": 2,
-            "type": "MODEL"
-          },
-          {
-            "id": 3,
-            "origin_id": 4,
-            "origin_slot": 1,
-            "target_id": -20,
-            "target_slot": 3,
-            "type": "CLIP"
-          },
-          {
-            "id": 8,
-            "origin_id": 4,
-            "origin_slot": 2,
-            "target_id": -20,
-            "target_slot": 4,
-            "type": "VAE"
-          }
-        ],
-        "extra": {}
-      }
-    ]
-  },
-  "config": {},
-  "extra": {
-    "frontendVersion": "1.24.0-1"
-  },
-  "version": 0.4
-}

browser_tests/tests/featureFlags.spec.ts

@@ -1,382 +0,0 @@
-import { expect } from '@playwright/test'
-
-import { comfyPageFixture as test } from '../fixtures/ComfyPage'
-
-test.describe('Feature Flags', () => {
-  test('Client and server exchange feature flags on connection', async ({
-    comfyPage
-  }) => {
-    // Navigate to a new page to capture the initial WebSocket connection
-    const newPage = await comfyPage.page.context().newPage()
-
-    // Set up monitoring before navigation
-    await newPage.addInitScript(() => {
-      // This runs before any page scripts
-      window.__capturedMessages = {
-        clientFeatureFlags: null,
-        serverFeatureFlags: null
-      }
-
-      // Capture outgoing client messages
-      const originalSend = WebSocket.prototype.send
-      WebSocket.prototype.send = function (data) {
-        try {
-          const parsed = JSON.parse(data)
-          if (parsed.type === 'feature_flags') {
-            window.__capturedMessages.clientFeatureFlags = parsed
-          }
-        } catch (e) {
-          // Not JSON, ignore
-        }
-        return originalSend.call(this, data)
-      }
-
-      // Monitor for server feature flags
-      const checkInterval = setInterval(() => {
-        if (
-          window['app']?.api?.serverFeatureFlags &&
-          Object.keys(window['app'].api.serverFeatureFlags).length > 0
-        ) {
-          window.__capturedMessages.serverFeatureFlags =
-            window['app'].api.serverFeatureFlags
-          clearInterval(checkInterval)
-        }
-      }, 100)
-
-      // Clear after 10 seconds
-      setTimeout(() => clearInterval(checkInterval), 10000)
-    })
-
-    // Navigate to the app
-    await newPage.goto(comfyPage.url)
-
-    // Wait for both client and server feature flags
-    await newPage.waitForFunction(
-      () =>
-        window.__capturedMessages.clientFeatureFlags !== null &&
-        window.__capturedMessages.serverFeatureFlags !== null,
-      { timeout: 10000 }
-    )
-
-    // Get the captured messages
-    const messages = await newPage.evaluate(() => window.__capturedMessages)
-
-    // Verify client sent feature flags
-    expect(messages.clientFeatureFlags).toBeTruthy()
-    expect(messages.clientFeatureFlags).toHaveProperty('type', 'feature_flags')
-    expect(messages.clientFeatureFlags).toHaveProperty('data')
-    expect(messages.clientFeatureFlags.data).toHaveProperty(
-      'supports_preview_metadata'
-    )
-    expect(
-      typeof messages.clientFeatureFlags.data.supports_preview_metadata
-    ).toBe('boolean')
-
-    // Verify server sent feature flags back
-    expect(messages.serverFeatureFlags).toBeTruthy()
-    expect(messages.serverFeatureFlags).toHaveProperty(
-      'supports_preview_metadata'
-    )
-    expect(typeof messages.serverFeatureFlags.supports_preview_metadata).toBe(
-      'boolean'
-    )
-    expect(messages.serverFeatureFlags).toHaveProperty('max_upload_size')
-    expect(typeof messages.serverFeatureFlags.max_upload_size).toBe('number')
-    expect(Object.keys(messages.serverFeatureFlags).length).toBeGreaterThan(0)
-
-    await newPage.close()
-  })
-
-  test('Server feature flags are received and accessible', async ({
-    comfyPage
-  }) => {
-    // Wait for connection to establish
-    await comfyPage.page.waitForTimeout(1000)
-
-    // Get the actual server feature flags from the backend
-    const serverFlags = await comfyPage.page.evaluate(() => {
-      return window['app'].api.serverFeatureFlags
-    })
-
-    // Verify we received real feature flags from the backend
-    expect(serverFlags).toBeTruthy()
-    expect(Object.keys(serverFlags).length).toBeGreaterThan(0)
-
-    // The backend should send feature flags
-    expect(serverFlags).toHaveProperty('supports_preview_metadata')
-    expect(typeof serverFlags.supports_preview_metadata).toBe('boolean')
-    expect(serverFlags).toHaveProperty('max_upload_size')
-    expect(typeof serverFlags.max_upload_size).toBe('number')
-  })
-
-  test('serverSupportsFeature method works with real backend flags', async ({
-    comfyPage
-  }) => {
-    // Wait for connection
-    await comfyPage.page.waitForTimeout(1000)
-
-    // Test serverSupportsFeature with real backend flags
-    const supportsPreviewMetadata = await comfyPage.page.evaluate(() => {
-      return window['app'].api.serverSupportsFeature(
-        'supports_preview_metadata'
-      )
-    })
-    // The method should return a boolean based on the backend's value
-    expect(typeof supportsPreviewMetadata).toBe('boolean')
-
-    // Test non-existent feature - should always return false
-    const supportsNonExistent = await comfyPage.page.evaluate(() => {
-      return window['app'].api.serverSupportsFeature('non_existent_feature_xyz')
-    })
-    expect(supportsNonExistent).toBe(false)
-
-    // Test that the method only returns true for boolean true values
-    const testResults = await comfyPage.page.evaluate(() => {
-      // Temporarily modify serverFeatureFlags to test behavior
-      const original = window['app'].api.serverFeatureFlags
-      window['app'].api.serverFeatureFlags = {
-        bool_true: true,
-        bool_false: false,
-        string_value: 'yes',
-        number_value: 1,
-        null_value: null
-      }
-
-      const results = {
-        bool_true: window['app'].api.serverSupportsFeature('bool_true'),
-        bool_false: window['app'].api.serverSupportsFeature('bool_false'),
-        string_value: window['app'].api.serverSupportsFeature('string_value'),
-        number_value: window['app'].api.serverSupportsFeature('number_value'),
-        null_value: window['app'].api.serverSupportsFeature('null_value')
-      }
-
-      // Restore original
-      window['app'].api.serverFeatureFlags = original
-      return results
-    })
-
-    // serverSupportsFeature should only return true for boolean true values
-    expect(testResults.bool_true).toBe(true)
-    expect(testResults.bool_false).toBe(false)
-    expect(testResults.string_value).toBe(false)
-    expect(testResults.number_value).toBe(false)
-    expect(testResults.null_value).toBe(false)
-  })
-
-  test('getServerFeature method works with real backend data', async ({
-    comfyPage
-  }) => {
-    // Wait for connection
-    await comfyPage.page.waitForTimeout(1000)
-
-    // Test getServerFeature method
-    const previewMetadataValue = await comfyPage.page.evaluate(() => {
-      return window['app'].api.getServerFeature('supports_preview_metadata')
-    })
-    expect(typeof previewMetadataValue).toBe('boolean')
-
-    // Test getting max_upload_size
-    const maxUploadSize = await comfyPage.page.evaluate(() => {
-      return window['app'].api.getServerFeature('max_upload_size')
-    })
-    expect(typeof maxUploadSize).toBe('number')
-    expect(maxUploadSize).toBeGreaterThan(0)
-
-    // Test getServerFeature with default value for non-existent feature
-    const defaultValue = await comfyPage.page.evaluate(() => {
-      return window['app'].api.getServerFeature(
-        'non_existent_feature_xyz',
-        'default'
-      )
-    })
-    expect(defaultValue).toBe('default')
-  })
-
-  test('getServerFeatures returns all backend feature flags', async ({
-    comfyPage
-  }) => {
-    // Wait for connection
-    await comfyPage.page.waitForTimeout(1000)
-
-    // Test getServerFeatures returns all flags
-    const allFeatures = await comfyPage.page.evaluate(() => {
-      return window['app'].api.getServerFeatures()
-    })
-
-    expect(allFeatures).toBeTruthy()
-    expect(allFeatures).toHaveProperty('supports_preview_metadata')
-    expect(typeof allFeatures.supports_preview_metadata).toBe('boolean')
-    expect(allFeatures).toHaveProperty('max_upload_size')
-    expect(Object.keys(allFeatures).length).toBeGreaterThan(0)
-  })
-
-  test('Client feature flags are immutable', async ({ comfyPage }) => {
-    // Test that getClientFeatureFlags returns a copy
-    const immutabilityTest = await comfyPage.page.evaluate(() => {
-      const flags1 = window['app'].api.getClientFeatureFlags()
-      const flags2 = window['app'].api.getClientFeatureFlags()
-
-      // Modify the first object
-      flags1.test_modification = true
-
-      // Get flags again to check if original was modified
-      const flags3 = window['app'].api.getClientFeatureFlags()
-
-      return {
-        areEqual: flags1 === flags2,
-        hasModification: flags3.test_modification !== undefined,
-        hasSupportsPreview: flags1.supports_preview_metadata !== undefined,
-        supportsPreviewValue: flags1.supports_preview_metadata
-      }
-    })
-
-    // Verify they are different objects (not the same reference)
-    expect(immutabilityTest.areEqual).toBe(false)
-
-    // Verify modification didn't affect the original
-    expect(immutabilityTest.hasModification).toBe(false)
-
-    // Verify the flags contain expected properties
-    expect(immutabilityTest.hasSupportsPreview).toBe(true)
-    expect(typeof immutabilityTest.supportsPreviewValue).toBe('boolean') // From clientFeatureFlags.json
-  })
-
-  test('Server features are immutable when accessed via getServerFeatures', async ({
-    comfyPage
-  }) => {
-    // Wait for connection to establish
-    await comfyPage.page.waitForTimeout(1000)
-
-    const immutabilityTest = await comfyPage.page.evaluate(() => {
-      // Get a copy of server features
-      const features1 = window['app'].api.getServerFeatures()
-
-      // Try to modify it
-      features1.supports_preview_metadata = false
-      features1.new_feature = 'added'
-
-      // Get another copy
-      const features2 = window['app'].api.getServerFeatures()
-
-      return {
-        modifiedValue: features1.supports_preview_metadata,
-        originalValue: features2.supports_preview_metadata,
-        hasNewFeature: features2.new_feature !== undefined,
-        hasSupportsPreview: features2.supports_preview_metadata !== undefined
-      }
-    })
-
-    // The modification should only affect the copy
-    expect(immutabilityTest.modifiedValue).toBe(false)
-    expect(typeof immutabilityTest.originalValue).toBe('boolean') // Backend sends boolean for supports_preview_metadata
-    expect(immutabilityTest.hasNewFeature).toBe(false)
-    expect(immutabilityTest.hasSupportsPreview).toBe(true)
-  })
-
-  test('Feature flags are negotiated early in connection lifecycle', async ({
-    comfyPage
-  }) => {
-    // This test verifies that feature flags are available early in the app lifecycle
-    // which is important for protocol negotiation
-
-    // Create a new page to ensure clean state
-    const newPage = await comfyPage.page.context().newPage()
-
-    // Set up monitoring before navigation
-    await newPage.addInitScript(() => {
-      // Track when various app components are ready
-      ;(window as any).__appReadiness = {
-        featureFlagsReceived: false,
-        apiInitialized: false,
-        appInitialized: false
-      }
-
-      // Monitor when feature flags arrive by checking periodically
-      const checkFeatureFlags = setInterval(() => {
-        if (
-          window['app']?.api?.serverFeatureFlags?.supports_preview_metadata !==
-          undefined
-        ) {
-          ;(window as any).__appReadiness.featureFlagsReceived = true
-          clearInterval(checkFeatureFlags)
-        }
-      }, 10)
-
-      // Monitor API initialization
-      const checkApi = setInterval(() => {
-        if (window['app']?.api) {
-          ;(window as any).__appReadiness.apiInitialized = true
-          clearInterval(checkApi)
-        }
-      }, 10)
-
-      // Monitor app initialization
-      const checkApp = setInterval(() => {
-        if (window['app']?.graph) {
-          ;(window as any).__appReadiness.appInitialized = true
-          clearInterval(checkApp)
-        }
-      }, 10)
-
-      // Clean up after 10 seconds
-      setTimeout(() => {
-        clearInterval(checkFeatureFlags)
-        clearInterval(checkApi)
-        clearInterval(checkApp)
-      }, 10000)
-    })
-
-    // Navigate to the app
-    await newPage.goto(comfyPage.url)
-
-    // Wait for feature flags to be received
-    await newPage.waitForFunction(
-      () =>
-        window['app']?.api?.serverFeatureFlags?.supports_preview_metadata !==
-        undefined,
-      {
-        timeout: 10000
-      }
-    )
-
-    // Get readiness state
-    const readiness = await newPage.evaluate(() => {
-      return {
-        ...(window as any).__appReadiness,
-        currentFlags: window['app'].api.serverFeatureFlags
-      }
-    })
-
-    // Verify feature flags are available
-    expect(readiness.currentFlags).toHaveProperty('supports_preview_metadata')
-    expect(typeof readiness.currentFlags.supports_preview_metadata).toBe(
-      'boolean'
-    )
-    expect(readiness.currentFlags).toHaveProperty('max_upload_size')
-
-    // Verify feature flags were received (we detected them via polling)
-    expect(readiness.featureFlagsReceived).toBe(true)
-
-    // Verify API was initialized (feature flags require API)
-    expect(readiness.apiInitialized).toBe(true)
-
-    await newPage.close()
-  })
-
-  test('Backend /features endpoint returns feature flags', async ({
-    comfyPage
-  }) => {
-    // Test the HTTP endpoint directly
-    const response = await comfyPage.page.request.get(
-      `${comfyPage.url}/api/features`
-    )
-    expect(response.ok()).toBe(true)
-
-    const features = await response.json()
-    expect(features).toBeTruthy()
-    expect(features).toHaveProperty('supports_preview_metadata')
-    expect(typeof features.supports_preview_metadata).toBe('boolean')
-    expect(features).toHaveProperty('max_upload_size')
-    expect(Object.keys(features).length).toBeGreaterThan(0)
-  })
-})

browser_tests/tests/subgraphBreadcrumb.spec.ts

@@ -1,82 +0,0 @@
-import { expect } from '@playwright/test'
-
-import { comfyPageFixture as test } from '../fixtures/ComfyPage'
-
-test.describe('Subgraph Breadcrumb Title Sync', () => {
-  test.beforeEach(async ({ comfyPage }) => {
-    await comfyPage.setSetting('Comfy.UseNewMenu', 'Top')
-  })
-
-  test('Breadcrumb updates when subgraph node title is changed', async ({
-    comfyPage
-  }) => {
-    // Load a workflow with subgraphs
-    await comfyPage.loadWorkflow('nested-subgraph')
-    await comfyPage.nextFrame()
-
-    // Get the subgraph node by ID (node 10 is the subgraph)
-    const subgraphNode = await comfyPage.getNodeRefById('10')
-
-    // Get node position and double-click on it to enter the subgraph
-    const nodePos = await subgraphNode.getPosition()
-    const nodeSize = await subgraphNode.getSize()
-    await comfyPage.canvas.dblclick({
-      position: {
-        x: nodePos.x + nodeSize.width / 2,
-        y: nodePos.y + nodeSize.height / 2 + 10
-      }
-    })
-    await comfyPage.nextFrame()
-
-    // Wait for breadcrumb to appear
-    await comfyPage.page.waitForSelector('.subgraph-breadcrumb', {
-      state: 'visible',
-      timeout: 20000
-    })
-
-    // Get initial breadcrumb text
-    const breadcrumb = comfyPage.page.locator('.subgraph-breadcrumb')
-    const initialBreadcrumbText = await breadcrumb.textContent()
-
-    // Go back to main graph
-    await comfyPage.page.keyboard.press('Escape')
-
-    // Double-click on the title area of the subgraph node to edit
-    await comfyPage.canvas.dblclick({
-      position: {
-        x: nodePos.x + nodeSize.width / 2,
-        y: nodePos.y - 10 // Title area is above the node body
-      },
-      delay: 5
-    })
-
-    // Wait for title editor to appear
-    await expect(comfyPage.page.locator('.node-title-editor')).toBeVisible()
-
-    // Clear existing text and type new title
-    await comfyPage.page.keyboard.press('Control+a')
-    const newTitle = 'Updated Subgraph Title'
-    await comfyPage.page.keyboard.type(newTitle)
-    await comfyPage.page.keyboard.press('Enter')
-
-    // Wait a frame for the update to complete
-    await comfyPage.nextFrame()
-
-    // Enter the subgraph again
-    await comfyPage.canvas.dblclick({
-      position: {
-        x: nodePos.x + nodeSize.width / 2,
-        y: nodePos.y + nodeSize.height / 2
-      },
-      delay: 5
-    })
-
-    // Wait for breadcrumb
-    await comfyPage.page.waitForSelector('.subgraph-breadcrumb')
-
-    // Check that breadcrumb now shows the new title
-    const updatedBreadcrumbText = await breadcrumb.textContent()
-    expect(updatedBreadcrumbText).toContain(newTitle)
-    expect(updatedBreadcrumbText).not.toBe(initialBreadcrumbText)
-  })
-})

dangerfile.ts

@@ -1,72 +0,0 @@
-import { danger, fail } from 'danger'
-
-// Check if we should run the checks
-const shouldRunChecks = async () => {
-  const allChangedFiles = [
-    ...danger.git.modified_files,
-    ...danger.git.created_files
-  ]
-  const srcChanges = allChangedFiles.filter((file) => file.startsWith('src/'))
-
-  if (srcChanges.length === 0) {
-    return false
-  }
-
-  // Check total lines changed in src files
-  let totalLinesChanged = 0
-  for (const file of srcChanges) {
-    const diff = await danger.git.diffForFile(file)
-    if (diff) {
-      // Count only lines with actual content (non-empty after trimming whitespace)
-      // This excludes empty lines and lines containing only spaces/tabs
-      const additions =
-        diff.added?.split('\n').filter((line) => line.trim()).length || 0
-      const deletions =
-        diff.removed?.split('\n').filter((line) => line.trim()).length || 0
-      totalLinesChanged += additions + deletions
-    }
-  }
-
-  return totalLinesChanged > 3
-}
-
-// Check if browser tests were updated
-const checkBrowserTestCoverage = () => {
-  const allChangedFiles = [
-    ...danger.git.modified_files,
-    ...danger.git.created_files
-  ]
-  const hasBrowserTestChanges = allChangedFiles.some(
-    (file) => file.startsWith('browser_tests/') && file.endsWith('.ts')
-  )
-
-  if (!hasBrowserTestChanges) {
-    fail(`🧪 **E2E Test Coverage Missing**
-
-All changes should be covered under E2E testing. Please add or update browser tests.`)
-  }
-}
-
-// Check for screen recording in PR description
-const checkScreenRecording = () => {
-  const description = danger.github.pr.body || ''
-  const hasRecording =
-    /github\.com\/user-attachments\/assets\/[a-f0-9-]+/i.test(description) ||
-    /youtube\.com\/watch|youtu\.be\//i.test(description)
-
-  if (!hasRecording) {
-    fail(`📹 **Visual Documentation Missing**
-
-Please add a screen recording or screenshot:
-- GitHub: Drag & drop media to PR description  
-- YouTube: Add YouTube link`)
-  }
-}
-
-// Run the checks only if conditions are met
-shouldRunChecks().then((shouldRun) => {
-  if (shouldRun) {
-    checkBrowserTestCoverage()
-    checkScreenRecording()
-  }
-})

package.json

@@ -45,7 +45,6 @@
     "@vue/test-utils": "^2.4.6",
     "autoprefixer": "^10.4.19",
     "chalk": "^5.3.0",
-    "danger": "^13.0.4",
     "eslint": "^9.12.0",
     "eslint-config-prettier": "^10.1.2",
     "eslint-plugin-prettier": "^5.2.6",

src/components/graph/DomWidgets.vue

@@ -11,6 +11,7 @@
 </template>
 
 <script setup lang="ts">
+import type { LGraphNode } from '@comfyorg/litegraph'
 import { whenever } from '@vueuse/core'
 import { computed } from 'vue'
 
@@ -20,37 +21,24 @@ import { useDomWidgetStore } from '@/stores/domWidgetStore'
 import { useCanvasStore } from '@/stores/graphStore'
 
 const domWidgetStore = useDomWidgetStore()
-
-const widgetStates = computed(() => {
-  return [
-    ...domWidgetStore.activeWidgetStates,
-    ...domWidgetStore.inactiveWidgetStates
-  ]
-})
+const widgetStates = computed(() => domWidgetStore.activeWidgetStates)
 
 const updateWidgets = () => {
   const lgCanvas = canvasStore.canvas
   if (!lgCanvas) return
 
   const lowQuality = lgCanvas.low_quality
-  const currentGraph = lgCanvas.graph
-
   for (const widgetState of widgetStates.value) {
     const widget = widgetState.widget
-
-    // Use containerNode for promoted widgets, otherwise use widget.node
-    const node = widget.containerNode || widget.node
+    const node = widget.node as LGraphNode
 
     const visible =
-      node &&
-      currentGraph?.nodes.includes(node) &&
       lgCanvas.isNodeVisible(node) &&
       !(widget.options.hideOnZoom && lowQuality) &&
       widget.isVisible()
 
-    widgetState.visible = visible ?? false
-
-    if (widgetState.visible && node) {
+    widgetState.visible = visible
+    if (visible) {
       const margin = widget.margin
       widgetState.pos = [node.pos[0] + margin, node.pos[1] + margin + widget.y]
       widgetState.size = [

src/components/graph/GraphCanvas.vue

@@ -72,6 +72,7 @@ import { useWorkflowAutoSave } from '@/composables/useWorkflowAutoSave'
 import { useWorkflowPersistence } from '@/composables/useWorkflowPersistence'
 import { CORE_SETTINGS } from '@/constants/coreSettings'
 import { i18n, t } from '@/i18n'
+import type { NodeId } from '@/schemas/comfyWorkflowSchema'
 import { UnauthorizedError, api } from '@/scripts/api'
 import { app as comfyApp } from '@/scripts/app'
 import { ChangeTracker } from '@/scripts/changeTracker'
@@ -191,26 +192,22 @@ watch(
   }
 )
 
-// Update the progress of executing nodes
+// Update the progress of the executing node
 watch(
   () =>
-    [executionStore.nodeLocationProgressStates, canvasStore.canvas] as const,
-  ([nodeLocationProgressStates, canvas]) => {
-    if (!canvas?.graph) return
-    for (const node of canvas.graph.nodes) {
-      const nodeLocatorId = useWorkflowStore().nodeIdToNodeLocatorId(node.id)
-      const progressState = nodeLocationProgressStates[nodeLocatorId]
-      if (progressState && progressState.state === 'running') {
-        node.progress = progressState.value / progressState.max
+    [
+      executionStore.executingNodeId,
+      executionStore.executingNodeProgress
+    ] satisfies [NodeId | null, number | null],
+  ([executingNodeId, executingNodeProgress]) => {
+    for (const node of comfyApp.graph.nodes) {
+      if (node.id == executingNodeId) {
+        node.progress = executingNodeProgress ?? undefined
       } else {
         node.progress = undefined
       }
     }
-
-    // Force canvas redraw to ensure progress updates are visible
-    canvas.graph.setDirtyCanvas(true, false)
-  },
-  { deep: true }
+  }
 )
 
 // Update node slot errors

src/components/graph/TitleEditor.vue

@@ -41,15 +41,7 @@ const previousCanvasDraggable = ref(true)
 
 const onEdit = (newValue: string) => {
   if (titleEditorStore.titleEditorTarget && newValue.trim() !== '') {
-    const trimmedTitle = newValue.trim()
-    titleEditorStore.titleEditorTarget.title = trimmedTitle
-
-    // If this is a subgraph node, sync the runtime subgraph name for breadcrumb reactivity
-    const target = titleEditorStore.titleEditorTarget
-    if (target instanceof LGraphNode && target.isSubgraphNode?.()) {
-      target.subgraph.name = trimmedTitle
-    }
-
+    titleEditorStore.titleEditorTarget.title = newValue.trim()
     app.graph.setDirtyCanvas(true, true)
   }
   showInput.value = false

src/components/graph/widgets/DomWidget.vue

@@ -61,15 +61,10 @@ const updateDomClipping = () => {
   if (!lgCanvas || !widgetElement.value) return
 
   const selectedNode = Object.values(lgCanvas.selected_nodes ?? {})[0]
-  if (!selectedNode) {
-    // Clear clipping when no node is selected
-    updateClipPath(widgetElement.value, lgCanvas.canvas, false, undefined)
-    return
-  }
+  if (!selectedNode) return
 
-  // Use containerNode for promoted widgets, otherwise use widget.node
-  const positioningNode = widget.containerNode || widget.node
-  const isSelected = selectedNode === positioningNode
+  const node = widget.node
+  const isSelected = selectedNode === node
   const renderArea = selectedNode?.renderArea
   const offset = lgCanvas.ds.offset
   const scale = lgCanvas.ds.scale
@@ -148,28 +143,11 @@ if (isDOMWidget(widget)) {
 const inputSpec = widget.node.constructor.nodeData
 const tooltip = inputSpec?.inputs?.[widget.name]?.tooltip
 
-// Mount DOM element when widget is or becomes visible
-const mountElementIfVisible = () => {
-  if (widgetState.visible && isDOMWidget(widget) && widgetElement.value) {
-    // Only append if not already a child
-    if (!widgetElement.value.contains(widget.element)) {
-      widgetElement.value.appendChild(widget.element)
-    }
-  }
-}
-
-// Check on mount
 onMounted(() => {
-  mountElementIfVisible()
-})
-
-// And watch for visibility changes
-watch(
-  () => widgetState.visible,
-  () => {
-    mountElementIfVisible()
+  if (isDOMWidget(widget) && widgetElement.value) {
+    widgetElement.value.appendChild(widget.element)
   }
-)
+})
 </script>
 
 <style scoped>

src/components/graph/widgets/TextPreviewWidget.vue

@@ -20,44 +20,33 @@ import { useExecutionStore } from '@/stores/executionStore'
 import { linkifyHtml, nl2br } from '@/utils/formatUtil'
 
 const modelValue = defineModel<string>({ required: true })
-const props = defineProps<{
+defineProps<{
   widget?: object
-  nodeId: NodeId
 }>()
 
 const executionStore = useExecutionStore()
 const isParentNodeExecuting = ref(true)
 const formattedText = computed(() => nl2br(linkifyHtml(modelValue.value)))
 
-let parentNodeId: NodeId | null = null
+let executingNodeId: NodeId | null = null
 onMounted(() => {
-  // Get the parent node ID from props if provided
-  // For backward compatibility, fall back to the first executing node
-  parentNodeId = props.nodeId
+  executingNodeId = executionStore.executingNodeId
 })
 
 // Watch for either a new node has starting execution or overall execution ending
 const stopWatching = watch(
-  [() => executionStore.executingNodeIds, () => executionStore.isIdle],
+  [() => executionStore.executingNode, () => executionStore.isIdle],
   () => {
-    if (executionStore.isIdle) {
-      isParentNodeExecuting.value = false
-      stopWatching()
-      return
-    }
-
-    // Check if parent node is no longer in the executing nodes list
     if (
-      parentNodeId &&
-      !executionStore.executingNodeIds.includes(parentNodeId)
+      executionStore.isIdle ||
+      (executionStore.executingNode &&
+        executionStore.executingNode.id !== executingNodeId)
     ) {
       isParentNodeExecuting.value = false
       stopWatching()
     }
-
-    // Set parent node ID if not set yet
-    if (!parentNodeId && executionStore.executingNodeIds.length > 0) {
-      parentNodeId = executionStore.executingNodeIds[0]
+    if (!executingNodeId) {
+      executingNodeId = executionStore.executingNodeId
     }
   }
 )

src/composables/useBrowserTabTitle.ts

@@ -1,7 +1,6 @@
 import { useTitle } from '@vueuse/core'
 import { computed } from 'vue'
 
-import { t } from '@/i18n'
 import { useExecutionStore } from '@/stores/executionStore'
 import { useSettingStore } from '@/stores/settingStore'
 import { useWorkflowStore } from '@/stores/workflowStore'
@@ -37,34 +36,11 @@ export const useBrowserTabTitle = () => {
       : DEFAULT_TITLE
   })
 
-  const nodeExecutionTitle = computed(() => {
-    // Check if any nodes are in progress
-    const nodeProgressEntries = Object.entries(
-      executionStore.nodeProgressStates
-    )
-    const runningNodes = nodeProgressEntries.filter(
-      ([_, state]) => state.state === 'running'
-    )
-
-    if (runningNodes.length === 0) {
-      return ''
-    }
-
-    // If multiple nodes are running
-    if (runningNodes.length > 1) {
-      return `${executionText.value}[${runningNodes.length} ${t('g.nodesRunning', 'nodes running')}]`
-    }
-
-    // If only one node is running
-    const [nodeId, state] = runningNodes[0]
-    const progress = Math.round((state.value / state.max) * 100)
-    const nodeType =
-      executionStore.activePrompt?.workflow?.changeTracker?.activeState?.nodes.find(
-        (n) => String(n.id) === nodeId
-      )?.type || 'Node'
-
-    return `${executionText.value}[${progress}%] ${nodeType}`
-  })
+  const nodeExecutionTitle = computed(() =>
+    executionStore.executingNode && executionStore.executingNodeProgress
+      ? `${executionText.value}[${Math.round(executionStore.executingNodeProgress * 100)}%] ${executionStore.executingNode.type}`
+      : ''
+  )
 
   const workflowTitle = computed(
     () =>

src/composables/useLitegraphSettings.ts

@@ -124,9 +124,12 @@ export const useLitegraphSettings = () => {
   })
 
   watchEffect(() => {
-    LiteGraph.macTrackpadGestures = settingStore.get(
-      'LiteGraph.Pointer.TrackpadGestures'
-    )
+    const navigationMode = settingStore.get('Comfy.Canvas.NavigationMode') as
+      | 'standard'
+      | 'legacy'
+
+    LiteGraph.canvasNavigationMode = navigationMode
+    LiteGraph.macTrackpadGestures = navigationMode === 'standard'
   })
 
   watchEffect(() => {

src/composables/widgets/useProgressTextWidget.ts

@@ -23,9 +23,6 @@ export const useTextPreviewWidget = (
       name: inputSpec.name,
       component: TextPreviewWidget,
       inputSpec,
-      componentProps: {
-        nodeId: node.id
-      },
       options: {
         getValue: () => widgetValue.value,
         setValue: (value: string | object) => {

src/config/clientFeatureFlags.json

@@ -1,3 +0,0 @@
-{
-    "supports_preview_metadata": false
-}

src/constants/coreSettings.ts

@@ -785,6 +785,21 @@ export const CORE_SETTINGS: SettingParams[] = [
     defaultValue: 0.6,
     versionAdded: '1.9.1'
   },
+  {
+    id: 'Comfy.Canvas.NavigationMode',
+    category: ['LiteGraph', 'Canvas', 'CanvasNavigationMode'],
+    name: 'Canvas Navigation Mode',
+    defaultValue: 'legacy',
+    type: 'combo',
+    options: [
+      { value: 'standard', text: 'Standard (New)' },
+      { value: 'legacy', text: 'Left-Click Pan (Legacy)' }
+    ],
+    versionAdded: '1.24.0',
+    defaultsByInstallVersion: {
+      '1.24.0': 'standard'
+    }
+  },
   {
     id: 'Comfy.Canvas.SelectionToolbox',
     category: ['LiteGraph', 'Canvas', 'SelectionToolbox'],
@@ -855,17 +870,6 @@ export const CORE_SETTINGS: SettingParams[] = [
     versionAdded: '1.20.4',
     versionModified: '1.20.5'
   },
-  {
-    id: 'LiteGraph.Pointer.TrackpadGestures',
-    category: ['LiteGraph', 'Pointer', 'Trackpad Gestures'],
-    experimental: true,
-    name: 'Enable trackpad gestures',
-    tooltip:
-      'This setting enables trackpad mode for the canvas, allowing pinch-to-zoom and panning with two fingers.',
-    type: 'boolean',
-    defaultValue: false,
-    versionAdded: '1.19.1'
-  },
   // Release data stored in settings
   {
     id: 'Comfy.Release.Version',

src/extensions/core/groupNode.ts

@@ -15,7 +15,6 @@ import {
 } from '@/schemas/comfyWorkflowSchema'
 import type { ComfyNodeDef } from '@/schemas/nodeDefSchema'
 import { useDialogService } from '@/services/dialogService'
-import { useExecutionStore } from '@/stores/executionStore'
 import { useNodeDefStore } from '@/stores/nodeDefStore'
 import { useToastStore } from '@/stores/toastStore'
 import { useWidgetStore } from '@/stores/widgetStore'
@@ -1225,10 +1224,9 @@ export class GroupNodeHandler {
     node.onDrawForeground = function (ctx) {
       // @ts-expect-error fixme ts strict error
       onDrawForeground?.apply?.(this, arguments)
-      const progressState = useExecutionStore().nodeProgressStates[this.id]
       if (
-        progressState &&
-        progressState.state === 'running' &&
+        // @ts-expect-error fixme ts strict error
+        +app.runningNodeId === this.id &&
         this.runningInternalNodeId !== null
       ) {
         // @ts-expect-error fixme ts strict error
@@ -1342,7 +1340,6 @@ export class GroupNodeHandler {
     this.node.onRemoved = function () {
       // @ts-expect-error fixme ts strict error
       onRemoved?.apply(this, arguments)
-      // api.removeEventListener('progress_state', progress_state)
       api.removeEventListener('executing', executing)
       api.removeEventListener('executed', executed)
     }

src/locales/en/main.json

@@ -133,8 +133,7 @@
     "copyURL": "Copy URL",
     "releaseTitle": "{package} {version} Release",
     "progressCountOf": "of",
-    "keybindingAlreadyExists": "Keybinding already exists on",
-    "nodesRunning": "nodes running"
+    "keybindingAlreadyExists": "Keybinding already exists on"
   },
   "manager": {
     "title": "Custom Nodes Manager",

src/locales/es/main.json

@@ -336,7 +336,6 @@
     "noTasksFoundMessage": "No hay tareas en la cola.",
     "noWorkflowsFound": "No se encontraron flujos de trabajo.",
     "nodes": "Nodos",
-    "nodesRunning": "nodos en ejecución",
     "ok": "OK",
     "openNewIssue": "Abrir nuevo problema",
     "overwrite": "Sobrescribir",

src/locales/fr/main.json

@@ -336,7 +336,6 @@
     "noTasksFoundMessage": "Il n'y a pas de tâches dans la file d'attente.",
     "noWorkflowsFound": "Aucun flux de travail trouvé.",
     "nodes": "Nœuds",
-    "nodesRunning": "nœuds en cours d’exécution",
     "ok": "OK",
     "openNewIssue": "Ouvrir un nouveau problème",
     "overwrite": "Écraser",

src/locales/ja/main.json

@@ -336,7 +336,6 @@
     "noTasksFoundMessage": "キューにタスクがありません。",
     "noWorkflowsFound": "ワークフローが見つかりません。",
     "nodes": "ノード",
-    "nodesRunning": "ノードが実行中",
     "ok": "OK",
     "openNewIssue": "新しい問題を開く",
     "overwrite": "上書き",

src/locales/ko/main.json

@@ -336,7 +336,6 @@
     "noTasksFoundMessage": "대기열에 작업이 없습니다.",
     "noWorkflowsFound": "워크플로를 찾을 수 없습니다.",
     "nodes": "노드",
-    "nodesRunning": "노드 실행 중",
     "ok": "확인",
     "openNewIssue": "새 문제 열기",
     "overwrite": "덮어쓰기",

src/locales/ru/main.json

@@ -336,7 +336,6 @@
     "noTasksFoundMessage": "В очереди нет задач.",
     "noWorkflowsFound": "Рабочие процессы не найдены.",
     "nodes": "Узлы",
-    "nodesRunning": "запущено узлов",
     "ok": "ОК",
     "openNewIssue": "Открыть новую проблему",
     "overwrite": "Перезаписать",

src/locales/zh-TW/main.json

@@ -336,7 +336,6 @@
     "noTasksFoundMessage": "佇列中沒有任務。",
     "noWorkflowsFound": "找不到工作流程。",
     "nodes": "節點",
-    "nodesRunning": "節點執行中",
     "ok": "確定",
     "openNewIssue": "開啟新問題",
     "overwrite": "覆蓋",

src/locales/zh/main.json

@@ -336,7 +336,6 @@
     "noTasksFoundMessage": "队列中没有任务。",
     "noWorkflowsFound": "未找到工作流。",
     "nodes": "节点",
-    "nodesRunning": "节点正在运行",
     "ok": "确定",
     "openNewIssue": "打开新问题",
     "overwrite": "覆盖",
@@ -786,13 +785,13 @@
     "Toggle Bottom Panel": "切换底部面板",
     "Toggle Focus Mode": "切换专注模式",
     "Toggle Logs Bottom Panel": "切换日志底部面板",
-    "Toggle Model Library Sidebar": "切換模型庫側邊欄",
-    "Toggle Node Library Sidebar": "切換節點庫側邊欄",
-    "Toggle Queue Sidebar": "切換佇列側邊欄",
+    "Toggle Model Library Sidebar": "切换模型库侧边栏",
+    "Toggle Node Library Sidebar": "切换节点库侧边栏",
+    "Toggle Queue Sidebar": "切换队列侧边栏",
     "Toggle Search Box": "切换搜索框",
     "Toggle Terminal Bottom Panel": "切换终端底部面板",
     "Toggle Theme (Dark/Light)": "切换主题（暗/亮）",
-    "Toggle Workflows Sidebar": "切換工作流程側邊欄",
+    "Toggle Workflows Sidebar": "切换工作流侧边栏",
     "Toggle the Custom Nodes Manager": "切换自定义节点管理器",
     "Toggle the Custom Nodes Manager Progress Bar": "切换自定义节点管理器进度条",
     "Undo": "撤销",

src/schemas/apiSchema.ts

@@ -48,22 +48,6 @@ const zProgressWsMessage = z.object({
   node: zNodeId
 })
 
-const zNodeProgressState = z.object({
-  value: z.number(),
-  max: z.number(),
-  state: z.enum(['pending', 'running', 'finished', 'error']),
-  node_id: zNodeId,
-  prompt_id: zPromptId,
-  display_node_id: zNodeId.optional(),
-  parent_node_id: zNodeId.optional(),
-  real_node_id: zNodeId.optional()
-})
-
-const zProgressStateWsMessage = z.object({
-  prompt_id: zPromptId,
-  nodes: z.record(zNodeId, zNodeProgressState)
-})
-
 const zExecutingWsMessage = z.object({
   node: zNodeId,
   display_node: zNodeId,
@@ -129,8 +113,6 @@ const zLogRawResponse = z.object({
   entries: z.array(zLogEntry)
 })
 
-const zFeatureFlagsWsMessage = z.record(z.string(), z.any())
-
 export type StatusWsMessageStatus = z.infer<typeof zStatusWsMessageStatus>
 export type StatusWsMessage = z.infer<typeof zStatusWsMessage>
 export type ProgressWsMessage = z.infer<typeof zProgressWsMessage>
@@ -150,7 +132,6 @@ export type ProgressTextWsMessage = z.infer<typeof zProgressTextWsMessage>
 export type DisplayComponentWsMessage = z.infer<
   typeof zDisplayComponentWsMessage
 >
-export type FeatureFlagsWsMessage = z.infer<typeof zFeatureFlagsWsMessage>
 // End of ws messages
 
 const zPromptInputItem = z.object({
@@ -473,6 +454,7 @@ const zSettings = z.object({
   'Comfy.TutorialCompleted': z.boolean(),
   'Comfy.InstalledVersion': z.string().nullable(),
   'Comfy.Node.AllowImageSizeDraw': z.boolean(),
+  'Comfy.Canvas.NavigationMode': z.string(),
   'Comfy-Desktop.AutoUpdate': z.boolean(),
   'Comfy-Desktop.SendStatistics': z.boolean(),
   'Comfy-Desktop.WindowStyle': z.string(),

src/scripts/api.ts

@@ -1,6 +1,5 @@
 import axios from 'axios'
 
-import defaultClientFeatureFlags from '@/config/clientFeatureFlags.json'
 import type {
   DisplayComponentWsMessage,
   EmbeddingsResponse,
@@ -12,11 +11,9 @@ import type {
   ExecutionStartWsMessage,
   ExecutionSuccessWsMessage,
   ExtensionsResponse,
-  FeatureFlagsWsMessage,
   HistoryTaskItem,
   LogsRawResponse,
   LogsWsMessage,
-  NodeProgressState,
   PendingTaskItem,
   ProgressTextWsMessage,
   ProgressWsMessage,
@@ -106,19 +103,8 @@ interface BackendApiCalls {
   logs: LogsWsMessage
   /** Binary preview/progress data */
   b_preview: Blob
-  /** Binary preview with metadata (node_id, prompt_id) */
-  b_preview_with_metadata: {
-    blob: Blob
-    nodeId: string
-    parentNodeId: string
-    displayNodeId: string
-    realNodeId: string
-    promptId: string
-  }
   progress_text: ProgressTextWsMessage
-  progress_state: NodeProgressState
   display_component: DisplayComponentWsMessage
-  feature_flags: FeatureFlagsWsMessage
 }
 
 /** Dictionary of all api calls */
@@ -248,19 +234,6 @@ export class ComfyApi extends EventTarget {
 
   reportedUnknownMessageTypes = new Set<string>()
 
-  /**
-   * Get feature flags supported by this frontend client.
-   * Returns a copy to prevent external modification.
-   */
-  getClientFeatureFlags(): Record<string, unknown> {
-    return { ...defaultClientFeatureFlags }
-  }
-
-  /**
-   * Feature flags received from the backend server.
-   */
-  serverFeatureFlags: Record<string, unknown> = {}
-
   /**
    * The auth token for the comfy org account if the user is logged in.
    * This is only used for {@link queuePrompt} now. It is not directly
@@ -402,15 +375,6 @@ export class ComfyApi extends EventTarget {
 
     this.socket.addEventListener('open', () => {
       opened = true
-
-      // Send feature flags as the first message
-      this.socket!.send(
-        JSON.stringify({
-          type: 'feature_flags',
-          data: this.getClientFeatureFlags()
-        })
-      )
-
       if (isReconnect) {
         this.dispatchCustomEvent('reconnected')
       }
@@ -468,33 +432,6 @@ export class ComfyApi extends EventTarget {
               })
               this.dispatchCustomEvent('b_preview', imageBlob)
               break
-            case 4:
-              // PREVIEW_IMAGE_WITH_METADATA
-              const decoder4 = new TextDecoder()
-              const metadataLength = view.getUint32(4)
-              const metadataBytes = event.data.slice(8, 8 + metadataLength)
-              const metadata = JSON.parse(decoder4.decode(metadataBytes))
-              const imageData4 = event.data.slice(8 + metadataLength)
-
-              let imageMime4 = metadata.image_type
-
-              const imageBlob4 = new Blob([imageData4], {
-                type: imageMime4
-              })
-
-              // Dispatch enhanced preview event with metadata
-              this.dispatchCustomEvent('b_preview_with_metadata', {
-                blob: imageBlob4,
-                nodeId: metadata.node_id,
-                displayNodeId: metadata.display_node_id,
-                parentNodeId: metadata.parent_node_id,
-                realNodeId: metadata.real_node_id,
-                promptId: metadata.prompt_id
-              })
-
-              // Also dispatch legacy b_preview for backward compatibility
-              this.dispatchCustomEvent('b_preview', imageBlob4)
-              break
             default:
               throw new Error(
                 `Unknown binary websocket message of type ${eventType}`
@@ -524,7 +461,6 @@ export class ComfyApi extends EventTarget {
             case 'execution_cached':
             case 'execution_success':
             case 'progress':
-            case 'progress_state':
             case 'executed':
             case 'graphChanged':
             case 'promptQueued':
@@ -532,14 +468,6 @@ export class ComfyApi extends EventTarget {
             case 'b_preview':
               this.dispatchCustomEvent(msg.type, msg.data)
               break
-            case 'feature_flags':
-              // Store server feature flags
-              this.serverFeatureFlags = msg.data
-              console.log(
-                'Server feature flags received:',
-                this.serverFeatureFlags
-              )
-              break
             default:
               if (this.#registered.has(msg.type)) {
                 // Fallback for custom types - calls super direct.
@@ -1034,33 +962,6 @@ export class ComfyApi extends EventTarget {
   async getCustomNodesI18n(): Promise<Record<string, any>> {
     return (await axios.get(this.apiURL('/i18n'))).data
   }
-
-  /**
-   * Checks if the server supports a specific feature.
-   * @param featureName The name of the feature to check
-   * @returns true if the feature is supported, false otherwise
-   */
-  serverSupportsFeature(featureName: string): boolean {
-    return this.serverFeatureFlags[featureName] === true
-  }
-
-  /**
-   * Gets a server feature flag value.
-   * @param featureName The name of the feature to get
-   * @param defaultValue The default value if the feature is not found
-   * @returns The feature value or default
-   */
-  getServerFeature<T = unknown>(featureName: string, defaultValue?: T): T {
-    return (this.serverFeatureFlags[featureName] ?? defaultValue) as T
-  }
-
-  /**
-   * Gets all server feature flags.
-   * @returns Copy of all server feature flags
-   */
-  getServerFeatures(): Record<string, unknown> {
-    return { ...this.serverFeatureFlags }
-  }
 }
 
 export const api = new ComfyApi()

src/scripts/app.ts

@@ -194,8 +194,6 @@ export class ComfyApp {
 
   /**
    * @deprecated Use useExecutionStore().executingNodeId instead
-   * TODO: Update to support multiple executing nodes. This getter returns only the first executing node.
-   * Consider updating consumers to handle multiple nodes or use executingNodeIds array.
    */
   get runningNodeId(): NodeId | null {
     return useExecutionStore().executingNodeId
@@ -637,6 +635,10 @@ export class ComfyApp {
 
     api.addEventListener('executing', () => {
       this.graph.setDirtyCanvas(true, false)
+      // @ts-expect-error fixme ts strict error
+      this.revokePreviews(this.runningNodeId)
+      // @ts-expect-error fixme ts strict error
+      delete this.nodePreviewImages[this.runningNodeId]
     })
 
     api.addEventListener('executed', ({ detail }) => {
@@ -687,13 +689,15 @@ export class ComfyApp {
       this.canvas.draw(true, true)
     })
 
-    api.addEventListener('b_preview_with_metadata', ({ detail }) => {
-      // Enhanced preview with explicit node context
-      const { blob, displayNodeId } = detail
-      this.revokePreviews(displayNodeId)
+    api.addEventListener('b_preview', ({ detail }) => {
+      const id = this.runningNodeId
+      if (id == null) return
+
+      const blob = detail
       const blobUrl = URL.createObjectURL(blob)
-      // Preview cleanup is now handled in progress_state event to support multiple concurrent previews
-      this.nodePreviewImages[displayNodeId] = [blobUrl]
+      // Ensure clean up if `executing` event is missed.
+      this.revokePreviews(id)
+      this.nodePreviewImages[id] = [blobUrl]
     })
 
     api.init()

src/scripts/domWidget.ts

@@ -237,7 +237,6 @@ export class ComponentWidgetImpl<
     component: Component
     inputSpec: InputSpec
     props?: P
-    componentProps?: Partial<P>
     options: DOMWidgetOptions<V>
   }) {
     super({
@@ -246,9 +245,7 @@ export class ComponentWidgetImpl<
     })
     this.component = obj.component
     this.inputSpec = obj.inputSpec
-    this.props = obj.componentProps
-      ? ({ ...obj.props, ...obj.componentProps } as P)
-      : obj.props
+    this.props = obj.props
   }
 
   override computeLayoutSize() {

src/services/litegraphService.ts

@@ -33,8 +33,6 @@ import type {
 import type { ComfyNodeDef as ComfyNodeDefV1 } from '@/schemas/nodeDefSchema'
 import { ComfyApp, app } from '@/scripts/app'
 import { $el } from '@/scripts/ui'
-import { useDomWidgetStore } from '@/stores/domWidgetStore'
-import { useExecutionStore } from '@/stores/executionStore'
 import { useCanvasStore } from '@/stores/graphStore'
 import { useNodeOutputStore } from '@/stores/imagePreviewStore'
 import { ComfyNodeDefImpl } from '@/stores/nodeDefStore'
@@ -89,14 +87,6 @@ export const useLitegraphService = () => {
       constructor() {
         super(app.graph, subgraph, instanceData)
 
-        // Set up callback for promoted widget registration
-        this.onPromotedWidgetAdded = (widget) => {
-          const domWidgetStore = useDomWidgetStore()
-          if (!domWidgetStore.widgetStates.has(widget.id)) {
-            domWidgetStore.registerWidget(widget)
-          }
-        }
-
         this.#setupStrokeStyles()
         this.#addInputs(ComfyNode.nodeData.inputs)
         this.#addOutputs(ComfyNode.nodeData.outputs)
@@ -117,11 +107,7 @@ export const useLitegraphService = () => {
        */
       #setupStrokeStyles() {
         this.strokeStyles['running'] = function (this: LGraphNode) {
-          const nodeId = String(this.id)
-          const nodeLocatorId = useWorkflowStore().nodeIdToNodeLocatorId(nodeId)
-          const state =
-            useExecutionStore().nodeLocationProgressStates[nodeLocatorId]?.state
-          if (state === 'running') {
+          if (this.id == app.runningNodeId) {
             return { color: '#0f0' }
           }
         }
@@ -376,11 +362,7 @@ export const useLitegraphService = () => {
        */
       #setupStrokeStyles() {
         this.strokeStyles['running'] = function (this: LGraphNode) {
-          const nodeId = String(this.id)
-          const nodeLocatorId = useWorkflowStore().nodeIdToNodeLocatorId(nodeId)
-          const state =
-            useExecutionStore().nodeLocationProgressStates[nodeLocatorId]?.state
-          if (state === 'running') {
+          if (this.id == app.runningNodeId) {
             return { color: '#0f0' }
           }
         }

src/stores/executionStore.ts

@@ -12,8 +12,6 @@ import type {
   ExecutionErrorWsMessage,
   ExecutionStartWsMessage,
   NodeError,
-  NodeProgressState,
-  ProgressStateWsMessage,
   ProgressTextWsMessage,
   ProgressWsMessage
 } from '@/schemas/apiSchema'
@@ -23,9 +21,6 @@ import type {
   NodeId
 } from '@/schemas/comfyWorkflowSchema'
 import { api } from '@/scripts/api'
-import { app } from '@/scripts/app'
-import type { NodeLocatorId } from '@/types/nodeIdentification'
-import { createNodeLocatorId } from '@/types/nodeIdentification'
 
 import { useCanvasStore } from './graphStore'
 import { ComfyWorkflow, useWorkflowStore } from './workflowStore'
@@ -51,97 +46,7 @@ export const useExecutionStore = defineStore('execution', () => {
   const queuedPrompts = ref<Record<NodeId, QueuedPrompt>>({})
   const lastNodeErrors = ref<Record<NodeId, NodeError> | null>(null)
   const lastExecutionError = ref<ExecutionErrorWsMessage | null>(null)
-  // This is the progress of all nodes in the currently executing workflow
-  const nodeProgressStates = ref<Record<string, NodeProgressState>>({})
-
-  /**
-   * Convert execution context node IDs to NodeLocatorIds
-   * @param nodeId The node ID from execution context (could be execution ID)
-   * @returns The NodeLocatorId
-   */
-  const executionIdToNodeLocatorId = (
-    nodeId: string | number
-  ): NodeLocatorId => {
-    const nodeIdStr = String(nodeId)
-
-    if (!nodeIdStr.includes(':')) {
-      // It's a top-level node ID
-      return nodeIdStr as NodeLocatorId
-    }
-
-    // It's an execution node ID
-    const parts = nodeIdStr.split(':')
-    const localNodeId = parts[parts.length - 1]
-    const subgraphs = getSubgraphsFromInstanceIds(app.graph, parts)
-    const nodeLocatorId = createNodeLocatorId(subgraphs.at(-1)!.id, localNodeId)
-    return nodeLocatorId
-  }
-
-  const mergeExecutionProgressStates = (
-    currentState: NodeProgressState | undefined,
-    newState: NodeProgressState
-  ): NodeProgressState => {
-    if (currentState === undefined) {
-      return newState
-    }
-
-    const mergedState = { ...currentState }
-    if (mergedState.state === 'error') {
-      return mergedState
-    } else if (newState.state === 'running') {
-      const newPerc = newState.max > 0 ? newState.value / newState.max : 0.0
-      const oldPerc =
-        mergedState.max > 0 ? mergedState.value / mergedState.max : 0.0
-      if (
-        mergedState.state !== 'running' ||
-        oldPerc === 0.0 ||
-        newPerc < oldPerc
-      ) {
-        mergedState.value = newState.value
-        mergedState.max = newState.max
-      }
-      mergedState.state = 'running'
-    }
-
-    return mergedState
-  }
-
-  const nodeLocationProgressStates = computed<
-    Record<NodeLocatorId, NodeProgressState>
-  >(() => {
-    const result: Record<NodeLocatorId, NodeProgressState> = {}
-
-    const states = nodeProgressStates.value // Apparently doing this inside `Object.entries` causes issues
-    for (const [_, state] of Object.entries(states)) {
-      const parts = String(state.display_node_id).split(':')
-      for (let i = 0; i < parts.length; i++) {
-        const executionId = parts.slice(0, i + 1).join(':')
-        const locatorId = executionIdToNodeLocatorId(executionId)
-        if (!locatorId) continue
-
-        result[locatorId] = mergeExecutionProgressStates(
-          result[locatorId],
-          state
-        )
-      }
-    }
-
-    return result
-  })
-
-  // Easily access all currently executing node IDs
-  const executingNodeIds = computed<NodeId[]>(() => {
-    return Object.entries(nodeProgressStates)
-      .filter(([_, state]) => state.state === 'running')
-      .map(([nodeId, _]) => nodeId)
-  })
-
-  // @deprecated For backward compatibility - stores the primary executing node ID
-  const executingNodeId = computed<NodeId | null>(() => {
-    return executingNodeIds.value.length > 0 ? executingNodeIds.value[0] : null
-  })
-
-  // For backward compatibility - returns the primary executing node
+  const executingNodeId = ref<NodeId | null>(null)
   const executingNode = computed<ComfyNode | null>(() => {
     if (!executingNodeId.value) return null
 
@@ -188,7 +93,30 @@ export const useExecutionStore = defineStore('execution', () => {
     return getSubgraphsFromInstanceIds(subgraph, subgraphNodeIds, subgraphs)
   }
 
-  // This is the progress of the currently executing node (for backward compatibility)
+  const executionIdToCurrentId = (id: string) => {
+    const subgraph = workflowStore.activeSubgraph
+
+    // Short-circuit: ID belongs to the parent workflow / no active subgraph
+    if (!id.includes(':')) {
+      return !subgraph ? id : undefined
+    } else if (!subgraph) {
+      return
+    }
+
+    // Parse the hierarchical ID (e.g., "123:456:789")
+    const subgraphNodeIds = id.split(':')
+
+    // If the last subgraph is the active subgraph, return the node ID
+    const subgraphs = getSubgraphsFromInstanceIds(
+      subgraph.rootGraph,
+      subgraphNodeIds
+    )
+    if (subgraphs.at(-1) === subgraph) {
+      return subgraphNodeIds.at(-1)
+    }
+  }
+
+  // This is the progress of the currently executing node, if any
   const _executingNodeProgress = ref<ProgressWsMessage | null>(null)
   const executingNodeProgress = computed(() =>
     _executingNodeProgress.value
@@ -225,7 +153,6 @@ export const useExecutionStore = defineStore('execution', () => {
     api.addEventListener('executed', handleExecuted)
     api.addEventListener('executing', handleExecuting)
     api.addEventListener('progress', handleProgress)
-    api.addEventListener('progress_state', handleProgressState)
     api.addEventListener('status', handleStatus)
     api.addEventListener('execution_error', handleExecutionError)
   }
@@ -238,7 +165,6 @@ export const useExecutionStore = defineStore('execution', () => {
     api.removeEventListener('executed', handleExecuted)
     api.removeEventListener('executing', handleExecuting)
     api.removeEventListener('progress', handleProgress)
-    api.removeEventListener('progress_state', handleProgressState)
     api.removeEventListener('status', handleStatus)
     api.removeEventListener('execution_error', handleExecutionError)
     api.removeEventListener('progress_text', handleProgressText)
@@ -268,42 +194,19 @@ export const useExecutionStore = defineStore('execution', () => {
 
     if (!activePrompt.value) return
 
-    // Update the executing nodes list
-    if (typeof e.detail !== 'string') {
-      if (activePromptId.value) {
-        delete queuedPrompts.value[activePromptId.value]
-      }
-      activePromptId.value = null
+    if (executingNodeId.value && activePrompt.value) {
+      // Seems sometimes nodes that are cached fire executing but not executed
+      activePrompt.value.nodes[executingNodeId.value] = true
     }
-  }
-
-  function handleProgressState(e: CustomEvent<ProgressStateWsMessage>) {
-    const { nodes } = e.detail
-
-    // Revoke previews for nodes that are starting to execute
-    for (const nodeId in nodes) {
-      const nodeState = nodes[nodeId]
-      if (nodeState.state === 'running' && !nodeProgressStates.value[nodeId]) {
-        // This node just started executing, revoke its previews
-        // Note that we're doing the *actual* node id instead of the display node id
-        // here intentionally. That way, we don't clear the preview every time a new node
-        // within an expanded graph starts executing.
-        app.revokePreviews(nodeId)
-        delete app.nodePreviewImages[nodeId]
-      }
-    }
-
-    // Update the progress states for all nodes
-    nodeProgressStates.value = nodes
-
-    // If we have progress for the currently executing node, update it for backwards compatibility
-    if (executingNodeId.value && nodes[executingNodeId.value]) {
-      const nodeState = nodes[executingNodeId.value]
-      _executingNodeProgress.value = {
-        value: nodeState.value,
-        max: nodeState.max,
-        prompt_id: nodeState.prompt_id,
-        node: nodeState.display_node_id || nodeState.node_id
+    if (typeof e.detail === 'string') {
+      executingNodeId.value = executionIdToCurrentId(e.detail) ?? null
+    } else {
+      executingNodeId.value = e.detail
+      if (executingNodeId.value === null) {
+        if (activePromptId.value) {
+          delete queuedPrompts.value[activePromptId.value]
+        }
+        activePromptId.value = null
       }
     }
   }
@@ -336,7 +239,7 @@ export const useExecutionStore = defineStore('execution', () => {
     const { nodeId, text } = e.detail
     if (!text || !nodeId) return
 
-    // Handle execution node IDs for subgraphs
+    // Handle hierarchical node IDs for subgraphs
     const currentId = getNodeIdIfExecuting(nodeId)
     const node = canvasStore.getCanvas().graph?.getNodeById(currentId)
     if (!node) return
@@ -347,7 +250,7 @@ export const useExecutionStore = defineStore('execution', () => {
   function handleDisplayComponent(e: CustomEvent<DisplayComponentWsMessage>) {
     const { node_id: nodeId, component, props = {} } = e.detail
 
-    // Handle execution node IDs for subgraphs
+    // Handle hierarchical node IDs for subgraphs
     const currentId = getNodeIdIfExecuting(nodeId)
     const node = canvasStore.getCanvas().graph?.getNodeById(currentId)
     if (!node) return
@@ -387,18 +290,6 @@ export const useExecutionStore = defineStore('execution', () => {
     )
   }
 
-  /**
-   * Convert a NodeLocatorId to an execution context ID
-   * @param locatorId The NodeLocatorId
-   * @returns The execution ID or null if conversion fails
-   */
-  const nodeLocatorIdToExecutionId = (
-    locatorId: NodeLocatorId | string
-  ): string | null => {
-    const executionId = workflowStore.nodeLocatorIdToNodeExecutionId(locatorId)
-    return executionId
-  }
-
   return {
     isIdle,
     clientId,
@@ -419,13 +310,9 @@ export const useExecutionStore = defineStore('execution', () => {
      */
     lastExecutionError,
     /**
-     * The id of the node that is currently being executed (backward compatibility)
+     * The id of the node that is currently being executed
      */
     executingNodeId,
-    /**
-     * The list of all nodes that are currently executing
-     */
-    executingNodeIds,
     /**
      * The prompt that is currently being executed
      */
@@ -443,25 +330,17 @@ export const useExecutionStore = defineStore('execution', () => {
      */
     executionProgress,
     /**
-     * The node that is currently being executed (backward compatibility)
+     * The node that is currently being executed
      */
     executingNode,
     /**
-     * The progress of the executing node (backward compatibility)
+     * The progress of the executing node (if the node reports progress)
      */
     executingNodeProgress,
-    /**
-     * All node progress states from progress_state events
-     */
-    nodeProgressStates,
-    nodeLocationProgressStates,
     bindExecutionEvents,
     unbindExecutionEvents,
     storePrompt,
     // Raw executing progress data for backward compatibility in ComfyApp.
-    _executingNodeProgress,
-    // NodeLocatorId conversion helpers
-    executionIdToNodeLocatorId,
-    nodeLocatorIdToExecutionId
+    _executingNodeProgress
   }
 })

src/stores/workflowStore.ts

@@ -4,18 +4,10 @@ import { defineStore } from 'pinia'
 import { type Raw, computed, markRaw, ref, shallowRef, watch } from 'vue'
 
 import { ComfyWorkflowJSON } from '@/schemas/comfyWorkflowSchema'
-import type { NodeId } from '@/schemas/comfyWorkflowSchema'
 import { api } from '@/scripts/api'
 import { app as comfyApp } from '@/scripts/app'
 import { ChangeTracker } from '@/scripts/changeTracker'
 import { defaultGraphJSON } from '@/scripts/defaultGraph'
-import type { NodeExecutionId, NodeLocatorId } from '@/types/nodeIdentification'
-import {
-  createNodeExecutionId,
-  createNodeLocatorId,
-  parseNodeExecutionId,
-  parseNodeLocatorId
-} from '@/types/nodeIdentification'
 import { getPathDetails } from '@/utils/formatUtil'
 import { syncEntities } from '@/utils/syncUtil'
 import { isSubgraph } from '@/utils/typeGuardUtil'
@@ -171,15 +163,6 @@ export interface WorkflowStore {
   /** Updates the {@link subgraphNamePath} and {@link isSubgraphActive} values. */
   updateActiveGraph: () => void
   executionIdToCurrentId: (id: string) => any
-  nodeIdToNodeLocatorId: (nodeId: NodeId, subgraph?: Subgraph) => NodeLocatorId
-  nodeExecutionIdToNodeLocatorId: (
-    nodeExecutionId: NodeExecutionId | string
-  ) => NodeLocatorId | null
-  nodeLocatorIdToNodeId: (locatorId: NodeLocatorId | string) => NodeId | null
-  nodeLocatorIdToNodeExecutionId: (
-    locatorId: NodeLocatorId | string,
-    targetSubgraph?: Subgraph
-  ) => NodeExecutionId | null
 }
 
 export const useWorkflowStore = defineStore('workflow', () => {
@@ -490,7 +473,7 @@ export const useWorkflowStore = defineStore('workflow', () => {
       return
     }
 
-    // Parse the execution ID (e.g., "123:456:789")
+    // Parse the hierarchical ID (e.g., "123:456:789")
     const subgraphNodeIds = id.split(':')
 
     // Start from the root graph
@@ -505,136 +488,6 @@ export const useWorkflowStore = defineStore('workflow', () => {
 
   watch(activeWorkflow, updateActiveGraph)
 
-  /**
-   * Convert a node ID to a NodeLocatorId
-   * @param nodeId The local node ID
-   * @param subgraph The subgraph containing the node (defaults to active subgraph)
-   * @returns The NodeLocatorId (for root graph nodes, returns the node ID as-is)
-   */
-  const nodeIdToNodeLocatorId = (
-    nodeId: NodeId,
-    subgraph?: Subgraph
-  ): NodeLocatorId => {
-    const targetSubgraph = subgraph ?? activeSubgraph.value
-    if (!targetSubgraph) {
-      // Node is in the root graph, return the node ID as-is
-      return String(nodeId) as NodeLocatorId
-    }
-
-    return createNodeLocatorId(targetSubgraph.id, nodeId)
-  }
-
-  /**
-   * Convert an execution ID to a NodeLocatorId
-   * @param nodeExecutionId The execution node ID (e.g., "123:456:789")
-   * @returns The NodeLocatorId or null if conversion fails
-   */
-  const nodeExecutionIdToNodeLocatorId = (
-    nodeExecutionId: NodeExecutionId | string
-  ): NodeLocatorId | null => {
-    // Handle simple node IDs (root graph - no colons)
-    if (!nodeExecutionId.includes(':')) {
-      return nodeExecutionId as NodeLocatorId
-    }
-
-    const parts = parseNodeExecutionId(nodeExecutionId)
-    if (!parts || parts.length === 0) return null
-
-    const nodeId = parts[parts.length - 1]
-    const subgraphNodeIds = parts.slice(0, -1)
-
-    if (subgraphNodeIds.length === 0) {
-      // Node is in root graph, return the node ID as-is
-      return String(nodeId) as NodeLocatorId
-    }
-
-    try {
-      const subgraphs = getSubgraphsFromInstanceIds(
-        comfyApp.graph,
-        subgraphNodeIds.map((id) => String(id))
-      )
-      const immediateSubgraph = subgraphs[subgraphs.length - 1]
-      return createNodeLocatorId(immediateSubgraph.id, nodeId)
-    } catch {
-      return null
-    }
-  }
-
-  /**
-   * Extract the node ID from a NodeLocatorId
-   * @param locatorId The NodeLocatorId
-   * @returns The local node ID or null if invalid
-   */
-  const nodeLocatorIdToNodeId = (
-    locatorId: NodeLocatorId | string
-  ): NodeId | null => {
-    const parsed = parseNodeLocatorId(locatorId)
-    return parsed?.localNodeId ?? null
-  }
-
-  /**
-   * Convert a NodeLocatorId to an execution ID for a specific context
-   * @param locatorId The NodeLocatorId
-   * @param targetSubgraph The subgraph context (defaults to active subgraph)
-   * @returns The execution ID or null if the node is not accessible from the target context
-   */
-  const nodeLocatorIdToNodeExecutionId = (
-    locatorId: NodeLocatorId | string,
-    targetSubgraph?: Subgraph
-  ): NodeExecutionId | null => {
-    const parsed = parseNodeLocatorId(locatorId)
-    if (!parsed) return null
-
-    const { subgraphUuid, localNodeId } = parsed
-
-    // If no subgraph UUID, this is a root graph node
-    if (!subgraphUuid) {
-      return String(localNodeId) as NodeExecutionId
-    }
-
-    // Find the path from root to the subgraph with this UUID
-    const findSubgraphPath = (
-      graph: LGraph | Subgraph,
-      targetUuid: string,
-      path: NodeId[] = []
-    ): NodeId[] | null => {
-      if (isSubgraph(graph) && graph.id === targetUuid) {
-        return path
-      }
-
-      for (const node of graph._nodes) {
-        if (node.isSubgraphNode?.() && (node as any).subgraph) {
-          const result = findSubgraphPath((node as any).subgraph, targetUuid, [
-            ...path,
-            node.id
-          ])
-          if (result) return result
-        }
-      }
-
-      return null
-    }
-
-    const path = findSubgraphPath(comfyApp.graph, subgraphUuid)
-    if (!path) return null
-
-    // If we have a target subgraph, check if the path goes through it
-    if (
-      targetSubgraph &&
-      !path.some((_, idx) => {
-        const subgraphs = getSubgraphsFromInstanceIds(
-          comfyApp.graph,
-          path.slice(0, idx + 1).map((id) => String(id))
-        )
-        return subgraphs[subgraphs.length - 1] === targetSubgraph
-      })
-    ) {
-      return null
-    }
-
-    return createNodeExecutionId([...path, localNodeId])
-  }
-
   return {
     activeWorkflow,
     isActive,
@@ -661,11 +514,7 @@ export const useWorkflowStore = defineStore('workflow', () => {
     isSubgraphActive,
     activeSubgraph,
     updateActiveGraph,
-    executionIdToCurrentId,
-    nodeIdToNodeLocatorId,
-    nodeExecutionIdToNodeLocatorId,
-    nodeLocatorIdToNodeId,
-    nodeLocatorIdToNodeExecutionId
+    executionIdToCurrentId
   }
 }) satisfies () => WorkflowStore
 

src/types/index.ts

@@ -31,16 +31,6 @@ export type { ComfyApi } from '@/scripts/api'
 export type { ComfyApp } from '@/scripts/app'
 export type { ComfyNodeDef } from '@/schemas/nodeDefSchema'
 export type { InputSpec } from '@/schemas/nodeDefSchema'
-export type {
-  NodeLocatorId,
-  NodeExecutionId,
-  isNodeLocatorId,
-  isNodeExecutionId,
-  parseNodeLocatorId,
-  createNodeLocatorId,
-  parseNodeExecutionId,
-  createNodeExecutionId
-} from './nodeIdentification'
 export type {
   EmbeddingsResponse,
   ExtensionsResponse,

src/types/nodeIdentification.ts

@@ -1,123 +0,0 @@
-import type { NodeId } from '@/schemas/comfyWorkflowSchema'
-
-/**
- * A globally unique identifier for nodes that maintains consistency across
- * multiple instances of the same subgraph.
- *
- * Format:
- * - For subgraph nodes: `<immediate-contained-subgraph-uuid>:<local-node-id>`
- * - For root graph nodes: `<local-node-id>`
- *
- * Examples:
- * - "a1b2c3d4-e5f6-7890-abcd-ef1234567890:123" (node in subgraph)
- * - "456" (node in root graph)
- *
- * Unlike execution IDs which change based on the instance path,
- * NodeLocatorId remains the same for all instances of a particular node.
- */
-export type NodeLocatorId = string
-
-/**
- * An execution identifier representing a node's position in nested subgraphs.
- * Also known as ExecutionId in some contexts.
- *
- * Format: Colon-separated path of node IDs
- * Example: "123:456:789" (node 789 in subgraph 456 in subgraph 123)
- */
-export type NodeExecutionId = string
-
-/**
- * Type guard to check if a value is a NodeLocatorId
- */
-export function isNodeLocatorId(value: unknown): value is NodeLocatorId {
-  if (typeof value !== 'string') return false
-
-  // Check if it's a simple node ID (root graph node)
-  const parts = value.split(':')
-  if (parts.length === 1) {
-    // Simple node ID - must be non-empty
-    return value.length > 0
-  }
-
-  // Check for UUID:nodeId format
-  if (parts.length !== 2) return false
-
-  // Check that node ID part is not empty
-  if (!parts[1]) return false
-
-  // Basic UUID format check (8-4-4-4-12 hex characters)
-  const uuidPattern =
-    /^[0-9a-f]{8}-[0-9a-f]{4}-[0-9a-f]{4}-[0-9a-f]{4}-[0-9a-f]{12}$/i
-  return uuidPattern.test(parts[0])
-}
-
-/**
- * Type guard to check if a value is a NodeExecutionId
- */
-export function isNodeExecutionId(value: unknown): value is NodeExecutionId {
-  if (typeof value !== 'string') return false
-  // Must contain at least one colon to be an execution ID
-  return value.includes(':')
-}
-
-/**
- * Parse a NodeLocatorId into its components
- * @param id The NodeLocatorId to parse
- * @returns The subgraph UUID and local node ID, or null if invalid
- */
-export function parseNodeLocatorId(
-  id: string
-): { subgraphUuid: string | null; localNodeId: NodeId } | null {
-  if (!isNodeLocatorId(id)) return null
-
-  const parts = id.split(':')
-
-  if (parts.length === 1) {
-    // Simple node ID (root graph)
-    return {
-      subgraphUuid: null,
-      localNodeId: isNaN(Number(id)) ? id : Number(id)
-    }
-  }
-
-  const [subgraphUuid, localNodeId] = parts
-  return {
-    subgraphUuid,
-    localNodeId: isNaN(Number(localNodeId)) ? localNodeId : Number(localNodeId)
-  }
-}
-
-/**
- * Create a NodeLocatorId from components
- * @param subgraphUuid The UUID of the immediate containing subgraph
- * @param localNodeId The local node ID within that subgraph
- * @returns A properly formatted NodeLocatorId
- */
-export function createNodeLocatorId(
-  subgraphUuid: string,
-  localNodeId: NodeId
-): NodeLocatorId {
-  return `${subgraphUuid}:${localNodeId}` as NodeLocatorId
-}
-
-/**
- * Parse a NodeExecutionId into its component node IDs
- * @param id The NodeExecutionId to parse
- * @returns Array of node IDs from root to target, or null if not an execution ID
- */
-export function parseNodeExecutionId(id: string): NodeId[] | null {
-  if (!isNodeExecutionId(id)) return null
-
-  return id
-    .split(':')
-    .map((part) => (isNaN(Number(part)) ? part : Number(part)))
-}
-
-/**
- * Create a NodeExecutionId from an array of node IDs
- * @param nodeIds Array of node IDs from root to target
- * @returns A properly formatted NodeExecutionId
- */
-export function createNodeExecutionId(nodeIds: NodeId[]): NodeExecutionId {
-  return nodeIds.join(':') as NodeExecutionId
-}

tests-ui/tests/api.featureFlags.test.ts

@@ -1,208 +0,0 @@
-import { afterEach, beforeEach, describe, expect, it, vi } from 'vitest'
-
-import { api } from '@/scripts/api'
-
-describe('API Feature Flags', () => {
-  let mockWebSocket: any
-  const wsEventHandlers: { [key: string]: (event: any) => void } = {}
-
-  beforeEach(() => {
-    // Use fake timers
-    vi.useFakeTimers()
-
-    // Mock WebSocket
-    mockWebSocket = {
-      readyState: 1, // WebSocket.OPEN
-      send: vi.fn(),
-      close: vi.fn(),
-      addEventListener: vi.fn(
-        (event: string, handler: (event: any) => void) => {
-          wsEventHandlers[event] = handler
-        }
-      ),
-      removeEventListener: vi.fn()
-    }
-
-    // Mock WebSocket constructor
-    global.WebSocket = vi.fn().mockImplementation(() => mockWebSocket) as any
-
-    // Reset API state
-    api.serverFeatureFlags = {}
-
-    // Mock getClientFeatureFlags to return test feature flags
-    vi.spyOn(api, 'getClientFeatureFlags').mockReturnValue({
-      supports_preview_metadata: true,
-      api_version: '1.0.0',
-      capabilities: ['bulk_operations', 'async_nodes']
-    })
-  })
-
-  afterEach(() => {
-    vi.useRealTimers()
-    vi.restoreAllMocks()
-  })
-
-  describe('Feature flags negotiation', () => {
-    it('should send client feature flags as first message on connection', async () => {
-      // Initialize API connection
-      const initPromise = api.init()
-
-      // Simulate connection open
-      wsEventHandlers['open'](new Event('open'))
-
-      // Check that feature flags were sent as first message
-      expect(mockWebSocket.send).toHaveBeenCalledTimes(1)
-      const sentMessage = JSON.parse(mockWebSocket.send.mock.calls[0][0])
-      expect(sentMessage).toEqual({
-        type: 'feature_flags',
-        data: {
-          supports_preview_metadata: true,
-          api_version: '1.0.0',
-          capabilities: ['bulk_operations', 'async_nodes']
-        }
-      })
-
-      // Simulate server response with status message
-      wsEventHandlers['message']({
-        data: JSON.stringify({
-          type: 'status',
-          data: {
-            status: { exec_info: { queue_remaining: 0 } },
-            sid: 'test-sid'
-          }
-        })
-      })
-
-      // Simulate server feature flags response
-      wsEventHandlers['message']({
-        data: JSON.stringify({
-          type: 'feature_flags',
-          data: {
-            supports_preview_metadata: true,
-            async_execution: true,
-            supported_formats: ['webp', 'jpeg', 'png'],
-            api_version: '1.0.0',
-            max_upload_size: 104857600,
-            capabilities: ['isolated_nodes', 'dynamic_models']
-          }
-        })
-      })
-
-      await initPromise
-
-      // Check that server features were stored
-      expect(api.serverFeatureFlags).toEqual({
-        supports_preview_metadata: true,
-        async_execution: true,
-        supported_formats: ['webp', 'jpeg', 'png'],
-        api_version: '1.0.0',
-        max_upload_size: 104857600,
-        capabilities: ['isolated_nodes', 'dynamic_models']
-      })
-    })
-
-    it('should handle server without feature flags support', async () => {
-      // Initialize API connection
-      const initPromise = api.init()
-
-      // Simulate connection open
-      wsEventHandlers['open'](new Event('open'))
-
-      // Clear the send mock to reset
-      mockWebSocket.send.mockClear()
-
-      // Simulate server response with status but no feature flags
-      wsEventHandlers['message']({
-        data: JSON.stringify({
-          type: 'status',
-          data: {
-            status: { exec_info: { queue_remaining: 0 } },
-            sid: 'test-sid'
-          }
-        })
-      })
-
-      // Simulate some other message (not feature flags)
-      wsEventHandlers['message']({
-        data: JSON.stringify({
-          type: 'execution_start',
-          data: {}
-        })
-      })
-
-      await initPromise
-
-      // Server features should remain empty
-      expect(api.serverFeatureFlags).toEqual({})
-    })
-  })
-
-  describe('Feature checking methods', () => {
-    beforeEach(() => {
-      // Set up some test features
-      api.serverFeatureFlags = {
-        supports_preview_metadata: true,
-        async_execution: false,
-        capabilities: ['isolated_nodes', 'dynamic_models']
-      }
-    })
-
-    it('should check if server supports a boolean feature', () => {
-      expect(api.serverSupportsFeature('supports_preview_metadata')).toBe(true)
-      expect(api.serverSupportsFeature('async_execution')).toBe(false)
-      expect(api.serverSupportsFeature('non_existent_feature')).toBe(false)
-    })
-
-    it('should get server feature value', () => {
-      expect(api.getServerFeature('supports_preview_metadata')).toBe(true)
-      expect(api.getServerFeature('capabilities')).toEqual([
-        'isolated_nodes',
-        'dynamic_models'
-      ])
-      expect(api.getServerFeature('non_existent_feature')).toBeUndefined()
-    })
-  })
-
-  describe('Client feature flags configuration', () => {
-    it('should use mocked client feature flags', () => {
-      // Verify mocked flags are returned
-      const clientFlags = api.getClientFeatureFlags()
-      expect(clientFlags).toEqual({
-        supports_preview_metadata: true,
-        api_version: '1.0.0',
-        capabilities: ['bulk_operations', 'async_nodes']
-      })
-    })
-
-    it('should return a copy of client feature flags', () => {
-      // Temporarily restore the real implementation for this test
-      vi.mocked(api.getClientFeatureFlags).mockRestore()
-
-      // Verify that modifications to returned object don't affect original
-      const clientFlags1 = api.getClientFeatureFlags()
-      const clientFlags2 = api.getClientFeatureFlags()
-
-      // Should be different objects
-      expect(clientFlags1).not.toBe(clientFlags2)
-
-      // But with same content
-      expect(clientFlags1).toEqual(clientFlags2)
-
-      // Modifying one should not affect the other
-      clientFlags1.test_flag = true
-      expect(api.getClientFeatureFlags()).not.toHaveProperty('test_flag')
-    })
-  })
-
-  describe('Integration with preview messages', () => {
-    it('should affect preview message handling based on feature support', () => {
-      // Test with metadata support
-      api.serverFeatureFlags = { supports_preview_metadata: true }
-      expect(api.serverSupportsFeature('supports_preview_metadata')).toBe(true)
-
-      // Test without metadata support
-      api.serverFeatureFlags = {}
-      expect(api.serverSupportsFeature('supports_preview_metadata')).toBe(false)
-    })
-  })
-})

tests-ui/tests/composables/BrowserTabTitle.spec.ts

@@ -3,20 +3,12 @@ import { nextTick, reactive } from 'vue'
 
 import { useBrowserTabTitle } from '@/composables/useBrowserTabTitle'
 
-// Mock i18n module
-vi.mock('@/i18n', () => ({
-  t: (key: string, fallback: string) =>
-    key === 'g.nodesRunning' ? 'nodes running' : fallback
-}))
-
 // Mock the execution store
 const executionStore = reactive({
   isIdle: true,
   executionProgress: 0,
   executingNode: null as any,
-  executingNodeProgress: 0,
-  nodeProgressStates: {} as any,
-  activePrompt: null as any
+  executingNodeProgress: 0
 })
 vi.mock('@/stores/executionStore', () => ({
   useExecutionStore: () => executionStore
@@ -45,8 +37,6 @@ describe('useBrowserTabTitle', () => {
     executionStore.executionProgress = 0
     executionStore.executingNode = null as any
     executionStore.executingNodeProgress = 0
-    executionStore.nodeProgressStates = {}
-    executionStore.activePrompt = null
 
     // reset setting and workflow stores
     ;(settingStore.get as any).mockReturnValue('Enabled')
@@ -107,41 +97,13 @@ describe('useBrowserTabTitle', () => {
     expect(document.title).toBe('[30%]ComfyUI')
   })
 
-  it('shows node execution title when executing a node using nodeProgressStates', async () => {
+  it('shows node execution title when executing a node', async () => {
     executionStore.isIdle = false
     executionStore.executionProgress = 0.4
-    executionStore.nodeProgressStates = {
-      '1': { state: 'running', value: 5, max: 10, node: '1', prompt_id: 'test' }
-    }
-    executionStore.activePrompt = {
-      workflow: {
-        changeTracker: {
-          activeState: {
-            nodes: [{ id: 1, type: 'Foo' }]
-          }
-        }
-      }
-    }
+    executionStore.executingNodeProgress = 0.5
+    executionStore.executingNode = { type: 'Foo' }
     useBrowserTabTitle()
     await nextTick()
     expect(document.title).toBe('[40%][50%] Foo')
   })
-
-  it('shows multiple nodes running when multiple nodes are executing', async () => {
-    executionStore.isIdle = false
-    executionStore.executionProgress = 0.4
-    executionStore.nodeProgressStates = {
-      '1': {
-        state: 'running',
-        value: 5,
-        max: 10,
-        node: '1',
-        prompt_id: 'test'
-      },
-      '2': { state: 'running', value: 8, max: 10, node: '2', prompt_id: 'test' }
-    }
-    useBrowserTabTitle()
-    await nextTick()
-    expect(document.title).toBe('[40%][2 nodes running]')
-  })
 })

tests-ui/tests/store/executionStore.test.ts

@@ -1,22 +1,11 @@
 import { createPinia, setActivePinia } from 'pinia'
 import { beforeEach, describe, expect, it, vi } from 'vitest'
 
-import { app } from '@/scripts/app'
 import { useExecutionStore } from '@/stores/executionStore'
-import { useWorkflowStore } from '@/stores/workflowStore'
-
-// Mock the workflowStore
-vi.mock('@/stores/workflowStore', () => ({
-  useWorkflowStore: vi.fn(() => ({
-    nodeExecutionIdToNodeLocatorId: vi.fn(),
-    nodeIdToNodeLocatorId: vi.fn(),
-    nodeLocatorIdToNodeExecutionId: vi.fn()
-  }))
-}))
 
 // Remove any previous global types
 declare global {
-  // eslint-disable-next-line @typescript-eslint/no-empty-object-type
+  // Empty interface to override any previous declarations
   interface Window {}
 }
 
@@ -33,16 +22,12 @@ vi.mock('@/composables/node/useNodeProgressText', () => ({
   })
 }))
 
-// Mock the app import with proper implementation
-vi.mock('@/scripts/app', () => ({
-  app: {
-    graph: {
-      getNodeById: vi.fn()
-    },
-    revokePreviews: vi.fn(),
-    nodePreviewImages: {}
+// Create a local mock instead of using global to avoid conflicts
+const mockApp = {
+  graph: {
+    getNodeById: vi.fn()
   }
-}))
+}
 
 describe('executionStore - display_component handling', () => {
   function createDisplayComponentEvent(
@@ -62,7 +47,7 @@ describe('executionStore - display_component handling', () => {
 
   function handleDisplayComponentMessage(event: CustomEvent) {
     const { node_id, component } = event.detail
-    const node = vi.mocked(app.graph.getNodeById)(node_id)
+    const node = mockApp.graph.getNodeById(node_id)
     if (node && component === 'ChatHistoryWidget') {
       mockShowChatHistory(node)
     }
@@ -75,121 +60,23 @@ describe('executionStore - display_component handling', () => {
   })
 
   it('handles ChatHistoryWidget display_component messages', () => {
-    const mockNode = { id: '123' } as any
-    vi.mocked(app.graph.getNodeById).mockReturnValue(mockNode)
+    const mockNode = { id: '123' }
+    mockApp.graph.getNodeById.mockReturnValue(mockNode)
 
     const event = createDisplayComponentEvent('123')
     handleDisplayComponentMessage(event)
 
-    expect(app.graph.getNodeById).toHaveBeenCalledWith('123')
+    expect(mockApp.graph.getNodeById).toHaveBeenCalledWith('123')
     expect(mockShowChatHistory).toHaveBeenCalledWith(mockNode)
   })
 
   it('does nothing if node is not found', () => {
-    vi.mocked(app.graph.getNodeById).mockReturnValue(null)
+    mockApp.graph.getNodeById.mockReturnValue(null)
 
     const event = createDisplayComponentEvent('non-existent')
     handleDisplayComponentMessage(event)
 
-    expect(app.graph.getNodeById).toHaveBeenCalledWith('non-existent')
+    expect(mockApp.graph.getNodeById).toHaveBeenCalledWith('non-existent')
     expect(mockShowChatHistory).not.toHaveBeenCalled()
   })
 })
-
-describe('useExecutionStore - NodeLocatorId conversions', () => {
-  let store: ReturnType<typeof useExecutionStore>
-  let workflowStore: ReturnType<typeof useWorkflowStore>
-
-  beforeEach(() => {
-    setActivePinia(createPinia())
-
-    // Create the mock workflowStore instance
-    const mockWorkflowStore = {
-      nodeExecutionIdToNodeLocatorId: vi.fn(),
-      nodeIdToNodeLocatorId: vi.fn(),
-      nodeLocatorIdToNodeExecutionId: vi.fn()
-    }
-
-    // Mock the useWorkflowStore function to return our mock
-    vi.mocked(useWorkflowStore).mockReturnValue(mockWorkflowStore as any)
-
-    workflowStore = mockWorkflowStore as any
-    store = useExecutionStore()
-    vi.clearAllMocks()
-  })
-
-  describe('executionIdToNodeLocatorId', () => {
-    it('should convert execution ID to NodeLocatorId', () => {
-      // Mock subgraph structure
-      const mockSubgraph = {
-        id: 'a1b2c3d4-e5f6-7890-abcd-ef1234567890',
-        _nodes: []
-      }
-
-      const mockNode = {
-        id: 123,
-        isSubgraphNode: () => true,
-        subgraph: mockSubgraph
-      } as any
-
-      // Mock app.graph.getNodeById to return the mock node
-      vi.mocked(app.graph.getNodeById).mockReturnValue(mockNode)
-
-      const result = store.executionIdToNodeLocatorId('123:456')
-
-      expect(result).toBe('a1b2c3d4-e5f6-7890-abcd-ef1234567890:456')
-    })
-
-    it('should convert simple node ID to NodeLocatorId', () => {
-      const result = store.executionIdToNodeLocatorId('123')
-
-      // For simple node IDs, it should return the ID as-is
-      expect(result).toBe('123')
-    })
-
-    it('should handle numeric node IDs', () => {
-      const result = store.executionIdToNodeLocatorId(123)
-
-      // For numeric IDs, it should convert to string and return as-is
-      expect(result).toBe('123')
-    })
-
-    it('should return null when conversion fails', () => {
-      // Mock app.graph.getNodeById to return null (node not found)
-      vi.mocked(app.graph.getNodeById).mockReturnValue(null)
-
-      // This should throw an error as the node is not found
-      expect(() => store.executionIdToNodeLocatorId('999:456')).toThrow(
-        'Subgraph not found: 999'
-      )
-    })
-  })
-
-  describe('nodeLocatorIdToExecutionId', () => {
-    it('should convert NodeLocatorId to execution ID', () => {
-      const mockExecutionId = '123:456'
-      vi.spyOn(workflowStore, 'nodeLocatorIdToNodeExecutionId').mockReturnValue(
-        mockExecutionId as any
-      )
-
-      const result = store.nodeLocatorIdToExecutionId(
-        'a1b2c3d4-e5f6-7890-abcd-ef1234567890:456'
-      )
-
-      expect(workflowStore.nodeLocatorIdToNodeExecutionId).toHaveBeenCalledWith(
-        'a1b2c3d4-e5f6-7890-abcd-ef1234567890:456'
-      )
-      expect(result).toBe(mockExecutionId)
-    })
-
-    it('should return null when conversion fails', () => {
-      vi.spyOn(workflowStore, 'nodeLocatorIdToNodeExecutionId').mockReturnValue(
-        null
-      )
-
-      const result = store.nodeLocatorIdToExecutionId('invalid:format')
-
-      expect(result).toBeNull()
-    })
-  })
-})

tests-ui/tests/store/workflowStore.test.ts

@@ -1,4 +1,3 @@
-import type { Subgraph } from '@comfyorg/litegraph'
 import { createPinia, setActivePinia } from 'pinia'
 import { beforeEach, describe, expect, it, vi } from 'vitest'
 import { nextTick } from 'vue'
@@ -12,7 +11,6 @@ import {
   useWorkflowBookmarkStore,
   useWorkflowStore
 } from '@/stores/workflowStore'
-import { isSubgraph } from '@/utils/typeGuardUtil'
 
 // Add mock for api at the top of the file
 vi.mock('@/scripts/api', () => ({
@@ -28,15 +26,10 @@ vi.mock('@/scripts/api', () => ({
 // Mock comfyApp globally for the store setup
 vi.mock('@/scripts/app', () => ({
   app: {
-    canvas: {} // Start with empty canvas object
+    canvas: null // Start with canvas potentially undefined or null
   }
 }))
 
-// Mock isSubgraph
-vi.mock('@/utils/typeGuardUtil', () => ({
-  isSubgraph: vi.fn(() => false)
-}))
-
 describe('useWorkflowStore', () => {
   let store: ReturnType<typeof useWorkflowStore>
   let bookmarkStore: ReturnType<typeof useWorkflowBookmarkStore>
@@ -525,13 +518,8 @@ describe('useWorkflowStore', () => {
           { name: 'Level 1 Subgraph' },
           { name: 'Level 2 Subgraph' }
         ]
-      } as any
-      vi.mocked(comfyApp.canvas).subgraph = mockSubgraph
-
-      // Mock isSubgraph to return true for our mockSubgraph
-      vi.mocked(isSubgraph).mockImplementation(
-        (obj): obj is Subgraph => obj === mockSubgraph
-      )
+      }
+      vi.mocked(comfyApp.canvas).subgraph = mockSubgraph as any
 
       // Act: Trigger the update
       store.updateActiveGraph()
@@ -548,13 +536,8 @@ describe('useWorkflowStore', () => {
         name: 'Initial Subgraph',
         pathToRootGraph: [{ name: 'Root' }, { name: 'Initial Subgraph' }],
         isRootGraph: false
-      } as any
-      vi.mocked(comfyApp.canvas).subgraph = initialSubgraph
-
-      // Mock isSubgraph to return true for our initialSubgraph
-      vi.mocked(isSubgraph).mockImplementation(
-        (obj): obj is Subgraph => obj === initialSubgraph
-      )
+      }
+      vi.mocked(comfyApp.canvas).subgraph = initialSubgraph as any
 
       // Trigger initial update based on the *first* workflow opened in beforeEach
       store.updateActiveGraph()
@@ -578,11 +561,6 @@ describe('useWorkflowStore', () => {
       // This ensures the watcher *does* cause a state change we can assert
       vi.mocked(comfyApp.canvas).subgraph = undefined
 
-      // Mock isSubgraph to return false for undefined
-      vi.mocked(isSubgraph).mockImplementation(
-        (_obj): _obj is Subgraph => false
-      )
-
       await store.openWorkflow(workflow2) // This changes activeWorkflow and triggers the watch
       await nextTick() // Allow watcher and potential async operations in updateActiveGraph to complete
 
@@ -591,131 +569,4 @@ describe('useWorkflowStore', () => {
       expect(store.activeSubgraph).toBeUndefined()
     })
   })
-
-  describe('NodeLocatorId conversions', () => {
-    beforeEach(() => {
-      // Setup mock graph structure with subgraphs
-      const mockSubgraph = {
-        id: 'a1b2c3d4-e5f6-7890-abcd-ef1234567890',
-        _nodes: []
-      }
-
-      const mockNode = {
-        id: 123,
-        isSubgraphNode: () => true,
-        subgraph: mockSubgraph
-      }
-
-      const mockRootGraph = {
-        _nodes: [mockNode],
-        subgraphs: new Map([[mockSubgraph.id, mockSubgraph]]),
-        getNodeById: (id: string | number) => {
-          if (String(id) === '123') return mockNode
-          return null
-        }
-      }
-
-      vi.mocked(comfyApp).graph = mockRootGraph as any
-      vi.mocked(comfyApp.canvas).subgraph = mockSubgraph as any
-      store.activeSubgraph = mockSubgraph as any
-    })
-
-    describe('nodeIdToNodeLocatorId', () => {
-      it('should convert node ID to NodeLocatorId for subgraph nodes', () => {
-        const result = store.nodeIdToNodeLocatorId(456)
-        expect(result).toBe('a1b2c3d4-e5f6-7890-abcd-ef1234567890:456')
-      })
-
-      it('should return simple node ID for root graph nodes', () => {
-        store.activeSubgraph = undefined
-        const result = store.nodeIdToNodeLocatorId(123)
-        expect(result).toBe('123')
-      })
-
-      it('should use provided subgraph instead of active one', () => {
-        const customSubgraph = {
-          id: 'custom-uuid-1234-5678-90ab-cdef12345678'
-        } as any
-        const result = store.nodeIdToNodeLocatorId(789, customSubgraph)
-        expect(result).toBe('custom-uuid-1234-5678-90ab-cdef12345678:789')
-      })
-    })
-
-    describe('nodeExecutionIdToNodeLocatorId', () => {
-      it('should convert execution ID to NodeLocatorId', () => {
-        const result = store.nodeExecutionIdToNodeLocatorId('123:456')
-        expect(result).toBe('a1b2c3d4-e5f6-7890-abcd-ef1234567890:456')
-      })
-
-      it('should return simple node ID for root level nodes', () => {
-        const result = store.nodeExecutionIdToNodeLocatorId('123')
-        expect(result).toBe('123')
-      })
-
-      it('should return null for invalid execution IDs', () => {
-        const result = store.nodeExecutionIdToNodeLocatorId('999:456')
-        expect(result).toBeNull()
-      })
-    })
-
-    describe('nodeLocatorIdToNodeId', () => {
-      it('should extract node ID from NodeLocatorId', () => {
-        const result = store.nodeLocatorIdToNodeId(
-          'a1b2c3d4-e5f6-7890-abcd-ef1234567890:456'
-        )
-        expect(result).toBe(456)
-      })
-
-      it('should handle string node IDs', () => {
-        const result = store.nodeLocatorIdToNodeId(
-          'a1b2c3d4-e5f6-7890-abcd-ef1234567890:node_1'
-        )
-        expect(result).toBe('node_1')
-      })
-
-      it('should handle simple node IDs (root graph)', () => {
-        const result = store.nodeLocatorIdToNodeId('123')
-        expect(result).toBe(123)
-
-        const stringResult = store.nodeLocatorIdToNodeId('node_1')
-        expect(stringResult).toBe('node_1')
-      })
-
-      it('should return null for invalid NodeLocatorId', () => {
-        const result = store.nodeLocatorIdToNodeId('invalid:format')
-        expect(result).toBeNull()
-      })
-    })
-
-    describe('nodeLocatorIdToNodeExecutionId', () => {
-      it('should convert NodeLocatorId to execution ID', () => {
-        // Need to mock isSubgraph to identify our mockSubgraph
-        vi.mocked(isSubgraph).mockImplementation((obj): obj is Subgraph => {
-          return obj === store.activeSubgraph
-        })
-
-        const result = store.nodeLocatorIdToNodeExecutionId(
-          'a1b2c3d4-e5f6-7890-abcd-ef1234567890:456'
-        )
-        expect(result).toBe('123:456')
-      })
-
-      it('should handle simple node IDs (root graph)', () => {
-        const result = store.nodeLocatorIdToNodeExecutionId('123')
-        expect(result).toBe('123')
-      })
-
-      it('should return null for unknown subgraph UUID', () => {
-        const result = store.nodeLocatorIdToNodeExecutionId(
-          'unknown-uuid-1234-5678-90ab-cdef12345678:456'
-        )
-        expect(result).toBeNull()
-      })
-
-      it('should return null for invalid NodeLocatorId', () => {
-        const result = store.nodeLocatorIdToNodeExecutionId('invalid:format')
-        expect(result).toBeNull()
-      })
-    })
-  })
 })

tests-ui/tests/types/nodeIdentification.test.ts

@@ -1,207 +0,0 @@
-import { describe, expect, it } from 'vitest'
-
-import type { NodeId } from '@/schemas/comfyWorkflowSchema'
-import {
-  type NodeLocatorId,
-  createNodeExecutionId,
-  createNodeLocatorId,
-  isNodeExecutionId,
-  isNodeLocatorId,
-  parseNodeExecutionId,
-  parseNodeLocatorId
-} from '@/types/nodeIdentification'
-
-describe('nodeIdentification', () => {
-  describe('NodeLocatorId', () => {
-    const validUuid = 'a1b2c3d4-e5f6-7890-abcd-ef1234567890'
-    const validNodeId = '123'
-    const validNodeLocatorId = `${validUuid}:${validNodeId}` as NodeLocatorId
-
-    describe('isNodeLocatorId', () => {
-      it('should return true for valid NodeLocatorId', () => {
-        expect(isNodeLocatorId(validNodeLocatorId)).toBe(true)
-        expect(isNodeLocatorId(`${validUuid}:456`)).toBe(true)
-        expect(isNodeLocatorId(`${validUuid}:node_1`)).toBe(true)
-        // Simple node IDs (root graph)
-        expect(isNodeLocatorId('123')).toBe(true)
-        expect(isNodeLocatorId('node_1')).toBe(true)
-        expect(isNodeLocatorId('5')).toBe(true)
-      })
-
-      it('should return false for invalid formats', () => {
-        expect(isNodeLocatorId('123:456')).toBe(false) // No UUID in first part
-        expect(isNodeLocatorId('not-a-uuid:123')).toBe(false)
-        expect(isNodeLocatorId('')).toBe(false) // Empty string
-        expect(isNodeLocatorId(':123')).toBe(false) // Empty UUID
-        expect(isNodeLocatorId(`${validUuid}:`)).toBe(false) // Empty node ID
-        expect(isNodeLocatorId(`${validUuid}:123:456`)).toBe(false) // Too many parts
-        expect(isNodeLocatorId(123)).toBe(false) // Not a string
-        expect(isNodeLocatorId(null)).toBe(false)
-        expect(isNodeLocatorId(undefined)).toBe(false)
-      })
-
-      it('should validate UUID format correctly', () => {
-        // Valid UUID formats
-        expect(
-          isNodeLocatorId('00000000-0000-0000-0000-000000000000:123')
-        ).toBe(true)
-        expect(
-          isNodeLocatorId('A1B2C3D4-E5F6-7890-ABCD-EF1234567890:123')
-        ).toBe(true)
-
-        // Invalid UUID formats
-        expect(isNodeLocatorId('00000000-0000-0000-0000-00000000000:123')).toBe(
-          false
-        ) // Too short
-        expect(
-          isNodeLocatorId('00000000-0000-0000-0000-0000000000000:123')
-        ).toBe(false) // Too long
-        expect(
-          isNodeLocatorId('00000000_0000_0000_0000_000000000000:123')
-        ).toBe(false) // Wrong separator
-        expect(
-          isNodeLocatorId('g0000000-0000-0000-0000-000000000000:123')
-        ).toBe(false) // Invalid hex
-      })
-    })
-
-    describe('parseNodeLocatorId', () => {
-      it('should parse valid NodeLocatorId', () => {
-        const result = parseNodeLocatorId(validNodeLocatorId)
-        expect(result).toEqual({
-          subgraphUuid: validUuid,
-          localNodeId: 123
-        })
-      })
-
-      it('should handle string node IDs', () => {
-        const stringNodeId = `${validUuid}:node_1`
-        const result = parseNodeLocatorId(stringNodeId)
-        expect(result).toEqual({
-          subgraphUuid: validUuid,
-          localNodeId: 'node_1'
-        })
-      })
-
-      it('should handle simple node IDs (root graph)', () => {
-        const result = parseNodeLocatorId('123')
-        expect(result).toEqual({
-          subgraphUuid: null,
-          localNodeId: 123
-        })
-
-        const stringResult = parseNodeLocatorId('node_1')
-        expect(stringResult).toEqual({
-          subgraphUuid: null,
-          localNodeId: 'node_1'
-        })
-      })
-
-      it('should return null for invalid formats', () => {
-        expect(parseNodeLocatorId('123:456')).toBeNull() // No UUID in first part
-        expect(parseNodeLocatorId('')).toBeNull()
-      })
-    })
-
-    describe('createNodeLocatorId', () => {
-      it('should create NodeLocatorId from components', () => {
-        const result = createNodeLocatorId(validUuid, 123)
-        expect(result).toBe(validNodeLocatorId)
-        expect(isNodeLocatorId(result)).toBe(true)
-      })
-
-      it('should handle string node IDs', () => {
-        const result = createNodeLocatorId(validUuid, 'node_1')
-        expect(result).toBe(`${validUuid}:node_1`)
-        expect(isNodeLocatorId(result)).toBe(true)
-      })
-    })
-  })
-
-  describe('NodeExecutionId', () => {
-    describe('isNodeExecutionId', () => {
-      it('should return true for execution IDs', () => {
-        expect(isNodeExecutionId('123:456')).toBe(true)
-        expect(isNodeExecutionId('123:456:789')).toBe(true)
-        expect(isNodeExecutionId('node_1:node_2')).toBe(true)
-      })
-
-      it('should return false for non-execution IDs', () => {
-        expect(isNodeExecutionId('123')).toBe(false)
-        expect(isNodeExecutionId('node_1')).toBe(false)
-        expect(isNodeExecutionId('')).toBe(false)
-        expect(isNodeExecutionId(123)).toBe(false)
-        expect(isNodeExecutionId(null)).toBe(false)
-        expect(isNodeExecutionId(undefined)).toBe(false)
-      })
-    })
-
-    describe('parseNodeExecutionId', () => {
-      it('should parse execution IDs correctly', () => {
-        expect(parseNodeExecutionId('123:456')).toEqual([123, 456])
-        expect(parseNodeExecutionId('123:456:789')).toEqual([123, 456, 789])
-        expect(parseNodeExecutionId('node_1:node_2')).toEqual([
-          'node_1',
-          'node_2'
-        ])
-        expect(parseNodeExecutionId('123:node_2:456')).toEqual([
-          123,
-          'node_2',
-          456
-        ])
-      })
-
-      it('should return null for non-execution IDs', () => {
-        expect(parseNodeExecutionId('123')).toBeNull()
-        expect(parseNodeExecutionId('')).toBeNull()
-      })
-    })
-
-    describe('createNodeExecutionId', () => {
-      it('should create execution IDs from node arrays', () => {
-        expect(createNodeExecutionId([123, 456])).toBe('123:456')
-        expect(createNodeExecutionId([123, 456, 789])).toBe('123:456:789')
-        expect(createNodeExecutionId(['node_1', 'node_2'])).toBe(
-          'node_1:node_2'
-        )
-        expect(createNodeExecutionId([123, 'node_2', 456])).toBe(
-          '123:node_2:456'
-        )
-      })
-
-      it('should handle single node ID', () => {
-        const result = createNodeExecutionId([123])
-        expect(result).toBe('123')
-        // Single node IDs are not execution IDs
-        expect(isNodeExecutionId(result)).toBe(false)
-      })
-
-      it('should handle empty array', () => {
-        expect(createNodeExecutionId([])).toBe('')
-      })
-    })
-  })
-
-  describe('Integration tests', () => {
-    it('should round-trip NodeLocatorId correctly', () => {
-      const uuid = 'a1b2c3d4-e5f6-7890-abcd-ef1234567890'
-      const nodeId: NodeId = 123
-
-      const locatorId = createNodeLocatorId(uuid, nodeId)
-      const parsed = parseNodeLocatorId(locatorId)
-
-      expect(parsed).toBeTruthy()
-      expect(parsed!.subgraphUuid).toBe(uuid)
-      expect(parsed!.localNodeId).toBe(nodeId)
-    })
-
-    it('should round-trip NodeExecutionId correctly', () => {
-      const nodeIds: NodeId[] = [123, 'node_2', 456]
-
-      const executionId = createNodeExecutionId(nodeIds)
-      const parsed = parseNodeExecutionId(executionId)
-
-      expect(parsed).toEqual(nodeIds)
-    })
-  })
-})