1.9.13 (#2520)

Co-authored-by: github-actions <github-actions@github.com>

.cursorrules

@@ -15,7 +15,7 @@ const folderStructure = `
 src/
   components/
   constants/
-  hooks/
+  composables/
   views/
   stores/
   services/

.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.1
+    - 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

@@ -9,7 +9,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.1
+    - 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-browser-exp.yaml

@@ -11,7 +11,7 @@ jobs:
     runs-on: ubuntu-latest
     if: github.event.label.name == 'New Browser Test Expectations'
     steps:
-    - uses: Comfy-Org/ComfyUI_frontend_setup_action@v2.1
+    - 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

@@ -15,7 +15,9 @@ jobs:
   jest-tests:
     runs-on: ubuntu-latest
     steps:
-    - uses: Comfy-Org/ComfyUI_frontend_setup_action@v2.1
+    - uses: Comfy-Org/ComfyUI_frontend_setup_action@v2.2
+      with:
+        devtools_ref: 7b81139e904519db8e5481899ef36bbb4393cb6b
     - name: Run Jest tests
       run: |
         npm run test:generate
@@ -25,7 +27,9 @@ jobs:
   playwright-tests-chromium:
     runs-on: ubuntu-latest
     steps:
-    - uses: Comfy-Org/ComfyUI_frontend_setup_action@v2.1
+    - uses: Comfy-Org/ComfyUI_frontend_setup_action@v2.2
+      with:
+        devtools_ref: 7b81139e904519db8e5481899ef36bbb4393cb6b
     - name: Install Playwright Browsers
       run: npx playwright install chromium --with-deps
       working-directory: ComfyUI_frontend
@@ -42,7 +46,9 @@ jobs:
   playwright-tests-chromium-2x:
     runs-on: ubuntu-latest
     steps:
-    - uses: Comfy-Org/ComfyUI_frontend_setup_action@v2.1
+    - uses: Comfy-Org/ComfyUI_frontend_setup_action@v2.2
+      with:
+        devtools_ref: 7b81139e904519db8e5481899ef36bbb4393cb6b
     - name: Install Playwright Browsers
       run: npx playwright install chromium --with-deps
       working-directory: ComfyUI_frontend
@@ -59,7 +65,9 @@ jobs:
   playwright-tests-mobile-chrome:
     runs-on: ubuntu-latest
     steps:
-    - uses: Comfy-Org/ComfyUI_frontend_setup_action@v2.1
+    - uses: Comfy-Org/ComfyUI_frontend_setup_action@v2.2
+      with:
+        devtools_ref: 7b81139e904519db8e5481899ef36bbb4393cb6b
     - name: Install Playwright Browsers
       run: npx playwright install chromium --with-deps
       working-directory: ComfyUI_frontend

browser_tests/assets/default.json

@@ -114,7 +114,7 @@
         { "name": "VAE", "type": "VAE", "links": [8], "slot_index": 2 }
       ],
       "properties": {},
-      "widgets_values": ["v1-5-pruned-emaonly.ckpt"]
+      "widgets_values": ["v1-5-pruned-emaonly-fp16.safetensors"]
     }
   ],
   "links": [

browser_tests/assets/remote_widget.json

@@ -0,0 +1,48 @@
+{
+  "last_node_id": 15,
+  "last_link_id": 10,
+  "nodes": [
+    {
+      "id": 15,
+      "type": "DevToolsRemoteWidgetNode",
+      "pos": [
+        495,
+        735
+      ],
+      "size": [
+        315,
+        58
+      ],
+      "flags": {},
+      "order": 0,
+      "mode": 0,
+      "inputs": [],
+      "outputs": [
+        {
+          "name": "STRING",
+          "type": "STRING",
+          "links": null
+        }
+      ],
+      "properties": {
+        "Node name for S&R": "DevToolsRemoteWidgetNode"
+      },
+      "widgets_values": [
+        "v1-5-pruned-emaonly-fp16.safetensors"
+      ]
+    }
+  ],
+  "links": [],
+  "groups": [],
+  "config": {},
+  "extra": {
+    "ds": {
+      "scale": 0.8008869919566275,
+      "offset": [
+        538.9801226576359,
+        -55.24554581806672
+      ]
+    }
+  },
+  "version": 0.4
+}

browser_tests/assets/widgets/seed_widget.json

@@ -0,0 +1,43 @@
+{
+  "last_node_id": 10,
+  "last_link_id": 9,
+  "nodes": [
+    {
+      "id": 10,
+      "type": "DevToolsNodeWithSeedInput",
+      "pos": [
+        20,
+        50
+      ],
+      "size": [
+        315,
+        82
+      ],
+      "flags": {},
+      "order": 1,
+      "mode": 0,
+      "inputs": [],
+      "outputs": [],
+      "properties": {
+        "Node name for S&R": "DevToolsNodeWithSeedInput"
+      },
+      "widgets_values": [
+        0,
+        "randomize"
+      ]
+    }
+  ],
+  "links": [],
+  "groups": [],
+  "config": {},
+  "extra": {
+    "ds": {
+      "scale": 1,
+      "offset": [
+        0,
+        0
+      ]
+    }
+  },
+  "version": 0.4
+}

browser_tests/extensionAPI.spec.ts

@@ -1,5 +1,6 @@
 import { expect } from '@playwright/test'
 
+import { SettingParams } from '../src/types/settingTypes'
 import { comfyPageFixture as test } from './fixtures/ComfyPage'
 
 test.describe('Topbar commands', () => {
@@ -134,6 +135,90 @@ test.describe('Topbar commands', () => {
       expect(await comfyPage.getSetting('Comfy.TestSetting')).toBe(true)
       expect(await comfyPage.page.evaluate(() => window['changeCount'])).toBe(2)
     })
+
+    test.describe('Passing through attrs to setting components', () => {
+      const testCases: Array<{
+        config: Partial<SettingParams>
+        selector: string
+      }> = [
+        {
+          config: {
+            type: 'boolean',
+            defaultValue: true
+          },
+          selector: '.p-toggleswitch.p-component'
+        },
+        {
+          config: {
+            type: 'number',
+            defaultValue: 10
+          },
+          selector: '.p-inputnumber input'
+        },
+        {
+          config: {
+            type: 'slider',
+            defaultValue: 10
+          },
+          selector: '.p-slider.p-component'
+        },
+        {
+          config: {
+            type: 'combo',
+            defaultValue: 'foo',
+            options: ['foo', 'bar', 'baz']
+          },
+          selector: '.p-select.p-component'
+        },
+        {
+          config: {
+            type: 'text',
+            defaultValue: 'Hello'
+          },
+          selector: '.p-inputtext'
+        },
+        {
+          config: {
+            type: 'color',
+            defaultValue: '#000000'
+          },
+          selector: '.p-colorpicker-preview'
+        }
+      ] as const
+
+      for (const { config, selector } of testCases) {
+        test(`${config.type} component should respect disabled attr`, async ({
+          comfyPage
+        }) => {
+          await comfyPage.page.evaluate((config) => {
+            window['app'].registerExtension({
+              name: 'TestExtension1',
+              settings: [
+                {
+                  id: 'Comfy.TestSetting',
+                  name: 'Test',
+                  // The `disabled` attr is common to all settings components
+                  attrs: { disabled: true },
+                  ...config
+                }
+              ]
+            })
+          }, config)
+
+          await comfyPage.settingDialog.open()
+          const component = comfyPage.settingDialog.root
+            .getByText('TestSetting Test')
+            .locator(selector)
+
+          const isDisabled = await component.evaluate((el) =>
+            el.tagName === 'INPUT'
+              ? (el as HTMLInputElement).disabled
+              : el.classList.contains('p-disabled')
+          )
+          expect(isDisabled).toBe(true)
+        })
+      }
+    })
   })
 
   test.describe('About panel', () => {

browser_tests/fixtures/components/SettingDialog.ts

@@ -3,6 +3,10 @@ import { Page } from '@playwright/test'
 export class SettingDialog {
   constructor(public readonly page: Page) {}
 
+  get root() {
+    return this.page.locator('div.settings-container')
+  }
+
   async open() {
     const button = this.page.locator('button.comfy-settings-btn:visible')
     await button.click()

browser_tests/fixtures/utils/litegraphUtils.ts

@@ -62,6 +62,9 @@ export class NodeWidgetReference {
     readonly node: NodeReference
   ) {}
 
+  /**
+   * @returns The position of the widget's center
+   */
   async getPosition(): Promise<Position> {
     const pos: [number, number] = await this.node.comfyPage.page.evaluate(
       ([id, index]) => {
@@ -89,6 +92,22 @@ export class NodeWidgetReference {
       position: await this.getPosition()
     })
   }
+
+  async dragHorizontal(delta: number) {
+    const pos = await this.getPosition()
+    const canvas = this.node.comfyPage.canvas
+    const canvasPos = (await canvas.boundingBox())!
+    this.node.comfyPage.dragAndDrop(
+      {
+        x: canvasPos.x + pos.x,
+        y: canvasPos.y + pos.y
+      },
+      {
+        x: canvasPos.x + pos.x + delta,
+        y: canvasPos.y + pos.y
+      }
+    )
+  }
 }
 
 export class NodeReference {

browser_tests/menu.spec.ts

@@ -707,6 +707,36 @@ test.describe('Menu', () => {
         '*Unsaved Workflow.json'
       ])
     })
+
+    test('Can drop workflow from workflows sidebar', async ({ comfyPage }) => {
+      await comfyPage.setupWorkflowsDirectory({
+        'workflow1.json': 'default.json'
+      })
+      await comfyPage.setup()
+      await comfyPage.menu.workflowsTab.open()
+
+      const nodeCount = await comfyPage.getGraphNodesCount()
+
+      // Get the bounding box of the canvas element
+      const canvasBoundingBox = (await comfyPage.page
+        .locator('#graph-canvas')
+        .boundingBox())!
+
+      // Calculate the center position of the canvas
+      const targetPosition = {
+        x: canvasBoundingBox.x + canvasBoundingBox.width / 2,
+        y: canvasBoundingBox.y + canvasBoundingBox.height / 2
+      }
+
+      await comfyPage.page.dragAndDrop(
+        '.comfyui-workflows-browse .node-label:has-text("workflow1.json")',
+        '#graph-canvas',
+        { targetPosition }
+      )
+      // Wait for the workflow to be inserted
+      await comfyPage.page.waitForTimeout(200)
+      expect(await comfyPage.getGraphNodesCount()).toBe(nodeCount * 2)
+    })
   })
 
   test.describe('Workflows topbar tabs', () => {