Standardize default sidebar bg color

.env_example

@@ -18,10 +18,3 @@ TEST_COMFYUI_DIR=/home/ComfyUI
 
 # 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

.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/test-ui.yaml

@@ -30,7 +30,7 @@ jobs:
         with:
           repository: 'Comfy-Org/ComfyUI_devtools'
           path: 'ComfyUI/custom_nodes/ComfyUI_devtools'
-          ref: 'd05fd48dd787a4192e16802d4244cfcc0e2f9684'
+          ref: '9d2421fd3208a310e4d0f71fca2ea0c985759c33'
 
       - uses: actions/setup-node@v4
         with:

README.md

@@ -67,463 +67,6 @@ The development of successive minor versions overlaps. For example, while versio
 | 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) |
 
-## Release Summary
-
-### Major features
-
-<details id='feature-native-translation'>
-  <summary>v1.5: Native translation (i18n)</summary>
-
-  ComfyUI now includes built-in translation support, replacing the need for third-party translation extensions. Select your language
-  in `Comfy > Locale > Language` to translate the interface into English, Chinese (Simplified), Russian, Japanese, or Korean. This native
-  implementation offers better performance, reliability, and maintainability compared to previous solutions.<br>
-
-  More details available here: https://blog.comfy.org/p/native-localization-support-i18n
-</details>
-
-<details id='feature-mask-editor'>
-  <summary>v1.4: New mask editor</summary>
-
-  https://github.com/Comfy-Org/ComfyUI_frontend/pull/1284 implements a new mask editor.
-
-  ![image](https://github.com/user-attachments/assets/f0ea6ee5-00ee-4e5d-a09c-6938e86a1f17)
-</details>
-
-<details id='feature-integrated-server-terminal'>
-  <summary>v1.3.22: Integrated server terminal</summary>
-
-Press Ctrl + ` to toggle integrated terminal.
-
-https://github.com/user-attachments/assets/eddedc6a-07a3-4a83-9475-63b3977f6d94
-</details>
-
-<details id='feature-keybinding-customization'>
-  <summary>v1.3.7: Keybinding customization</summary>
-
-## Basic UI
-![image](https://github.com/user-attachments/assets/c84a1609-3880-48e0-a746-011f36beda68)
-
-## Reset button
-![image](https://github.com/user-attachments/assets/4d2922da-bb4f-4f90-8017-a8e4a0db07c7)
-
-## Edit Keybinding
-![image](https://github.com/user-attachments/assets/77626b7a-cb46-48f8-9465-e03120aac66a)
-![image](https://github.com/user-attachments/assets/79131a4e-75c6-4715-bd11-c6aaed887779)
-
-[rec.webm](https://github.com/user-attachments/assets/a3984ed9-eb28-4d47-86c0-7fc3efc2b5d0)
-
-</details>
-
-<details id='feature-node-library-sidebar'>
-  <summary>v1.2.4: Node library sidebar tab</summary>
-
-  #### Drag & Drop
-https://github.com/user-attachments/assets/853e20b7-bc0e-49c9-bbce-a2ba7566f92f
-
-  #### Filter
-https://github.com/user-attachments/assets/4bbca3ee-318f-4cf0-be32-a5a5541066cf
-</details>
-
-<details id='feature-queue-sidebar'>
-  <summary>v1.2.0: Queue/History sidebar tab</summary>
-
-  https://github.com/user-attachments/assets/86e264fe-4d26-4f07-aa9a-83bdd2d02b8f
-</details>
-
-<details id='feature-node-search'>
-  <summary>v1.1.0: Node search box</summary>
-
-  #### Fuzzy search & Node preview
-  ![image](https://github.com/user-attachments/assets/94733e32-ea4e-4a9c-b321-c1a05db48709)
-
-  #### Release link with shift
-  https://github.com/user-attachments/assets/a1b2b5c3-10d1-4256-b620-345de6858f25
-</details>
-
-### QoL changes
-
-<details id='feature-nested-group'>
-  <summary>v1.3.32: **Litegraph** Nested group</summary>
-
-https://github.com/user-attachments/assets/f51adeb1-028e-40af-81e4-0ac13075198a
-</details>
-
-<details id='feature-group-selection'>
-  <summary>v1.3.24: **Litegraph** Group selection</summary>
-
-https://github.com/user-attachments/assets/e6230a94-411e-4fba-90cb-6c694200adaa
-</details>
-
-<details id='feature-toggle-link-visibility'>
-  <summary>v1.3.6: **Litegraph** Toggle link visibility</summary>
-
-[rec.webm](https://github.com/user-attachments/assets/34e460ac-fbbc-44ef-bfbb-99a84c2ae2be)
-
-</details>
-
-<details id='feature-auto-widget-conversion'>
-  <summary>v1.3.4: **Litegraph** Auto widget to input conversion</summary>
-
-Dropping a link of correct type on node widget will automatically convert the widget to input.
-
-[rec.webm](https://github.com/user-attachments/assets/15cea0b0-b225-4bec-af50-2cdb16dc46bf)
-
-</details>
-
-<details id='feature-pan-mode'>
-  <summary>v1.3.4: **Litegraph** Canvas pan mode</summary>
-
-The canvas becomes readonly in pan mode. Pan mode is activated by clicking the pan mode button on the canvas menu
-or by holding the space key.
-
-[rec.webm](https://github.com/user-attachments/assets/c7872532-a2ac-44c1-9e7d-9e03b5d1a80b)
-
-</details>
-
-<details id='feature-shift-drag-link-creation'>
-  <summary>v1.3.1: **Litegraph** Shift drag link to create a new link</summary>
-
-[rec.webm](https://github.com/user-attachments/assets/7e73aaf9-79e2-4c3c-a26a-911cba3b85e4)
-
-</details>
-
-<details id='feature-optional-input-donuts'>
-  <summary>v1.2.62: **Litegraph** Show optional input slots as donuts</summary>
-
-![GYEIRidb0AYGO-v](https://github.com/user-attachments/assets/e6cde0b6-654b-4afd-a117-133657a410b1)
-
-</details>
-
-<details id='feature-group-title-edit'>
-  <summary>v1.2.44: **Litegraph** Double click group title to edit</summary>
-
-https://github.com/user-attachments/assets/5bf0e2b6-8b3a-40a7-b44f-f0879e9ad26f
-
-</details>
-
-<details id='feature-group-selection-shortcut'>
-  <summary>v1.2.39: **Litegraph** Group selected nodes with Ctrl + G</summary>
-
-https://github.com/user-attachments/assets/7805dc54-0854-4a28-8bcd-4b007fa01151
-
-</details>
-
-<details id='feature-node-title-edit'>
-  <summary>v1.2.38: **Litegraph** Double click node title to edit</summary>
-
-https://github.com/user-attachments/assets/d61d5d0e-f200-4153-b293-3e3f6a212b30
-
-</details>
-
-<details id='feature-drag-multi-link'>
-  <summary>v1.2.7: **Litegraph** drags multiple links with shift pressed</summary>
-
-https://github.com/user-attachments/assets/68826715-bb55-4b2a-be6e-675cfc424afe
-
-https://github.com/user-attachments/assets/c142c43f-2fe9-4030-8196-b3bfd4c6977d
-
-</details>
-
-<details id='feature-auto-connect-link'>
-  <summary>v1.2.2: **Litegraph** auto connects to correct slot</summary>
-
-  #### Before
-  https://github.com/user-attachments/assets/c253f778-82d5-4e6f-aec0-ea2ccf421651
-
-  #### After
-  https://github.com/user-attachments/assets/b6360ac0-f0d2-447c-9daa-8a2e20c0dc1d
-</details>
-
-<details id='feature-hide-text-overflow'>
-  <summary>v1.1.8: **Litegraph** hides text overflow on widget value</summary>
-
-  https://github.com/user-attachments/assets/5696a89d-4a47-4fcc-9e8c-71e1264943f2
-</details>
-
-### Developer APIs
-
-<details>
-  <summary>v1.6.13: prompt/confirm/alert replacements for ComfyUI desktop</summary>
-
-Several browser-only APIs are not available in ComfyUI desktop's electron environment.
-
-- `window.prompt`
-- `window.confirm`
-- `window.alert`
-
-Please use the following APIs as replacements.
-
-```js
-// window.prompt
-window['app'].extensionManager.dialog
-  .prompt({
-    title: 'Test Prompt',
-    message: 'Test Prompt Message'
-  })
-  .then((value: string) => {
-    // Do something with the value user entered
-  })
-```
-
-![image](https://github.com/user-attachments/assets/c73f74d0-9bb4-4555-8d56-83f1be4a1d7e)
-
-```js
-// window.confirm
-window['app'].extensionManager.dialog
-  .confirm({
-    title: 'Test Confirm',
-    message: 'Test Confirm Message'
-  })
-  .then((value: boolean) => {
-    // Do something with the value user entered
-  })
-```
-
-![image](https://github.com/user-attachments/assets/8dec7a42-7443-4245-85be-ceefb1116e96)
-
-```js
-// window.alert
-window['app'].extensionManager.toast
-  .addAlert("Test Alert")
-```
-
-![image](https://github.com/user-attachments/assets/9b18bdca-76ef-4432-95de-5cd2369684f2)
-
-</details>
-
-<details>
-  <summary>v1.3.34: Register about panel badges</summary>
-
-```js
-app.registerExtension({
-  name: 'TestExtension1',
-  aboutPageBadges: [
-    {
-      label: 'Test Badge',
-      url: 'https://example.com',
-      icon: 'pi pi-box'
-    }
-  ]
-})
-```
-
-![image](https://github.com/user-attachments/assets/099e77ee-16ad-4141-b2fc-5e9d5075188b)
-
-</details>
-
-<details id='extension-api-bottom-panel-tabs'>
-  <summary>v1.3.22: Register bottom panel tabs</summary>
-
-```js
-app.registerExtension({
-  name: 'TestExtension',
-  bottomPanelTabs: [
-    {
-      id: 'TestTab',
-      title: 'Test Tab',
-      type: 'custom',
-      render: (el) => {
-        el.innerHTML = '<div>Custom tab</div>'
-      }
-    }
-  ]
-})
-```
-
-![image](https://github.com/user-attachments/assets/2114f8b8-2f55-414b-b027-78e61c870b64)
-
-</details>
-
-<details id='extension-api-settings'>
-  <summary>v1.3.22: New settings API</summary>
-
-Legacy settings API.
-
-```js
-// Register a new setting
-app.ui.settings.addSetting({
-  id: 'TestSetting',
-  name: 'Test Setting',
-  type: 'text',
-  defaultValue: 'Hello, world!'
-})
-
-// Get the value of a setting
-const value = app.ui.settings.getSettingValue('TestSetting')
-
-// Set the value of a setting
-app.ui.settings.setSettingValue('TestSetting', 'Hello, universe!')
-```
-
-New settings API.
-
-```js
-// Register a new setting
-app.registerExtension({
-  name: 'TestExtension1',
-  settings: [
-    {
-      id: 'TestSetting',
-      name: 'Test Setting',
-      type: 'text',
-      defaultValue: 'Hello, world!'
-    }
-  ]
-})
-
-// Get the value of a setting
-const value = app.extensionManager.setting.get('TestSetting')
-
-// Set the value of a setting
-app.extensionManager.setting.set('TestSetting', 'Hello, universe!')
-```
-
-</details>
-
-<details id='extension-api-commands-keybindings'>
-  <summary>v1.3.7: Register commands and keybindings</summary>
-
-  Extensions can call the following API to register commands and keybindings. Do
-  note that keybindings defined in core cannot be overwritten, and some keybindings
-  are reserved by the browser.
-
-```js
-  app.registerExtension({
-    name: 'TestExtension1',
-    commands: [
-      {
-        id: 'TestCommand',
-        function: () => {
-          alert('TestCommand')
-        }
-      }
-    ],
-    keybindings: [
-      {
-        combo: { key: 'k' },
-        commandId: 'TestCommand'
-      }
-    ]
-  })
-```
-
-</details>
-
-<details id='extension-api-topbar-menu'>
-  <summary>v1.3.1: Extension API to register custom topbar menu items</summary>
-
-  Extensions can call the following API to register custom topbar menu items.
-
-```js
-  app.registerExtension({
-    name: 'TestExtension1',
-    commands: [
-      {
-        id: 'foo-id',
-        label: 'foo',
-        function: () => {
-          alert(1)
-        }
-      }
-    ],
-    menuCommands: [
-      {
-        path: ['ext', 'ext2'],
-        commands: ['foo-id']
-      }
-    ]
-  })
-```
-
-![image](https://github.com/user-attachments/assets/ae7b082f-7ce9-4549-a446-4563567102fe)
-</details>
-
-<details id='extension-api-toast'>
-  <summary>v1.2.27: Extension API to add toast message</summary>i
-
-  Extensions can call the following API to add toast messages.
-
-```js
-  app.extensionManager.toast.add({
-    severity: 'info',
-    summary: 'Loaded!',
-    detail: 'Extension loaded!',
-    life: 3000
-  })
-```
-Documentation of all supported options can be found here: <https://primevue.org/toast/#api.toast.interfaces.ToastMessageOptions>
-
-![image](https://github.com/user-attachments/assets/de02cd7e-cd81-43d1-a0b0-bccef92ff487)
-</details>
-
-<details id='extension-api-sidebar-tab'>
-  <summary>v1.2.4: Extension API to register custom sidebar tab</summary>
-
-  Extensions now can call the following API to register a sidebar tab.
-
-```js
-  app.extensionManager.registerSidebarTab({
-    id: "search",
-    icon: "pi pi-search",
-    title: "search",
-    tooltip: "search",
-    type: "custom",
-    render: (el) => {
-      el.innerHTML = "<div>Custom search tab</div>";
-    },
-  });
-```
-
-The list of supported icons can be found here: <https://primevue.org/icons/#list>
-
-We will support custom icons later.
-
-![image](https://github.com/user-attachments/assets/7bff028a-bf91-4cab-bf97-55c243b3f5e0)
-</details>
-
-<details id='extension-api-selection-toolbox'>
-  <summary>v1.10.9: Selection Toolbox API</summary>
-
-Extensions can register commands that appear in the selection toolbox when specific items are selected on the canvas.
-
-```js
-app.registerExtension({
-  name: 'TestExtension1',
-  commands: [
-    {
-      id: 'test.selection.command',
-      label: 'Test Command',
-      icon: 'pi pi-star',
-      function: () => {
-        // Command logic here
-      }
-    }
-  ],
-  // Return an array of command IDs to show in the selection toolbox
-  // when an item is selected
-  getSelectionToolboxCommands: (selectedItem) => ['test.selection.command']
-})
-```
-
-The selection toolbox will display the command button when items are selected:
-![Image](https://github.com/user-attachments/assets/28d91267-c0a9-4bd5-a7c4-36e8ec44c9bd)
-
-</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
 
 ### Tech Stack

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

@@ -42,12 +42,12 @@
   "config": {},
   "extra": {
     "ds": {
-      "scale": 1,
+      "scale": 2.1600300525920346,
       "offset": [
-        0,
-        0
+        63.071794466403446,
+        75.18055335968394
       ]
     }
   },
   "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/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

@@ -61,11 +61,6 @@
   "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

@@ -50,11 +50,6 @@
   "links": [],
   "groups": [],
   "config": {},
-  "extra": {
-    "ds": {
-      "offset": [0, 0],
-      "scale": 1
-    }
-  },
+  "extra": {},
   "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

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

browser_tests/assets/renamed_converted_widget.json

@@ -92,14 +92,10 @@
   "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

@@ -84,10 +84,6 @@
   "groups": [],
   "config": {},
   "extra": {
-    "ds": {
-      "offset": [0, 0],
-      "scale": 1
-    },
     "reroutes": [
       {
         "id": 1,

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

@@ -8,4 +8,4 @@
       "title": "Load Animated Image"
     }
   }
-}
+}

browser_tests/assets/widgets/load_audio_widget.json

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

browser_tests/assets/widgets/load_image_widget.json

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

browser_tests/assets/widgets/save_animated_webp.json

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

browser_tests/fixtures/ComfyPage.ts

@@ -133,9 +133,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 +159,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)
@@ -275,7 +270,6 @@ export class ComfyPage {
         localStorage.clear()
         sessionStorage.clear()
         localStorage.setItem('Comfy.userId', id)
-        localStorage.setItem('api-nodes-news-seen', 'true')
       }, this.id)
     }
     await this.goto()
@@ -402,30 +396,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()
@@ -442,20 +412,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-message:visible').count()
   }
 
   async clickTextEncodeNode1() {
@@ -533,7 +490,6 @@ export class ComfyPage {
 
       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'
@@ -967,12 +923,6 @@ 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)
   }

browser_tests/tests/colorPalette.spec.ts

@@ -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/tests/domWidget.spec.ts

@@ -31,20 +31,4 @@ test.describe('DOM Widget', () => {
     await comfyPage.nextFrame()
     await expect(comfyPage.canvas).toHaveScreenshot('focus-mode-on.png')
   })
-
-  // No DOM widget should be created by creation of interim LGraphNode objects.
-  test('Copy node with DOM widget by dragging + alt', async ({ comfyPage }) => {
-    const initialCount = await comfyPage.getDOMWidgetCount()
-
-    // TextEncodeNode1
-    await comfyPage.page.mouse.move(618, 191)
-    await comfyPage.page.keyboard.down('Alt')
-    await comfyPage.page.mouse.down()
-    await comfyPage.page.mouse.move(100, 100)
-    await comfyPage.page.mouse.up()
-    await comfyPage.page.keyboard.up('Alt')
-
-    const finalCount = await comfyPage.getDOMWidgetCount()
-    expect(finalCount).toBe(initialCount + 1)
-  })
 })

browser_tests/tests/execution.spec.ts

@@ -18,27 +18,3 @@ test.describe('Execution', () => {
     )
   })
 })
-
-test.describe('Execute to selected output nodes', () => {
-  test('Execute to selected output nodes', async ({ comfyPage }) => {
-    await comfyPage.loadWorkflow('execution/partial_execution')
-    const input = await comfyPage.getNodeRefById(3)
-    const output1 = await comfyPage.getNodeRefById(1)
-    const output2 = await comfyPage.getNodeRefById(4)
-    expect(await (await input.getWidget(0)).getValue()).toBe('foo')
-    expect(await (await output1.getWidget(0)).getValue()).toBe('')
-    expect(await (await output2.getWidget(0)).getValue()).toBe('')
-
-    await output1.click('title')
-
-    await comfyPage.executeCommand('Comfy.QueueSelectedOutputNodes')
-    // @note: Wait for the execution to finish. We might want to move to a more
-    // reliable way to wait for the execution to finish. Workflow in this test
-    // is simple enough that this is fine for now.
-    await comfyPage.page.waitForTimeout(200)
-
-    expect(await (await input.getWidget(0)).getValue()).toBe('foo')
-    expect(await (await output1.getWidget(0)).getValue()).toBe('foo')
-    expect(await (await output2.getWidget(0)).getValue()).toBe('')
-  })
-})

browser_tests/tests/interaction.spec.ts

@@ -1,6 +1,6 @@
 import { expect } from '@playwright/test'
 
-import { type ComfyPage, comfyPageFixture as test } from '../fixtures/ComfyPage'
+import { comfyPageFixture as test } from '../fixtures/ComfyPage'
 
 test.describe('Item Interaction', () => {
   test('Can select/delete all items', async ({ comfyPage }) => {
@@ -666,12 +666,6 @@ test.describe('Load workflow', () => {
       expect(activeWorkflowName).toEqual(workflowPathB)
     })
   })
-
-  test('Auto fit view after loading workflow', async ({ comfyPage }) => {
-    await comfyPage.setSetting('Comfy.EnableWorkflowViewRestore', false)
-    await comfyPage.loadWorkflow('single_ksampler')
-    await expect(comfyPage.canvas).toHaveScreenshot('single_ksampler_fit.png')
-  })
 })
 
 test.describe('Load duplicate workflow', () => {
@@ -689,42 +683,3 @@ test.describe('Load duplicate workflow', () => {
     expect(await comfyPage.getGraphNodesCount()).toBe(1)
   })
 })
-
-test.describe('Viewport settings', () => {
-  test.beforeEach(async ({ comfyPage }) => {
-    await comfyPage.setSetting('Comfy.UseNewMenu', 'Top')
-    await comfyPage.setSetting('Comfy.Workflow.WorkflowTabsPosition', 'Topbar')
-
-    await comfyPage.setupWorkflowsDirectory({})
-  })
-
-  test('Keeps viewport settings when changing tabs', async ({
-    comfyPage,
-    comfyMouse
-  }) => {
-    // Screenshot the canvas element
-    await comfyPage.menu.topbar.saveWorkflow('Workflow A')
-    await expect(comfyPage.canvas).toHaveScreenshot('viewport-workflow-a.png')
-
-    // Save workflow as a new file, then zoom out before screen shot
-    await comfyPage.menu.topbar.saveWorkflowAs('Workflow B')
-    await comfyMouse.move(comfyPage.emptySpace)
-    for (let i = 0; i < 4; i++) {
-      await comfyMouse.wheel(0, 60)
-    }
-    await expect(comfyPage.canvas).toHaveScreenshot('viewport-workflow-b.png')
-
-    const tabA = comfyPage.menu.topbar.getWorkflowTab('Workflow A')
-    const tabB = comfyPage.menu.topbar.getWorkflowTab('Workflow B')
-
-    // Go back to Workflow A
-    await tabA.click()
-    await comfyPage.nextFrame()
-    await expect(comfyPage.canvas).toHaveScreenshot('viewport-workflow-a.png')
-
-    // And back to Workflow B
-    await tabB.click()
-    await comfyPage.nextFrame()
-    await expect(comfyPage.canvas).toHaveScreenshot('viewport-workflow-b.png')
-  })
-})