Revert "[refactor] Use getSlotPosition for Vue nodes in link rendering"

This reverts commit 881ff67fe2.

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

@@ -67,9 +67,9 @@ This is critical for better file inspection:
 
 Use git locally for much faster analysis:
 
-1. Get list of changed files: `git diff --name-only "$BASE_SHA" > changed_files.txt`
-2. Get the full diff: `git diff "$BASE_SHA" > pr_diff.txt`
-3. Get detailed file changes with status: `git diff --name-status "$BASE_SHA" > file_changes.txt`
+1. Get list of changed files: `git diff --name-only "origin/$BASE_BRANCH" > changed_files.txt`
+2. Get the full diff: `git diff "origin/$BASE_BRANCH" > pr_diff.txt`
+3. Get detailed file changes with status: `git diff --name-status "origin/$BASE_BRANCH" > file_changes.txt`
 
 ### Step 1.5: Create Analysis Cache
 

.git-blame-ignore-revs

@@ -7,21 +7,3 @@ c53f197de2a3e0fa66b16dedc65c131235c1c4b6
 
 # Reorganize renderer components into domain-driven folder structure
 c8a83a9caede7bdb5f8598c5492b07d08c339d49
-
-# Domain-driven design (DDD) refactors - September 2025
-# These commits reorganized the codebase into domain-driven architecture
-
-# [refactor] Improve renderer domain organization (#5552)
-6349ceee6c0a57fc7992e85635def9b6e22eaeb2
-
-# [refactor] Improve settings domain organization (#5550)  
-4c8c4a1ad4f53354f700a33ea1b95262aeda2719
-
-# [refactor] Improve workflow domain organization (#5584)
-ca312fd1eab540cc4ddc0e3d244d38b3858574f0
-
-# [refactor] Move thumbnail functionality to renderer/core domain (#5586)
-e3bb29ceb8174b8bbca9e48ec7d42cd540f40efa
-
-# [refactor] Improve updates/notifications domain organization (#5590)
-27ab355f9c73415dc39f4d3f512b02308f847801

.gitattributes

@@ -13,4 +13,4 @@
 
 # Generated files
 src/types/comfyRegistryTypes.ts linguist-generated=true
-src/workbench/extensions/manager/types/generatedManagerTypes.ts linguist-generated=true
+src/types/generatedManagerTypes.ts linguist-generated=true

.github/workflows/backport.yaml

@@ -4,25 +4,10 @@ on:
   pull_request_target:
     types: [closed, labeled]
     branches: [main]
-  workflow_dispatch:
-    inputs:
-      pr_number:
-        description: 'PR number to backport'
-        required: true
-        type: string
-      force_rerun:
-        description: 'Force rerun even if backports exist'
-        required: false
-        type: boolean
-        default: false
 
 jobs:
   backport:
-    if: >
-      (github.event_name == 'pull_request_target' && 
-       github.event.pull_request.merged == true && 
-       contains(github.event.pull_request.labels.*.name, 'needs-backport')) ||
-      github.event_name == 'workflow_dispatch'
+    if: github.event.pull_request.merged == true && contains(github.event.pull_request.labels.*.name, 'needs-backport')
     runs-on: ubuntu-latest
     permissions:
       contents: write
@@ -30,35 +15,6 @@ jobs:
       issues: write
 
     steps:
-      - name: Validate inputs for manual triggers
-        if: github.event_name == 'workflow_dispatch'
-        run: |
-          # Validate PR number format
-          if ! [[ "${{ inputs.pr_number }}" =~ ^[0-9]+$ ]]; then
-            echo "::error::Invalid PR number format. Must be a positive integer."
-            exit 1
-          fi
-          
-          # Validate PR exists and is merged
-          if ! gh pr view "${{ inputs.pr_number }}" --json merged >/dev/null 2>&1; then
-            echo "::error::PR #${{ inputs.pr_number }} not found or inaccessible."
-            exit 1
-          fi
-          
-          MERGED=$(gh pr view "${{ inputs.pr_number }}" --json merged --jq '.merged')
-          if [ "$MERGED" != "true" ]; then
-            echo "::error::PR #${{ inputs.pr_number }} is not merged. Only merged PRs can be backported."
-            exit 1
-          fi
-          
-          # Validate PR has needs-backport label
-          if ! gh pr view "${{ inputs.pr_number }}" --json labels --jq '.labels[].name' | grep -q "needs-backport"; then
-            echo "::error::PR #${{ inputs.pr_number }} does not have 'needs-backport' label."
-            exit 1
-          fi
-        env:
-          GH_TOKEN: ${{ secrets.GITHUB_TOKEN }}
-
       - name: Checkout repository
         uses: actions/checkout@v4
         with:
@@ -73,7 +29,7 @@ jobs:
         id: check-existing
         env:
           GH_TOKEN: ${{ secrets.GITHUB_TOKEN }}
-          PR_NUMBER: ${{ github.event_name == 'workflow_dispatch' && inputs.pr_number || github.event.pull_request.number }}
+          PR_NUMBER: ${{ github.event.pull_request.number }}
         run: |
           # Check for existing backport PRs for this PR number
           EXISTING_BACKPORTS=$(gh pr list --state all --search "backport-${PR_NUMBER}-to" --json title,headRefName,baseRefName | jq -r '.[].headRefName')
@@ -83,13 +39,6 @@ jobs:
             exit 0
           fi
           
-          # For manual triggers with force_rerun, proceed anyway
-          if [ "${{ github.event_name }}" = "workflow_dispatch" ] && [ "${{ inputs.force_rerun }}" = "true" ]; then
-            echo "skip=false" >> $GITHUB_OUTPUT
-            echo "::warning::Force rerun requested - existing backports will be updated"
-            exit 0
-          fi
-          
           echo "Found existing backport PRs:"
           echo "$EXISTING_BACKPORTS"
           echo "skip=true" >> $GITHUB_OUTPUT
@@ -101,17 +50,8 @@ jobs:
         run: |
           # Extract version labels (e.g., "1.24", "1.22")
           VERSIONS=""
-          
-          if [ "${{ github.event_name }}" = "workflow_dispatch" ]; then
-            # For manual triggers, get labels from the PR
-            LABELS=$(gh pr view ${{ inputs.pr_number }} --json labels | jq -r '.labels[].name')
-          else
-            # For automatic triggers, extract from PR event
-            LABELS='${{ toJSON(github.event.pull_request.labels) }}'
-            LABELS=$(echo "$LABELS" | jq -r '.[].name')
-          fi
-          
-          for label in $LABELS; do
+          LABELS='${{ toJSON(github.event.pull_request.labels) }}'
+          for label in $(echo "$LABELS" | jq -r '.[].name'); do
             # Match version labels like "1.24" (major.minor only)
             if [[ "$label" =~ ^[0-9]+\.[0-9]+$ ]]; then
               # Validate the branch exists before adding to list
@@ -135,20 +75,12 @@ jobs:
         if: steps.check-existing.outputs.skip != 'true'
         id: backport
         env:
-          PR_NUMBER: ${{ github.event_name == 'workflow_dispatch' && inputs.pr_number || github.event.pull_request.number }}
+          PR_NUMBER: ${{ github.event.pull_request.number }}
+          PR_TITLE: ${{ github.event.pull_request.title }}
+          MERGE_COMMIT: ${{ github.event.pull_request.merge_commit_sha }}
         run: |
           FAILED=""
           SUCCESS=""
-          
-          # Get PR data for manual triggers
-          if [ "${{ github.event_name }}" = "workflow_dispatch" ]; then
-            PR_DATA=$(gh pr view ${{ inputs.pr_number }} --json title,mergeCommit)
-            PR_TITLE=$(echo "$PR_DATA" | jq -r '.title')
-            MERGE_COMMIT=$(echo "$PR_DATA" | jq -r '.mergeCommit.oid')
-          else
-            PR_TITLE="${{ github.event.pull_request.title }}"
-            MERGE_COMMIT="${{ github.event.pull_request.merge_commit_sha }}"
-          fi
 
           for version in ${{ steps.versions.outputs.versions }}; do
             echo "::group::Backporting to core/${version}"
@@ -201,18 +133,11 @@ jobs:
         if: steps.check-existing.outputs.skip != 'true' && steps.backport.outputs.success
         env:
           GH_TOKEN: ${{ secrets.PR_GH_TOKEN }}
-          PR_NUMBER: ${{ github.event_name == 'workflow_dispatch' && inputs.pr_number || github.event.pull_request.number }}
         run: |
-          # Get PR data for manual triggers
-          if [ "${{ github.event_name }}" = "workflow_dispatch" ]; then
-            PR_DATA=$(gh pr view ${{ inputs.pr_number }} --json title,author)
-            PR_TITLE=$(echo "$PR_DATA" | jq -r '.title')
-            PR_AUTHOR=$(echo "$PR_DATA" | jq -r '.author.login')
-          else
-            PR_TITLE="${{ github.event.pull_request.title }}"
-            PR_AUTHOR="${{ github.event.pull_request.user.login }}"
-          fi
-          
+          PR_TITLE="${{ github.event.pull_request.title }}"
+          PR_NUMBER="${{ github.event.pull_request.number }}"
+          PR_AUTHOR="${{ github.event.pull_request.user.login }}"
+
           for backport in ${{ steps.backport.outputs.success }}; do
             IFS=':' read -r version branch <<< "${backport}"
 
@@ -241,16 +166,9 @@ jobs:
         env:
           GH_TOKEN: ${{ github.token }}
         run: |
-          if [ "${{ github.event_name }}" = "workflow_dispatch" ]; then
-            PR_DATA=$(gh pr view ${{ inputs.pr_number }} --json author,mergeCommit)
-            PR_NUMBER="${{ inputs.pr_number }}"
-            PR_AUTHOR=$(echo "$PR_DATA" | jq -r '.author.login')
-            MERGE_COMMIT=$(echo "$PR_DATA" | jq -r '.mergeCommit.oid')
-          else
-            PR_NUMBER="${{ github.event.pull_request.number }}"
-            PR_AUTHOR="${{ github.event.pull_request.user.login }}"
-            MERGE_COMMIT="${{ github.event.pull_request.merge_commit_sha }}"
-          fi
+          PR_NUMBER="${{ github.event.pull_request.number }}"
+          PR_AUTHOR="${{ github.event.pull_request.user.login }}"
+          MERGE_COMMIT="${{ github.event.pull_request.merge_commit_sha }}"
 
           for failure in ${{ steps.backport.outputs.failed }}; do
             IFS=':' read -r version reason conflicts <<< "${failure}"

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

@@ -47,7 +47,6 @@ jobs:
     needs: wait-for-ci
     if: needs.wait-for-ci.outputs.should-proceed == 'true'
     runs-on: ubuntu-latest
-    timeout-minutes: 30
     steps:
       - name: Checkout repository
         uses: actions/checkout@v4
@@ -70,17 +69,19 @@ jobs:
           pnpm install -g typescript @vue/compiler-sfc
 
       - name: Run Claude PR Review
-        uses: anthropics/claude-code-action@v1.0.6
+        uses: anthropics/claude-code-action@main
         with:
           label_trigger: "claude-review"
-          prompt: |
+          direct_prompt: |
             Read the file .claude/commands/comprehensive-pr-review.md and follow ALL the instructions exactly. 
             
             CRITICAL: You must post individual inline comments using the gh api commands shown in the file. 
             DO NOT create a summary comment. 
             Each issue must be posted as a separate inline comment on the specific line of code.
           anthropic_api_key: ${{ secrets.ANTHROPIC_API_KEY }}
-          claude_args: "--max-turns 256 --allowedTools 'Bash(git:*),Bash(gh api:*),Bash(gh pr:*),Bash(gh repo:*),Bash(jq:*),Bash(echo:*),Read,Write,Edit,Glob,Grep,WebFetch'"
+          max_turns: 256
+          timeout_minutes: 30
+          allowed_tools: "Bash(git:*),Bash(gh api:*),Bash(gh pr:*),Bash(gh repo:*),Bash(jq:*),Bash(echo:*),Read,Write,Edit,Glob,Grep,WebFetch"
         env:
           PR_NUMBER: ${{ github.event.pull_request.number }}
           GITHUB_TOKEN: ${{ secrets.GITHUB_TOKEN }}

.github/workflows/i18n-custom-nodes.yaml

@@ -32,10 +32,11 @@ jobs:
       with:
         repository: Comfy-Org/ComfyUI_frontend
         path: ComfyUI_frontend
