Update locales [skip ci]

.cursorrules

@@ -8,15 +8,6 @@ const vue3CompositionApiBestPractices = [
   "Use watch and watchEffect for side effects",
   "Implement lifecycle hooks with onMounted, onUpdated, etc.",
   "Utilize provide/inject for dependency injection",
-  "Use vue 3.5 style of default prop declaration. Example:
-
-const { nodes, showTotal = true } = defineProps<{
-  nodes: ApiNodeCost[]
-  showTotal?: boolean
-}>()
-
-",
-  "Organize vue component in <template> <script> <style> order",
 ]
 
 // Folder structure
@@ -49,6 +40,4 @@ const additionalInstructions = `
 7. Implement proper error handling
 8. Follow Vue 3 style guide and naming conventions
 9. Use Vite for fast development and building
-10. Use vue-i18n in composition API for any string literals. Place new translation
-entries in src/locales/en/main.json.
 `;

.env_example

@@ -1,5 +1,4 @@
 # Local development playwright target
-# Note: Don't add a trailing / after the port
 PLAYWRIGHT_TEST_URL=http://localhost:5173
 # PLAYWRIGHT_TEST_URL=http://localhost:8188
 
@@ -12,20 +11,18 @@ DEV_SERVER_COMFYUI_URL=http://127.0.0.1:8188
 # and public addresses.
 VITE_REMOTE_DEV=false
 
+# The target ComfyUI checkout directory to deploy the frontend code to.
+# The dist directory will be copied to {DEPLOY_COMFYUI_DIR}/custom_web_versions/main/dev
+# Add `--front-end-root {DEPLOY_COMFYUI_DIR}/custom_web_versions/main/dev`
+# to ComfyUI launch script to serve the custom web version.
+DEPLOY_COMFYUI_DIR=/home/ComfyUI/web
+
 # The directory containing the ComfyUI installation used to run Playwright tests.
 # If you aren't using a separate install for testing, point this to your regular install.
 TEST_COMFYUI_DIR=/home/ComfyUI
 
+# The directory containing the ComfyUI_examples repo used to extract test workflows.
+EXAMPLE_REPO_PATH=tests-ui/ComfyUI_examples
+
 # Whether to enable minification of the frontend code.
 ENABLE_MINIFY=true
-
-# Whether to disable proxying the `/templates` route. If true, allows you to 
-# serve templates from the ComfyUI_frontend/public/templates folder (for 
-# locally testing changes to templates). When false or nonexistent, the 
-# templates are served via the normal method from the server's python site 
-# packages.
-DISABLE_TEMPLATES_PROXY=false
-
-# If playwright tests are being run via vite dev server, Vue plugins will
-# invalidate screenshots.  When `true`, vite plugins will not be loaded.
-DISABLE_VUE_PLUGINS=false

.github/copilot-instructions.md

@@ -1,37 +0,0 @@
-Use the Vue 3 Composition API instead of the Options API when writing Vue components. An exception is when overriding or extending a PrimeVue component for compatibility, you may use the Options API.
-
-Use setup() function for component logic
-
-Utilize ref and reactive for reactive state
-
-Implement computed properties with computed()
-
-Use watch and watchEffect for side effects
-
-Implement lifecycle hooks with onMounted, onUpdated, etc.
-
-Utilize provide/inject for dependency injection
-
-Use vue 3.5 style of default prop declaration.
-
-Use Tailwind CSS for styling
-
-Leverage VueUse functions for performance-enhancing styles
-
-Use lodash for utility functions
-
-Use TypeScript for type safety
-
-Implement proper props and emits definitions
-
-Utilize Vue 3's Teleport component when needed
-
-Use Suspense for async components
-
-Implement proper error handling
-
-Follow Vue 3 style guide and naming conventions
-
-Use Vite for fast development and building
-
-Use vue-i18n in composition API for any string literals. Place new translation entries in src/locales/en/main.json.

.github/workflows/dev-release.yaml