-    - name: Copy ComfyUI_devtools from frontend repo
-      run: |
-        mkdir -p ComfyUI/custom_nodes/ComfyUI_devtools
-        cp -r ComfyUI_frontend/tools/devtools/* ComfyUI/custom_nodes/ComfyUI_devtools/
+    - name: Checkout ComfyUI_devtools
+      uses: actions/checkout@v4
+      with:
+        repository: Comfy-Org/ComfyUI_devtools
+        path: ComfyUI/custom_nodes/ComfyUI_devtools
     - name: Checkout custom node repository
       uses: actions/checkout@v4
       with:

.github/workflows/pr-playwright-deploy.yaml

@@ -1,4 +1,4 @@
-name: PR Playwright Deploy (Forks)
+name: PR Playwright Deploy and Comment
 
 on:
   workflow_run:
@@ -9,84 +9,272 @@ env:
   DATE_FORMAT: '+%m/%d/%Y, %I:%M:%S %p'
 
 jobs:
-  deploy-and-comment-forked-pr:
+  deploy-reports:
     runs-on: ubuntu-latest
-    if: |
-      github.repository == 'Comfy-Org/ComfyUI_frontend' && 
-      github.event.workflow_run.event == 'pull_request' &&
-      github.event.workflow_run.head_repository != null &&
-      github.event.workflow_run.repository != null &&
-      github.event.workflow_run.head_repository.full_name != github.event.workflow_run.repository.full_name
+    if: github.repository == 'Comfy-Org/ComfyUI_frontend' && github.event.workflow_run.event == 'pull_request' && github.event.action == 'completed'
     permissions:
-      pull-requests: write
       actions: read
+    strategy:
+      fail-fast: false
+      matrix:
+        browser: [chromium, chromium-2x, chromium-0.5x, mobile-chrome]
     steps:
-      - name: Log workflow trigger info
-        run: |
-          echo "Repository: ${{ github.repository }}"
-          echo "Event: ${{ github.event.workflow_run.event }}"
-          echo "Head repo: ${{ github.event.workflow_run.head_repository.full_name || 'null' }}"
-          echo "Base repo: ${{ github.event.workflow_run.repository.full_name || 'null' }}"
-          echo "Is forked: ${{ github.event.workflow_run.head_repository.full_name != github.event.workflow_run.repository.full_name }}"
-
-      - name: Checkout repository
-        uses: actions/checkout@v4
-
-      - name: Get PR Number
-        id: pr
+      - name: Get PR info
+        id: pr-info
         uses: actions/github-script@v7
         with:
           script: |
-            const { data: prs } = await github.rest.pulls.list({
+            const { data: pullRequests } = await github.rest.pulls.list({
               owner: context.repo.owner,
               repo: context.repo.repo,
               state: 'open',
+              head: `${context.repo.owner}:${context.payload.workflow_run.head_branch}`,
             });
             
-            const pr = prs.find(p => p.head.sha === context.payload.workflow_run.head_sha);
-            
-            if (!pr) {
-              console.log('No PR found for SHA:', context.payload.workflow_run.head_sha);
-              return null;
+            if (pullRequests.length === 0) {
+              console.log('No open PR found for this branch');
+              return { number: null, sanitized_branch: null };
             }
             
-            console.log(`Found PR #${pr.number} from fork: ${context.payload.workflow_run.head_repository.full_name}`);
-            return pr.number;
+            const pr = pullRequests[0];
+            const branchName = context.payload.workflow_run.head_branch;
+            const sanitizedBranch = branchName.toLowerCase().replace(/[^a-z0-9-]/g, '-').replace(/--+/g, '-').replace(/^-|-$/g, '');
+            
+            return {
+              number: pr.number,
+              sanitized_branch: sanitizedBranch
+            };
 
-      - name: Handle Test Start
-        if: steps.pr.outputs.result != 'null' && github.event.action == 'requested'
-        env:
-          GITHUB_TOKEN: ${{ github.token }}
+      - name: Set project name
+        if: fromJSON(steps.pr-info.outputs.result).number != null
+        id: project-name
         run: |
-          chmod +x scripts/cicd/pr-playwright-deploy-and-comment.sh
-          ./scripts/cicd/pr-playwright-deploy-and-comment.sh \
-            "${{ steps.pr.outputs.result }}" \
-            "${{ github.event.workflow_run.head_branch }}" \
-            "starting" \
-            "$(date -u '${{ env.DATE_FORMAT }}')"
+          if [ "${{ matrix.browser }}" = "chromium-0.5x" ]; then
+            echo "name=comfyui-playwright-chromium-0-5x" >> $GITHUB_OUTPUT
+          else
+            echo "name=comfyui-playwright-${{ matrix.browser }}" >> $GITHUB_OUTPUT
+          fi
+          echo "branch=${{ fromJSON(steps.pr-info.outputs.result).sanitized_branch }}" >> $GITHUB_OUTPUT
 
-      - name: Download and Deploy Reports
-        if: steps.pr.outputs.result != 'null' && github.event.action == 'completed'
+      - name: Download playwright report
+        if: fromJSON(steps.pr-info.outputs.result).number != null
         uses: actions/download-artifact@v4
         with:
           github-token: ${{ secrets.GITHUB_TOKEN }}
           run-id: ${{ github.event.workflow_run.id }}
-          pattern: playwright-report-*
-          path: reports
+          name: playwright-report-${{ matrix.browser }}
+          path: playwright-report
+
+      - name: Install Wrangler
+        if: fromJSON(steps.pr-info.outputs.result).number != null
+        run: npm install -g wrangler
+
+      - name: Deploy to Cloudflare Pages (${{ matrix.browser }})
+        if: fromJSON(steps.pr-info.outputs.result).number != null
+        id: cloudflare-deploy
+        continue-on-error: true
+        run: |
+          # Retry logic for wrangler deploy (3 attempts)
+          RETRY_COUNT=0
+          MAX_RETRIES=3
+          SUCCESS=false
           
-      - name: Handle Test Completion
-        if: steps.pr.outputs.result != 'null' && github.event.action == 'completed'
+          while [ $RETRY_COUNT -lt $MAX_RETRIES ] && [ $SUCCESS = false ]; do
+            RETRY_COUNT=$((RETRY_COUNT + 1))
+            echo "Deployment attempt $RETRY_COUNT of $MAX_RETRIES..."
+            
+            if npx wrangler pages deploy playwright-report --project-name=${{ steps.project-name.outputs.name }} --branch=${{ steps.project-name.outputs.branch }}; then
+              SUCCESS=true
+              echo "Deployment successful on attempt $RETRY_COUNT"
+            else
+              echo "Deployment failed on attempt $RETRY_COUNT"
+              if [ $RETRY_COUNT -lt $MAX_RETRIES ]; then
+                echo "Retrying in 10 seconds..."
+                sleep 10
+              fi
+            fi
+          done
+          
+          if [ $SUCCESS = false ]; then
+            echo "All deployment attempts failed"
+            exit 1
+          fi
         env:
           CLOUDFLARE_API_TOKEN: ${{ secrets.CLOUDFLARE_API_TOKEN }}
           CLOUDFLARE_ACCOUNT_ID: ${{ secrets.CLOUDFLARE_ACCOUNT_ID }}
-          GITHUB_TOKEN: ${{ github.token }}
+
+  comment-tests-starting:
+    runs-on: ubuntu-latest
+    if: github.repository == 'Comfy-Org/ComfyUI_frontend' && github.event.workflow_run.event == 'pull_request' && github.event.action == 'requested'
+    permissions:
+      pull-requests: write
+      actions: read
+    steps:
+      - name: Get PR number
+        id: pr
+        uses: actions/github-script@v7
+        with:
+          script: |
+            const { data: pullRequests } = await github.rest.pulls.list({
+              owner: context.repo.owner,
+              repo: context.repo.repo,
+              state: 'open',
+              head: `${context.repo.owner}:${context.payload.workflow_run.head_branch}`,
+            });
+
+            if (pullRequests.length === 0) {
+              console.log('No open PR found for this branch');
+              return null;
+            }
+
+            return pullRequests[0].number;
+
+      - name: Get completion time
+        id: completion-time
+        run: echo "time=$(date -u '${{ env.DATE_FORMAT }}')" >> $GITHUB_OUTPUT
+
+      - name: Generate comment body for start
+        if: steps.pr.outputs.result != 'null'
+        id: comment-body-start
         run: |
-          # Rename merged report if exists
-          [ -d "reports/playwright-report-chromium-merged" ] && \
-            mv reports/playwright-report-chromium-merged reports/playwright-report-chromium
-          
-          chmod +x scripts/cicd/pr-playwright-deploy-and-comment.sh
-          ./scripts/cicd/pr-playwright-deploy-and-comment.sh \
-            "${{ steps.pr.outputs.result }}" \
-            "${{ github.event.workflow_run.head_branch }}" \
-            "completed"
+          echo "<!-- PLAYWRIGHT_TEST_STATUS -->" > comment.md
+          echo "## 🎭 Playwright Test Results" >> comment.md
+          echo "" >> comment.md
+          echo "<img alt='comfy-loading-gif' src='https://github.com/user-attachments/assets/755c86ee-e445-4ea8-bc2c-cca85df48686' width='14px' height='14px' style='vertical-align: middle; margin-right: 4px;' /> **Tests are starting...** " >> comment.md
+          echo "" >> comment.md
+          echo "⏰ Started at: ${{ steps.completion-time.outputs.time }} UTC" >> comment.md
+          echo "" >> comment.md
+          echo "### 🚀 Running Tests" >> comment.md
+          echo "- 🧪 **chromium**: Running tests..." >> comment.md
+          echo "- 🧪 **chromium-0.5x**: Running tests..." >> comment.md
+          echo "- 🧪 **chromium-2x**: Running tests..." >> comment.md
+          echo "- 🧪 **mobile-chrome**: Running tests..." >> comment.md
+          echo "" >> comment.md
+          echo "---" >> comment.md
+          echo "⏱️ Please wait while tests are running across all browsers..." >> comment.md
+
+      - name: Comment PR - Tests Started
+        if: steps.pr.outputs.result != 'null'
+        uses: edumserrano/find-create-or-update-comment@82880b65c8a3a6e4c70aa05a204995b6c9696f53 # v3.0.0
+        with:
+          issue-number: ${{ steps.pr.outputs.result }}
+          body-includes: '<!-- PLAYWRIGHT_TEST_STATUS -->'
+          comment-author: 'github-actions[bot]'
+          edit-mode: replace
+          body-path: comment.md
+
+  comment-tests-completed:
+    runs-on: ubuntu-latest
+    needs: deploy-reports
+    if: github.repository == 'Comfy-Org/ComfyUI_frontend' && github.event.workflow_run.event == 'pull_request' && github.event.action == 'completed' && always()
+    permissions:
+      pull-requests: write
+      actions: read
+    steps:
+      - name: Get PR number
+        id: pr
+        uses: actions/github-script@v7
+        with:
+          script: |
+            const { data: pullRequests } = await github.rest.pulls.list({
+              owner: context.repo.owner,
+              repo: context.repo.repo,
+              state: 'open',
+              head: `${context.repo.owner}:${context.payload.workflow_run.head_branch}`,
+            });
+
+            if (pullRequests.length === 0) {
+              console.log('No open PR found for this branch');
+              return null;
+            }
+
+            return pullRequests[0].number;
+
+      - name: Download all deployment info
+        if: steps.pr.outputs.result != 'null'
+        uses: actions/download-artifact@v4
+        with:
+          github-token: ${{ secrets.GITHUB_TOKEN }}
+          run-id: ${{ github.event.workflow_run.id }}
+          pattern: deployment-info-*
+          merge-multiple: true
+          path: deployment-info
+
+      - name: Get completion time
+        id: completion-time
+        run: echo "time=$(date -u '${{ env.DATE_FORMAT }}')" >> $GITHUB_OUTPUT
+
+      - name: Generate comment body for completion
+        if: steps.pr.outputs.result != 'null'
+        id: comment-body-completed
+        run: |
+          echo "<!-- PLAYWRIGHT_TEST_STATUS -->" > comment.md
+          echo "## 🎭 Playwright Test Results" >> comment.md
+          echo "" >> comment.md
+
+          # Check if all tests passed
+          ALL_PASSED=true
+          for file in deployment-info/*.txt; do
+            if [ -f "$file" ]; then
+              browser=$(basename "$file" .txt)
+              info=$(cat "$file")
+              exit_code=$(echo "$info" | cut -d'|' -f2)
+              if [ "$exit_code" != "0" ]; then
+                ALL_PASSED=false
+                break
+              fi
+            fi
+          done
+
+          if [ "$ALL_PASSED" = "true" ]; then
+            echo "✅ **All tests passed across all browsers!**" >> comment.md
+          else
+            echo "❌ **Some tests failed!**" >> comment.md
+          fi
+
+          echo "" >> comment.md
+          echo "⏰ Completed at: ${{ steps.completion-time.outputs.time }} UTC" >> comment.md
+          echo "" >> comment.md
+          echo "### 📊 Test Reports by Browser" >> comment.md
+
+          for file in deployment-info/*.txt; do
+            if [ -f "$file" ]; then
+              browser=$(basename "$file" .txt)
+              info=$(cat "$file")
+              exit_code=$(echo "$info" | cut -d'|' -f2)
+              url=$(echo "$info" | cut -d'|' -f3)
+              
+              # Validate URLs before using them in comments
+              sanitized_url=$(echo "$url" | grep -E '^https://[a-z0-9.-]+\.pages\.dev(/.*)?$' || echo "INVALID_URL")
+              if [ "$sanitized_url" = "INVALID_URL" ]; then
+                echo "Invalid deployment URL detected: $url"
+                url="#" # Use safe fallback
+              fi
+              
+              if [ "$exit_code" = "0" ]; then
+                status="✅"
+              else
+                status="❌"
+              fi
+              
+              echo "- $status **$browser**: [View Report]($url)" >> comment.md
+            fi
+          done
+
+          echo "" >> comment.md
+          echo "---" >> comment.md
+          if [ "$ALL_PASSED" = "true" ]; then
+            echo "🎉 Your tests are passing across all browsers!" >> comment.md
+          else
+            echo "⚠️ Please check the test reports for details on failures." >> comment.md
+          fi
+
+      - name: Comment PR - Tests Complete
+        if: steps.pr.outputs.result != 'null'
+        uses: edumserrano/find-create-or-update-comment@82880b65c8a3a6e4c70aa05a204995b6c9696f53 # v3.0.0
+        with:
+          issue-number: ${{ steps.pr.outputs.result }}
+          body-includes: '<!-- PLAYWRIGHT_TEST_STATUS -->'
+          comment-author: 'github-actions[bot]'
+          edit-mode: replace
+          body-path: comment.md

.github/workflows/publish-frontend-types.yaml

@@ -1,139 +0,0 @@
-name: Publish Frontend Types
-
-on:
-  workflow_dispatch:
-    inputs:
-      version:
-        description: 'Version to publish (e.g., 1.26.7)'
-        required: true
-        type: string
-      dist_tag:
-        description: 'npm dist-tag to use'
-        required: true
-        default: latest
-        type: string
-      ref:
-        description: 'Git ref to checkout (commit SHA, tag, or branch)'
-        required: false
-        type: string
-  workflow_call:
-    inputs:
-      version:
-        required: true
-        type: string
-      dist_tag:
-        required: false
-        type: string
-        default: latest
-      ref:
-        required: false
-        type: string
-
-concurrency:
-  group: publish-frontend-types-${{ github.workflow }}-${{ inputs.version }}-${{ inputs.dist_tag }}
-  cancel-in-progress: false
-
-jobs:
-  publish_types_manual:
-    name: Publish @comfyorg/comfyui-frontend-types
-    runs-on: ubuntu-latest
-    permissions:
-      contents: read
-    steps:
-      - name: Validate inputs
-        shell: bash
-        run: |
-          set -euo pipefail
-          VERSION="${{ inputs.version }}"
-          SEMVER_REGEX='^(0|[1-9][0-9]*)\.(0|[1-9][0-9]*)\.(0|[1-9][0-9]*)(-((0|[1-9][0-9]*|[0-9]*[A-Za-z-][0-9A-Za-z-]*)(\.(0|[1-9][0-9]*|[0-9]*[A-Za-z-][0-9A-Za-z-]*))*))?(\+([0-9A-Za-z-]+(\.[0-9A-Za-z-]+)*))?$'
-          if [[ ! "$VERSION" =~ $SEMVER_REGEX ]]; then
-            echo "::error title=Invalid version::Version '$VERSION' must follow semantic versioning (x.y.z[-suffix][+build])" >&2
-            exit 1
-          fi
-
-      - name: Determine ref to checkout
-        id: resolve_ref
-        shell: bash
-        run: |
-          set -euo pipefail
-          REF="${{ inputs.ref }}"
-          VERSION="${{ inputs.version }}"
-          if [ -n "$REF" ]; then
-            if ! git check-ref-format --allow-onelevel "$REF"; then
-              echo "::error title=Invalid ref::Ref '$REF' fails git check-ref-format validation." >&2
-              exit 1
-            fi
-            echo "ref=$REF" >> "$GITHUB_OUTPUT"
-          else
-            echo "ref=refs/tags/v$VERSION" >> "$GITHUB_OUTPUT"
-          fi
-
-      - name: Checkout repository
-        uses: actions/checkout@v5
-        with:
-          ref: ${{ steps.resolve_ref.outputs.ref }}
-          fetch-depth: 1
-
-      - name: Install pnpm
-        uses: pnpm/action-setup@v4
-        with:
-          version: 10
-
-      - name: Setup Node.js
-        uses: actions/setup-node@v5
-        with:
-          node-version: 'lts/*'
-          cache: 'pnpm'
-          registry-url: https://registry.npmjs.org
-
-      - name: Install dependencies
-        run: pnpm install --frozen-lockfile
-        env:
-          PLAYWRIGHT_SKIP_BROWSER_DOWNLOAD: '1'
-
-      - name: Build types
-        run: pnpm build:types
-
-      - name: Verify version matches input
-        id: verify
-        shell: bash
-        run: |
-          PKG_VERSION=$(node -p "require('./package.json').version")
-          TYPES_PKG_VERSION=$(node -p "require('./dist/package.json').version")
-          if [ "$PKG_VERSION" != "${{ inputs.version }}" ]; then
-            echo "Error: package.json version $PKG_VERSION does not match input ${{ inputs.version }}" >&2
-            exit 1
-          fi
-          if [ "$TYPES_PKG_VERSION" != "${{ inputs.version }}" ]; then
-            echo "Error: dist/package.json version $TYPES_PKG_VERSION does not match input ${{ inputs.version }}" >&2
-            exit 1
-          fi
-          echo "version=${{ inputs.version }}" >> $GITHUB_OUTPUT
-
-      - name: Check if version already on npm
-        id: check_npm
-        shell: bash
-        run: |
-          set -euo pipefail
-          NAME=$(node -p "require('./dist/package.json').name")
-          VER="${{ steps.verify.outputs.version }}"
-          STATUS=0
-          OUTPUT=$(npm view "${NAME}@${VER}" --json 2>&1) || STATUS=$?
-          if [ "$STATUS" -eq 0 ]; then
-            echo "exists=true" >> "$GITHUB_OUTPUT"
-            echo "::warning title=Already published::${NAME}@${VER} already exists on npm. Skipping publish."
-          else
-            if echo "$OUTPUT" | grep -q "E404"; then
-              echo "exists=false" >> "$GITHUB_OUTPUT"
-            else
-              echo "::error title=Registry lookup failed::$OUTPUT" >&2
-              exit "$STATUS"
-            fi
-          fi
-
-      - name: Publish package
-        if: steps.check_npm.outputs.exists == 'false'
-        run: pnpm publish --access public --tag "${{ inputs.dist_tag }}" --no-git-checks
-        working-directory: dist
-        env:
-          NODE_AUTH_TOKEN: ${{ secrets.NPM_TOKEN }}

.github/workflows/release.yaml

@@ -18,7 +18,7 @@ jobs:
       is_prerelease: ${{ steps.check_prerelease.outputs.is_prerelease }}
     steps:
       - name: Checkout code
-        uses: actions/checkout@v5
+        uses: actions/checkout@v4
       - name: Install pnpm
         uses: pnpm/action-setup@v4
         with:
@@ -73,7 +73,7 @@ jobs:
     runs-on: ubuntu-latest
     steps:
       - name: Checkout code
-        uses: actions/checkout@v5
+        uses: actions/checkout@v4
       - name: Download dist artifact
         uses: actions/download-artifact@v4
         with:
@@ -98,7 +98,7 @@ jobs:
     runs-on: ubuntu-latest
     steps:
       - name: Checkout code
-        uses: actions/checkout@v5
+        uses: actions/checkout@v4
       - name: Download dist artifact
         uses: actions/download-artifact@v4
         with:
@@ -126,8 +126,34 @@ jobs:
 
   publish_types:
     needs: build
-    uses: ./.github/workflows/publish-frontend-types.yaml
-    with:
-      version: ${{ needs.build.outputs.version }}
-      ref: ${{ github.event.pull_request.merge_commit_sha }}
-    secrets: inherit
+    runs-on: ubuntu-latest
+    steps:
+      - uses: actions/checkout@v4
+      - name: Install pnpm
+        uses: pnpm/action-setup@v4
+        with:
+          version: 10
+      - uses: actions/setup-node@v4
+        with:
+          node-version: 'lts/*'
+          cache: 'pnpm'
+          registry-url: https://registry.npmjs.org
+
+      - name: Cache tool outputs
+        uses: actions/cache@v4
+        with:
+          path: |
+            .cache
+            tsconfig.tsbuildinfo
+            dist
+          key: types-tools-cache-${{ runner.os }}-${{ hashFiles('**/pnpm-lock.yaml') }}
+          restore-keys: |
+            types-tools-cache-${{ runner.os }}-
+
+      - run: pnpm install --frozen-lockfile
+      - run: pnpm build:types
+      - name: Publish package
+        run: pnpm publish --access public
+        working-directory: dist
+        env:
+          NODE_AUTH_TOKEN: ${{ secrets.NPM_TOKEN }}

.github/workflows/test-ui.yaml

@@ -27,10 +27,12 @@ jobs:
           repository: 'Comfy-Org/ComfyUI_frontend'
           path: 'ComfyUI_frontend'
 
-      - name: Copy ComfyUI_devtools from frontend repo
-        run: |
-          mkdir -p ComfyUI/custom_nodes/ComfyUI_devtools
-          cp -r ComfyUI_frontend/tools/devtools/* ComfyUI/custom_nodes/ComfyUI_devtools/
+      - name: Checkout ComfyUI_devtools
+        uses: actions/checkout@v4
+        with:
+          repository: 'Comfy-Org/ComfyUI_devtools'
+          path: 'ComfyUI/custom_nodes/ComfyUI_devtools'
+          ref: 'd05fd48dd787a4192e16802d4244cfcc0e2f9684'
 
       - name: Install pnpm
         uses: pnpm/action-setup@v4
@@ -227,13 +229,7 @@ jobs:
 
       - name: Run Playwright tests (${{ matrix.browser }})
         id: playwright
-        run: |
-          # Run tests with both HTML and JSON reporters
-          PLAYWRIGHT_JSON_OUTPUT_NAME=playwright-report/report.json \
-          npx playwright test --project=${{ matrix.browser }} \
-            --reporter=list \
-            --reporter=html \
-            --reporter=json
+        run: npx playwright test --project=${{ matrix.browser }} --reporter=html
         working-directory: ComfyUI_frontend
 
       - uses: actions/upload-artifact@v4
@@ -279,12 +275,7 @@ jobs:
           merge-multiple: true
 
       - name: Merge into HTML Report
-        run: |
-          # Generate HTML report
-          npx playwright merge-reports --reporter=html ./all-blob-reports
-          # Generate JSON report separately with explicit output path
-          PLAYWRIGHT_JSON_OUTPUT_NAME=playwright-report/report.json \
-          npx playwright merge-reports --reporter=json ./all-blob-reports
+        run: npx playwright merge-reports --reporter html ./all-blob-reports
         working-directory: ComfyUI_frontend
 
       - name: Upload HTML report
@@ -293,65 +284,3 @@ jobs:
           name: playwright-report-chromium
           path: ComfyUI_frontend/playwright-report/
           retention-days: 30
-
-  #### BEGIN Deployment and commenting (non-forked PRs only)
-  # when using pull_request event, we have permission to comment directly
-  # if its a forked repo, we need to use workflow_run event in a separate workflow (pr-playwright-deploy.yaml)
-
-  # Post starting comment for non-forked PRs
-  comment-on-pr-start:
-    runs-on: ubuntu-latest
-    if: github.event_name == 'pull_request' && github.event.pull_request.head.repo.fork == false
-    permissions:
-      pull-requests: write
-    steps:
-      - name: Checkout repository
-        uses: actions/checkout@v4
-        
-      - name: Get start time
-        id: start-time
-        run: echo "time=$(date -u '+%m/%d/%Y, %I:%M:%S %p')" >> $GITHUB_OUTPUT
-        
-      - name: Post starting comment
-        env:
-          GITHUB_TOKEN: ${{ github.token }}
-        run: |
-          chmod +x scripts/cicd/pr-playwright-deploy-and-comment.sh
-          ./scripts/cicd/pr-playwright-deploy-and-comment.sh \
-            "${{ github.event.pull_request.number }}" \
-            "${{ github.head_ref }}" \
-            "starting" \
-            "${{ steps.start-time.outputs.time }}"
-          
-  # Deploy and comment for non-forked PRs only
-  deploy-and-comment:
-    needs: [playwright-tests, merge-reports]
-    runs-on: ubuntu-latest
-    if: always() && github.event_name == 'pull_request' && github.event.pull_request.head.repo.fork == false
-    permissions:
-      pull-requests: write
-      contents: read
-    steps:
-      - name: Checkout repository
-        uses: actions/checkout@v4
-        
-      - name: Download all playwright reports
-        uses: actions/download-artifact@v4
-        with:
-          pattern: playwright-report-*
-          path: reports
-          
-      - name: Make deployment script executable
-        run: chmod +x scripts/cicd/pr-playwright-deploy-and-comment.sh
-        
-      - name: Deploy reports and comment on PR
-        env:
-          CLOUDFLARE_API_TOKEN: ${{ secrets.CLOUDFLARE_API_TOKEN }}
-          CLOUDFLARE_ACCOUNT_ID: ${{ secrets.CLOUDFLARE_ACCOUNT_ID }}
-          GITHUB_TOKEN: ${{ github.token }}
-        run: |
-          ./scripts/cicd/pr-playwright-deploy-and-comment.sh \
-            "${{ github.event.pull_request.number }}" \
-            "${{ github.head_ref }}" \
-            "completed"
-  #### END Deployment and commenting (non-forked PRs only)

.github/workflows/update-electron-types.yaml

@@ -40,7 +40,7 @@ jobs:
       - name: Get new version
         id: get-version
         run: |
-          NEW_VERSION=$(pnpm list @comfyorg/comfyui-electron-types --json --depth=0 | jq -r '.[0].dependencies."@comfyorg/comfyui-electron-types".version')
+          NEW_VERSION=$(pnpm list @comfyorg/comfyui-electron-types --json --depth=0 | jq -r '.[0].version')
           echo "NEW_VERSION=$NEW_VERSION" >> $GITHUB_OUTPUT
 
       - name: Create Pull Request

.gitignore

@@ -22,8 +22,6 @@ dist-ssr
 *.local
 # Claude configuration
 .claude/*.local.json
-.claude/*.local.md
-.claude/*.local.txt
 CLAUDE.local.md
 
 # Editor directories and files
@@ -46,7 +44,6 @@ components.d.ts
 tests-ui/data/*
 tests-ui/ComfyUI_examples
 tests-ui/workflows/examples
-coverage/
 
 # Browser tests
 /test-results/
@@ -54,7 +51,6 @@ coverage/
 /blob-report/
 /playwright/.cache/
 browser_tests/**/*-win32.png
-browser_tests/local/
 
 .env
 
@@ -81,8 +77,8 @@ vite.config.mts.timestamp-*.mjs
 *storybook.log
 storybook-static
 
-# MCP Servers
-.playwright-mcp/*
+
+
 
 .nx/cache
 .nx/workspace-data

.i18nrc.cjs

@@ -9,7 +9,7 @@ module.exports = defineConfig({
   entry: 'src/locales/en',
   entryLocale: 'en',
   output: 'src/locales',
-  outputLocales: ['zh', 'zh-TW', 'ru', 'ja', 'ko', 'fr', 'es', 'ar', 'tr'],
+  outputLocales: ['zh', 'zh-TW', 'ru', 'ja', 'ko', 'fr', 'es', 'ar'],
   reference: `Special names to keep untranslated: flux, photomaker, clip, vae, cfg, stable audio, stable cascade, stable zero, controlnet, lora, HiDream.
   'latent' is the short form of 'latent space'.
   'mask' is in the context of image processing.

.npmrc

@@ -1 +0,0 @@
-ignore-workspace-root-check=true

.storybook/main.ts

@@ -15,32 +15,21 @@ const config: StorybookConfig = {
   async viteFinal(config) {
     // Use dynamic import to avoid CJS deprecation warning
     const { mergeConfig } = await import('vite')
-    const { default: tailwindcss } = await import('@tailwindcss/vite')
 
     // Filter out any plugins that might generate import maps
     if (config.plugins) {
-      config.plugins = config.plugins
-        // Type guard: ensure we have valid plugin objects with names
-        .filter(
-          (plugin): plugin is NonNullable<typeof plugin> & { name: string } => {
-            return (
-              plugin !== null &&
-              plugin !== undefined &&
-              typeof plugin === 'object' &&
-              'name' in plugin &&
-              typeof plugin.name === 'string'
-            )
-          }
-        )
-        // Business logic: filter out import-map plugins
-        .filter((plugin) => !plugin.name.includes('import-map'))
+      config.plugins = config.plugins.filter((plugin: any) => {
+        if (plugin && plugin.name && plugin.name.includes('import-map')) {
+          return false
+        }
+        return true
+      })
     }
 
     return mergeConfig(config, {
       // Replace plugins entirely to avoid inheritance issues
       plugins: [
         // Only include plugins we explicitly need for Storybook
-        tailwindcss(),
         Icons({
           compiler: 'vue3',
           customCollections: {

.storybook/preview-head.html

@@ -57,8 +57,9 @@
 
   /* Override Storybook's problematic & selector styles */
   /* Reset only the specific properties that Storybook injects */
-  li+li {
-    margin: 0;
-    padding: revert-layer;
+  #storybook-root li+li,
+  #storybook-docs li+li {
+    margin: inherit;
+    padding: inherit;
   }
 </style>

.storybook/preview.ts

@@ -1,7 +1,7 @@
 import { definePreset } from '@primevue/themes'
 import Aura from '@primevue/themes/aura'
 import { setup } from '@storybook/vue3'
-import type { Preview, StoryContext, StoryFn } from '@storybook/vue3-vite'
+import type { Preview } from '@storybook/vue3-vite'
 import { createPinia } from 'pinia'
 import 'primeicons/primeicons.css'
 import PrimeVue from 'primevue/config'
@@ -9,9 +9,11 @@ import ConfirmationService from 'primevue/confirmationservice'
 import ToastService from 'primevue/toastservice'
 import Tooltip from 'primevue/tooltip'
 