@@ -1,72 +0,0 @@
-name: Create Dev PyPI Package
-
-on:
-  workflow_dispatch:
-    inputs:
-      devVersion:
-        description: 'Dev version'
-        required: true
-        type: number
-
-jobs:
-  build:
-    runs-on: ubuntu-latest
-    outputs:
-      version: ${{ steps.current_version.outputs.version }}
-    steps:
-      - name: Checkout code
-        uses: actions/checkout@v4
-      - uses: actions/setup-node@v4
-        with:
-          node-version: 'lts/*'
-      - name: Get current version
-        id: current_version
-        run: echo "version=$(node -p "require('./package.json').version")" >> $GITHUB_OUTPUT
-      - name: Build project
-        env:
-          SENTRY_DSN: ${{ secrets.SENTRY_DSN }}
-          ALGOLIA_APP_ID: ${{ secrets.ALGOLIA_APP_ID }}
-          ALGOLIA_API_KEY: ${{ secrets.ALGOLIA_API_KEY }}
-          USE_PROD_CONFIG: 'true'
-        run: |
-          npm ci
-          npm run build
-          npm run zipdist
-      - name: Upload dist artifact
-        uses: actions/upload-artifact@v4
-        with:
-          name: dist-files
-          path: |
-            dist/
-            dist.zip
-
-  publish_pypi:
-    needs: build
-    runs-on: ubuntu-latest
-    steps:
-      - name: Checkout code
-        uses: actions/checkout@v4
-      - name: Download dist artifact
-        uses: actions/download-artifact@v4
-        with:
-          name: dist-files
-      - name: Set up Python
-        uses: actions/setup-python@v4
-        with:
-          python-version: '3.x'
-      - name: Install build dependencies
-        run: python -m pip install build
-      - name: Setup pypi package
-        run: |
-          mkdir -p comfyui_frontend_package/comfyui_frontend_package/static/
-          cp -r dist/* comfyui_frontend_package/comfyui_frontend_package/static/
-      - name: Build pypi package
-        run: python -m build
-        working-directory: comfyui_frontend_package
-        env:
-          COMFYUI_FRONTEND_VERSION: ${{ format('{0}.dev{1}', needs.build.outputs.version, inputs.devVersion) }}
-      - name: Publish pypi package
-        uses: pypa/gh-action-pypi-publish@release/v1
-        with:
-          password: ${{ secrets.PYPI_TOKEN }}
-          packages-dir: comfyui_frontend_package/dist

.github/workflows/i18n-node-defs.yaml

@@ -13,7 +13,7 @@ jobs:
   update-locales:
     runs-on: ubuntu-latest
     steps:
-    - uses: Comfy-Org/ComfyUI_frontend_setup_action@v2.3
+    - uses: Comfy-Org/ComfyUI_frontend_setup_action@v2.2
     - name: Install Playwright Browsers
       run: npx playwright install chromium --with-deps
       working-directory: ComfyUI_frontend

.github/workflows/i18n.yaml

@@ -10,7 +10,7 @@ jobs:
     if: github.event.pull_request.head.repo.full_name == github.repository
     runs-on: ubuntu-latest
     steps:
-    - uses: Comfy-Org/ComfyUI_frontend_setup_action@v2.3
+    - uses: Comfy-Org/ComfyUI_frontend_setup_action@v2.2
     - name: Install Playwright Browsers
       run: npx playwright install chromium --with-deps
       working-directory: ComfyUI_frontend
@@ -34,11 +34,7 @@ jobs:
         git config --global user.name 'github-actions'
         git config --global user.email 'github-actions@github.com'
         git fetch origin ${{ github.head_ref }}
-        # Stash any local changes before checkout
-        git stash -u
         git checkout -B ${{ github.head_ref }} origin/${{ github.head_ref }}
-        # Apply the stashed changes if any
-        git stash pop || true
         git add src/locales/
         git diff --staged --quiet || git commit -m "Update locales [skip ci]"
         git push origin HEAD:${{ github.head_ref }}

.github/workflows/release.yaml

@@ -8,13 +8,11 @@ on:
       - 'package.json'
 
 jobs:
-  build:
+  draft_release:
     runs-on: ubuntu-latest
     if: >
       github.event.pull_request.merged == true &&
       contains(github.event.pull_request.labels.*.name, 'Release')
-    outputs:
-      version: ${{ steps.current_version.outputs.version }}
     steps:
       - name: Checkout code
         uses: actions/checkout@v4
@@ -23,35 +21,14 @@ jobs:
           node-version: 'lts/*'
       - name: Get current version
         id: current_version
-        run: echo "version=$(node -p "require('./package.json').version")" >> $GITHUB_OUTPUT
+        run: echo ::set-output name=version::$(node -p "require('./package.json').version")
       - name: Build project
         env:
           SENTRY_DSN: ${{ secrets.SENTRY_DSN }}
-          ALGOLIA_APP_ID: ${{ secrets.ALGOLIA_APP_ID }}
-          ALGOLIA_API_KEY: ${{ secrets.ALGOLIA_API_KEY }}
-          USE_PROD_CONFIG: 'true'
         run: |
           npm ci
           npm run build
           npm run zipdist
-      - name: Upload dist artifact
-        uses: actions/upload-artifact@v4
-        with:
-          name: dist-files
-          path: |
-            dist/
-            dist.zip
-
-  draft_release:
-    needs: build
-    runs-on: ubuntu-latest
-    steps:
-      - name: Checkout code
-        uses: actions/checkout@v4
-      - name: Download dist artifact
-        uses: actions/download-artifact@v4
-        with:
-          name: dist-files
       - name: Create release
         id: create_release
         uses: softprops/action-gh-release@v2
@@ -60,47 +37,17 @@ jobs:
         with:
           files: |
             dist.zip
-          tag_name: v${{ needs.build.outputs.version }}
+          tag_name: v${{ steps.current_version.outputs.version }}
           target_commitish: ${{ github.event.pull_request.base.ref }}
           make_latest: ${{ github.event.pull_request.base.ref == 'main' }}
-          draft: ${{ github.event.pull_request.base.ref != 'main' }}
+          draft: true
           prerelease: false
           generate_release_notes: true
-
-  publish_pypi:
-    needs: build
-    runs-on: ubuntu-latest
-    steps:
-      - name: Checkout code
-        uses: actions/checkout@v4
-      - name: Download dist artifact
-        uses: actions/download-artifact@v4
-        with:
-          name: dist-files
-      - name: Set up Python
-        uses: actions/setup-python@v4
-        with:
-          python-version: '3.x'
-      - name: Install build dependencies
-        run: python -m pip install build
-      - name: Setup pypi package
-        run: |
-          mkdir -p comfyui_frontend_package/comfyui_frontend_package/static/
-          cp -r dist/* comfyui_frontend_package/comfyui_frontend_package/static/
-      - name: Build pypi package
-        run: python -m build
-        working-directory: comfyui_frontend_package
-        env:
-          COMFYUI_FRONTEND_VERSION: ${{ needs.build.outputs.version }}
-      - name: Publish pypi package
-        uses: pypa/gh-action-pypi-publish@release/v1
-        with:
-          password: ${{ secrets.PYPI_TOKEN }}
-          packages-dir: comfyui_frontend_package/dist
-
   publish_types:
-    needs: build
     runs-on: ubuntu-latest
+    if: >
+      github.event.pull_request.merged == true &&
+      contains(github.event.pull_request.labels.*.name, 'Release')
     steps:
       - uses: actions/checkout@v4
       - uses: actions/setup-node@v4

.github/workflows/test-browser-exp.yaml

@@ -10,7 +10,7 @@ jobs:
     runs-on: ubuntu-latest
     if: github.event.label.name == 'New Browser Test Expectations'
     steps:
-    - uses: Comfy-Org/ComfyUI_frontend_setup_action@v2.3
+    - uses: Comfy-Org/ComfyUI_frontend_setup_action@v2.2
     - name: Install Playwright Browsers
       run: npx playwright install chromium --with-deps
       working-directory: ComfyUI_frontend

.github/workflows/test-ui.yaml

@@ -2,103 +2,76 @@ name: Tests CI
 
 on:
   push:
-    branches: [main, master, core/*, desktop/*]
+    branches: [ main, master, core/*, desktop/* ]
   pull_request:
-    branches: [main, master, dev*, core/*, desktop/*]
+    branches: [ main, master, dev*, core/*, desktop/* ]
 
 jobs:
-  setup:
+  jest-tests:
     runs-on: ubuntu-latest
-    outputs:
-      cache-key: ${{ steps.cache-key.outputs.key }}
     steps:
-      - name: Checkout ComfyUI
-        uses: actions/checkout@v4
-        with:
-          repository: 'comfyanonymous/ComfyUI'
-          path: 'ComfyUI'
-          ref: master
+    - uses: Comfy-Org/ComfyUI_frontend_setup_action@v2.2
+      with:
+        devtools_ref: 080e6d4af809a46852d1c4b7ed85f06e8a3a72be
+    - name: Run Jest tests
+      run: |
+        npm run test:generate
+        npm run test:jest -- --verbose
+      working-directory: ComfyUI_frontend
 
-      - name: Checkout ComfyUI_frontend
-        uses: actions/checkout@v4
-        with:
-          repository: 'Comfy-Org/ComfyUI_frontend'
-          path: 'ComfyUI_frontend'
-
-      - name: Checkout ComfyUI_devtools
-        uses: actions/checkout@v4
-        with:
-          repository: 'Comfy-Org/ComfyUI_devtools'
-          path: 'ComfyUI/custom_nodes/ComfyUI_devtools'
-          ref: 'd05fd48dd787a4192e16802d4244cfcc0e2f9684'
-
-      - uses: actions/setup-node@v4
-        with:
-          node-version: lts/*
-
-      - name: Build ComfyUI_frontend
-        run: |
-          npm ci
-          npm run build
-        working-directory: ComfyUI_frontend
-
-      - name: Generate cache key
-        id: cache-key
-        run: echo "key=$(date +%s)" >> $GITHUB_OUTPUT
-
-      - name: Cache setup
-        uses: actions/cache@v3
-        with:
-          path: |
-            ComfyUI
-            ComfyUI_frontend
-          key: comfyui-setup-${{ steps.cache-key.outputs.key }}
-
-  playwright-tests:
-    needs: setup
+  playwright-tests-chromium:
     runs-on: ubuntu-latest
-    strategy:
-      fail-fast: false
-      matrix:
-        browser: [chromium, chromium-2x, mobile-chrome]
     steps:
-      - name: Restore cached setup
-        uses: actions/cache@v3
-        with:
-          path: |
-            ComfyUI
-            ComfyUI_frontend
-          key: comfyui-setup-${{ needs.setup.outputs.cache-key }}
+    - uses: Comfy-Org/ComfyUI_frontend_setup_action@v2.2
+      with:
+        devtools_ref: 080e6d4af809a46852d1c4b7ed85f06e8a3a72be
+    - name: Install Playwright Browsers
+      run: npx playwright install chromium --with-deps
+      working-directory: ComfyUI_frontend
+    - name: Run Playwright tests (Chromium)
+      run: npx playwright test --project=chromium
+      working-directory: ComfyUI_frontend
+    - uses: actions/upload-artifact@v4
+      if: always()
+      with:
+        name: playwright-report-chromium
+        path: ComfyUI_frontend/playwright-report/
+        retention-days: 30
 
-      - uses: actions/setup-python@v4
-        with:
-          python-version: '3.10'
+  playwright-tests-chromium-2x:
+    runs-on: ubuntu-latest
+    steps:
+    - uses: Comfy-Org/ComfyUI_frontend_setup_action@v2.2
+      with:
+        devtools_ref: 080e6d4af809a46852d1c4b7ed85f06e8a3a72be
+    - name: Install Playwright Browsers
+      run: npx playwright install chromium --with-deps
+      working-directory: ComfyUI_frontend
+    - name: Run Playwright tests (Chromium 2x)
+      run: npx playwright test --project=chromium-2x
+      working-directory: ComfyUI_frontend
+    - uses: actions/upload-artifact@v4
+      if: always()
+      with:
+        name: playwright-report-chromium-2x
+        path: ComfyUI_frontend/playwright-report/
+        retention-days: 30
 
-      - name: Install requirements
-        run: |
-          python -m pip install --upgrade pip
-          pip install torch torchvision torchaudio --index-url https://download.pytorch.org/whl/cpu
-          pip install -r requirements.txt
-          pip install wait-for-it
-        working-directory: ComfyUI
-
-      - name: Start ComfyUI server
-        run: |
-          python main.py --cpu --multi-user --front-end-root ../ComfyUI_frontend/dist &
-          wait-for-it --service 127.0.0.1:8188 -t 600
-        working-directory: ComfyUI
-
-      - name: Install Playwright Browsers
-        run: npx playwright install chromium --with-deps
-        working-directory: ComfyUI_frontend
-
-      - name: Run Playwright tests (${{ matrix.browser }})
-        run: npx playwright test --project=${{ matrix.browser }}
-        working-directory: ComfyUI_frontend
-
-      - uses: actions/upload-artifact@v4
-        if: always()
-        with:
-          name: playwright-report-${{ matrix.browser }}
-          path: ComfyUI_frontend/playwright-report/
-          retention-days: 30
+  playwright-tests-mobile-chrome:
+    runs-on: ubuntu-latest
+    steps:
+    - uses: Comfy-Org/ComfyUI_frontend_setup_action@v2.2
+      with:
+        devtools_ref: 080e6d4af809a46852d1c4b7ed85f06e8a3a72be
+    - name: Install Playwright Browsers
+      run: npx playwright install chromium --with-deps
+      working-directory: ComfyUI_frontend
+    - name: Run Playwright tests (Mobile Chrome)
+      run: npx playwright test --project=mobile-chrome
+      working-directory: ComfyUI_frontend
+    - uses: actions/upload-artifact@v4
+      if: always()
+      with:
+        name: playwright-report-mobile-chrome
+        path: ComfyUI_frontend/playwright-report/
+        retention-days: 30

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

@@ -1,44 +0,0 @@
-name: Update Electron Types
-
-on:
-  workflow_dispatch:
-
-jobs:
-  update-electron-types:
-    runs-on: ubuntu-latest
-    permissions:
-      contents: write
-      pull-requests: write
-
-    steps:
-      - name: Checkout repository
-        uses: actions/checkout@v4
-
-      - name: Setup Node.js
-        uses: actions/setup-node@v4
-        with:
-          node-version: lts/*
-          cache: 'npm'
-
-      - name: Update electron types
-        run: npm install @comfyorg/comfyui-electron-types@latest
-
-      - name: Get new version
-        id: get-version
-        run: |
-          NEW_VERSION=$(node -e "console.log(JSON.parse(require('fs').readFileSync('./package-lock.json')).packages['node_modules/@comfyorg/comfyui-electron-types'].version)")
-          echo "NEW_VERSION=$NEW_VERSION" >> $GITHUB_OUTPUT
-
-      - name: Create Pull Request
-        uses: peter-evans/create-pull-request@v7
-        with:
-          token: ${{ secrets.PR_GH_TOKEN }}
-          commit-message: '[chore] Update electron-types to ${{ steps.get-version.outputs.NEW_VERSION }}'
-          title: '[chore] Update electron-types to ${{ steps.get-version.outputs.NEW_VERSION }}'
-          body: |
-            Automated update of desktop API types to version ${{ steps.get-version.outputs.NEW_VERSION }}.
-          branch: update-electron-types-${{ steps.get-version.outputs.NEW_VERSION }}
-          base: main
-          labels: |
-            dependencies
-            Electron

.github/workflows/update-litegraph.yaml

@@ -1,43 +0,0 @@
-name: Update Litegraph Dependency
-
-on:
-  workflow_dispatch:
-
-jobs:
-  update-litegraph:
-    runs-on: ubuntu-latest
-    permissions:
-      contents: write
-      pull-requests: write
-
-    steps:
-      - name: Checkout repository
-        uses: actions/checkout@v4
-
-      - name: Setup Node.js
-        uses: actions/setup-node@v4
-        with:
-          node-version: lts/*
-
-      - name: Update litegraph
-        run: npm install @comfyorg/litegraph@latest
-
-      - name: Get new version
-        id: get-version
-        run: |
-          NEW_VERSION=$(node -e "console.log(JSON.parse(require('fs').readFileSync('./package-lock.json')).packages['node_modules/@comfyorg/litegraph'].version)")
-          echo "NEW_VERSION=$NEW_VERSION" >> $GITHUB_OUTPUT
-
-      - name: Create Pull Request
-        uses: peter-evans/create-pull-request@v7
-        with:
-          token: ${{ secrets.PR_GH_TOKEN }}
-          commit-message: '[chore] Update litegraph to ${{ steps.get-version.outputs.NEW_VERSION }}'
-          title: '[chore] Update litegraph to ${{ steps.get-version.outputs.NEW_VERSION }}'
-          body: |
-            Automated update of litegraph to version ${{ steps.get-version.outputs.NEW_VERSION }}.
-            Ref: https://github.com/Comfy-Org/litegraph.js/releases/tag/v${{ steps.get-version.outputs.NEW_VERSION }}
-          branch: update-litegraph-${{ steps.get-version.outputs.NEW_VERSION }}
-          base: main
-          labels: |
-            dependencies

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

@@ -1,97 +0,0 @@
-name: Update Comfy Registry API Types
-
-on:
-  # Manual trigger
-  workflow_dispatch:
-
-  # Triggered from comfy-api repo
-  repository_dispatch:
-    types: [comfy-api-updated]
-
-jobs:
-  update-registry-types:
-    runs-on: ubuntu-latest
-    permissions:
-      contents: write
-      pull-requests: write
-    steps:
-      - name: Checkout repository
-        uses: actions/checkout@v4
-
-      - name: Setup Node.js
-        uses: actions/setup-node@v4
-        with:
-          node-version: lts/*
-          cache: 'npm'
-
-      - name: Install dependencies
-        run: npm ci
-
-      - name: Checkout comfy-api repository
-        uses: actions/checkout@v4
-        with:
-          repository: Comfy-Org/comfy-api
-          path: comfy-api
-          token: ${{ secrets.COMFY_API_PAT }}
-          clean: true
-
-      - name: Get API commit information
-        id: api-info
-        run: |
-          cd comfy-api
-          API_COMMIT=$(git rev-parse --short HEAD)
-          echo "commit=${API_COMMIT}" >> $GITHUB_OUTPUT
-          cd ..
-
-      - name: Generate API types
-        run: |
-          echo "Generating TypeScript types from comfy-api@${{ steps.api-info.outputs.commit }}..."
-          npx openapi-typescript ./comfy-api/openapi.yml --output ./src/types/comfyRegistryTypes.ts
-
-      - name: Validate generated types
-        run: |
-          if [ ! -f ./src/types/comfyRegistryTypes.ts ]; then
-            echo "Error: Types file was not generated."
-            exit 1
-          fi
-
-          # Check if file is not empty
-          if [ ! -s ./src/types/comfyRegistryTypes.ts ]; then
-            echo "Error: Generated types file is empty."
-            exit 1
-          fi
-
-      - name: Check for changes
-        id: check-changes
-        run: |
-          if [[ -z $(git status --porcelain ./src/types/comfyRegistryTypes.ts) ]]; then
-            echo "No changes to Comfy Registry API types detected."
-            echo "changed=false" >> $GITHUB_OUTPUT
-            exit 0
-          else
-            echo "Changes detected in Comfy Registry API types."
-            echo "changed=true" >> $GITHUB_OUTPUT
-          fi
-
-      - name: Create Pull Request
-        if: steps.check-changes.outputs.changed == 'true'
-        uses: peter-evans/create-pull-request@v7
-        with:
-          token: ${{ secrets.PR_GH_TOKEN }}
-          commit-message: '[chore] Update Comfy Registry API types from comfy-api@${{ steps.api-info.outputs.commit }}'
-          title: '[chore] Update Comfy Registry API types from comfy-api@${{ steps.api-info.outputs.commit }}'
-          body: |
-            ## Automated API Type Update
-
-            This PR updates the Comfy Registry API types from the latest comfy-api OpenAPI specification.
-
-            - API commit: ${{ steps.api-info.outputs.commit }}
-            - Generated on: ${{ github.event.repository.updated_at }}
-
-            These types are automatically generated using openapi-typescript.
-          branch: update-registry-types-${{ steps.api-info.outputs.commit }}
-          base: main
-          labels: CNR
-          delete-branch: true
-          add-paths: |
-            src/types/comfyRegistryTypes.ts

.github/workflows/version-bump.yaml

@@ -1,51 +0,0 @@
-name: Version Bump
-
-on:
-  workflow_dispatch:
-    inputs:
-      version_type:
-        description: 'Version increment type'
-        required: true
-        default: 'patch'
-        type: 'choice'
-        options:
-          - patch
-          - minor
-          - major
-
-jobs:
-  bump-version:
-    runs-on: ubuntu-latest
-    permissions:
-      contents: write
-      pull-requests: write
-
-    steps:
-      - name: Checkout repository
-        uses: actions/checkout@v4
-
-      - name: Setup Node.js
-        uses: actions/setup-node@v4
-        with:
-          node-version: lts/*
-          cache: 'npm'
-
-      - name: Bump version
-        id: bump-version
-        run: |
-          npm version ${{ github.event.inputs.version_type }} --no-git-tag-version
-          NEW_VERSION=$(node -p "require('./package.json').version")
-          echo "NEW_VERSION=$NEW_VERSION" >> $GITHUB_OUTPUT
-
-      - name: Create Pull Request
-        uses: peter-evans/create-pull-request@v7
-        with:
-          token: ${{ secrets.PR_GH_TOKEN }}
-          commit-message: '[release] Bump version to ${{ steps.bump-version.outputs.NEW_VERSION }}'
-          title: '${{ steps.bump-version.outputs.NEW_VERSION }}'
-          body: |
-            Automated version bump to ${{ steps.bump-version.outputs.NEW_VERSION }}
-          branch: version-bump-${{ steps.bump-version.outputs.NEW_VERSION }}
-          base: main
-          labels: |
-            Release

.github/workflows/vitest.yaml

@@ -22,6 +22,4 @@ jobs:
       run: npm ci
 
     - name: Run Vitest tests
-      run: |
-        npm run test:component
-        npm run test:unit
+      run: npm run test:component

.gitignore

@@ -38,7 +38,7 @@ tests-ui/workflows/examples
 /playwright-report/
 /blob-report/
 /playwright/.cache/
-browser_tests/**/*-win32.png
+browser_tests/*/*-win32.png
 
 .env
 
@@ -48,13 +48,3 @@ dist.zip
 
 # Generated JSON Schemas
 /schemas/
-
-# Workflow templates assets
-# Hosted on https://github.com/Comfy-Org/workflow_templates
-/public/templates/
-
-# Temporary repository directory
-templates_repo/
-
-# Vite’s timestamped config modules
-vite.config.mts.timestamp-*.mjs

.i18nrc.cjs

@@ -4,13 +4,13 @@
 const { defineConfig } = require('@lobehub/i18n-cli');
 
 module.exports = defineConfig({
-  modelName: 'gpt-4.1',
+  modelName: 'gpt-4',
   splitToken: 1024,
   entry: 'src/locales/en',
   entryLocale: 'en',
   output: 'src/locales',
-  outputLocales: ['zh', 'ru', 'ja', 'ko', 'fr', 'es'],
-  reference: `Special names to keep untranslated: flux, photomaker, clip, vae, cfg, stable audio, stable cascade, stable zero, controlnet, lora, HiDream.
+  outputLocales: ['zh', 'ru', 'ja', 'ko', 'fr'],
+  reference: `Special names to keep untranslated: flux, photomaker, clip, vae, cfg, stable audio, stable cascade.
   'latent' is the short form of 'latent space'.
   'mask' is in the context of image processing.
   `

.vscode/extensions.json

@@ -1,25 +0,0 @@
-{
-  "recommendations": [
-    "austenc.tailwind-docs",
-    "bradlc.vscode-tailwindcss",
-    "davidanson.vscode-markdownlint",
-    "dbaeumer.vscode-eslint",
-    "eamodio.gitlens",
-    "esbenp.prettier-vscode",
-    "figma.figma-vscode-extension",
-    "github.vscode-github-actions",
-    "github.vscode-pull-request-github",
-    "hbenl.vscode-test-explorer",
-    "lokalise.i18n-ally",
-    "ms-playwright.playwright",
-    "vitest.explorer",
-    "vue.volar",
-    "sonarsource.sonarlint-vscode",
-    "deque-systems.vscode-axe-linter",
-    "kisstkondoros.vscode-codemetrics",
-    "donjayamanne.githistory",
-    "wix.vscode-import-cost",
-    "prograhammer.tslint-vue",
-    "antfu.vite"
-  ]
-}

README.md

@@ -31,22 +31,8 @@
 
 ## Release Schedule
 
-The project follows a structured release process for each minor version, consisting of three distinct phases:
+### Nightly Release
 
-1. **Development Phase** - 1 week
-   - Active development of new features
-   - Code changes merged to the development branch
-
-2. **Feature Freeze** - 1 week
-   - No new features accepted
-   - Only bug fixes are cherry-picked to the release branch
-   - Testing and stabilization of the codebase
-
-3. **Publication**
-   - Release is published at the end of the freeze period
-   - Version is finalized and made available to all users
-
-### Nightly Releases
 Nightly releases are published daily at [https://github.com/Comfy-Org/ComfyUI_frontend/releases](https://github.com/Comfy-Org/ComfyUI_frontend/releases).
 
 To use the latest nightly release, add the following command line argument to your ComfyUI launch script:
@@ -55,17 +41,18 @@ To use the latest nightly release, add the following command line argument to yo
 --front-end-version Comfy-Org/ComfyUI_frontend@latest
 ```
 
-## Overlapping Release Cycles
-The development of successive minor versions overlaps. For example, while version 1.1 is in feature freeze, development for version 1.2 begins simultaneously.
+#### For Windows Stand-alone Build Users
 
-### Example Release Cycle
+Edit your `run_cpu.bat` or `run_nvidia_gpu.bat` file as follows:
 
-| Week | Date Range | Version 1.1 | Version 1.2 | Version 1.3 | Patch Releases |
-|------|------------|-------------|-------------|-------------|----------------|
-| 1 | Mar 1-7 | Development | - | - | - |
-| 2 | Mar 8-14 | Feature Freeze | Development | - | 1.1.0 through 1.1.6 (daily) |
-| 3 | Mar 15-21 | Released | Feature Freeze | Development | 1.1.7 through 1.1.13 (daily)<br>1.2.0 through 1.2.6 (daily) |
-| 4 | Mar 22-28 | - | Released | Feature Freeze | 1.2.7 through 1.2.13 (daily)<br>1.3.0 through 1.3.6 (daily) |
+```bat
+.\python_embeded\python.exe -s ComfyUI\main.py --windows-standalone-build --front-end-version Comfy-Org/ComfyUI_frontend@latest
+pause
+```
+
+### Stable Release
+
+Stable releases are published bi-weekly in the ComfyUI main repository.
 
 ## Release Summary
 
@@ -510,60 +497,14 @@ The selection toolbox will display the command button when items are selected:
 
 </details>
 
-## Contributing
-
-We're building this frontend together and would love your help — no matter how you'd like to pitch in! You don't need to write code to make a difference.
-
-Here are some ways to get involved:
-
-- **Pull Requests:** Add features, fix bugs, or improve code health. Browse [issues](https://github.com/Comfy-Org/ComfyUI_frontend/issues) for inspiration.
-- **Vote on Features:** Give a 👍 to the feature requests you care about to help us prioritize.
-- **Verify Bugs:** Try reproducing reported issues and share your results (even if the bug doesn't occur!).
-- **Community Support:** Hop into our [Discord](https://www.comfy.org/discord) to answer questions or get help.
-- **Share & Advocate:** Tell your friends, tweet about us, or share tips to support the project.
-
-Have another idea? Drop into Discord or open an issue, and let's chat!
-
 ## Development
 
-### Prerequisites
-
-- Node.js (v16 or later) and npm must be installed
-- Git for version control
-- A running ComfyUI backend instance
-
-### Initial Setup
-
-1. Clone the repository:
-   ```bash
-   git clone https://github.com/Comfy-Org/ComfyUI_frontend.git
-   cd ComfyUI_frontend
-   ```
-
-2. Install dependencies:
-   ```bash
-   npm install
-   ```
-
-3. Configure environment (optional):
-   Create a `.env` file in the project root based on the provided [.env.example](.env.example) file.
-
-   **Note about ports**: By default, the dev server expects the ComfyUI backend at `localhost:8188`. If your ComfyUI instance runs on a different port, update this in your `.env` file.
-
-### Dev Server Configuration
-
-To launch ComfyUI and have it connect to your development server:
-
-```bash
-python main.py --port 8188
-```
-
 ### Tech Stack
 
 - [Vue 3](https://vuejs.org/) with [TypeScript](https://www.typescriptlang.org/)
 - [Pinia](https://pinia.vuejs.org/) for state management
 - [PrimeVue](https://primevue.org/) with [TailwindCSS](https://tailwindcss.com/) for UI
-- [litegraph.js](https://github.com/Comfy-Org/litegraph.js) for node editor
+- [Litegraph](https://github.com/Comfy-Org/litegraph.js) for node editor
 - [zod](https://zod.dev/) for schema validation
 - [vue-i18n](https://github.com/intlify/vue-i18n) for internationalization
 
@@ -579,6 +520,7 @@ core extensions will be loaded.
 
 - Start local ComfyUI backend at `localhost:8188`
 - Run `npm run dev` to start the dev server
+- Run `npm run dev:electron` to start the dev server with electron API mocked
 
 #### Access dev server on touch devices
 
@@ -602,16 +544,12 @@ After you start the dev server, you should see following logs:
 Make sure your desktop machine and touch device are on the same network. On your touch device,
 navigate to `http://<server_ip>:5173` (e.g. `http://192.168.2.20:5173` here), to access the ComfyUI frontend.
 
-### Recommended Code Editor Configuration
-
-This project includes `.vscode/launch.json.default` and `.vscode/settings.json.default` files with recommended launch and workspace settings for editors that use the `.vscode` directory (e.g., VS Code, Cursor, etc.).
-
-We've also included a list of recommended extensions in `.vscode/extensions.json`. Your editor should detect this file and show a human friendly list in the Extensions panel, linking each entry to its marketplace page.
-
 ### Unit Test
 
+- `git clone https://github.com/comfyanonymous/ComfyUI_examples.git` to `tests-ui/ComfyUI_examples` or the EXAMPLE_REPO_PATH location specified in .env
 - `npm i` to install all dependencies
-- `npm run test:unit` to execute all unit tests.
+- `npm run test:generate` to fetch `tests-ui/data/object_info.json`
+- `npm run test:jest` to execute all unit tests.
 
 ### Component Test
 
@@ -623,117 +561,97 @@ Component test verifies Vue components in `src/components/`.
 
 Playwright test verifies the whole app. See <https://github.com/Comfy-Org/ComfyUI_frontend/blob/main/browser_tests/README.md> for details.
 
-### litegraph.js
+### LiteGraph
 
 This repo is using litegraph package hosted on <https://github.com/Comfy-Org/litegraph.js>. Any changes to litegraph should be submitted in that repo instead.
 
-#### Test litegraph.js changes
+### Test litegraph changes
 
 - Run `npm link` in the local litegraph repo.
 - Run `npm link @comfyorg/litegraph` in this repo.
 
 This will replace the litegraph package in this repo with the local litegraph repo.
 
-### i18n
+## Internationalization (i18n)
 
-See [locales/README.md](src/locales/README.md) for details.
+Our project supports multiple languages using `vue-i18n`. This allows users around the world to use the application in their preferred language.
 
-## Troubleshooting
+### Supported Languages
 
-> **Note**: For comprehensive troubleshooting and how-to guides, please refer to our [official documentation](https://docs.comfy.org/). This section covers only the most common issues related to frontend development.
+ - en (English)
+ - zh (中文)
+ - ru (Русский)
+ - ja (日本語)
+ - ko (한국어)
+ - fr (Français)
 
-> **Desktop Users**: For issues specific to the desktop application, please refer to the [ComfyUI desktop repository](https://github.com/Comfy-Org/desktop).
+### How to Add a New Language
 
-### Debugging Custom Node (Extension) Issues
+We welcome the addition of new languages. You can add a new language by following these steps:
 
-If you're experiencing crashes, errors, or unexpected behavior with ComfyUI, it's often caused by custom nodes (extensions). Follow these steps to identify and resolve the issues:
+#### 1. Generate language files
+We use [lobe-i18n](https://github.com/lobehub/lobe-cli-toolbox/blob/master/packages/lobe-i18n/README.md) as our translation tool, which integrates with LLM for efficient localization.
 
-#### Step 1: Verify if custom nodes are causing the problem
+Update the configuration file to include the new language(s) you wish to add:
 
-Run ComfyUI with the `--disable-all-custom-nodes` flag:
 
-```bash
-python main.py --disable-all-custom-nodes
+```javascript
+const { defineConfig } = require('@lobehub/i18n-cli');
+
+module.exports = defineConfig({
+  entry: 'src/locales/en.json', // Base language file
+  entryLocale: 'en',
+  output: 'src/locales',
+  outputLocales: ['zh', 'ru', 'ja'], // Add the new language(s) here
+});
 ```
 
-If the issue disappears, a custom node is the culprit. Proceed to the next step.
+Set your OpenAI API Key by running the following command:
 
-#### Step 2: Identify the problematic custom node using binary search
+```sh
+npx lobe-i18n --option
+```
 
-Rather than disabling nodes one by one, use this more efficient approach:
+Once configured, generate the translation files with:
 
-1. Temporarily move half of your custom nodes out of the `custom_nodes` directory
-   ```bash
-   # Create a temporary directory
-   # Linux/Mac
-   mkdir ~/custom_nodes_disabled
-   
-   # Windows
-   mkdir %USERPROFILE%\custom_nodes_disabled
-   
-   # Move half of your custom nodes (assuming you have node1 through node8)
-   # Linux/Mac
-   mv custom_nodes/node1 custom_nodes/node2 custom_nodes/node3 custom_nodes/node4 ~/custom_nodes_disabled/
-   
-   # Windows
-   move custom_nodes\node1 custom_nodes\node2 custom_nodes\node3 custom_nodes\node4 %USERPROFILE%\custom_nodes_disabled\
-   ```
+```sh
+npx lobe-i18n locale
+```
 
-2. Run ComfyUI again
-   - If the issue persists: The problem is in nodes 5-8 (the remaining half)
-   - If the issue disappears: The problem is in nodes 1-4 (the moved half)
+This will create the language files for the specified languages in the configuration.
 
-3. Let's assume the issue disappeared, so the problem is in nodes 1-4. Move half of these for the next test:
-   ```bash
-   # Move nodes 3-4 back to custom_nodes
-   # Linux/Mac
-   mv ~/custom_nodes_disabled/node3 ~/custom_nodes_disabled/node4 custom_nodes/
-   
-   # Windows
-   move %USERPROFILE%\custom_nodes_disabled\node3 %USERPROFILE%\custom_nodes_disabled\node4 custom_nodes\
-   ```
+#### 2. Update i18n Configuration
 
-4. Run ComfyUI again
-   - If the issue reappears: The problem is in nodes 3-4
-   - If issue still gone: The problem is in nodes 1-2
+Import the newly generated locale file(s) in the `src/i18n.ts` file to include them in the application's i18n setup.
 
-5. Let's assume the issue reappeared, so the problem is in nodes 3-4. Test each one:
-   ```bash
-   # Move node 3 back to disabled
-   # Linux/Mac
-   mv custom_nodes/node3 ~/custom_nodes_disabled/
-   
-   # Windows
-   move custom_nodes\node3 %USERPROFILE%\custom_nodes_disabled\
-   ```
+#### 3. Enable Selection of the New Language
 
-6. Run ComfyUI again
-   - If the issue disappears: node3 is the problem
-   - If issue persists: node4 is the problem
+Add the newly added language to the following item in `src/constants/coreSettings.ts`:
 
-7. Repeat until you identify the specific problematic node
+```typescript
+  {
+    id: 'Comfy.Locale',
+    name: 'Locale',
+    type: 'combo',
+    // Add the new language(s) here
+    options: [
+      { value: 'en', text: 'English' },
+      { value: 'zh', text: '中文' },
+      { value: 'ru', text: 'Русский' },
+      { value: 'ja', text: '日本語' }
+    ],
+    defaultValue: navigator.language.split('-')[0] || 'en'
+  },
+```
 
-#### Step 3: Update or replace the problematic node
+This will make the new language selectable in the application's settings.
 
-Once identified:
-1. Check for updates to the problematic custom node
-2. Consider alternatives with similar functionality
-3. Report the issue to the custom node developer with specific details
+#### 4. Test the Translations
 
-### Common Issues and Solutions
+Start the development server, switch to the new language, and verify the translations.
+You can switch languages by opening the ComfyUI Settings and selecting from the `ComfyUI > Locale` dropdown box.
 
-- **"Module not found" errors**: Usually indicates missing Python dependencies. Check the custom node's `requirements.txt` file for required packages and install them:
-  ```bash
-  pip install -r custom_nodes/problematic_node/requirements.txt
-  ```
+## Deploy
 
-- **Frontend or Templates Package Not Updated**: After updating ComfyUI via Git, ensure you update the frontend dependencies:
-  ```bash
-  pip install -r requirements.txt
-  ```
-
-- **Can't Find Custom Node**: Make sure to disable node validation in ComfyUI settings.
-
-- **Error Toast About Workflow Failing Validation**: Report the issue to the ComfyUI team. As a temporary workaround, disable workflow validation in settings.
-
-- **Login Issues When Not on Localhost**: Normal login is only available when accessing from localhost. If you're running ComfyUI via LAN, another domain, or headless, you can use our API key feature to authenticate. The API key lets you log in normally through the UI. Generate an API key at [platform.comfy.org/login](https://platform.comfy.org/login) and use it in the API Key field in the login dialog or with the `--api-key` command line argument. Refer to our [API Key Integration Guide](https://docs.comfy.org/essentials/comfyui-server/api-key-integration#integration-of-api-key-to-use-comfyui-api-nodes) for complete setup instructions.
+- Option 1: Set `DEPLOY_COMFYUI_DIR` in `.env` and run `npm run deploy`.
+- Option 2: Copy everything under `dist/` to `ComfyUI/web/` in your ComfyUI checkout manually.

babel.config.json

@@ -0,0 +1,8 @@
+{
+	"presets": [
+		"@babel/preset-env"
+	],
+	"plugins": [
+		"babel-plugin-transform-import-meta"
+	]
+}

browser_tests/README.md

@@ -9,26 +9,15 @@ If `TEST_COMFYUI_DIR` in `.env` isn't set to your `(Comfy Path)/ComfyUI` directo
 
 ## Setup
 
-### ComfyUI devtools
-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._
+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.
 
-### Node.js & Playwright Prerequisites
 Ensure you have Node.js v20 or later installed. Then, set up the Chromium test driver:
+
 ```bash
 npx playwright install chromium --with-deps
 ```
 
-### Environment Variables
-Ensure the environment variables in `.env` are set correctly according to your setup. 
-
-The `.env` file will not exist until you create it yourself.
-
-A template with helpful information can be found in `.env_example`.
-
-### Multiple Tests
-If you are running Playwright tests in parallel or running the same test multiple times, the flag `--multi-user` must be added to the main ComfyUI process.
-
 ## Running Tests
 
 There are two ways to run the tests:
@@ -45,6 +34,8 @@ There are two ways to run the tests:
    ```
    This opens a user interface where you can select specific tests to run and inspect the test execution timeline.
 
+   To run the same test multiple times in Playwright's UI mode, you must launch the main ComfyUI process with the `--multi-user` flag.
+
    ![Playwright UI Mode](https://github.com/user-attachments/assets/6a1ebef0-90eb-4157-8694-f5ee94d03755)
 
 ## Screenshot Expectations

browser_tests/actionbar.spec.ts

@@ -1,9 +1,9 @@
 import type { Response } from '@playwright/test'
 import { expect, mergeTests } from '@playwright/test'
 
-import type { StatusWsMessage } from '../../src/schemas/apiSchema.ts'
-import { comfyPageFixture } from '../fixtures/ComfyPage.ts'
-import { webSocketFixture } from '../fixtures/ws.ts'
+import type { StatusWsMessage } from '../src/schemas/apiSchema.ts'
+import { comfyPageFixture } from './fixtures/ComfyPage'
+import { webSocketFixture } from './fixtures/ws.ts'
 
 const test = mergeTests(comfyPageFixture, webSocketFixture)
 

browser_tests/assets/bad_link.json

@@ -1,126 +0,0 @@
-{
-  "id": "51b9b184-770d-40ac-a478-8cc31667ff23",
-  "revision": 0,
-  "last_node_id": 5,
-  "last_link_id": 3,
-  "nodes": [
-    {
-      "id": 4,
-      "type": "KSampler",
-      "pos": [
-        867.4669799804688,
-        347.22369384765625
-      ],
-      "size": [
-        315,
-        262
-      ],
-      "flags": {},
-      "order": 1,
-      "mode": 0,
-      "inputs": [
-        {
-          "name": "model",
-          "type": "MODEL",
-          "link": null
-        },
-        {
-          "name": "positive",
-          "type": "CONDITIONING",
-          "link": null
-        },
-        {
-          "name": "negative",
-          "type": "CONDITIONING",
-          "link": null
-        },
-        {
-          "name": "latent_image",
-          "type": "LATENT",
-          "link": null
-        },
-        {
-          "name": "steps",
-          "type": "INT",
-          "widget": {
-            "name": "steps"
-          },
-          "link": 3
-        }
-      ],
-      "outputs": [
-        {
-          "name": "LATENT",
-          "type": "LATENT",
-          "links": null
-        }
-      ],
-      "properties": {
-        "Node name for S&R": "KSampler"
-      },
-      "widgets_values": [
-        0,
-        "randomize",
-        20,
-        8,
-        "euler",
-        "normal",
-        1
-      ]
-    },
-    {
-      "id": 5,
-      "type": "PrimitiveInt",
-      "pos": [
-        443.0852355957031,
-        441.131591796875
-      ],
-      "size": [
-        315,
-        82
-      ],
-      "flags": {},
-      "order": 0,
-      "mode": 0,
-      "inputs": [],
-      "outputs": [
-        {
-          "name": "INT",
-          "type": "INT",
-          "links": [
-            3
-          ]
-        }
-      ],
-      "properties": {
-        "Node name for S&R": "PrimitiveInt"
-      },
-      "widgets_values": [
-        0,
-        "randomize"
-      ]
-    }
-  ],
-  "links": [
-    [
-      3,
-      5,
-      0,
-      4,
-      5,
-      "INT"
-    ]
-  ],
-  "groups": [],
-  "config": {},
-  "extra": {
-    "ds": {
-      "scale": 1.9487171000000016,
-      "offset": [
-        -325.57196748514497,
-        -168.13150517966463
-      ]
-    }
-  },
-  "version": 0.4
-}

browser_tests/assets/collapsed_multiline.json

@@ -33,11 +33,5 @@
   "links": [],
   "groups": [],
   "config": {},
-  "extra": {
-    "ds": {
-      "offset": [0, 0],
-      "scale": 1
-    }
-  },
   "version": 0.4
 }

browser_tests/assets/default.json

@@ -130,11 +130,6 @@
   ],
   "groups": [],
   "config": {},
-  "extra": {
-    "ds": {
-      "offset": [0, 0],
-      "scale": 1
-    }
-  },
+  "extra": {},
   "version": 0.4
 }

browser_tests/assets/default_input.json

@@ -1,53 +0,0 @@
-{
-  "id": "9bcb9451-8319-492a-88d4-fb711d8c3d25",
-  "revision": 0,
-  "last_node_id": 6,
-  "last_link_id": 0,
-  "nodes": [
-    {
-      "id": 6,
-      "type": "DevToolsNodeWithDefaultInput",
-      "pos": [
-        8.39722728729248,
-        29.727279663085938
-      ],
-      "size": [
-        315,
-        82
-      ],
-      "flags": {},
-      "order": 0,
-      "mode": 0,
-      "inputs": [
-        {
-          "name": "float_input",
-          "shape": 7,
-          "type": "FLOAT",
-          "link": null
-        }
-      ],
-      "outputs": [],
-      "properties": {
-        "Node name for S&R": "DevToolsNodeWithDefaultInput"
-      },
-      "widgets_values": [
-        0,
-        1,
-        0
-      ]
-    }
-  ],
-  "links": [],
-  "groups": [],
-  "config": {},
-  "extra": {
-    "ds": {
-      "scale": 1,
-      "offset": [
-        0,
-        0
-      ]
-    }
-  },
-  "version": 0.4
-}

browser_tests/assets/dynamically_added_input.json

@@ -1,82 +0,0 @@
-{
-  "last_node_id": 9,
-  "last_link_id": 13,
-  "nodes": [
-    {
-      "id": 3,
-      "type": "KSampler",
-      "pos": [
-        0,
-        30
-      ],
-      "size": {
-        "0": 315,
-        "1": 262
-      },
-      "flags": {},
-      "order": 0,
-      "mode": 0,
-      "inputs": [
-        {
-          "name": "model",
-          "type": "MODEL",
-          "link": null
-        },
-        {
-          "name": "positive",
-          "type": "CONDITIONING",
-          "link": null
-        },
-        {
-          "name": "negative",
-          "type": "CONDITIONING",
-          "link": null
-        },
-        {
-          "name": "latent_image",
-          "type": "LATENT",
-          "link": null
-        } ,
-        {
-          "name": "dynamic_input",
-          "type": "FLOAT",
-          "link": null,
-          "_meta": "Dynamically added input via frontend JS logic"
-        }
-      ],
-      "outputs": [
-        {
-          "name": "LATENT",
-          "type": "LATENT",
-          "links": [],
-          "slot_index": 0
-        }
-      ],
-      "properties": {
-        "Node name for S&R": "KSampler"
-      },
-      "widgets_values": [
-        156680208700286,
-        "randomize",
-        20,
-        8,
-        "euler",
-        "normal",
-        1
-      ]
-    }
-  ],
-  "links": [],
-  "groups": [],
-  "config": {},
-  "extra": {
-    "ds": {
-      "scale": 1,
-      "offset": [
-        0,
-        0
-      ]
-    }
-  },
-  "version": 0.4
-}

browser_tests/assets/every_node_color.json

@@ -499,11 +499,6 @@
   ],
   "groups": [],
   "config": {},
-  "extra": {
-    "ds": {
-      "offset": [0, 0],
-      "scale": 1
-    }
-  },
+  "extra": {},
   "version": 0.4
-}
+}

browser_tests/assets/execution/partial_execution.json

@@ -1,85 +0,0 @@
-{
-  "id": "1a95532f-c8aa-4c9d-a7f6-f928ba2d4862",
-  "revision": 0,
-  "last_node_id": 4,
-  "last_link_id": 3,
-  "nodes": [
-    {
-      "id": 4,
-      "type": "PreviewAny",
-      "pos": [946.2566528320312, 598.4373168945312],
-      "size": [140, 76],
-      "flags": {},
-      "order": 2,
-      "mode": 0,
-      "inputs": [
-        {
-          "name": "source",
-          "type": "*",
-          "link": 3
-        }
-      ],
-      "outputs": [],
-      "properties": {
-        "Node name for S&R": "PreviewAny"
-      },
-      "widgets_values": []
-    },
-    {
-      "id": 1,
-      "type": "PreviewAny",
-      "pos": [951.0236206054688, 421.3861083984375],
-      "size": [140, 76],
-      "flags": {},
-      "order": 1,
-      "mode": 0,
-      "inputs": [
-        {
-          "name": "source",
-          "type": "*",
-          "link": 2
-        }
-      ],
-      "outputs": [],
-      "properties": {
-        "Node name for S&R": "PreviewAny"
-      },
-      "widgets_values": []
-    },
-    {
-      "id": 3,
-      "type": "PrimitiveString",
-      "pos": [575.1760864257812, 504.5214538574219],
-      "size": [270, 58],
-      "flags": {},
-      "order": 0,
-      "mode": 0,
-      "inputs": [],
-      "outputs": [
-        {
-          "name": "STRING",
-          "type": "STRING",
-          "links": [2, 3]
-        }
-      ],
-      "properties": {
-        "Node name for S&R": "PrimitiveString"
-      },
-      "widgets_values": ["foo"]
-    }
-  ],
-  "links": [
-    [2, 3, 0, 1, 0, "*"],
-    [3, 3, 0, 4, 0, "*"]
-  ],
-  "groups": [],
-  "config": {},
-  "extra": {
-    "frontendVersion": "1.19.1",
-    "ds": {
-      "offset": [0, 0],
-      "scale": 1
-    }
-  },
-  "version": 0.4
-}

browser_tests/assets/group_node_identical_nodes_hidden_inputs.json

@@ -160,4 +160,4 @@
     }
   },
   "version": 0.4
-}
+}

browser_tests/assets/group_node_v1.3.3.json

@@ -43,10 +43,6 @@
   "groups": [],
   "config": {},
   "extra": {
-    "ds": {
-      "offset": [0, 0],
-      "scale": 1
-    },
     "groupNodes": {
       "group_node": {
         "nodes": [
@@ -405,4 +401,4 @@
     }
   },
   "version": 0.4
-}
+}

browser_tests/assets/input_order_swap.json

@@ -1,74 +0,0 @@
-{
-  "id": "51b9b184-770d-40ac-a478-8cc31667ff23",
-  "revision": 0,
-  "last_node_id": 2,
-  "last_link_id": 1,
-  "nodes": [
-    {
-      "id": 1,
-      "type": "CLIPTextEncode",
-      "pos": [904, 466],
-      "size": [400, 200],
-      "flags": {},
-      "order": 1,
-      "mode": 0,
-      "inputs": [
-        {
-          "name": "text",
-          "type": "STRING",
-          "widget": {
-            "name": "text"
-          },
-          "link": 1
-        },
-        {
-          "name": "clip",
-          "type": "CLIP",
-          "link": null
-        }
-      ],
-      "outputs": [
-        {
-          "name": "CONDITIONING",
-          "type": "CONDITIONING",
-          "links": null
-        }
-      ],
-      "properties": {
-        "Node name for S&R": "CLIPTextEncode"
-      },
-      "widgets_values": [""]
-    },
-    {
-      "id": 2,
-      "type": "PrimitiveString",
-      "pos": [556.8589477539062, 472.94342041015625],
-      "size": [315, 58],
-      "flags": {},
-      "order": 0,
-      "mode": 0,
-      "inputs": [],
-      "outputs": [
-        {
-          "name": "STRING",
-          "type": "STRING",
-          "links": [1]
-        }
-      ],
-      "properties": {
-        "Node name for S&R": "PrimitiveString"
-      },
-      "widgets_values": ["foo"]
-    }
-  ],
-  "links": [[1, 2, 0, 1, 0, "STRING"]],
-  "groups": [],
-  "config": {},
-  "extra": {
-    "ds": {
-      "scale": 1.7715610000000013,
-      "offset": [-388.521484375, -162.31336975097656]
-    }
-  },
-  "version": 0.4
-}

browser_tests/assets/legacy_group_node.json

@@ -110,10 +110,6 @@
   "groups": [],
   "config": {},
   "extra": {
-    "ds": {
-      "offset": [0, 0],
-      "scale": 1
-    },
     "groupNodes": {
       "hello": {
         "nodes": [
@@ -253,4 +249,4 @@
     }
   },
   "version": 0.4
-}
+}

browser_tests/assets/missing_models_from_node_properties.json

@@ -44,11 +44,6 @@
   "links": [],
   "groups": [],
   "config": {},
-  "extra": {
-    "ds": {
-      "offset": [0, 0],
-      "scale": 1
-    }
-  },
+  "extra": {},
   "version": 0.4
 }

browser_tests/assets/missing_nodes_converted_widget.json

@@ -51,21 +51,13 @@
         0.85,
         false,
         false,
-        "",
-        {
-          "foo": "bar"
-        }
+        ""
       ]
     }
   ],
   "links": [],
   "groups": [],
   "config": {},
-  "extra": {
-    "ds": {
-      "offset": [0, 0],
-      "scale": 1
-    }
-  },
+  "extra": {},
   "version": 0.4
-}
+}

browser_tests/assets/node_with_v2_combo_input.json

@@ -1,36 +0,0 @@
-{
-  "id": "5635564e-189f-49e4-9b25-6b7634bcd595",
-  "revision": 0,
-  "last_node_id": 78,
-  "last_link_id": 53,
-  "nodes": [
-    {
-      "id": 78,
-      "type": "DevToolsNodeWithV2ComboInput",
-      "pos": [1320, 904],
-      "size": [270.3199157714844, 58],
-      "flags": {},
-      "order": 0,
-      "mode": 0,
-      "inputs": [],
-      "outputs": [
-        {
-          "name": "COMBO",
-          "type": "COMBO",
-          "links": null
-        }
-      ],
-      "properties": {
-        "Node name for S&R": "DevToolsNodeWithV2ComboInput"
-      },
-      "widgets_values": ["A"]
-    }
-  ],
-  "links": [],
-  "groups": [],
-  "config": {},
-  "extra": {
-    "frontendVersion": "1.19.7"
-  },
-  "version": 0.4
-}

browser_tests/assets/note_nodes.json

@@ -1,60 +0,0 @@
-{
-  "last_node_id": 2,
-  "last_link_id": 0,
-  "nodes": [
-    {
-      "id": 1,
-      "type": "Note",
-      "pos": [
-        50, 50
-      ],
-      "size": [
-        322.3645935058594,
-        167.91612243652344
-      ],
-      "flags": {},
-      "order": 0,
-      "mode": 0,
-      "inputs": [],
-      "outputs": [],
-      "properties": {},
-      "widgets_values": [
-        "Foo\n123"
-      ],
-      "color": "#432",
-      "bgcolor": "#653"
-    },
-    {
-      "id": 2,
-      "type": "MarkdownNote",
-      "pos": [
-        50, 300
-      ],
-      "size": [
-        320.9985656738281,
-        179.52735900878906
-      ],
-      "flags": {},
-      "order": 1,
-      "mode": 0,
-      "inputs": [],
-      "outputs": [],
-      "properties": {},
-      "widgets_values": [
-        "# Bar\n123"
-      ],
-      "color": "#432",
-      "bgcolor": "#653"
-    }
-  ],
-  "links": [],
-  "groups": [],
-  "config": {},
-  "extra": {
-    "ds": {
-      "offset": [0, 0],
-      "scale": 1
-    }
-  },
-  "version": 0.4
-}

browser_tests/assets/only_optional_inputs.json

@@ -38,11 +38,7 @@
   "groups": [],
   "config": {},
   "extra": {
-    "groupNodes": {},
-    "ds": {
-      "offset": [0, 0],
-      "scale": 1
-    }
+    "groupNodes": {}
   },
   "version": 0.4
-}
+}

browser_tests/assets/primitive/primitive_node_unconnected_dom_widget.json

@@ -1,64 +0,0 @@
-{
-  "last_node_id": 3,
-  "last_link_id": 1,
-  "nodes": [
-    {
-      "id": 1,
-      "type": "PrimitiveNode",
-      "pos": [14, 43],
-      "size": [203.1999969482422, 40.36840057373047],
-      "flags": {},
-      "order": 0,
-      "mode": 0,
-      "inputs": [],
-      "outputs": [
-        {
-          "name": "connect to widget input",
-          "type": "*",
-          "links": [],
-          "slot_index": 0
-        }
-      ],
-      "properties": {
-        "Run widget replace on values": false
-      }
-    },
-    {
-      "id": 2,
-      "type": "CLIPTextEncode",
-      "pos": [306.2463684082031, 45.30042266845703],
-      "size": [400, 200],
-      "flags": {},
-      "order": 1,
-      "mode": 0,
-      "inputs": [
-        {
-          "name": "clip",
-          "type": "CLIP",
-          "link": null
-        }
-      ],
-      "outputs": [
-        {
-          "name": "CONDITIONING",
-          "type": "CONDITIONING",
-          "links": null
-        }
-      ],
-      "properties": {
-        "Node name for S&R": "CLIPTextEncode"
-      },
-      "widgets_values": [""]
-    }
-  ],
-  "links": [],
-  "groups": [],
-  "config": {},
-  "extra": {
-    "ds": {
-      "offset": [0, 0],
-      "scale": 1
-    }
-  },
-  "version": 0.4
-}

browser_tests/assets/primitive/static_primitive_unconnected.json

@@ -1,104 +0,0 @@
-{
-  "last_node_id": 2,
-  "last_link_id": 1,
-  "nodes": [
-    {
-      "id": 2,
-      "type": "KSampler",
-      "pos": {
-        "0": 304.3653259277344,
-        "1": 42.15586471557617
-      },
-      "size": [
-        315,
-        262
-      ],
-      "flags": {},
-      "order": 0,
-      "mode": 0,
-      "inputs": [
-        {
-          "name": "model",
-          "type": "MODEL",
-          "link": null
-        },
-        {
-          "name": "positive",
-          "type": "CONDITIONING",
-          "link": null
-        },
-        {
-          "name": "negative",
-          "type": "CONDITIONING",
-          "link": null
-        },
-        {
-          "name": "latent_image",
-          "type": "LATENT",
-          "link": null
-        }
-      ],
-      "outputs": [
-        {
-          "name": "LATENT",
-          "type": "LATENT",
-          "links": null,
-          "shape": 3
-        }
-      ],
-      "properties": {
-        "Node name for S&R": "KSampler"
-      },
-      "widgets_values": [
-        0,
-        "randomize",
-        20,
-        8,
-        "euler",
-        "normal",
-        1
-      ]
-    },
-    {
-      "id": 1,
-      "type": "PrimitiveInt",
-      "pos": {
-        "0": 14,
-        "1": 43
-      },
-      "size": [
-        203.1999969482422,
-        40.368401303242536
-      ],
-      "flags": {},
-      "order": 1,
-      "mode": 0,
-      "inputs": [],
-      "outputs": [
-        {
-          "name": "value",
-          "type": "INT",
-          "links": [],
-          "slot_index": 0
-        }
-      ],
-      "properties": {
-        "Node name for S&R": "Int"
-      },
-      "widgets_values": [10]
-    }
-  ],
-  "links": [],
-  "groups": [],
-  "config": {},
-  "extra": {
-    "ds": {
-      "scale": 1,
-      "offset": [
-        0,
-        0
-      ]
-    }
-  },
-  "version": 0.4
-}

browser_tests/assets/renamed_converted_widget.json

@@ -1,105 +0,0 @@
-{
-  "last_node_id": 4,
-  "last_link_id": 2,
-  "nodes": [
-    {
-      "id": 3,
-      "type": "EmptyLatentImage",
-      "pos": [
-        380.51641845703125,
-        191.39659118652344
-      ],
-      "size": [
-        315,
-        106
-      ],
-      "flags": {},
-      "order": 1,
-      "mode": 0,
-      "inputs": [
-        {
-          "name": "breadth",
-          "type": "INT",
-          "widget": {
-            "name": "breadth"
-          },
-          "link": 2
-        }
-      ],
-      "outputs": [
-        {
-          "name": "LATENT",
-          "type": "LATENT",
-          "links": null
-        }
-      ],
-      "properties": {
-        "Node name for S&R": "EmptyLatentImage"
-      },
-      "widgets_values": [
-        512,
-        512,
-        1
-      ]
-    },
-    {
-      "id": 4,
-      "type": "PrimitiveNode",
-      "pos": [
-        73.6164321899414,
-        197.9966278076172
-      ],
-      "size": [
-        210,
-        82
-      ],
-      "flags": {},
-      "order": 0,
-      "mode": 0,
-      "inputs": [],
-      "outputs": [
-        {
-          "name": "INT",
-          "type": "INT",
-          "widget": {
-            "name": "bredth"
-          },
-          "links": [
-            2
-          ]
-        }
-      ],
-      "title": "breadth",
-      "properties": {
-        "Run widget replace on values": false
-      },
-      "widgets_values": [
-        512,
-        "fixed"
-      ]
-    }
-  ],
-  "links": [
-    [
-      2,
-      4,
-      0,
-      3,
-      0,
-      "INT"
-    ]
-  ],
-  "groups": [],
-  "config": {},
-  "extra": {
-    "ds": {
-      "offset": [0, 0],
-      "scale": 1
-    },
-    "VHS_latentpreview": true,
-    "VHS_latentpreviewrate": 0,
-    "VHS_MetadataImage": false,
-    "VHS_KeepIntermediate": false
-  },
-  "version": 0.4
-}

browser_tests/assets/reroute/native_reroute.json

@@ -1,114 +0,0 @@
-{
-  "last_node_id": 25,
-  "last_link_id": 33,
-  "nodes": [
-    {
-      "id": 4,
-      "type": "CheckpointLoaderSimple",
-      "pos": [160, 240],
-      "size": [315, 98],
-      "flags": {},
-      "order": 0,
-      "mode": 0,
-      "inputs": [],
-      "outputs": [
-        {
-          "name": "MODEL",
-          "type": "MODEL",
-          "slot_index": 0,
-          "links": []
-        },
-        {
-          "name": "CLIP",
-          "type": "CLIP",
-          "slot_index": 1,
-          "links": []
-        },
-        {
-          "name": "VAE",
-          "type": "VAE",
-          "slot_index": 2,
-          "links": [33]
-        }
-      ],
-      "properties": {
-        "Node name for S&R": "CheckpointLoaderSimple"
-      },
-      "widgets_values": ["v1-5-pruned-emaonly.safetensors"]
-    },
-    {
-      "id": 19,
-      "type": "VAEDecode",
-      "pos": [623.0897216796875, 324.64453125],
-      "size": [210, 46],
-      "flags": {},
-      "order": 1,
-      "mode": 0,
-      "inputs": [
-        {
-          "name": "samples",
-          "type": "LATENT",
-          "link": null
-        },
-        {
-          "name": "vae",
-          "type": "VAE",
-          "link": 33
-        }
-      ],
-      "outputs": [
-        {
-          "name": "IMAGE",
-          "type": "IMAGE",
-          "links": null
-        }
-      ],
-      "properties": {
-        "Node name for S&R": "VAEDecode"
-      },
-      "widgets_values": []
-    }
-  ],
-  "links": [[33, 4, 2, 19, 1, "VAE"]],
-  "floatingLinks": [
-    {
-      "id": 6,
-      "origin_id": 4,
-      "origin_slot": 2,
-      "target_id": -1,
-      "target_slot": -1,
-      "type": "VAE",
-      "parentId": 1
-    }
-  ],
-  "groups": [],
-  "config": {},
-  "extra": {
-    "ds": {
-      "offset": [0, 0],
-      "scale": 1
-    },
-    "reroutes": [
-      {
-        "id": 1,
-        "pos": [545.4541015625, 295.85760498046875],
-        "linkIds": [],
-        "floating": {
-          "slotType": "output"
-        }
-      },
-      {
-        "id": 2,
-        "pos": [543.8283081054688, 355.45849609375],
-        "linkIds": [33]
-      }
-    ],
-    "linkExtensions": [
-      {
-        "id": 33,
-        "parentId": 2
-      }
-    ]
-  },
-  "version": 0.4
-}

browser_tests/assets/single_connected_reroute_node.json

@@ -106,7 +106,10 @@
   "extra": {
     "ds": {
       "scale": 1,
-      "offset": [0, 0]
+      "offset": {
+        "0": 0,
+        "1": 0
+      }
     }
   },
   "version": 0.4

browser_tests/assets/string_node_id.json

@@ -368,10 +368,10 @@
     "ds": {
       "scale": 1,
       "offset": [
-        0,
-        0
+        149.9747408641311,
+        383.8593224280729
       ]
     }
   },
   "version": 0.4
-}
+}

browser_tests/assets/widgets/boolean_widget.json

@@ -31,11 +31,5 @@
   "links": [],
   "groups": [],
   "config": {},
-  "extra": {
-    "ds": {
-      "offset": [0, 0],
-      "scale": 1
-    }
-  },
   "version": 0.4
-}
+}

browser_tests/assets/widgets/load_animated_webp.json

@@ -1,11 +0,0 @@
-{
-  "8": {
-    "inputs": {
-      "image": "animated_web.webp"
-    },
-    "class_type": "DevToolsLoadAnimatedImageTest",
-    "_meta": {
-      "title": "Load Animated Image"
-    }
-  }
-}

browser_tests/assets/widgets/load_audio_widget.json

@@ -1,37 +0,0 @@
-{
-  "last_node_id": 1,
-  "last_link_id": 0,
-  "nodes": [
-    {
-      "id": 1,
-      "type": "LoadAudio",
-      "pos": [41.5296516418457, 16.930862426757812],
-      "size": [315, 82],
-      "flags": {},
-      "order": 0,
-      "mode": 0,
-      "inputs": [],
-      "outputs": [
-        {
-          "name": "AUDIO",
-          "type": "AUDIO",
-          "links": null
-        }
-      ],
-      "properties": {
-        "Node name for S&R": "LoadAudio"
-      },
-      "widgets_values": [null, ""]
-    }
-  ],
-  "links": [],
-  "groups": [],
-  "config": {},
-  "extra": {
-    "ds": {
-      "offset": [0, 0],
-      "scale": 1
-    }
-  },
-  "version": 0.4
-}

browser_tests/assets/widgets/load_image_widget.json

@@ -1,51 +0,0 @@
-{
-  "last_node_id": 10,
-  "last_link_id": 10,
-  "nodes": [
-    {
-      "id": 10,
-      "type": "LoadImage",
-      "pos": [
-        50,
-        50
-      ],
-      "size": [
-        315,
-        314
-      ],
-      "flags": {},
-      "order": 0,
-      "mode": 0,
-      "inputs": [],
-      "outputs": [
-        {
-          "name": "IMAGE",
-          "type": "IMAGE",
-          "links": null
-        },
-        {
-          "name": "MASK",
-          "type": "MASK",
-          "links": null
-        }
-      ],
-      "properties": {
-        "Node name for S&R": "LoadImage"
-      },
-      "widgets_values": [
-        "example.png",
-        "image"
-      ]
-    }
-  ],
-  "links": [],
-  "groups": [],
-  "config": {},
-  "extra": {
-    "ds": {
-      "offset": [0, 0],
-      "scale": 1
-    }
-  },
-  "version": 0.4
-}

browser_tests/assets/widgets/save_animated_webp.json

@@ -1,64 +0,0 @@
-{
-  "id": "3f1fcbf9-f9de-4935-8fad-401813f61b13",
-  "revision": 0,
-  "last_node_id": 10,
-  "last_link_id": 4,
-  "nodes": [
-    {
-      "id": 9,
-      "type": "SaveAnimatedWEBP",
-      "pos": [336, 104],
-      "size": [210, 368],
-      "flags": {},
-      "order": 1,
-      "mode": 0,
-      "inputs": [
-        {
-          "name": "images",
-          "type": "IMAGE",
-          "link": 4
-        }
-      ],
-      "outputs": [],
-      "properties": {},
-      "widgets_values": ["ComfyUI", 6, true, 80, "default"]
-    },
-    {
-      "id": 10,
-      "type": "DevToolsLoadAnimatedImageTest",
-      "pos": [64, 104],
-      "size": [210, 316],
-      "flags": {},
-      "order": 0,
-      "mode": 0,
-      "inputs": [],
-      "outputs": [
-        {
-          "name": "IMAGE",
-          "type": "IMAGE",
-          "links": [4]
-        },
-        {
-          "name": "MASK",
-          "type": "MASK",
-          "links": null
-        }
-      ],
-      "properties": {
-        "Node name for S&R": "DevToolsLoadAnimatedImageTest"
-      },
-      "widgets_values": ["animated_web.webp", "image"]
-    }
-  ],
-  "links": [[4, 10, 0, 9, 0, "IMAGE"]],
-  "groups": [],
-  "config": {},
-  "extra": {
-    "frontendVersion": "1.17.0",
-    "ds": {
-      "offset": [0, 0],
-      "scale": 1
-    }
-  },
-  "version": 0.4
-}

browser_tests/browserTabTitle.spec.ts

@@ -1,6 +1,6 @@
 import { expect } from '@playwright/test'
 
-import { comfyPageFixture as test } from '../fixtures/ComfyPage'
+import { comfyPageFixture as test } from './fixtures/ComfyPage'
 
 test.describe('Browser tab title', () => {
   test.describe('Beta Menu', () => {

browser_tests/changeTracker.spec.ts

@@ -2,7 +2,7 @@ import {
   ComfyPage,
   comfyExpect as expect,
   comfyPageFixture as test
-} from '../fixtures/ComfyPage'
+} from './fixtures/ComfyPage'
 
 async function beforeChange(comfyPage: ComfyPage) {
   await comfyPage.page.evaluate(() => {

browser_tests/colorPalette.spec.ts

@@ -1,7 +1,7 @@
 import { expect } from '@playwright/test'
 
-import type { Palette } from '../../src/schemas/colorPaletteSchema'
-import { comfyPageFixture as test } from '../fixtures/ComfyPage'
+import type { Palette } from '../src/schemas/colorPaletteSchema'
+import { comfyPageFixture as test } from './fixtures/ComfyPage'
 
 const customColorPalettes: Record<string, Palette> = {
   obsidian: {
@@ -48,7 +48,6 @@ const customColorPalettes: Record<string, Palette> = {
         WIDGET_OUTLINE_COLOR: '#333',
         WIDGET_TEXT_COLOR: '#a3a3a8',
         WIDGET_SECONDARY_TEXT_COLOR: '#97979c',
-        WIDGET_DISABLED_TEXT_COLOR: '#646464',
         LINK_COLOR: '#9A9',
         EVENT_LINK_COLOR: '#A86',
         CONNECTING_LINK_COLOR: '#AFA'
@@ -112,7 +111,6 @@ const customColorPalettes: Record<string, Palette> = {
         WIDGET_OUTLINE_COLOR: '#333',
         WIDGET_TEXT_COLOR: '#a3a3a8',
         WIDGET_SECONDARY_TEXT_COLOR: '#97979c',
-        WIDGET_DISABLED_TEXT_COLOR: '#646464',
         LINK_COLOR: '#9A9',
         EVENT_LINK_COLOR: '#A86',
         CONNECTING_LINK_COLOR: '#AFA'

browser_tests/commands.spec.ts

@@ -1,6 +1,6 @@
 import { expect } from '@playwright/test'
 
-import { comfyPageFixture as test } from '../fixtures/ComfyPage'
+import { comfyPageFixture as test } from './fixtures/ComfyPage'
 
 test.describe('Keybindings', () => {
   test('Should execute command', async ({ comfyPage }) => {
@@ -32,7 +32,7 @@ test.describe('Keybindings', () => {
     })
 
     await comfyPage.executeCommand('TestCommand')
-    expect(await comfyPage.getToastErrorCount()).toBe(1)
+    await expect(comfyPage.page.locator('.p-toast')).toBeVisible()
   })
 
   test('Should handle async command errors', async ({ comfyPage }) => {
@@ -45,6 +45,6 @@ test.describe('Keybindings', () => {
     })
 
     await comfyPage.executeCommand('TestCommand')
-    expect(await comfyPage.getToastErrorCount()).toBe(1)
+    await expect(comfyPage.page.locator('.p-toast')).toBeVisible()
   })
 })

browser_tests/copyPaste.spec.ts

@@ -1,6 +1,6 @@
 import { expect } from '@playwright/test'
 
-import { comfyPageFixture as test } from '../fixtures/ComfyPage'
+import { comfyPageFixture as test } from './fixtures/ComfyPage'
 
 test.describe('Copy Paste', () => {
   test('Can copy and paste node', async ({ comfyPage }) => {

browser_tests/dialog.spec.ts

@@ -1,7 +1,7 @@
 import { Locator, expect } from '@playwright/test'
 
-import type { Keybinding } from '../../src/schemas/keyBindingSchema'
-import { comfyPageFixture as test } from '../fixtures/ComfyPage'
+import type { Keybinding } from '../src/schemas/keyBindingSchema'
+import { comfyPageFixture as test } from './fixtures/ComfyPage'
 
 test.describe('Load workflow warning', () => {
   test('Should display a warning when loading a workflow with missing nodes', async ({
@@ -133,6 +133,14 @@ test.describe('Missing models warning', () => {
     await expect(missingModelsWarning).not.toBeVisible()
   })
 
+  test('should show on tutorial workflow', async ({ comfyPage }) => {
+    await comfyPage.setSetting('Comfy.TutorialCompleted', false)
+    await comfyPage.setup({ clearStorage: true })
+    const missingModelsWarning = comfyPage.page.locator('.comfy-missing-models')
+    await expect(missingModelsWarning).toBeVisible()
+    expect(await comfyPage.getSetting('Comfy.TutorialCompleted')).toBe(true)
+  })
+
   // Flaky test after parallelization
   // https://github.com/Comfy-Org/ComfyUI_frontend/pull/1400
   test.skip('Should download missing model when clicking download button', async ({
@@ -309,62 +317,3 @@ test.describe('Feedback dialog', () => {
     await expect(feedbackHeader).not.toBeVisible()
   })
 })
-
-test.describe('Error dialog', () => {
-  test('Should display an error dialog when graph configure fails', async ({
-    comfyPage
-  }) => {
-    await comfyPage.page.evaluate(() => {
-      const graph = window['graph']
-      graph.configure = () => {
-        throw new Error('Error on configure!')
-      }
-    })
-
-    await comfyPage.loadWorkflow('default')
-
-    const errorDialog = comfyPage.page.locator('.comfy-error-report')
-    await expect(errorDialog).toBeVisible()
-  })
-
-  test('Should display an error dialog when prompt execution fails', async ({
-    comfyPage
-  }) => {
-    await comfyPage.page.evaluate(async () => {
-      const app = window['app']
-      app.api.queuePrompt = () => {
-        throw new Error('Error on queuePrompt!')
-      }
-      await app.queuePrompt(0)
-    })
-    const errorDialog = comfyPage.page.locator('.comfy-error-report')
-    await expect(errorDialog).toBeVisible()
-  })
-})
-
-test.describe('Signin dialog', () => {
-  test('Paste content to signin dialog should not paste node on canvas', async ({
-    comfyPage
-  }) => {
-    const nodeNum = (await comfyPage.getNodes()).length
-    await comfyPage.clickEmptyLatentNode()
-    await comfyPage.ctrlC()
-
-    const textBox = comfyPage.widgetTextBox
-    await textBox.click()
-    await textBox.fill('test_password')
-    await textBox.press('Control+a')
-    await textBox.press('Control+c')
-
-    await comfyPage.page.evaluate(() => {
-      window['app'].extensionManager.dialog.showSignInDialog()
-    })
-
-    const input = comfyPage.page.locator('#comfy-org-sign-in-password')
-    await input.waitFor({ state: 'visible' })
-    await input.press('Control+v')
-    await expect(input).toHaveValue('test_password')
-
-    expect(await comfyPage.getNodes()).toHaveLength(nodeNum)
-  })
-})

browser_tests/domWidget.spec.ts

@@ -0,0 +1,27 @@
+import { expect } from '@playwright/test'
+
+import { comfyPageFixture as test } from './fixtures/ComfyPage'
+
+test.describe('DOM Widget', () => {
+  test('Collapsed multiline textarea is not visible', async ({ comfyPage }) => {
+    await comfyPage.loadWorkflow('collapsed_multiline')
+
+    expect(comfyPage.page.locator('.comfy-multiline-input')).not.toBeVisible()
+  })
+
+  test('Multiline textarea correctly collapses', async ({ comfyPage }) => {
+    const multilineTextAreas = comfyPage.page.locator('.comfy-multiline-input')
+    const firstMultiline = multilineTextAreas.first()
+    const lastMultiline = multilineTextAreas.last()
+
+    await expect(firstMultiline).toBeVisible()
+    await expect(lastMultiline).toBeVisible()
+
+    const nodes = await comfyPage.getNodeRefsByType('CLIPTextEncode')
+    for (const node of nodes) {
+      await node.click('collapse')
+    }
+    await expect(firstMultiline).not.toBeVisible()
+    await expect(lastMultiline).not.toBeVisible()
+  })
+})

browser_tests/extensionAPI.spec.ts

@@ -1,7 +1,7 @@
 import { expect } from '@playwright/test'
 
-import { SettingParams } from '../../src/types/settingTypes'
-import { comfyPageFixture as test } from '../fixtures/ComfyPage'
+import { SettingParams } from '../src/types/settingTypes'
+import { comfyPageFixture as test } from './fixtures/ComfyPage'
 
 test.describe('Topbar commands', () => {
   test.beforeEach(async ({ comfyPage }) => {

browser_tests/fixtures/ComfyMouse.ts

@@ -1,97 +0,0 @@
-import type { Mouse } from '@playwright/test'
-
-import type { ComfyPage } from './ComfyPage'
-import type { Position } from './types'
-
-/**
- * Used for drag and drop ops
- * @see
- * - {@link Mouse.down}
- * - {@link Mouse.move}
- * - {@link Mouse.up}
- */
-export interface DragOptions {
-  button?: 'left' | 'right' | 'middle'
-  clickCount?: number
-  steps?: number
-}
-
-/**
- * Wraps mouse drag and drop to work with a canvas-based app.
- *
- * Requires the next frame animated before and after all steps, giving the
- * canvas time to render the changes before screenshots are taken.
- */
-export class ComfyMouse implements Omit<Mouse, 'move'> {
-  static defaultSteps = 5
-  static defaultOptions: DragOptions = { steps: ComfyMouse.defaultSteps }
-
-  constructor(readonly comfyPage: ComfyPage) {}
-
-  /** The normal Playwright {@link Mouse} property from {@link ComfyPage.page}. */
-  get mouse() {
-    return this.comfyPage.page.mouse
-  }
-
-  async nextFrame() {
-    await this.comfyPage.nextFrame()
-  }
-
-  /** Drags from current location to a new location and hovers there (no pointerup event) */
-  async drag(to: Position, options = ComfyMouse.defaultOptions) {
-    const { steps, ...downOptions } = options
-
-    await this.mouse.down(downOptions)
-    await this.nextFrame()
-
-    await this.move(to, { steps })
-    await this.nextFrame()
-  }
-
-  async drop(options = ComfyMouse.defaultOptions) {
-    await this.mouse.up(options)
-    await this.nextFrame()
-  }
-
-  async dragAndDrop(
-    from: Position,
-    to: Position,
-    options = ComfyMouse.defaultOptions
-  ) {
-    const { steps } = options
-
-    await this.nextFrame()
-
-    await this.move(from, { steps })
-    await this.drag(to, options)
-    await this.drop(options)
-  }
-
-  /** @see {@link Mouse.move} */
-  async move(to: Position, options = ComfyMouse.defaultOptions) {
-    await this.mouse.move(to.x, to.y, options)
-    await this.nextFrame()
-  }
-
-  //#region Pass-through
-  async click(...args: Parameters<Mouse['click']>) {
-    return await this.mouse.click(...args)
-  }
-
-  async dblclick(...args: Parameters<Mouse['dblclick']>) {
-    return await this.mouse.dblclick(...args)
-  }
-
-  async down(...args: Parameters<Mouse['down']>) {
-    return await this.mouse.down(...args)
-  }
-
-  async up(...args: Parameters<Mouse['up']>) {
-    return await this.mouse.up(...args)
-  }
-
-  async wheel(...args: Parameters<Mouse['wheel']>) {
-    return await this.mouse.wheel(...args)
-  }
-  //#endregion Pass-through
-}

browser_tests/fixtures/ComfyPage.ts

@@ -11,7 +11,6 @@ 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 { ComfyNodeSearchBox } from './components/ComfyNodeSearchBox'
 import { SettingDialog } from './components/SettingDialog'
 import {
@@ -133,9 +132,6 @@ export class ComfyPage {
   // Inputs
   public readonly workflowUploadInput: Locator
 
-  // Toasts
-  public readonly visibleToasts: Locator
-
   // Components
   public readonly searchBox: ComfyNodeSearchBox
   public readonly menu: ComfyMenu
@@ -162,8 +158,6 @@ export class ComfyPage {
     this.resetViewButton = page.getByRole('button', { name: 'Reset View' })
     this.queueButton = page.getByRole('button', { name: 'Queue Prompt' })
     this.workflowUploadInput = page.locator('#comfy-file-input')
-    this.visibleToasts = page.locator('.p-toast-message:visible')
-
     this.searchBox = new ComfyNodeSearchBox(page)
     this.menu = new ComfyMenu(page)
     this.actionbar = new ComfyActionbar(page)
@@ -219,10 +213,6 @@ export class ComfyPage {
         `Failed to setup workflows directory: ${await resp.text()}`
       )
     }
-
-    await this.page.evaluate(async () => {
-      await window['app'].extensionManager.workflow.syncWorkflows()
-    })
   }
 
   async setupUser(username: string) {
@@ -401,30 +391,6 @@ export class ComfyPage {
     await this.nextFrame()
   }
 
-  async deleteWorkflow(
-    workflowName: string,
-    whenMissing: 'ignoreMissing' | 'throwIfMissing' = 'ignoreMissing'
-  ) {
-    // Open workflows tab
-    const { workflowsTab } = this.menu
-    await workflowsTab.open()
-
-    // Action to take if workflow missing
-    if (whenMissing === 'ignoreMissing') {
-      const workflows = await workflowsTab.getTopLevelSavedWorkflowNames()
-      if (!workflows.includes(workflowName)) return
-    }
-
-    // Delete workflow
-    await workflowsTab.getPersistedItem(workflowName).click({ button: 'right' })
-    await this.clickContextMenuItem('Delete')
-    await this.confirmDialog.delete.click()
-
-    // Clear toast & close tab
-    await this.closeToasts(1)
-    await workflowsTab.close()
-  }
-
   async resetView() {
     if (await this.resetViewButton.isVisible()) {
       await this.resetViewButton.click()
@@ -441,20 +407,7 @@ export class ComfyPage {
   }
 
   async getVisibleToastCount() {
-    return await this.visibleToasts.count()
-  }
-
-  async closeToasts(requireCount = 0) {
-    if (requireCount) await expect(this.visibleToasts).toHaveCount(requireCount)
-
-    // Clear all toasts
-    const toastCloseButtons = await this.page
-      .locator('.p-toast-close-button')
-      .all()
-    for (const button of toastCloseButtons) {
-      await button.click()
-    }
-    await expect(this.visibleToasts).toHaveCount(0)
+    return await this.page.locator('.p-toast:visible').count()
   }
 
   async clickTextEncodeNode1() {
@@ -505,129 +458,54 @@ export class ComfyPage {
     await this.nextFrame()
   }
 
-  async dragAndDropExternalResource(
-    options: {
-      fileName?: string
-      url?: string
-      dropPosition?: Position
-    } = {}
-  ) {
-    const { dropPosition = { x: 100, y: 100 }, fileName, url } = options
+  async dragAndDropFile(fileName: string) {
+    const filePath = this.assetPath(fileName)
 
-    if (!fileName && !url)
-      throw new Error('Must provide either fileName or url')
+    // Read the file content
+    const buffer = fs.readFileSync(filePath)
 
-    const evaluateParams: {
-      dropPosition: Position
-      fileName?: string
-      fileType?: string
-      buffer?: Uint8Array | number[]
-      url?: string
-    } = { dropPosition }
-
-    // Dropping a file from the filesystem
-    if (fileName) {
-      const filePath = this.assetPath(fileName)
-      const buffer = fs.readFileSync(filePath)
-
-      const getFileType = (fileName: string) => {
-        if (fileName.endsWith('.png')) return 'image/png'
-        if (fileName.endsWith('.svg')) return 'image/svg+xml'
-        if (fileName.endsWith('.webp')) return 'image/webp'
-        if (fileName.endsWith('.webm')) return 'video/webm'
-        if (fileName.endsWith('.json')) return 'application/json'
-        if (fileName.endsWith('.glb')) return 'model/gltf-binary'
-        return 'application/octet-stream'
-      }
-
-      evaluateParams.fileName = fileName
-      evaluateParams.fileType = getFileType(fileName)
-      evaluateParams.buffer = [...new Uint8Array(buffer)]
+    // Get file type
+    const getFileType = (fileName: string) => {
+      if (fileName.endsWith('.png')) return 'image/png'
+      if (fileName.endsWith('.webp')) return 'image/webp'
+      if (fileName.endsWith('.json')) return 'application/json'
+      return 'application/octet-stream'
     }
 
-    // Dropping a URL (e.g., dropping image across browser tabs in Firefox)
-    if (url) evaluateParams.url = url
+    const fileType = getFileType(fileName)
 
-    // Execute the drag and drop in the browser
-    await this.page.evaluate(async (params) => {
-      const dataTransfer = new DataTransfer()
-
-      // Add file if provided
-      if (params.buffer && params.fileName && params.fileType) {
-        const file = new File(
-          [new Uint8Array(params.buffer)],
-          params.fileName,
-          {
-            type: params.fileType
-          }
-        )
+    await this.page.evaluate(
+      async ({ buffer, fileName, fileType }) => {
+        const file = new File([new Uint8Array(buffer)], fileName, {
+          type: fileType
+        })
+        const dataTransfer = new DataTransfer()
         dataTransfer.items.add(file)
-      }
 
-      // Add URL data if provided
-      if (params.url) {
-        dataTransfer.setData('text/uri-list', params.url)
-        dataTransfer.setData('text/x-moz-url', params.url)
-      }
+        const dropEvent = new DragEvent('drop', {
+          bubbles: true,
+          cancelable: true,
+          dataTransfer
+        })
 
-      const targetElement = document.elementFromPoint(
-        params.dropPosition.x,
-        params.dropPosition.y
-      )
+        Object.defineProperty(dropEvent, 'preventDefault', {
+          value: () => {},
+          writable: false
+        })
 
-      if (!targetElement) {
-        console.error('No element found at drop position:', params.dropPosition)
-        return { success: false, error: 'No element at position' }
-      }
+        Object.defineProperty(dropEvent, 'stopPropagation', {
+          value: () => {},
+          writable: false
+        })
 
-      const eventOptions = {
-        bubbles: true,
-        cancelable: true,
-        dataTransfer,
-        clientX: params.dropPosition.x,
-        clientY: params.dropPosition.y
-      }
-
-      const dragOverEvent = new DragEvent('dragover', eventOptions)
-      const dropEvent = new DragEvent('drop', eventOptions)
-
-      Object.defineProperty(dropEvent, 'preventDefault', {
-        value: () => {},
-        writable: false
-      })
-
-      Object.defineProperty(dropEvent, 'stopPropagation', {
-        value: () => {},
-        writable: false
-      })
-
-      targetElement.dispatchEvent(dragOverEvent)
-      targetElement.dispatchEvent(dropEvent)
-
-      return {
-        success: true,
-        targetInfo: {
-          tagName: targetElement.tagName,
-          id: targetElement.id,
-          classList: Array.from(targetElement.classList)
-        }
-      }
-    }, evaluateParams)
+        document.dispatchEvent(dropEvent)
+      },
+      { buffer: [...new Uint8Array(buffer)], fileName, fileType }
+    )
 
     await this.nextFrame()
   }
 
-  async dragAndDropFile(
-    fileName: string,
-    options: { dropPosition?: Position } = {}
-  ) {
-    return this.dragAndDropExternalResource({ fileName, ...options })
-  }
-
-  async dragAndDropURL(url: string, options: { dropPosition?: Position } = {}) {
-    return this.dragAndDropExternalResource({ url, ...options })
-  }
-
   async dragNode2() {
     await this.dragAndDrop({ x: 622, y: 400 }, { x: 622, y: 300 })
     await this.nextFrame()
@@ -673,20 +551,11 @@ export class ComfyPage {
     await this.dragAndDrop(this.clipTextEncodeNode1InputSlot, this.emptySpace)
   }
 
-  async connectEdge(
-    options: {
-      reverse?: boolean
-    } = {}
-  ) {
-    const { reverse = false } = options
-    const start = reverse
-      ? this.clipTextEncodeNode1InputSlot
-      : this.loadCheckpointNodeClipOutputSlot
-    const end = reverse
-      ? this.loadCheckpointNodeClipOutputSlot
-      : this.clipTextEncodeNode1InputSlot
-
-    await this.dragAndDrop(start, end)
+  async connectEdge() {
+    await this.dragAndDrop(
+      this.loadCheckpointNodeClipOutputSlot,
+      this.clipTextEncodeNode1InputSlot
+    )
   }
 
   async adjustWidgetValue() {
@@ -966,16 +835,10 @@ export class ComfyPage {
       return window['app'].canvas.ds.convertOffsetToCanvas(pos)
     }, pos)
   }
-
-  /** Get number of DOM widgets on the canvas. */
-  async getDOMWidgetCount() {
-    return await this.page.locator('.dom-widget').count()
-  }
-
   async getNodeRefById(id: NodeId) {
     return new NodeReference(id, this)
   }
-  async getNodes(): Promise<LGraphNode[]> {
+  async getNodes() {
     return await this.page.evaluate(() => {
       return window['app'].graph.nodes
     })
@@ -1046,10 +909,7 @@ export class ComfyPage {
   }
 }
 
-export const comfyPageFixture = base.extend<{
-  comfyPage: ComfyPage
-  comfyMouse: ComfyMouse
-}>({
+export const comfyPageFixture = base.extend<{ comfyPage: ComfyPage }>({
   comfyPage: async ({ page, request }, use, testInfo) => {
     const comfyPage = new ComfyPage(page, request)
 
@@ -1080,10 +940,6 @@ export const comfyPageFixture = base.extend<{
 
     await comfyPage.setup()
     await use(comfyPage)
-  },
-  comfyMouse: async ({ comfyPage }, use) => {
-    const comfyMouse = new ComfyMouse(comfyPage)
-    use(comfyMouse)
   }
 })