-import '@/assets/css/style.css'
-import { i18n } from '@/i18n'
-import '@/lib/litegraph/public/css/litegraph.css'
+import '../src/assets/css/style.css'
+import { i18n } from '../src/i18n'
+import '../src/lib/litegraph/public/css/litegraph.css'
+import { useWidgetStore } from '../src/stores/widgetStore'
+import { useColorPaletteStore } from '../src/stores/workspace/colorPaletteStore'
 
 const ComfyUIPreset = definePreset(Aura, {
   semantic: {
@@ -23,11 +25,13 @@ const ComfyUIPreset = definePreset(Aura, {
 // Setup Vue app for Storybook
 setup((app) => {
   app.directive('tooltip', Tooltip)
-
-  // Create Pinia instance
   const pinia = createPinia()
-
   app.use(pinia)
+
+  // Initialize stores
+  useColorPaletteStore(pinia)
+  useWidgetStore(pinia)
+
   app.use(i18n)
   app.use(PrimeVue, {
     theme: {
@@ -46,8 +50,8 @@ setup((app) => {
   app.use(ToastService)
 })
 
-// Theme and dialog decorator
-export const withTheme = (Story: StoryFn, context: StoryContext) => {
+// Dark theme decorator
+export const withTheme = (Story: any, context: any) => {
   const theme = context.globals.theme || 'light'
 
   // Apply theme class to document root
@@ -59,7 +63,7 @@ export const withTheme = (Story: StoryFn, context: StoryContext) => {
     document.body.classList.remove('dark-theme')
   }
 
-  return Story(context.args, context)
+  return Story()
 }
 
 const preview: Preview = {

CODEOWNERS

@@ -1,61 +1,17 @@
-# Desktop/Electron
-/src/types/desktop/                               @webfiltered
-/src/constants/desktopDialogs.ts                  @webfiltered
-/src/constants/desktopMaintenanceTasks.ts         @webfiltered
-/src/stores/electronDownloadStore.ts              @webfiltered
-/src/extensions/core/electronAdapter.ts           @webfiltered
-/src/views/DesktopDialogView.vue                  @webfiltered
-/src/components/install/                          @webfiltered
-/src/components/maintenance/                      @webfiltered
-/vite.electron.config.mts                         @webfiltered
+# Admins
+* @Comfy-Org/comfy_frontend_devs
 
-# Common UI Components
-/src/components/chip/                             @viva-jinyi
-/src/components/card/                             @viva-jinyi
-/src/components/button/                           @viva-jinyi
-/src/components/input/                            @viva-jinyi
+# Maintainers
+*.md @Comfy-Org/comfy_maintainer
+/tests-ui/ @Comfy-Org/comfy_maintainer
+/browser_tests/ @Comfy-Org/comfy_maintainer
+/.env_example @Comfy-Org/comfy_maintainer
 
-# Topbar
-/src/components/topbar/                           @pythongosssss
+# Translations (AIGODLIKE team + shinshin86)
+/src/locales/ @Yorha4D @KarryCharon @DorotaLuna @shinshin86 @Comfy-Org/comfy_maintainer
 
-# Thumbnail
-/src/renderer/core/thumbnail/                     @pythongosssss
+# Load 3D extension
+/src/extensions/core/load3d.ts @jtydhr88 @Comfy-Org/comfy_frontend_devs
 
-# Legacy UI
-/scripts/ui/                                      @pythongosssss
-
-# Link rendering
-/src/renderer/core/canvas/links/                  @benceruleanlu
-
-# Node help system
-/src/utils/nodeHelpUtil.ts                        @benceruleanlu
-/src/stores/workspace/nodeHelpStore.ts            @benceruleanlu
-/src/services/nodeHelpService.ts                  @benceruleanlu
-
-# Selection toolbox
-/src/components/graph/selectionToolbox/           @Myestery
-
-# Minimap
-/src/renderer/extensions/minimap/                 @jtydhr88
-
-# Assets
-/src/platform/assets/                             @arjansingh
-
-# Workflow Templates
-/src/platform/workflow/templates/                 @Myestery @christian-byrne @comfyui-wiki
-/src/components/templates/                        @Myestery @christian-byrne @comfyui-wiki
-
-# Mask Editor
-/src/extensions/core/maskeditor.ts                @trsommer @brucew4yn3rp
-/src/extensions/core/maskEditorLayerFilenames.ts  @trsommer @brucew4yn3rp
-/src/extensions/core/maskEditorOld.ts             @trsommer @brucew4yn3rp
-
-# 3D
-/src/extensions/core/load3d.ts                    @jtydhr88
-/src/components/load3d/                           @jtydhr88
-
-# Manager
-/src/workbench/extensions/manager/                @viva-jinyi @christian-byrne @ltdrdata
-
-# Translations
-/src/locales/                                     @Yorha4D @KarryCharon @shinshin86 @Comfy-Org/comfy_maintainer
+# Mask Editor extension
+/src/extensions/core/maskeditor.ts @brucew4yn3rp @trsommer @Comfy-Org/comfy_frontend_devs

browser_tests/README.md

@@ -16,14 +16,9 @@ Without this flag, parallel tests will conflict and fail randomly.
 
 ### ComfyUI devtools
 
-ComfyUI_devtools is now included in this repository under `tools/devtools/`. During CI/CD, these files are automatically copied to the `custom_nodes` directory.  
+Clone <https://github.com/Comfy-Org/ComfyUI_devtools> to your `custom_nodes` directory.  
 _ComfyUI_devtools adds additional API endpoints and nodes to ComfyUI for browser testing._
 
-For local development, copy the devtools files to your ComfyUI installation:
-```bash
-cp -r tools/devtools/* /path/to/your/ComfyUI/custom_nodes/ComfyUI_devtools/
-```
-
 ### Node.js & Playwright Prerequisites
 
 Ensure you have Node.js v20 or v22 installed. Then, set up the Chromium test driver:
@@ -56,6 +51,14 @@ TEST_COMFYUI_DIR=/path/to/your/ComfyUI
 
 ### Common Setup Issues
 
+**Most tests require the new menu system** - Add to your test:
+
+```typescript
+test.beforeEach(async ({ comfyPage }) => {
+  await comfyPage.setSetting('Comfy.UseNewMenu', 'Top')
+})
+```
+
 ### Release API Mocking
 
 By default, all tests mock the release API (`api.comfy.org/releases`) to prevent release notification popups from interfering with test execution. This is necessary because the release notifications can appear over UI elements and block test interactions.

browser_tests/assets/vueNodes/simple-triple.json

@@ -1 +0,0 @@
-{"id":"4412323e-2509-4258-8abc-68ddeea8f9e1","revision":0,"last_node_id":39,"last_link_id":29,"nodes":[{"id":37,"type":"KSampler","pos":[3635.923095703125,870.237548828125],"size":[428,437],"flags":{},"order":0,"mode":0,"inputs":[{"localized_name":"model","name":"model","type":"MODEL","link":null},{"localized_name":"positive","name":"positive","type":"CONDITIONING","link":null},{"localized_name":"negative","name":"negative","type":"CONDITIONING","link":null},{"localized_name":"latent_image","name":"latent_image","type":"LATENT","link":null},{"localized_name":"seed","name":"seed","type":"INT","widget":{"name":"seed"},"link":null},{"localized_name":"steps","name":"steps","type":"INT","widget":{"name":"steps"},"link":null},{"localized_name":"cfg","name":"cfg","type":"FLOAT","widget":{"name":"cfg"},"link":null},{"localized_name":"sampler_name","name":"sampler_name","type":"COMBO","widget":{"name":"sampler_name"},"link":null},{"localized_name":"scheduler","name":"scheduler","type":"COMBO","widget":{"name":"scheduler"},"link":null},{"localized_name":"denoise","name":"denoise","type":"FLOAT","widget":{"name":"denoise"},"link":null}],"outputs":[{"localized_name":"LATENT","name":"LATENT","type":"LATENT","links":null}],"properties":{"Node name for S&R":"KSampler"},"widgets_values":[0,"randomize",20,8,"euler","simple",1]},{"id":38,"type":"VAEDecode","pos":[4164.01611328125,925.5230712890625],"size":[193.25,107],"flags":{},"order":1,"mode":0,"inputs":[{"localized_name":"samples","name":"samples","type":"LATENT","link":null},{"localized_name":"vae","name":"vae","type":"VAE","link":null}],"outputs":[{"localized_name":"IMAGE","name":"IMAGE","type":"IMAGE","links":null}],"properties":{"Node name for S&R":"VAEDecode"}},{"id":39,"type":"CLIPTextEncode","pos":[3259.289794921875,927.2508544921875],"size":[239.9375,155],"flags":{},"order":2,"mode":0,"inputs":[{"localized_name":"clip","name":"clip","type":"CLIP","link":null},{"localized_name":"text","name":"text","type":"STRING","widget":{"name":"text"},"link":null}],"outputs":[{"localized_name":"CONDITIONING","name":"CONDITIONING","type":"CONDITIONING","links":null}],"properties":{"Node name for S&R":"CLIPTextEncode"},"widgets_values":[""]}],"links":[],"groups":[],"config":{},"extra":{"ds":{"scale":1.1576250000000001,"offset":[-2808.366467322067,-478.34316506594797]}},"version":0.4}

browser_tests/fixtures/ComfyPage.ts

@@ -5,14 +5,13 @@ import dotenv from 'dotenv'
 import * as fs from 'fs'
 
 import type { LGraphNode } from '../../src/lib/litegraph/src/litegraph'
-import type { NodeId } from '../../src/platform/workflow/validation/schemas/workflowSchema'
+import type { NodeId } from '../../src/schemas/comfyWorkflowSchema'
 import type { KeyCombo } from '../../src/schemas/keyBindingSchema'
 import type { useWorkspaceStore } from '../../src/stores/workspaceStore'
 import { NodeBadgeMode } from '../../src/types/nodeSource'
 import { ComfyActionbar } from '../helpers/actionbar'
 import { ComfyTemplates } from '../helpers/templates'
 import { ComfyMouse } from './ComfyMouse'
-import { VueNodeHelpers } from './VueNodeHelpers'
 import { ComfyNodeSearchBox } from './components/ComfyNodeSearchBox'
 import { SettingDialog } from './components/SettingDialog'
 import {
@@ -145,7 +144,6 @@ export class ComfyPage {
   public readonly templates: ComfyTemplates
   public readonly settingDialog: SettingDialog
   public readonly confirmDialog: ConfirmDialog
-  public readonly vueNodes: VueNodeHelpers
 
   /** Worker index to test user ID */
   public readonly userIds: string[] = []
@@ -174,7 +172,6 @@ export class ComfyPage {
     this.templates = new ComfyTemplates(page)
     this.settingDialog = new SettingDialog(page, this)
     this.confirmDialog = new ConfirmDialog(page)
-    this.vueNodes = new VueNodeHelpers(page)
   }
 
   convertLeafToContent(structure: FolderStructure): FolderStructure {
@@ -1424,7 +1421,7 @@ export class ComfyPage {
   }
 
   async closeDialog() {
-    await this.page.locator('.p-dialog-close-button').click({ force: true })
+    await this.page.locator('.p-dialog-close-button').click()
     await expect(this.page.locator('.p-dialog')).toBeHidden()
   }
 
@@ -1643,7 +1640,7 @@ export const comfyPageFixture = base.extend<{
 
     try {
       await comfyPage.setupSettings({
-        'Comfy.UseNewMenu': 'Top',
+        'Comfy.UseNewMenu': 'Disabled',
         // Hide canvas menu/info/selection toolbox by default.
         'Comfy.Graph.CanvasInfo': false,
         'Comfy.Graph.CanvasMenu': false,

browser_tests/fixtures/UserSelectPage.ts

@@ -1,5 +1,4 @@
-import type { Page } from '@playwright/test'
-import { test as base } from '@playwright/test'
+import { Page, test as base } from '@playwright/test'
 
 export class UserSelectPage {
   constructor(

browser_tests/fixtures/VueNodeHelpers.ts

@@ -1,117 +0,0 @@
-/**
- * Vue Node Test Helpers
- */
-import type { Locator, Page } from '@playwright/test'
-
-export class VueNodeHelpers {
-  constructor(private page: Page) {}
-
-  /**
-   * Get locator for all Vue node components in the DOM
-   */
-  get nodes(): Locator {
-    return this.page.locator('[data-node-id]')
-  }
-
-  /**
-   * Get locator for selected Vue node components (using visual selection indicators)
-   */
-  get selectedNodes(): Locator {
-    return this.page.locator(
-      '[data-node-id].outline-black, [data-node-id].outline-white'
-    )
-  }
-
-  /**
-   * Get locator for a Vue node by the node's title (displayed name in the header)
-   */
-  getNodeByTitle(title: string): Locator {
-    return this.page.locator(`[data-node-id]`).filter({ hasText: title })
-  }
-
-  /**
-   * Get total count of Vue nodes in the DOM
-   */
-  async getNodeCount(): Promise<number> {
-    return await this.nodes.count()
-  }
-
-  /**
-   * Get count of selected Vue nodes
-   */
-  async getSelectedNodeCount(): Promise<number> {
-    return await this.selectedNodes.count()
-  }
-
-  /**
-   * Get all Vue node IDs currently in the DOM
-   */
-  async getNodeIds(): Promise<string[]> {
-    return await this.nodes.evaluateAll((nodes) =>
-      nodes
-        .map((n) => n.getAttribute('data-node-id'))
-        .filter((id): id is string => id !== null)
-    )
-  }
-
-  /**
-   * Select a specific Vue node by ID
-   */
-  async selectNode(nodeId: string): Promise<void> {
-    await this.page.locator(`[data-node-id="${nodeId}"]`).click()
-  }
-
-  /**
-   * Select multiple Vue nodes by IDs using Ctrl+click
-   */
-  async selectNodes(nodeIds: string[]): Promise<void> {
-    if (nodeIds.length === 0) return
-
-    // Select first node normally
-    await this.selectNode(nodeIds[0])
-
-    // Add additional nodes with Ctrl+click
-    for (let i = 1; i < nodeIds.length; i++) {
-      await this.page.locator(`[data-node-id="${nodeIds[i]}"]`).click({
-        modifiers: ['Control']
-      })
-    }
-  }
-
-  /**
-   * Clear all selections by clicking empty space
-   */
-  async clearSelection(): Promise<void> {
-    await this.page.mouse.click(50, 50)
-  }
-
-  /**
-   * Delete selected Vue nodes using Delete key
-   */
-  async deleteSelected(): Promise<void> {
-    await this.page.locator('#graph-canvas').focus()
-    await this.page.keyboard.press('Delete')
-  }
-
-  /**
-   * Delete selected Vue nodes using Backspace key
-   */
-  async deleteSelectedWithBackspace(): Promise<void> {
-    await this.page.locator('#graph-canvas').focus()
-    await this.page.keyboard.press('Backspace')
-  }
-
-  /**
-   * Wait for Vue nodes to be rendered
-   */
-  async waitForNodes(expectedCount?: number): Promise<void> {
-    if (expectedCount !== undefined) {
-      await this.page.waitForFunction(
-        (count) => document.querySelectorAll('[data-node-id]').length >= count,
-        expectedCount
-      )
-    } else {
-      await this.page.waitForSelector('[data-node-id]')
-    }
-  }
-}

browser_tests/fixtures/components/ComfyNodeSearchBox.ts

@@ -1,4 +1,4 @@
-import type { Locator, Page } from '@playwright/test'
+import { Locator, Page } from '@playwright/test'
 
 export class ComfyNodeSearchFilterSelectionPanel {
   constructor(public readonly page: Page) {}

browser_tests/fixtures/components/SettingDialog.ts

@@ -1,6 +1,6 @@
-import type { Page } from '@playwright/test'
+import { Page } from '@playwright/test'
 
-import type { ComfyPage } from '../ComfyPage'
+import { ComfyPage } from '../ComfyPage'
 
 export class SettingDialog {
   constructor(

browser_tests/fixtures/components/SidebarTab.ts

@@ -1,4 +1,4 @@
-import type { Locator, Page } from '@playwright/test'
+import { Locator, Page } from '@playwright/test'
 
 class SidebarTab {
   constructor(

browser_tests/fixtures/components/Topbar.ts

@@ -1,5 +1,4 @@
-import type { Locator, Page } from '@playwright/test'
-import { expect } from '@playwright/test'
+import { Locator, Page, expect } from '@playwright/test'
 
 export class Topbar {
   private readonly menuLocator: Locator

browser_tests/fixtures/utils/litegraphUtils.ts

@@ -1,6 +1,6 @@
 import type { Page } from '@playwright/test'
 
-import type { NodeId } from '../../../src/platform/workflow/validation/schemas/workflowSchema'
+import type { NodeId } from '../../../src/schemas/comfyWorkflowSchema'
 import { ManageGroupNode } from '../../helpers/manageGroupNode'
 import type { ComfyPage } from '../ComfyPage'
 import type { Position, Size } from '../types'

browser_tests/fixtures/ws.ts

@@ -12,10 +12,9 @@ export const webSocketFixture = base.extend<{
           // so we can look it up to trigger messages
           const store: Record<string, WebSocket> = ((window as any).__ws__ = {})
           window.WebSocket = class extends window.WebSocket {
-            constructor(
-              ...rest: ConstructorParameters<typeof window.WebSocket>
-            ) {
-              super(...rest)
+            constructor() {
+              // @ts-expect-error
+              super(...arguments)
               store[this.url] = this
             }
           }

browser_tests/globalSetup.ts

@@ -1,4 +1,4 @@
-import type { FullConfig } from '@playwright/test'
+import { FullConfig } from '@playwright/test'
 import dotenv from 'dotenv'
 
 import { backupPath } from './utils/backupUtils'

browser_tests/globalTeardown.ts

@@ -1,4 +1,4 @@
-import type { FullConfig } from '@playwright/test'
+import { FullConfig } from '@playwright/test'
 import dotenv from 'dotenv'
 
 import { restorePath } from './utils/backupUtils'

browser_tests/helpers/fitToView.ts

@@ -1,104 +0,0 @@
-import type { ReadOnlyRect } from '../../src/lib/litegraph/src/interfaces'
-import type { ComfyPage } from '../fixtures/ComfyPage'
-
-interface FitToViewOptions {
-  selectionOnly?: boolean
-  zoom?: number
-  padding?: number
-}
-
-/**
- * Instantly fits the canvas view to graph content without waiting for UI animation.
- *
- * Lives outside the shared fixture to keep the default ComfyPage interactions user-oriented.
- */
-export async function fitToViewInstant(
-  comfyPage: ComfyPage,
-  options: FitToViewOptions = {}
-) {
-  const { selectionOnly = false, zoom = 0.75, padding = 10 } = options
-
-  const rectangles = await comfyPage.page.evaluate<
-    ReadOnlyRect[] | null,
-    { selectionOnly: boolean }
-  >(
-    ({ selectionOnly }) => {
-      const app = window['app']
-      if (!app?.canvas) return null
-
-      const canvas = app.canvas
-      const items = (() => {
-        if (selectionOnly && canvas.selectedItems?.size) {
-          return Array.from(canvas.selectedItems)
-        }
-        try {
-          return Array.from(canvas.positionableItems ?? [])
-        } catch {
-          return []
-        }
-      })()
-
-      if (!items.length) return null
-
-      const rects: ReadOnlyRect[] = []
-
-      for (const item of items) {
-        const rect = item?.boundingRect
-        if (!rect) continue
-
-        const x = Number(rect[0])
-        const y = Number(rect[1])
-        const width = Number(rect[2])
-        const height = Number(rect[3])
-
-        rects.push([x, y, width, height] as const)
-      }
-
-      return rects.length ? rects : null
-    },
-    { selectionOnly }
-  )
-
-  if (!rectangles || rectangles.length === 0) return
-
-  let minX = Infinity
-  let minY = Infinity
-  let maxX = -Infinity
-  let maxY = -Infinity
-
-  for (const [x, y, width, height] of rectangles) {
-    minX = Math.min(minX, Number(x))
-    minY = Math.min(minY, Number(y))
-    maxX = Math.max(maxX, Number(x) + Number(width))
-    maxY = Math.max(maxY, Number(y) + Number(height))
-  }
-
-  const hasFiniteBounds =
-    Number.isFinite(minX) &&
-    Number.isFinite(minY) &&
-    Number.isFinite(maxX) &&
-    Number.isFinite(maxY)
-
-  if (!hasFiniteBounds) return
-
-  const bounds: ReadOnlyRect = [
-    minX - padding,
-    minY - padding,
-    maxX - minX + 2 * padding,
-    maxY - minY + 2 * padding
-  ]
-
-  await comfyPage.page.evaluate(
-    ({ bounds, zoom }) => {
-      const app = window['app']
-      if (!app?.canvas) return
-
-      const canvas = app.canvas
-      canvas.ds.fitToBounds(bounds, { zoom })
-      canvas.setDirty(true, true)
-    },
-    { bounds, zoom }
-  )
-
-  await comfyPage.nextFrame()
-}

browser_tests/helpers/manageGroupNode.ts

@@ -1,4 +1,4 @@
-import type { Locator, Page } from '@playwright/test'
+import { Locator, Page } from '@playwright/test'
 
 export class ManageGroupNode {
   footer: Locator

browser_tests/helpers/templates.ts

@@ -1,10 +1,10 @@
-import type { Locator, Page } from '@playwright/test'
+import { Locator, Page } from '@playwright/test'
 import path from 'path'
 
-import type {
+import {
   TemplateInfo,
   WorkflowTemplates
-} from '../../src/platform/workflow/templates/types/template'
+} from '../../src/types/workflowTemplateTypes'
 
 export class ComfyTemplates {
   readonly content: Locator

browser_tests/tests/actionbar.spec.ts

@@ -29,9 +29,9 @@ test.describe('Actionbar', () => {
 
     // Intercept the prompt queue endpoint
     let promptNumber = 0
-    await comfyPage.page.route('**/api/prompt', async (route, req) => {
+    comfyPage.page.route('**/api/prompt', async (route, req) => {
       await new Promise((r) => setTimeout(r, 100))
-      await route.fulfill({
+      route.fulfill({
         status: 200,
         body: JSON.stringify({
           prompt_id: promptNumber,

browser_tests/tests/backgroundImageUpload.spec.ts

@@ -2,10 +2,6 @@ import { expect } from '@playwright/test'
 
 import { comfyPageFixture as test } from '../fixtures/ComfyPage'
 
-test.beforeEach(async ({ comfyPage }) => {
-  await comfyPage.setSetting('Comfy.UseNewMenu', 'Disabled')
-})
-
 test.describe('Background Image Upload', () => {
   test.beforeEach(async ({ comfyPage }) => {
     // Reset the background image setting before each test

browser_tests/tests/changeTracker.spec.ts

@@ -1,5 +1,5 @@
-import type { ComfyPage } from '../fixtures/ComfyPage'
 import {
+  ComfyPage,
   comfyExpect as expect,
   comfyPageFixture as test
 } from '../fixtures/ComfyPage'
@@ -15,10 +15,6 @@ async function afterChange(comfyPage: ComfyPage) {
   })
 }
 
-test.beforeEach(async ({ comfyPage }) => {
-  await comfyPage.setSetting('Comfy.UseNewMenu', 'Disabled')
-})
-
 test.describe('Change Tracker', () => {
   test.describe('Undo/Redo', () => {
     test.beforeEach(async ({ comfyPage }) => {

browser_tests/tests/chatHistory.spec.ts

@@ -1,12 +1,7 @@
-import type { Page } from '@playwright/test'
-import { expect } from '@playwright/test'
+import { Page, expect } from '@playwright/test'
 
 import { comfyPageFixture as test } from '../fixtures/ComfyPage'
 
-test.beforeEach(async ({ comfyPage }) => {
-  await comfyPage.setSetting('Comfy.UseNewMenu', 'Disabled')
-})
-
 interface ChatHistoryEntry {
   prompt: string
   response: string

browser_tests/tests/colorPalette.spec.ts

@@ -3,10 +3,6 @@ import { expect } from '@playwright/test'
 import type { Palette } from '../../src/schemas/colorPaletteSchema'
 import { comfyPageFixture as test } from '../fixtures/ComfyPage'
 
-test.beforeEach(async ({ comfyPage }) => {
-  await comfyPage.setSetting('Comfy.UseNewMenu', 'Disabled')
-})
-
 const customColorPalettes: Record<string, Palette> = {
   obsidian: {
     version: 102,

browser_tests/tests/commands.spec.ts

@@ -2,10 +2,6 @@ import { expect } from '@playwright/test'
 
 import { comfyPageFixture as test } from '../fixtures/ComfyPage'
 
-test.beforeEach(async ({ comfyPage }) => {
-  await comfyPage.setSetting('Comfy.UseNewMenu', 'Disabled')
-})
-
 test.describe('Keybindings', () => {
   test('Should execute command', async ({ comfyPage }) => {
     await comfyPage.registerCommand('TestCommand', () => {

browser_tests/tests/copyPaste.spec.ts

@@ -2,10 +2,6 @@ import { expect } from '@playwright/test'
 
 import { comfyPageFixture as test } from '../fixtures/ComfyPage'
 
-test.beforeEach(async ({ comfyPage }) => {
-  await comfyPage.setSetting('Comfy.UseNewMenu', 'Disabled')
-})
-
 test.describe('Copy Paste', () => {
   test('Can copy and paste node', async ({ comfyPage }) => {
     await comfyPage.clickEmptyLatentNode()

browser_tests/tests/dialog.spec.ts

@@ -1,13 +1,8 @@
-import type { Locator } from '@playwright/test'
-import { expect } from '@playwright/test'
+import { Locator, expect } from '@playwright/test'
 
 import type { Keybinding } from '../../src/schemas/keyBindingSchema'
 import { comfyPageFixture as test } from '../fixtures/ComfyPage'
 
-test.beforeEach(async ({ comfyPage }) => {
-  await comfyPage.setSetting('Comfy.UseNewMenu', 'Disabled')
-})
-
 test.describe('Load workflow warning', () => {
   test('Should display a warning when loading a workflow with missing nodes', async ({
     comfyPage
@@ -41,10 +36,6 @@ test('Does not report warning on undo/redo', async ({ comfyPage }) => {
   await comfyPage.loadWorkflow('missing/missing_nodes')
   await comfyPage.closeDialog()
 
-  // Wait for any async operations to complete after dialog closes
-  await comfyPage.nextFrame()
-  await comfyPage.page.waitForTimeout(100)
-
   // Make a change to the graph
   await comfyPage.doubleClickCanvas()
   await comfyPage.searchBox.fillAndSelectFirstNode('KSampler')

browser_tests/tests/domWidget.spec.ts

@@ -2,10 +2,6 @@ import { expect } from '@playwright/test'
 
 import { comfyPageFixture as test } from '../fixtures/ComfyPage'
 
-test.beforeEach(async ({ comfyPage }) => {
-  await comfyPage.setSetting('Comfy.UseNewMenu', 'Disabled')
-})
-
 test.describe('DOM Widget', () => {
   test('Collapsed multiline textarea is not visible', async ({ comfyPage }) => {
     await comfyPage.loadWorkflow('widgets/collapsed_multiline')

browser_tests/tests/execution.spec.ts

@@ -2,10 +2,6 @@ import { expect } from '@playwright/test'
 
 import { comfyPageFixture as test } from '../fixtures/ComfyPage'
 
-test.beforeEach(async ({ comfyPage }) => {
-  await comfyPage.setSetting('Comfy.UseNewMenu', 'Disabled')
-})
-
 test.describe('Execution', () => {
   test('Report error on unconnected slot', async ({ comfyPage }) => {
     await comfyPage.disconnectEdge()

browser_tests/tests/extensionAPI.spec.ts

@@ -1,6 +1,6 @@
 import { expect } from '@playwright/test'
 
-import type { SettingParams } from '../../src/platform/settings/types'
+import { SettingParams } from '../../src/types/settingTypes'
 import { comfyPageFixture as test } from '../fixtures/ComfyPage'
 
 test.describe('Topbar commands', () => {
@@ -247,7 +247,7 @@ test.describe('Topbar commands', () => {
   test.describe('Dialog', () => {
     test('Should allow showing a prompt dialog', async ({ comfyPage }) => {
       await comfyPage.page.evaluate(() => {
-        void window['app'].extensionManager.dialog
+        window['app'].extensionManager.dialog
           .prompt({
             title: 'Test Prompt',
             message: 'Test Prompt Message'
@@ -267,7 +267,7 @@ test.describe('Topbar commands', () => {
       comfyPage
     }) => {
       await comfyPage.page.evaluate(() => {
-        void window['app'].extensionManager.dialog
+        window['app'].extensionManager.dialog
           .confirm({
             title: 'Test Confirm',
             message: 'Test Confirm Message'
@@ -284,7 +284,7 @@ test.describe('Topbar commands', () => {
     test('Should allow dismissing a dialog', async ({ comfyPage }) => {
       await comfyPage.page.evaluate(() => {
         window['value'] = 'foo'
-        void window['app'].extensionManager.dialog
+        window['app'].extensionManager.dialog
           .confirm({
             title: 'Test Confirm',
             message: 'Test Confirm Message'

browser_tests/tests/featureFlags.spec.ts

@@ -2,10 +2,6 @@ import { expect } from '@playwright/test'
 
 import { comfyPageFixture as test } from '../fixtures/ComfyPage'
 
-test.beforeEach(async ({ comfyPage }) => {
-  await comfyPage.setSetting('Comfy.UseNewMenu', 'Disabled')
-})
-
 test.describe('Feature Flags', () => {
   test('Client and server exchange feature flags on connection', async ({
     comfyPage

browser_tests/tests/graph.spec.ts

@@ -2,10 +2,6 @@ import { expect } from '@playwright/test'
 
 import { comfyPageFixture as test } from '../fixtures/ComfyPage'
 
-test.beforeEach(async ({ comfyPage }) => {
-  await comfyPage.setSetting('Comfy.UseNewMenu', 'Disabled')
-})
-
 test.describe('Graph', () => {
   // Should be able to fix link input slot index after swap the input order
   // Ref: https://github.com/Comfy-Org/ComfyUI_frontend/issues/3348

browser_tests/tests/graphCanvasMenu.spec.ts

@@ -2,10 +2,6 @@ import { expect } from '@playwright/test'
 
 import { comfyPageFixture as test } from '../fixtures/ComfyPage'
 
-test.beforeEach(async ({ comfyPage }) => {
-  await comfyPage.setSetting('Comfy.UseNewMenu', 'Disabled')
-})
-
 test.describe('Graph Canvas Menu', () => {
   test.beforeEach(async ({ comfyPage }) => {
     // Set link render mode to spline to make sure it's not affected by other tests'

browser_tests/tests/groupNode.spec.ts

@@ -1,13 +1,8 @@
 import { expect } from '@playwright/test'
 
-import type { ComfyPage } from '../fixtures/ComfyPage'
-import { comfyPageFixture as test } from '../fixtures/ComfyPage'
+import { ComfyPage, comfyPageFixture as test } from '../fixtures/ComfyPage'
 import type { NodeReference } from '../fixtures/utils/litegraphUtils'
 
-test.beforeEach(async ({ comfyPage }) => {
-  await comfyPage.setSetting('Comfy.UseNewMenu', 'Disabled')
-})
-
 test.describe('Group Node', () => {
   test.describe('Node library sidebar', () => {
     const groupNodeName = 'DefautWorkflowGroupNode'

browser_tests/tests/interaction.spec.ts

@@ -1,17 +1,12 @@
-import type { Locator } from '@playwright/test'
-import { expect } from '@playwright/test'
-import type { Position } from '@vueuse/core'
+import { Locator, expect } from '@playwright/test'
+import { Position } from '@vueuse/core'
 
 import {
   type ComfyPage,
   comfyPageFixture as test,
   testComfySnapToGridGridSize
 } from '../fixtures/ComfyPage'
-import type { NodeReference } from '../fixtures/utils/litegraphUtils'
-
-test.beforeEach(async ({ comfyPage }) => {
-  await comfyPage.setSetting('Comfy.UseNewMenu', 'Disabled')
-})
+import { type NodeReference } from '../fixtures/utils/litegraphUtils'
 
 test.describe('Item Interaction', () => {
   test('Can select/delete all items', async ({ comfyPage }) => {
@@ -1017,8 +1012,6 @@ test.describe('Canvas Navigation', () => {
   test('Shift + mouse wheel should pan canvas horizontally', async ({
     comfyPage
   }) => {
-    await comfyPage.setSetting('Comfy.Canvas.MouseWheelScroll', 'panning')
-
     await comfyPage.page.click('canvas')
     await comfyPage.nextFrame()
 

browser_tests/tests/keybindings.spec.ts

@@ -2,10 +2,6 @@ import { expect } from '@playwright/test'
 
 import { comfyPageFixture as test } from '../fixtures/ComfyPage'
 
-test.beforeEach(async ({ comfyPage }) => {
-  await comfyPage.setSetting('Comfy.UseNewMenu', 'Disabled')
-})
-
 test.describe('Keybindings', () => {
   test('Should not trigger non-modifier keybinding when typing in input fields', async ({
     comfyPage

browser_tests/tests/litegraphEvent.spec.ts

@@ -2,10 +2,6 @@ import { expect } from '@playwright/test'
 
 import { comfyPageFixture as test } from '../fixtures/ComfyPage'
 
-test.beforeEach(async ({ comfyPage }) => {
-  await comfyPage.setSetting('Comfy.UseNewMenu', 'Disabled')
-})
-
 function listenForEvent(): Promise<Event> {
   return new Promise<Event>((resolve) => {
     document.addEventListener('litegraph:canvas', (e) => resolve(e), {

browser_tests/tests/loadWorkflowInMedia.spec.ts

@@ -2,10 +2,6 @@ import { expect } from '@playwright/test'
 
 import { comfyPageFixture as test } from '../fixtures/ComfyPage'
 
-test.beforeEach(async ({ comfyPage }) => {
-  await comfyPage.setSetting('Comfy.UseNewMenu', 'Disabled')
-})
-
 test.describe('Load Workflow in Media', () => {
   const fileNames = [
     'workflow.webp',

browser_tests/tests/lodThreshold.spec.ts

@@ -2,10 +2,6 @@ import { expect } from '@playwright/test'
 
 import { comfyPageFixture as test } from '../fixtures/ComfyPage'
 
-test.beforeEach(async ({ comfyPage }) => {
-  await comfyPage.setSetting('Comfy.UseNewMenu', 'Disabled')
-})
-
 test.describe('LOD Threshold', () => {
   test('Should switch to low quality mode at correct zoom threshold', async ({
     comfyPage

browser_tests/tests/nodeBadge.spec.ts

@@ -4,10 +4,6 @@ import type { ComfyApp } from '../../src/scripts/app'
 import { NodeBadgeMode } from '../../src/types/nodeSource'
 import { comfyPageFixture as test } from '../fixtures/ComfyPage'
 
-test.beforeEach(async ({ comfyPage }) => {
-  await comfyPage.setSetting('Comfy.UseNewMenu', 'Disabled')
-})
-
 test.describe('Node Badge', () => {
   test('Can add badge', async ({ comfyPage }) => {
     await comfyPage.page.evaluate(() => {

browser_tests/tests/nodeDisplay.spec.ts

@@ -2,10 +2,6 @@ import { expect } from '@playwright/test'
 
 import { comfyPageFixture as test } from '../fixtures/ComfyPage'
 
-test.beforeEach(async ({ comfyPage }) => {
-  await comfyPage.setSetting('Comfy.UseNewMenu', 'Disabled')
-})
-
 // If an input is optional by node definition, it should be shown as
 // a hollow circle no matter what shape it was defined in the workflow JSON.
 test.describe('Optional input', () => {

browser_tests/tests/nodeHelp.spec.ts

@@ -46,7 +46,7 @@ test.describe('Node Help', () => {
 
       // Click the help button in the selection toolbox
       const helpButton = comfyPage.selectionToolbox.locator(
-        'button[data-testid="info-button"]'
+        'button:has(.pi-question-circle)'
       )
       await expect(helpButton).toBeVisible()
       await helpButton.click()
@@ -164,7 +164,7 @@ test.describe('Node Help', () => {
 
       // Click help button
       const helpButton = comfyPage.page.locator(
-        '.selection-toolbox button[data-testid="info-button"]'
+        '.selection-toolbox button:has(.pi-question-circle)'
       )
       await helpButton.click()
 
@@ -194,7 +194,7 @@ test.describe('Node Help', () => {
 
       // Click help button
       const helpButton = comfyPage.page.locator(
-        '.selection-toolbox button[data-testid="info-button"]'
+        '.selection-toolbox button:has(.pi-question-circle)'
       )
       await helpButton.click()
 
@@ -228,7 +228,7 @@ test.describe('Node Help', () => {
       await selectNodeWithPan(comfyPage, ksamplerNodes[0])
 
       const helpButton = comfyPage.page.locator(
-        '.selection-toolbox button[data-testid="info-button"]'
+        '.selection-toolbox button:has(.pi-question-circle)'
       )
       await helpButton.click()
 
@@ -276,7 +276,7 @@ test.describe('Node Help', () => {
       await selectNodeWithPan(comfyPage, ksamplerNodes[0])
 
       const helpButton = comfyPage.page.locator(
-        '.selection-toolbox button[data-testid="info-button"]'
+        '.selection-toolbox button:has(.pi-question-circle)'
       )
       await helpButton.click()
 
@@ -348,7 +348,7 @@ This is documentation for a custom node.
       }
 
       const helpButton = comfyPage.page.locator(
-        '.selection-toolbox button[data-testid="info-button"]'
+        '.selection-toolbox button:has(.pi-question-circle)'
       )
       if (await helpButton.isVisible()) {
         await helpButton.click()
@@ -389,7 +389,7 @@ This is documentation for a custom node.
       await selectNodeWithPan(comfyPage, ksamplerNodes[0])
 
       const helpButton = comfyPage.page.locator(
-        '.selection-toolbox button[data-testid="info-button"]'
+        '.selection-toolbox button:has(.pi-question-circle)'
       )
       await helpButton.click()
 
@@ -456,7 +456,7 @@ This is English documentation.
       await selectNodeWithPan(comfyPage, ksamplerNodes[0])
 
       const helpButton = comfyPage.page.locator(
-        '.selection-toolbox button[data-testid="info-button"]'
+        '.selection-toolbox button:has(.pi-question-circle)'
       )
       await helpButton.click()
 
@@ -479,7 +479,7 @@ This is English documentation.
       await selectNodeWithPan(comfyPage, ksamplerNodes[0])
 
       const helpButton = comfyPage.page.locator(
-        '.selection-toolbox button[data-testid="info-button"]'
+        '.selection-toolbox button:has(.pi-question-circle)'
       )
       await helpButton.click()
 
@@ -522,7 +522,7 @@ This is English documentation.
       await selectNodeWithPan(comfyPage, ksamplerNodes[0])
 
       const helpButton = comfyPage.page.locator(
-        '.selection-toolbox button[data-testid="info-button"]'
+        '.selection-toolbox button:has(.pi-question-circle)'
       )
       await helpButton.click()
 
@@ -538,7 +538,7 @@ This is English documentation.
 
       // Click help button again
       const helpButton2 = comfyPage.page.locator(
-        '.selection-toolbox button[data-testid="info-button"]'
+        '.selection-toolbox button:has(.pi-question-circle)'
       )
       await helpButton2.click()
 

browser_tests/tests/nodeSearchBox.spec.ts

@@ -3,10 +3,6 @@ import {
   comfyPageFixture as test
 } from '../fixtures/ComfyPage'
 
-test.beforeEach(async ({ comfyPage }) => {
-  await comfyPage.setSetting('Comfy.UseNewMenu', 'Disabled')
-})
-
 test.describe('Node search box', () => {
   test.beforeEach(async ({ comfyPage }) => {
     await comfyPage.setSetting('Comfy.LinkRelease.Action', 'search box')

browser_tests/tests/noteNode.spec.ts

@@ -2,10 +2,6 @@ import { expect } from '@playwright/test'
 
 import { comfyPageFixture as test } from '../fixtures/ComfyPage'
 
-test.beforeEach(async ({ comfyPage }) => {
-  await comfyPage.setSetting('Comfy.UseNewMenu', 'Disabled')
-})
-
 test.describe('Note Node', () => {
   test('Can load node nodes', async ({ comfyPage }) => {
     await comfyPage.loadWorkflow('nodes/note_nodes')

browser_tests/tests/primitiveNode.spec.ts

@@ -3,10 +3,6 @@ import { expect } from '@playwright/test'
 import { comfyPageFixture as test } from '../fixtures/ComfyPage'
 import type { NodeReference } from '../fixtures/utils/litegraphUtils'
 
-test.beforeEach(async ({ comfyPage }) => {
-  await comfyPage.setSetting('Comfy.UseNewMenu', 'Disabled')
-})
-
 test.describe('Primitive Node', () => {
   test('Can load with correct size', async ({ comfyPage }) => {
     await comfyPage.loadWorkflow('primitive/primitive_node')

browser_tests/tests/remoteWidgets.spec.ts

@@ -1,7 +1,6 @@
 import { expect } from '@playwright/test'
 
-import type { ComfyPage } from '../fixtures/ComfyPage'
-import { comfyPageFixture as test } from '../fixtures/ComfyPage'
+import { ComfyPage, comfyPageFixture as test } from '../fixtures/ComfyPage'
 
 test.describe('Remote COMBO Widget', () => {
   const mockOptions = ['d', 'c', 'b', 'a']
@@ -191,9 +190,7 @@ test.describe('Remote COMBO Widget', () => {
       await comfyPage.page.keyboard.press('Control+A')
 
       await expect(
-        comfyPage.page.locator(
-          '.selection-toolbox button[data-testid="refresh-button"]'
-        )
+        comfyPage.page.locator('.selection-toolbox .pi-refresh')
       ).toBeVisible()
     })
 

browser_tests/tests/rerouteNode.spec.ts

@@ -40,7 +40,6 @@ test.describe('Reroute Node', () => {
 
 test.describe('LiteGraph Native Reroute Node', () => {
   test.beforeEach(async ({ comfyPage }) => {
-    await comfyPage.setSetting('Comfy.UseNewMenu', 'Disabled')
     await comfyPage.setSetting('LiteGraph.Reroute.SplineOffset', 80)
   })
 

browser_tests/tests/rightClickMenu.spec.ts

@@ -3,10 +3,6 @@ import { expect } from '@playwright/test'
 import { NodeBadgeMode } from '../../src/types/nodeSource'
 import { comfyPageFixture as test } from '../fixtures/ComfyPage'
 
-test.beforeEach(async ({ comfyPage }) => {
-  await comfyPage.setSetting('Comfy.UseNewMenu', 'Disabled')
-})
-
 test.describe('Canvas Right Click Menu', () => {
   test('Can add node', async ({ comfyPage }) => {
     await comfyPage.rightClickCanvas()

browser_tests/tests/selectionToolbox.spec.ts

@@ -4,9 +4,6 @@ import { comfyPageFixture } from '../fixtures/ComfyPage'
 
 const test = comfyPageFixture
 
-test.beforeEach(async ({ comfyPage }) => {
-  await comfyPage.setSetting('Comfy.UseNewMenu', 'Disabled')
-})
 const BLUE_COLOR = 'rgb(51, 51, 85)'
 const RED_COLOR = 'rgb(85, 51, 51)'
 
@@ -152,7 +149,7 @@ test.describe('Selection Toolbox', () => {
       // Node should have the selected color class/style
       // Note: Exact verification method depends on how color is applied to nodes
       const selectedNode = (await comfyPage.getNodeRefsByTitle('KSampler'))[0]
-      expect(await selectedNode.getProperty('color')).not.toBeNull()
+      expect(selectedNode.getProperty('color')).not.toBeNull()
     })
 
     test('color picker shows current color of selected nodes', async ({

browser_tests/tests/selectionToolboxSubmenus.spec.ts

@@ -1,181 +0,0 @@
-import { expect } from '@playwright/test'
-
-import { comfyPageFixture as test } from '../fixtures/ComfyPage'
-
-test.beforeEach(async ({ comfyPage }) => {
-  await comfyPage.setSetting('Comfy.UseNewMenu', 'Disabled')
-})
-
-test.describe('Selection Toolbox - More Options Submenus', () => {
-  test.beforeEach(async ({ comfyPage }) => {
-    await comfyPage.setSetting('Comfy.Canvas.SelectionToolbox', true)
-    await comfyPage.loadWorkflow('nodes/single_ksampler')
-    await comfyPage.nextFrame()
-    await comfyPage.selectNodes(['KSampler'])
-    await comfyPage.nextFrame()
-  })
-
-  const openMoreOptions = async (comfyPage: any) => {
-    const ksamplerNodes = await comfyPage.getNodeRefsByTitle('KSampler')
-    if (ksamplerNodes.length === 0) {
-      throw new Error('No KSampler nodes found')
-    }
-
-    // Drag the KSampler to the center of the screen
-    const nodePos = await ksamplerNodes[0].getPosition()
-    const viewportSize = comfyPage.page.viewportSize()
-    const centerX = viewportSize.width / 3
-    const centerY = viewportSize.height / 2
-    await comfyPage.dragAndDrop(
-      { x: nodePos.x, y: nodePos.y },
-      { x: centerX, y: centerY }
-    )
-    await comfyPage.nextFrame()
-
-    await ksamplerNodes[0].click('title')
-    await comfyPage.nextFrame()
-    await comfyPage.page.waitForTimeout(500)
-
-    await expect(comfyPage.page.locator('.selection-toolbox')).toBeVisible({
-      timeout: 5000
-    })
-
-    const moreOptionsBtn = comfyPage.page.locator(
-      '[data-testid="more-options-button"]'
-    )
-    await expect(moreOptionsBtn).toBeVisible({ timeout: 3000 })
-
-    await comfyPage.page.click('[data-testid="more-options-button"]')
-
-    await comfyPage.nextFrame()
-
-    const menuOptionsVisible = await comfyPage.page
-      .getByText('Rename')
-      .isVisible({ timeout: 2000 })
-      .catch(() => false)
-    if (menuOptionsVisible) {
-      return
-    }
-
-    await moreOptionsBtn.click({ force: true })
-    await comfyPage.nextFrame()
-    await comfyPage.page.waitForTimeout(2000)
-
-    const menuOptionsVisibleAfterClick = await comfyPage.page
-      .getByText('Rename')
-      .isVisible({ timeout: 2000 })
-      .catch(() => false)
-    if (menuOptionsVisibleAfterClick) {
-      return
-    }
-
-    throw new Error('Could not open More Options menu - popover not showing')
-  }
-
-  test('opens Node Info from More Options menu', async ({ comfyPage }) => {
-    await openMoreOptions(comfyPage)
-    const nodeInfoButton = comfyPage.page.getByText('Node Info', {
-      exact: true
-    })
-    await expect(nodeInfoButton).toBeVisible()
-    await nodeInfoButton.click()
-    await comfyPage.nextFrame()
-  })
-
-  test('changes node shape via Shape submenu', async ({ comfyPage }) => {
-    const nodeRef = (await comfyPage.getNodeRefsByTitle('KSampler'))[0]
-    const initialShape = await nodeRef.getProperty<number>('shape')
-
-    await openMoreOptions(comfyPage)
-    await comfyPage.page.getByText('Shape', { exact: true }).click()
-    await expect(comfyPage.page.getByText('Box', { exact: true })).toBeVisible({
-      timeout: 5000
-    })
-    await comfyPage.page.getByText('Box', { exact: true }).click()
-    await comfyPage.nextFrame()
-
-    const newShape = await nodeRef.getProperty<number>('shape')
-    expect(newShape).not.toBe(initialShape)
-    expect(newShape).toBe(1)
-  })
-
-  test('changes node color via Color submenu swatch', async ({ comfyPage }) => {
-    const nodeRef = (await comfyPage.getNodeRefsByTitle('KSampler'))[0]
-    const initialColor = await nodeRef.getProperty<string | undefined>('color')
-
-    await openMoreOptions(comfyPage)
-    await comfyPage.page.getByText('Color', { exact: true }).click()
-    const blueSwatch = comfyPage.page.locator('[title="Blue"]')
-    await expect(blueSwatch.first()).toBeVisible({ timeout: 5000 })
-    await blueSwatch.first().click()
-    await comfyPage.nextFrame()
-
-    const newColor = await nodeRef.getProperty<string | undefined>('color')
-    expect(newColor).toBe('#223')
-    if (initialColor) {
-      expect(newColor).not.toBe(initialColor)
-    }
-  })
-
-  test('renames a node using Rename action', async ({ comfyPage }) => {
-    const nodeRef = (await comfyPage.getNodeRefsByTitle('KSampler'))[0]
-    await openMoreOptions(comfyPage)
-    await comfyPage.page
-      .getByText('Rename', { exact: true })
-      .click({ force: true })
-    const input = comfyPage.page.locator(
-      '.group-title-editor.node-title-editor .editable-text input'
-    )
-    await expect(input).toBeVisible()
-    await input.fill('RenamedNode')
-    await input.press('Enter')
-    await comfyPage.nextFrame()
-    const newTitle = await nodeRef.getProperty<string>('title')
-    expect(newTitle).toBe('RenamedNode')
-  })
-
-  test('closes More Options menu when clicking outside', async ({
-    comfyPage
-  }) => {
-    await openMoreOptions(comfyPage)
-    await expect(
-      comfyPage.page.getByText('Rename', { exact: true })
-    ).toBeVisible({ timeout: 5000 })
-
-    await comfyPage.page
-      .locator('#graph-canvas')
-      .click({ position: { x: 0, y: 50 }, force: true })
-    await comfyPage.nextFrame()
-    await expect(
-      comfyPage.page.getByText('Rename', { exact: true })
-    ).not.toBeVisible()
-  })
-
-  test('closes More Options menu when clicking the button again (toggle)', async ({
-    comfyPage
-  }) => {
-    await openMoreOptions(comfyPage)
-    await expect(
-      comfyPage.page.getByText('Rename', { exact: true })
-    ).toBeVisible({ timeout: 5000 })
-
-    await comfyPage.page.evaluate(() => {
-      const btn = document.querySelector('[data-testid="more-options-button"]')
-      if (btn) {
-        const event = new MouseEvent('click', {
-          bubbles: true,
-          cancelable: true,
-          view: window,
-          detail: 1
-        })
-        btn.dispatchEvent(event)
-      }
-    })
-    await comfyPage.nextFrame()
-    await comfyPage.page.waitForTimeout(500)
-
-    await expect(
-      comfyPage.page.getByText('Rename', { exact: true })
-    ).not.toBeVisible()
-  })
-})

browser_tests/tests/sidebar/queue.spec.ts

@@ -160,9 +160,7 @@ test.describe.skip('Queue sidebar', () => {
       comfyPage
     }) => {
       await comfyPage.nextFrame()
-      await expect(
-        comfyPage.menu.queueTab.getGalleryImage(firstImage)
-      ).toBeVisible()
+      expect(comfyPage.menu.queueTab.getGalleryImage(firstImage)).toBeVisible()
     })
 
     test('maintains active gallery item when new tasks are added', async ({
@@ -176,9 +174,7 @@ test.describe.skip('Queue sidebar', () => {
       const newTask = comfyPage.menu.queueTab.tasks.getByAltText(newImage)
       await newTask.waitFor({ state: 'visible' })
       // The active gallery item should still be the initial image
-      await expect(
-        comfyPage.menu.queueTab.getGalleryImage(firstImage)
-      ).toBeVisible()
+      expect(comfyPage.menu.queueTab.getGalleryImage(firstImage)).toBeVisible()
     })
 
     test.describe('Gallery navigation', () => {
@@ -200,9 +196,7 @@ test.describe.skip('Queue sidebar', () => {
               delay: 256
             })
           await comfyPage.nextFrame()
-          await expect(
-            comfyPage.menu.queueTab.getGalleryImage(end)
-          ).toBeVisible()
+          expect(comfyPage.menu.queueTab.getGalleryImage(end)).toBeVisible()
         })
       })
     })

browser_tests/tests/templates.spec.ts

@@ -1,5 +1,4 @@
-import type { Page } from '@playwright/test'
-import { expect } from '@playwright/test'
+import { Page, expect } from '@playwright/test'
 
 import { comfyPageFixture as test } from '../fixtures/ComfyPage'
 

browser_tests/tests/useSettingSearch.spec.ts

@@ -2,10 +2,6 @@ import { expect } from '@playwright/test'
 
 import { comfyPageFixture as test } from '../fixtures/ComfyPage'
 
-test.beforeEach(async ({ comfyPage }) => {
-  await comfyPage.setSetting('Comfy.UseNewMenu', 'Disabled')
-})
-
 test.describe('Settings Search functionality', () => {
   test.beforeEach(async ({ comfyPage }) => {
     // Register test settings to verify hidden/deprecated filtering

browser_tests/tests/versionMismatchWarnings.spec.ts

@@ -1,6 +1,6 @@
 import { expect } from '@playwright/test'
 
-import type { SystemStats } from '../../src/schemas/apiSchema'
+import { SystemStats } from '../../src/schemas/apiSchema'
 import { comfyPageFixture as test } from '../fixtures/ComfyPage'
 
 test.describe('Version Mismatch Warnings', () => {
@@ -106,11 +106,6 @@ test.describe('Version Mismatch Warnings', () => {
     const dismissButton = warningToast.getByRole('button', { name: 'Close' })
     await dismissButton.click()
 
-    // Wait for the dismissed state to be persisted
-    await comfyPage.page.waitForFunction(
-      () => !!localStorage.getItem('comfy.versionMismatch.dismissals')
-    )
-
     // Reload the page, keeping local storage
     await comfyPage.setup({ clearStorage: false })
 

browser_tests/tests/vueNodes/NodeHeader.spec.ts

@@ -6,7 +6,7 @@ import { VueNodeFixture } from '../../fixtures/utils/vueNodeFixtures'
 
 test.describe('NodeHeader', () => {
   test.beforeEach(async ({ comfyPage }) => {
-    await comfyPage.setSetting('Comfy.UseNewMenu', 'Top')
+    await comfyPage.setSetting('Comfy.UseNewMenu', 'Enabled')
     await comfyPage.setSetting('Comfy.Graph.CanvasMenu', false)
     await comfyPage.setSetting('Comfy.EnableTooltips', true)
     await comfyPage.setSetting('Comfy.VueNodes.Enabled', true)

browser_tests/tests/vueNodes/deleteKeyInteraction.spec.ts

@@ -1,145 +0,0 @@
-import { expect } from '@playwright/test'
-
-import { comfyPageFixture as test } from '../../fixtures/ComfyPage'
-
-test.beforeEach(async ({ comfyPage }) => {
-  await comfyPage.setSetting('Comfy.UseNewMenu', 'Disabled')
-})
-
-test.describe('Vue Nodes - Delete Key Interaction', () => {
-  test.beforeEach(async ({ comfyPage }) => {
-    // Enable Vue nodes rendering
-    await comfyPage.setSetting('Comfy.VueNodes.Enabled', true)
-    await comfyPage.setSetting('Comfy.Graph.CanvasMenu', false)
-    await comfyPage.setup()
-  })
-
-  test('Can select all and delete Vue nodes with Delete key', async ({
-    comfyPage
-  }) => {
-    await comfyPage.vueNodes.waitForNodes()
-
-    // Get initial Vue node count
-    const initialNodeCount = await comfyPage.vueNodes.getNodeCount()
-    expect(initialNodeCount).toBeGreaterThan(0)
-
-    // Select all Vue nodes
-    await comfyPage.ctrlA()
-
-    // Verify all Vue nodes are selected
-    const selectedCount = await comfyPage.vueNodes.getSelectedNodeCount()
-    expect(selectedCount).toBe(initialNodeCount)
-
-    // Delete with Delete key
-    await comfyPage.vueNodes.deleteSelected()
-
-    // Verify all Vue nodes were deleted
-    const finalNodeCount = await comfyPage.vueNodes.getNodeCount()
-    expect(finalNodeCount).toBe(0)
-  })
-
-  test('Can select specific Vue node and delete it', async ({ comfyPage }) => {
-    await comfyPage.vueNodes.waitForNodes()
-
-    // Get initial Vue node count
-    const initialNodeCount = await comfyPage.vueNodes.getNodeCount()
-    expect(initialNodeCount).toBeGreaterThan(0)
-
-    // Get first Vue node ID and select it
-    const nodeIds = await comfyPage.vueNodes.getNodeIds()
-    await comfyPage.vueNodes.selectNode(nodeIds[0])
-
-    // Verify selection
-    const selectedCount = await comfyPage.vueNodes.getSelectedNodeCount()
-    expect(selectedCount).toBe(1)
-
-    // Delete with Delete key
-    await comfyPage.vueNodes.deleteSelected()
-
-    // Verify one Vue node was deleted
-    const finalNodeCount = await comfyPage.vueNodes.getNodeCount()
-    expect(finalNodeCount).toBe(initialNodeCount - 1)
-  })
-
-  test('Can select and delete Vue node with Backspace key', async ({
-    comfyPage
-  }) => {
-    await comfyPage.vueNodes.waitForNodes()
-
-    const initialNodeCount = await comfyPage.vueNodes.getNodeCount()
-
-    // Select first Vue node
-    const nodeIds = await comfyPage.vueNodes.getNodeIds()
-    await comfyPage.vueNodes.selectNode(nodeIds[0])
-
-    // Delete with Backspace key instead of Delete
-    await comfyPage.vueNodes.deleteSelectedWithBackspace()
-
-    // Verify Vue node was deleted
-    const finalNodeCount = await comfyPage.vueNodes.getNodeCount()
-    expect(finalNodeCount).toBe(initialNodeCount - 1)
-  })
-
-  test('Delete key does not delete node when typing in Vue node widgets', async ({
-    comfyPage
-  }) => {
-    const initialNodeCount = await comfyPage.getGraphNodesCount()
-
-    // Find a text input widget in a Vue node
-    const textWidget = comfyPage.page
-      .locator('input[type="text"], textarea')
-      .first()
-
-    // Click on text widget to focus it
-    await textWidget.click()
-    await textWidget.fill('test text')
-
-    // Press Delete while focused on widget - should delete text, not node
-    await textWidget.press('Delete')
-
-    // Node count should remain the same
-    const finalNodeCount = await comfyPage.getGraphNodesCount()
-    expect(finalNodeCount).toBe(initialNodeCount)
-  })
-
-  test('Delete key does not delete node when nothing is selected', async ({
-    comfyPage
-  }) => {
-    await comfyPage.vueNodes.waitForNodes()
-
-    // Ensure no Vue nodes are selected
-    await comfyPage.vueNodes.clearSelection()
-    const selectedCount = await comfyPage.vueNodes.getSelectedNodeCount()
-    expect(selectedCount).toBe(0)
-
-    // Press Delete key - should not crash and should handle gracefully
-    await comfyPage.page.keyboard.press('Delete')
-
-    // Vue node count should remain the same
-    const nodeCount = await comfyPage.vueNodes.getNodeCount()
-    expect(nodeCount).toBeGreaterThan(0)
-  })
-
-  test('Can multi-select with Ctrl+click and delete multiple Vue nodes', async ({
-    comfyPage
-  }) => {
-    await comfyPage.vueNodes.waitForNodes()
-    const initialNodeCount = await comfyPage.vueNodes.getNodeCount()
-
-    // Multi-select first two Vue nodes using Ctrl+click
-    const nodeIds = await comfyPage.vueNodes.getNodeIds()
-    const nodesToSelect = nodeIds.slice(0, 2)
-    await comfyPage.vueNodes.selectNodes(nodesToSelect)
-
-    // Verify expected nodes are selected
-    const selectedCount = await comfyPage.vueNodes.getSelectedNodeCount()
-    expect(selectedCount).toBe(nodesToSelect.length)
-
-    // Delete selected Vue nodes
-    await comfyPage.vueNodes.deleteSelected()
-
-    // Verify expected nodes were deleted
-    const finalNodeCount = await comfyPage.vueNodes.getNodeCount()
-    expect(finalNodeCount).toBe(initialNodeCount - nodesToSelect.length)
-  })
-})

browser_tests/tests/vueNodes/linkInteraction.spec.ts

@@ -1,221 +0,0 @@
-import type { Locator } from '@playwright/test'
-
-import { getSlotKey } from '../../../src/renderer/core/layout/slots/slotIdentifier'
-import {
-  comfyExpect as expect,
-  comfyPageFixture as test
-} from '../../fixtures/ComfyPage'
-import { fitToViewInstant } from '../../helpers/fitToView'
-
-async function getCenter(locator: Locator): Promise<{ x: number; y: number }> {
-  const box = await locator.boundingBox()
-  if (!box) throw new Error('Slot bounding box not available')
-  return {
-    x: box.x + box.width / 2,
-    y: box.y + box.height / 2
-  }
-}
-
-test.describe('Vue Node Link Interaction', () => {
-  test.beforeEach(async ({ comfyPage }) => {
-    await comfyPage.setSetting('Comfy.UseNewMenu', 'Top')
-    await comfyPage.setSetting('Comfy.VueNodes.Enabled', true)
-    await comfyPage.setup()
-    await comfyPage.loadWorkflow('vueNodes/simple-triple')
-    await comfyPage.vueNodes.waitForNodes()
-    await fitToViewInstant(comfyPage)
-  })
-
-  test('should show a link dragging out from a slot when dragging on a slot', async ({
-    comfyPage,
-    comfyMouse
-  }) => {
-    const samplerNodes = await comfyPage.getNodeRefsByType('KSampler')
-    expect(samplerNodes.length).toBeGreaterThan(0)
-
-    const samplerNode = samplerNodes[0]
-    const outputSlot = await samplerNode.getOutput(0)
-    await outputSlot.removeLinks()
-    await comfyPage.nextFrame()
-
-    const slotKey = getSlotKey(String(samplerNode.id), 0, false)
-    const slotLocator = comfyPage.page.locator(`[data-slot-key="${slotKey}"]`)
-    await expect(slotLocator).toBeVisible()
-
-    const start = await getCenter(slotLocator)
-    const canvasBox = await comfyPage.canvas.boundingBox()
-    if (!canvasBox) throw new Error('Canvas bounding box not available')
-
-    // Arbitrary value
-    const dragTarget = {
-      x: start.x + 180,
-      y: start.y - 140
-    }
-
-    await comfyMouse.move(start)
-    await comfyMouse.drag(dragTarget)
-    await comfyPage.nextFrame()
-
-    try {
-      await expect(comfyPage.canvas).toHaveScreenshot(
-        'vue-node-dragging-link.png'
-      )
-    } finally {
-      await comfyMouse.drop()
-    }
-  })
-
-  test('should create a link when dropping on a compatible slot', async ({
-    comfyPage
-  }) => {
-    const samplerNodes = await comfyPage.getNodeRefsByType('KSampler')
-    expect(samplerNodes.length).toBeGreaterThan(0)
-    const samplerNode = samplerNodes[0]
-
-    const vaeNodes = await comfyPage.getNodeRefsByType('VAEDecode')
-    expect(vaeNodes.length).toBeGreaterThan(0)
-    const vaeNode = vaeNodes[0]
-
-    const samplerOutput = await samplerNode.getOutput(0)
-    const vaeInput = await vaeNode.getInput(0)
-
-    const outputSlotKey = getSlotKey(String(samplerNode.id), 0, false)
-    const inputSlotKey = getSlotKey(String(vaeNode.id), 0, true)
-
-    const outputSlot = comfyPage.page.locator(
-      `[data-slot-key="${outputSlotKey}"]`
-    )
-    const inputSlot = comfyPage.page.locator(
-      `[data-slot-key="${inputSlotKey}"]`
-    )
-
-    await expect(outputSlot).toBeVisible()
-    await expect(inputSlot).toBeVisible()
-
-    await outputSlot.dragTo(inputSlot)
-    await comfyPage.nextFrame()
-
-    expect(await samplerOutput.getLinkCount()).toBe(1)
-    expect(await vaeInput.getLinkCount()).toBe(1)
-
-    const linkDetails = await comfyPage.page.evaluate((sourceId) => {
-      const app = window['app']
-      const graph = app?.canvas?.graph ?? app?.graph
-      if (!graph) return null
-
-      const source = graph.getNodeById(sourceId)
-      if (!source) return null
-
-      const linkId = source.outputs[0]?.links?.[0]
-      if (linkId == null) return null
-
-      const link = graph.links[linkId]
-      if (!link) return null
-
-      return {
-        originId: link.origin_id,
-        originSlot: link.origin_slot,
-        targetId: link.target_id,
-        targetSlot: link.target_slot
-      }
-    }, samplerNode.id)
-
-    expect(linkDetails).not.toBeNull()
-    expect(linkDetails).toMatchObject({
-      originId: samplerNode.id,
-      originSlot: 0,
-      targetId: vaeNode.id,
-      targetSlot: 0
-    })
-  })
-
-  test('should not create a link when slot types are incompatible', async ({
-    comfyPage
-  }) => {
-    const samplerNodes = await comfyPage.getNodeRefsByType('KSampler')
-    expect(samplerNodes.length).toBeGreaterThan(0)
-    const samplerNode = samplerNodes[0]
-
-    const clipNodes = await comfyPage.getNodeRefsByType('CLIPTextEncode')
-    expect(clipNodes.length).toBeGreaterThan(0)
-    const clipNode = clipNodes[0]
-
-    const samplerOutput = await samplerNode.getOutput(0)
-    const clipInput = await clipNode.getInput(0)
-
-    const outputSlotKey = getSlotKey(String(samplerNode.id), 0, false)
-    const inputSlotKey = getSlotKey(String(clipNode.id), 0, true)
-
-    const outputSlot = comfyPage.page.locator(
-      `[data-slot-key="${outputSlotKey}"]`
-    )
-    const inputSlot = comfyPage.page.locator(
-      `[data-slot-key="${inputSlotKey}"]`
-    )
-
-    await expect(outputSlot).toBeVisible()
-    await expect(inputSlot).toBeVisible()
-
-    await outputSlot.dragTo(inputSlot)
-    await comfyPage.nextFrame()
-
-    expect(await samplerOutput.getLinkCount()).toBe(0)
-    expect(await clipInput.getLinkCount()).toBe(0)
-
-    const graphLinkCount = await comfyPage.page.evaluate((sourceId) => {
-      const app = window['app']
-      const graph = app?.canvas?.graph ?? app?.graph
-      if (!graph) return 0
-
-      const source = graph.getNodeById(sourceId)
-      if (!source) return 0
-
-      return source.outputs[0]?.links?.length ?? 0
-    }, samplerNode.id)
-
-    expect(graphLinkCount).toBe(0)
-  })
-
-  test('should not create a link when dropping onto a slot on the same node', async ({
-    comfyPage
-  }) => {
-    const samplerNodes = await comfyPage.getNodeRefsByType('KSampler')
-    expect(samplerNodes.length).toBeGreaterThan(0)
-    const samplerNode = samplerNodes[0]
-
-    const samplerOutput = await samplerNode.getOutput(0)
-    const samplerInput = await samplerNode.getInput(3)
-
-    const outputSlotKey = getSlotKey(String(samplerNode.id), 0, false)
-    const inputSlotKey = getSlotKey(String(samplerNode.id), 3, true)
-
-    const outputSlot = comfyPage.page.locator(
-      `[data-slot-key="${outputSlotKey}"]`
-    )
-    const inputSlot = comfyPage.page.locator(
-      `[data-slot-key="${inputSlotKey}"]`
-    )
-
-    await expect(outputSlot).toBeVisible()
-    await expect(inputSlot).toBeVisible()
-
-    await outputSlot.dragTo(inputSlot)
-    await comfyPage.nextFrame()
-
-    expect(await samplerOutput.getLinkCount()).toBe(0)
-    expect(await samplerInput.getLinkCount()).toBe(0)
-
-    const graphLinkCount = await comfyPage.page.evaluate((sourceId) => {
-      const app = window['app']
-      const graph = app?.canvas?.graph ?? app?.graph
-      if (!graph) return 0
-
-      const source = graph.getNodeById(sourceId)
-      if (!source) return 0
-
-      return source.outputs[0]?.links?.length ?? 0
-    }, samplerNode.id)
-
-    expect(graphLinkCount).toBe(0)
-  })
-})

browser_tests/tests/vueNodes/lod.spec.ts

@@ -1,48 +0,0 @@
-import { expect } from '@playwright/test'
-
-import { comfyPageFixture as test } from '../../fixtures/ComfyPage'
-
-test.beforeEach(async ({ comfyPage }) => {
-  await comfyPage.setSetting('Comfy.UseNewMenu', 'Disabled')
-})
-
-test.describe('Vue Nodes - LOD', () => {
-  test.beforeEach(async ({ comfyPage }) => {
-    await comfyPage.setSetting('Comfy.VueNodes.Enabled', true)
-    await comfyPage.setup()
-    await comfyPage.loadWorkflow('default')
-  })
-
-  test('should toggle LOD based on zoom threshold', async ({ comfyPage }) => {
-    await comfyPage.vueNodes.waitForNodes()
-
-    const initialNodeCount = await comfyPage.vueNodes.getNodeCount()
-    expect(initialNodeCount).toBeGreaterThan(0)
-
-    await expect(comfyPage.canvas).toHaveScreenshot('vue-nodes-default.png')
-
-    const vueNodesContainer = comfyPage.vueNodes.nodes
-    const textboxesInNodes = vueNodesContainer.getByRole('textbox')
-    const buttonsInNodes = vueNodesContainer.getByRole('button')
-
-    await expect(textboxesInNodes.first()).toBeVisible()
-    await expect(buttonsInNodes.first()).toBeVisible()
-
-    await comfyPage.zoom(120, 10)
-    await comfyPage.nextFrame()
-
-    await expect(comfyPage.canvas).toHaveScreenshot('vue-nodes-lod-active.png')
-
-    await expect(textboxesInNodes.first()).toBeHidden()
-    await expect(buttonsInNodes.first()).toBeHidden()
-
-    await comfyPage.zoom(-120, 10)
-    await comfyPage.nextFrame()
-
-    await expect(comfyPage.canvas).toHaveScreenshot(
-      'vue-nodes-lod-inactive.png'
-    )
-    await expect(textboxesInNodes.first()).toBeVisible()
-    await expect(buttonsInNodes.first()).toBeVisible()
-  })
-})

browser_tests/tests/vueNodes/nodeInteractions/selectionState.spec.ts

@@ -1,51 +0,0 @@
-import {
-  comfyExpect as expect,
-  comfyPageFixture as test
-} from '../../../fixtures/ComfyPage'
-
-test.beforeEach(async ({ comfyPage }) => {
-  await comfyPage.setSetting('Comfy.UseNewMenu', 'Disabled')
-})
-
-test.describe('Vue Node Selection', () => {
-  test.beforeEach(async ({ comfyPage }) => {
-    await comfyPage.setSetting('Comfy.VueNodes.Enabled', true)
-    await comfyPage.vueNodes.waitForNodes()
-  })
-
-  const modifiers = [
-    { key: 'Control', name: 'ctrl' },
-    { key: 'Shift', name: 'shift' }
-  ] as const
-
-  for (const { key: modifier, name } of modifiers) {
-    test(`should allow selecting multiple nodes with ${name}+click`, async ({
-      comfyPage
-    }) => {
-      await comfyPage.page.getByText('Load Checkpoint').click()
-      expect(await comfyPage.vueNodes.getSelectedNodeCount()).toBe(1)
-
-      await comfyPage.page.getByText('Empty Latent Image').click({
-        modifiers: [modifier]
-      })
-      expect(await comfyPage.vueNodes.getSelectedNodeCount()).toBe(2)
-
-      await comfyPage.page.getByText('KSampler').click({
-        modifiers: [modifier]
-      })
-      expect(await comfyPage.vueNodes.getSelectedNodeCount()).toBe(3)
-    })
-
-    test(`should allow de-selecting nodes with ${name}+click`, async ({
-      comfyPage
-    }) => {
-      await comfyPage.page.getByText('Load Checkpoint').click()
-      expect(await comfyPage.vueNodes.getSelectedNodeCount()).toBe(1)
-
-      await comfyPage.page.getByText('Load Checkpoint').click({
-        modifiers: [modifier]
-      })
-      expect(await comfyPage.vueNodes.getSelectedNodeCount()).toBe(0)
-    })
-  }
-})

browser_tests/tests/vueNodes/nodeStates/bypass.spec.ts

@@ -1,45 +0,0 @@
-import {
-  comfyExpect as expect,
-  comfyPageFixture as test
-} from '../../../fixtures/ComfyPage'
-
-const BYPASS_HOTKEY = 'Control+b'
-const BYPASS_CLASS = /before:bg-bypass\/60/
-
-test.describe('Vue Node Bypass', () => {
-  test.beforeEach(async ({ comfyPage }) => {
-    await comfyPage.setSetting('Comfy.VueNodes.Enabled', true)
-    await comfyPage.vueNodes.waitForNodes()
-  })
-
-  test('should allow toggling bypass on a selected node with hotkey', async ({
-    comfyPage
-  }) => {
-    await comfyPage.page.getByText('Load Checkpoint').click()
-    await comfyPage.page.keyboard.press(BYPASS_HOTKEY)
-
-    const checkpointNode = comfyPage.vueNodes.getNodeByTitle('Load Checkpoint')
-    await expect(checkpointNode).toHaveClass(BYPASS_CLASS)
-
-    await comfyPage.page.keyboard.press(BYPASS_HOTKEY)
-    await expect(checkpointNode).not.toHaveClass(BYPASS_CLASS)
-  })
-
-  test('should allow toggling bypass on multiple selected nodes with hotkey', async ({
-    comfyPage
-  }) => {
-    await comfyPage.page.getByText('Load Checkpoint').click()
-    await comfyPage.page.getByText('KSampler').click({ modifiers: ['Control'] })
-
-    const checkpointNode = comfyPage.vueNodes.getNodeByTitle('Load Checkpoint')
-    const ksamplerNode = comfyPage.vueNodes.getNodeByTitle('KSampler')
-
-    await comfyPage.page.keyboard.press(BYPASS_HOTKEY)
-    await expect(checkpointNode).toHaveClass(BYPASS_CLASS)
-    await expect(ksamplerNode).toHaveClass(BYPASS_CLASS)
-
-    await comfyPage.page.keyboard.press(BYPASS_HOTKEY)
-    await expect(checkpointNode).not.toHaveClass(BYPASS_CLASS)
-    await expect(ksamplerNode).not.toHaveClass(BYPASS_CLASS)
-  })
-})

browser_tests/tests/vueNodes/nodeStates/error.spec.ts

@@ -1,32 +0,0 @@
-import {
-  comfyExpect as expect,
-  comfyPageFixture as test
-} from '../../../fixtures/ComfyPage'
-
-const ERROR_CLASS = /border-error/
-
-test.describe('Vue Node Error', () => {
-  test.beforeEach(async ({ comfyPage }) => {
-    await comfyPage.setSetting('Comfy.VueNodes.Enabled', true)
-    await comfyPage.vueNodes.waitForNodes()
-  })
-
-  test('should display error state when node is missing (node from workflow is not installed)', async ({
-    comfyPage
-  }) => {
-    await comfyPage.setup()
-    await comfyPage.loadWorkflow('missing/missing_nodes')
-
-    // Close missing nodes warning dialog
-    await comfyPage.page.getByRole('button', { name: 'Close' }).click()
-    await comfyPage.page.waitForSelector('.comfy-missing-nodes', {
-      state: 'hidden'
-    })
-
-    // Expect error state on missing unknown node
-    const unknownNode = comfyPage.page.locator('[data-node-id]').filter({
-      hasText: 'UNKNOWN NODE'
-    })
-    await expect(unknownNode).toHaveClass(ERROR_CLASS)
-  })
-})

browser_tests/tests/vueNodes/nodeStates/mute.spec.ts

@@ -1,45 +0,0 @@
-import {
-  comfyExpect as expect,
-  comfyPageFixture as test
-} from '../../../fixtures/ComfyPage'
-
-const MUTE_HOTKEY = 'Control+m'
-const MUTE_CLASS = /opacity-50/
-
-test.describe('Vue Node Mute', () => {
-  test.beforeEach(async ({ comfyPage }) => {
-    await comfyPage.setSetting('Comfy.VueNodes.Enabled', true)
-    await comfyPage.vueNodes.waitForNodes()
-  })
-
-  test('should allow toggling mute on a selected node with hotkey', async ({
-    comfyPage
-  }) => {
-    await comfyPage.page.getByText('Load Checkpoint').click()
-    await comfyPage.page.keyboard.press(MUTE_HOTKEY)
-
-    const checkpointNode = comfyPage.vueNodes.getNodeByTitle('Load Checkpoint')
-    await expect(checkpointNode).toHaveClass(MUTE_CLASS)
-
-    await comfyPage.page.keyboard.press(MUTE_HOTKEY)
-    await expect(checkpointNode).not.toHaveClass(MUTE_CLASS)
-  })
-
-  test('should allow toggling mute on multiple selected nodes with hotkey', async ({
-    comfyPage
-  }) => {
-    await comfyPage.page.getByText('Load Checkpoint').click()
-    await comfyPage.page.getByText('KSampler').click({ modifiers: ['Control'] })
-
-    const checkpointNode = comfyPage.vueNodes.getNodeByTitle('Load Checkpoint')
-    const ksamplerNode = comfyPage.vueNodes.getNodeByTitle('KSampler')
-
-    await comfyPage.page.keyboard.press(MUTE_HOTKEY)
-    await expect(checkpointNode).toHaveClass(MUTE_CLASS)
-    await expect(ksamplerNode).toHaveClass(MUTE_CLASS)
-
-    await comfyPage.page.keyboard.press(MUTE_HOTKEY)
-    await expect(checkpointNode).not.toHaveClass(MUTE_CLASS)
-    await expect(ksamplerNode).not.toHaveClass(MUTE_CLASS)
-  })
-})

browser_tests/tests/widget.spec.ts

@@ -2,10 +2,6 @@ import { expect } from '@playwright/test'
 
 import { comfyPageFixture as test } from '../fixtures/ComfyPage'
 
-test.beforeEach(async ({ comfyPage }) => {
-  await comfyPage.setSetting('Comfy.UseNewMenu', 'Disabled')
-})
-
 test.describe('Combo text widget', () => {
   test('Truncates text when resized', async ({ comfyPage }) => {
     await comfyPage.resizeLoadCheckpointNode(0.2, 1)
@@ -268,13 +264,7 @@ test.describe('Animated image widget', () => {
     expect(filename).toContain('animated_webp.webp')
   })
 
-  // FIXME: This test keeps flip-flopping because it relies on animated webp timing,
-  // which is inherently unreliable in CI environments. The test asset is an animated
-  // webp with 2 frames, and the test depends on animation frame timing to verify that
-  // animated webp images are properly displayed (as opposed to being treated as static webp).
-  // While the underlying functionality works (animated webp are correctly distinguished
-  // from static webp), the test is flaky due to timing dependencies with webp animation frames.
-  test.fixme('Can preview saved animated webp image', async ({ comfyPage }) => {
+  test('Can preview saved animated webp image', async ({ comfyPage }) => {
     await comfyPage.loadWorkflow('widgets/save_animated_webp')
 
     // Get position of the load animated webp node
@@ -322,9 +312,6 @@ test.describe('Animated image widget', () => {
 test.describe('Load audio widget', () => {
   test('Can load audio', async ({ comfyPage }) => {
     await comfyPage.loadWorkflow('widgets/load_audio_widget')
-    // Wait for the audio widget to be rendered in the DOM
-    await comfyPage.page.waitForSelector('.comfy-audio', { state: 'attached' })
-    await comfyPage.nextFrame()
     await expect(comfyPage.canvas).toHaveScreenshot('load_audio_widget.png')
   })
 })