Commit Graph

3858 Commits

Author SHA1 Message Date
Arjan Singh
0a73072ff1 feat(AssetBrowserModal): set initial focus to SearchBox (#5945)
## Summary

Some quick design feedback.

## Changes

1. Fix the placeholder text so it's showing up correctly.
2. Make the SearchBox take initial focus when the modal is opened.

┆Issue is synchronized with this [Notion
page](https://www.notion.so/PR-5945-feat-AssetBrowserModal-set-initial-focus-to-SearchBox-2846d73d365081bfb3e0cde78c827d5f)
by [Unito](https://www.unito.io)
2025-10-06 16:32:27 -07:00
Alexander Brown
e7745eb2be Style: Make components themeable (#5908)
## Summary

Replace color/dark-color pairs in components with design tokens to allow
for easy overriding.
<!-- Also standardizes the icon pattern to simplify the tailwind config.
-->

## Changes

- **What**: Token based colors, for now, mostly.
- **Breaking**: Got approval from Design to collapse some very similar
pairs of colors that seem to have diverged in implementations over time.
Some of the colors might be a little different, but we can tweak them
later.

## Review Focus

Still have quite a few places from which to remove `dark-theme`, but
this at least gets the theming much closer.
Need to decide if I want to keep going in here or cut this and do the
rest in a subsequent PR.

## Screenshots (if applicable)

<!-- Add screenshots or video recording to help explain your changes -->

┆Issue is synchronized with this [Notion
page](https://www.notion.so/PR-5908-WIP-Make-components-themeable-2816d73d365081ffbc05d189fe71084b)
by [Unito](https://www.unito.io)

---------

Co-authored-by: github-actions <github-actions@github.com>
2025-10-06 16:27:08 -07:00
Simula_r
51f0f111ea refactor: remove unused tooltip appendTo code (#5943)
## Summary

Remove unused tooltip appendTo positioning code.

┆Issue is synchronized with this [Notion
page](https://www.notion.so/PR-5943-refactor-remove-unused-tooltip-appendTo-code-2846d73d365081d99c00cd41e35eb496)
by [Unito](https://www.unito.io)

---------

Co-authored-by: Jake Schroeder <jake.schroeder@isophex.com>
2025-10-06 14:45:53 -07:00
AustinMroz
d69c54820f Subgraph widget promotion fixes (#5911)
- Fixes automatic promotion of image previews by ~~more correctly
handling a usage of `requestAnimationFrame` and~~ introducing a means to
perform actions upon successful load of preview.
- When workflows contain an old proxyWidget property in string form,
parse it instead of throwing an error.
- Do not overlay the `label` of promoted widgets. Further consideration
is needed, but this resolves the primary annoyance and prevents
untranslated widget names
See #5914

┆Issue is synchronized with this [Notion
page](https://www.notion.so/PR-5911-Subgraph-widget-promotion-fixes-2826d73d365081838ffeeea4b8d7068c)
by [Unito](https://www.unito.io)
2025-10-06 13:11:14 -07:00
AustinMroz
3eedff3876 Fix untyped subgraph node outputs in vue mode (#5930)
Under some infrequent circumstances, the node outputs of subgraphNodes
lack the boundingRect property. As this is a required property of
`INodeSlot`s, it's presence is required to satisfy isSlotObject and the
type information is discarded to instead display a placeholder output.

This boundingRect property is not used by vue nodes and the type of
nodeData.outputs already satisfies INodeSlot, so this entire typeguard
and computed can be removed.

<img width="405" height="209" alt="image"
src="https://github.com/user-attachments/assets/8563abb7-b619-495e-b9ec-e3274e7668cf"
/>


┆Issue is synchronized with this [Notion
page](https://www.notion.so/PR-5930-Fix-untyped-subgraph-node-outputs-in-vue-mode-2836d73d3650814f993fc71590eca79b)
by [Unito](https://www.unito.io)
2025-10-06 13:09:54 -07:00
ComfyUI Wiki
72ab84e37b Complete the missing i18n translations (#5927)
Complete the missing i18n translations

┆Issue is synchronized with this [Notion
page](https://www.notion.so/PR-5927-Complete-the-missing-i18n-translations-2836d73d3650815ab206cb82a01aae3e)
by [Unito](https://www.unito.io)

---------

Co-authored-by: Claude <noreply@anthropic.com>
2025-10-06 13:08:21 -07:00
Christian Byrne
2cb078cd9e fix mmb navigation when click starts on Vue nodes (#5921)
## Summary

Fixes https://github.com/Comfy-Org/ComfyUI_frontend/issues/5860
by updating Vue node pointer interactions to forward middle mouse button
events to canvas instead of handling them locally.

## Review Focus

Middle mouse button event detection logic using both `button` property
and `buttons` bitmask for cross-browser compatibility. Test coverage for
pointer event forwarding behavior.

┆Issue is synchronized with this [Notion
page](https://www.notion.so/PR-5921-fix-mmb-navigation-when-click-starts-on-Vue-nodes-2826d73d3650819688eec4600666755d)
by [Unito](https://www.unito.io)

---------

Co-authored-by: DrJKL <DrJKL@users.noreply.github.com>
2025-10-06 10:23:39 -07:00
Christian Byrne
480f37e2f5 use PrimeVue tooltip for "enter subgraph" button on Vue node headers (#5920)
## Summary

Replaced HTML `title` attribute with PrimeVue tooltip component for the
"Enter Subgraph" button in Vue node headers.

┆Issue is synchronized with this [Notion
page](https://www.notion.so/PR-5920-use-PrimeVue-tooltip-for-enter-subgraph-button-on-Vue-node-headers-2826d73d365081bdb0b9dcc7b4509d39)
by [Unito](https://www.unito.io)
2025-10-05 18:33:43 -07:00
Christian Byrne
f09590f269 fix border style on Vue nodes (#5924)
## Summary

Changes Vue nodes border to match
[design](https://www.figma.com/design/31uH3r4x3xbIctuRWYW6NM/V3---Vue-Nodes?node-id=6189-6820&m=dev).

┆Issue is synchronized with this [Notion
page](https://www.notion.so/PR-5924-fix-border-style-on-Vue-nodes-2826d73d36508121bb76cd786da06e5a)
by [Unito](https://www.unito.io)

---------

Co-authored-by: github-actions <github-actions@github.com>
2025-10-05 00:29:02 -07:00
filtered
07a74e3cdc Decouple Desktop UI into monorepo app (#5912)
## Summary

Extracts desktop UI into apps/desktop-ui package with minimal changes.

## Changes

- **What**:
- Separates desktop-specific code into standalone package with
independent Vite config, router, and i18n
- Drastically simplifies the main app router by removing all desktop
routes
  - Adds a some code duplication, most due to the existing design
- Some duplication can be refactored to be *simpler* on either side - no
need to split things by `isElectron()`
  - Rudimentary storybook support has been added
- **Breaking**: Stacked PR for publishing must be merged before this PR
makes it to stable core (but publishing _could_ be done manually)
  - #5915
- **Dependencies**: Takes full advantage of pnpm catalog. No additional
dependencies added.

## Review Focus

- Should be no changes to normal frontend operation
- Scripts added to root package.json are acceptable
- The duplication in this PR is copied as is, wherever possible. Any
corrections or fix-ups beyond the scope of simply migrating the
functionality as-is, can be addressed in later PRs. That said, if any
changes are made, it instantly becomes more difficult to separate the
duplicated code out into a shared utility.
  - Tracking issue to address concerns: #5925

### i18n

Fixing i18n is out of scope for this PR. It is a larger task that we
should consider carefully and implement properly. Attempting to isolate
the desktop i18n and duplicate the _current_ localisation scripts would
be wasted energy.
2025-10-05 05:04:27 +00:00
Alexander Piskun
ac9ebe1266 feat(api-nodes): add pricing for new Kling 2.5 Turbo model (#5892)
## Summary

Added prices for new model to the `KlingTextToVideoNode` and
`KlingImage2VideoNode` nodes

## Screenshots (if applicable)

<img width="2150" height="991" alt="Screenshot From 2025-10-02 10-51-04"
src="https://github.com/user-attachments/assets/489d2aeb-9c8b-4123-91ab-4e17df460862"
/>

┆Issue is synchronized with this [Notion
page](https://www.notion.so/PR-5892-feat-api-nodes-add-pricing-for-new-Kling-2-5-Turbo-model-2806d73d3650810eb33cf794dca23266)
by [Unito](https://www.unito.io)
2025-10-04 21:50:05 -07:00
Benjamin Lu
cd7310cb8c feat(vue-nodes): snap link preview; connect on drop (#5780)
## Summary

Snap link preview to the nearest compatible slot while dragging in Vue
Nodes mode, and complete the connection on drop using the snapped
target. Mirrors LiteGraph’s first-compatible-slot logic for node-level
snapping and reuses the computed candidate for performance.

## Changes

- Snap preview end to compatible slot
  - slot under cursor via `data-slot-key` fast-path
  - node under cursor via `findInputByType` / `findOutputByType`
- Render path
- `slotLinkPreviewRenderer.ts` now renders to
`state.candidate.layout.position`
- Complete on drop
  - Prefer `state.candidate` (no re-hit-testing)
  - Fallbacks: DOM slot → node first-compatible → reroute
  - Disconnects moving input link when dropped on canvas

## Review Focus

- UX feel of snapping and drop completion (both directions)
- Performance on large graphs (mousemove path is O(1) with dataset +
single validation)
- Edge cases: reroutes, moving existing links, collapsed nodes

## Screenshots (if applicable)


https://github.com/user-attachments/assets/fbed0ae2-2231-473b-a05a-9aaf68e3f820

https://github.com/Comfy-Org/ComfyUI_frontend/pull/5780 (snapping) <--
https://github.com/Comfy-Org/ComfyUI_frontend/pull/5898 (drop on canvas
+ linkconnectoradapter refactor) <--
https://github.com/Comfy-Org/ComfyUI_frontend/pull/5903 (fix reroute
snapping)

┆Issue is synchronized with this [Notion
page](https://www.notion.so/PR-5780-feat-vue-nodes-snap-link-preview-connect-on-drop-27a6d73d365081d89c8cf570e2049c89)
by [Unito](https://www.unito.io)

---------

Co-authored-by: github-actions <github-actions@github.com>
2025-10-04 21:48:59 -07:00
Christian Byrne
4e7e6e2bf3 fix dragging video/image components on Vue nodes triggers node drag (#5922)
## Summary

Fixed pointer capture behavior on video and image preview components to
prevent unintended node dragging. Below video shows behavior after fix:


https://github.com/user-attachments/assets/95563a2d-8958-47e1-a19c-977fb539d162

## Changes

- **What**: Added `data-capture-node="true"` attribute to
`VideoPreview.vue` and `ImagePreview.vue` components
- **What**: Enhanced `useNodePointerInteractions.ts` composable to
detect and handle pointer events on elements with capture attribute

## Review Focus

Pointer event delegation logic and interaction behavior between preview
components and canvas drag operations.

┆Issue is synchronized with this [Notion
page](https://www.notion.so/PR-5922-fix-dragging-video-image-components-on-Vue-nodes-triggers-node-drag-2826d73d365081ce83e7fd61510167e2)
by [Unito](https://www.unito.io)

---------

Co-authored-by: DrJKL <DrJKL@users.noreply.github.com>
2025-10-04 21:30:02 -07:00
Christian Byrne
2c555efdfe [refactor] remove import alias on LGraphNode.vue (#5919)
## Summary

Changes import name such that it matches the SFC filename.

┆Issue is synchronized with this [Notion
page](https://www.notion.so/PR-5919-refactor-remove-import-alias-on-LGraphNode-vue-2826d73d365081fc80d8f277a40f7d81)
by [Unito](https://www.unito.io)
2025-10-04 17:49:55 -07:00
Arjan Singh
59736c6d1d feat: create toggle command for AssetAPI (#5918)
## Summary

Taking inspiration from VueNodes to make testing easier

## Changes

1. Add a toggle to enable/disable AssetAPI
2. If you have the Model Browser bound, it will prompt to enable the
AssetAPI if you try to use it.

┆Issue is synchronized with this [Notion
page](https://www.notion.so/PR-5918-feat-create-toggle-command-for-AssetAPI-2826d73d365081539aeaf3951928fdc1)
by [Unito](https://www.unito.io)
2025-10-04 13:54:43 -07:00
Alexander Brown
84e6e99f17 Cleanup: Removing monkeypatches for litegraph logic (#5902)
## Summary

Putting the litegraph specific pieces into litegraph itself, using the
CanvasGraph and LiteGraphGlobal to coordinate options.

This was one part of the Image Previews reloading/calculating with every
canvas draw.

## Review Focus

Is this keeping things decoupled enough?
Is this the right place to put things?
Are there assumptions about the options that I'm missing here?

┆Issue is synchronized with this [Notion
page](https://www.notion.so/PR-5902-WIP-Removing-monkeypatches-for-litegraph-logic-2816d73d3650818b860ec73579b89b54)
by [Unito](https://www.unito.io)

---------

Co-authored-by: github-actions <github-actions@github.com>
2025-10-03 21:22:42 -07:00
Arjan Singh
abf2b3b980 Full Asset Selection Experience (Assets API) (#5900)
## Summary

Full Integration of Asset Browsing and Selection when Assets API is
enabled.

## Changes

1. Replace Model Left Side Tab with experience
2. Configurable titles for the Asset Browser Modal
3. Refactors to simplify callback code
4. Refactor to make modal filters reactive (they change their values
based on assets displayed)
5. Add `browse()` mode with ability to create node directly from the
Asset Browser Modal (in `browse()` mode)

## Screenshots

Demo of many different types of Nodes getting configured by the Modal



https://github.com/user-attachments/assets/34f9c964-cdf2-4c5d-86a9-a8e7126a7de9

┆Issue is synchronized with this [Notion
page](https://www.notion.so/PR-5900-Feat-asset-selection-cloud-integration-2816d73d365081ccb4aeecdc14b0e5d3)
by [Unito](https://www.unito.io)
2025-10-03 20:34:59 -07:00
Rizumu Ayaka
661885f5e5 feat(widgets): lazy load images in FormDropdown (#5904)
some users may have a very large number of files, so we only need to
request/render the ones that are visible.

┆Issue is synchronized with this [Notion
page](https://www.notion.so/PR-5904-feat-widgets-lazy-load-images-in-FormDropdown-2816d73d36508195b283ff469061f3f3)
by [Unito](https://www.unito.io)

Co-authored-by: Claude <noreply@anthropic.com>
2025-10-03 13:03:36 -07:00
Christian Byrne
038ed27107 fix Vue node dragging/moving on touch devices (#5896)
## Summary

Enabled touch drag functionality on Vue nodes by adding CSS
`touchAction: 'none'`.

## Changes

- **What**: Added [`touchAction:
'none'`](https://developer.mozilla.org/en-US/docs/Web/CSS/touch-action)
CSS property to Vue nodes for touch device compatibility
- **What**: Added Playwright tests for both desktop and mobile drag
interactions

## Review Focus

Touch event handling on various mobile browsers and pointer event
compatibility across different devices.

┆Issue is synchronized with this [Notion
page](https://www.notion.so/PR-5896-fix-Vue-node-dragging-moving-on-touch-devices-2806d73d365081578b02cd6714fd8fe0)
by [Unito](https://www.unito.io)

---------

Co-authored-by: github-actions <github-actions@github.com>
2025-10-02 21:20:33 -07:00
Alexander Brown
b994608506 Tests: Vitest configuration cleanup (#5888)
## Summary

Simplify default scripts. Filtering is still available to users, we can
revisit tagging or grouping later.
This fixes the issue where we had tests that were in the codebase but
never run because they weren't under `/src/components`

Also deletes the duplicate litegraph tests and their associated vitest
config file.

## Changes

- **What**: Test cleanup

## Review Focus

┆Issue is synchronized with this [Notion
page](https://www.notion.so/PR-5888-Tests-Vitest-configuration-cleanup-2806d73d36508197b800f68f0b028279)
by [Unito](https://www.unito.io)
2025-10-02 21:01:42 -07:00
Simula_r
39eca0bc0a fix: save video preview (#5897)
## Summary

Fix the save video preview by checking for video inputs.

## Screenshots (if applicable)


https://github.com/user-attachments/assets/26a1fbb1-f54c-4a17-a59d-ce89b4e0c389

┆Issue is synchronized with this [Notion
page](https://www.notion.so/PR-5897-fix-save-video-preview-2816d73d365081b79a47e0da29e1fed6)
by [Unito](https://www.unito.io)
2025-10-02 19:34:00 -07:00
Johnpaul Chiwetelu
2970692176 Move Frame Vue Nodes (#5886)
This pull request improves the selection and movement logic for groups
and nodes on the LiteGraph canvas, especially when using Vue-based node
rendering. The most notable changes are the addition of proper bounding
box handling for groups and a new coordinated movement mechanism that
updates both LiteGraph internals and the Vue layout store when dragging
nodes and groups.

**Selection and bounding box calculation:**

* Added support for including `LGraphGroup` bounding rectangles when
calculating the selection toolbox position, so groups are now properly
considered in selection overlays.
[[1]](diffhunk://#diff-57a51ac5e656e64ae7fd276d71b115058631621755de33b1eb8e8a4731d48713L8-R8)
[[2]](diffhunk://#diff-57a51ac5e656e64ae7fd276d71b115058631621755de33b1eb8e8a4731d48713R95-R97)

**Node and group movement synchronization (Vue nodes mode):**

* Introduced a new movement logic in `LGraphCanvas` for Vue nodes mode:
when dragging, groups and their child nodes are moved together, and all
affected node positions are batch-updated in both LiteGraph and the Vue
layout store via `moveNode`. This ensures canvas and UI stay in sync.
* Added imports for layout mutation operations and types to support the
above synchronization.

These changes make group selection and movement more robust and ensure
that UI and internal state remain consistent when using the Vue-based
node system.



https://github.com/user-attachments/assets/153792dc-08f2-4b53-b2bf-b0591ee76559

┆Issue is synchronized with this [Notion
page](https://www.notion.so/PR-5886-Move-Frame-Vue-Nodes-2806d73d365081e48b5ef96d6c6b6d6b)
by [Unito](https://www.unito.io)
2025-10-03 03:05:33 +01:00
Alexander Brown
4b1c165d43 Cleanup/Perf: Float32Array/Float64Array removal (#5877)
## Summary

Redoing https://github.com/Comfy-Org/ComfyUI_frontend/pull/5567, without
the link rendering changes.

## Changes

- **What**: Standardizing the Point/Size/Rect logic around numeric
tuples instead of typed arrays.

## Review Focus

Cutting here and going to continue in a second PR.

Do the simpler types make sense?
Do we want to keep the behavior of Rectangle as it is now?

┆Issue is synchronized with this [Notion
page](https://www.notion.so/PR-5877-WIP-Float32Array-Float64Array-removal-27f6d73d36508169a39eff1e4a87a61c)
by [Unito](https://www.unito.io)

---------

Co-authored-by: filtered <176114999+webfiltered@users.noreply.github.com>
Co-authored-by: github-actions <github-actions@github.com>
2025-10-02 17:20:31 -07:00
AustinMroz
720de8cc8a Add UI code for configuring subgraphNode widgets (#5826)
The third PR for managing display of widgets on subgraph nodes. This is
the one that actually makes the functionality usable and user visible.

Adds
- A right-side modal for configuring which widgets are promoted,
accessed by right click or selection toolbar
- This menu allows for re-arranging widget order by dragging and
dropping.
- Indicators inside the subgraph for which widgets have been promoted.
- Context menu options for promoting or demoting widget inside of a
subgraph.
<img width="767" height="694" alt="image"
src="https://github.com/user-attachments/assets/4f78645d-7b26-48ba-8c49-78f4807e89e8"
/>
<img width="784" height="435" alt="image"
src="https://github.com/user-attachments/assets/7005c730-a732-481e-befb-57019a8a31a7"
/>


Known issues
- Some preview widgets are not added to a node until a draw operation
occurs. The code does not yet have a way of determining which nodes
should have draw operations forced to facilitate initial widget
creation.

┆Issue is synchronized with this [Notion
page](https://www.notion.so/PR-5826-Add-UI-code-for-configuring-subgraphNode-widgets-27c6d73d36508146accbf395e5bcd36a)
by [Unito](https://www.unito.io)
2025-10-02 17:19:47 -07:00
Arjan Singh
48335475dc Chores: Updates for Asset Services (#5872)
## Changes

1. Updates schema to match new API
2. Adds additional relevant models to the registry

┆Issue is synchronized with this [Notion
page](https://www.notion.so/PR-5872-Chores-Updates-for-Asset-Services-27f6d73d36508117b89fd473f1a7090d)
by [Unito](https://www.unito.io)
2025-10-02 15:52:36 -07:00
Simula_r
0d3d258995 Fix/vue nodes video (#5870)
## Summary

Fix the video preview widget and associated dropdown to load and select
videos.

Fixes:
-
https://www.notion.so/comfy-org/Video-thumbnails-not-being-used-in-asset-explorer-dialog-27e6d73d365080ec8a3ee7c7ec413657?source=copy_link
-
https://www.notion.so/comfy-org/Image-Video-upload-dialog-doesnt-set-mime-type-27e6d73d365080c5bffdf08842855ba0?source=copy_link
-
https://www.notion.so/comfy-org/Video-Previews-are-not-displayed-2756d73d365080b2bfb9e0004e9d784d?source=copy_link
-
https://www.notion.so/comfy-org/Cannot-load-video-in-Load-Video-node-2756d73d365080009c21d3a67add96c4?source=copy_link

## Screenshots (if applicable)


https://github.com/user-attachments/assets/b71dbecb-c9a7-4feb-83a3-c3e044a9c93c

┆Issue is synchronized with this [Notion
page](https://www.notion.so/PR-5870-Fix-vue-nodes-video-27e6d73d36508182b44bef8e90ef4018)
by [Unito](https://www.unito.io)

---------

Co-authored-by: JakeSchroeder <jake@axiom.co>
Co-authored-by: github-actions <github-actions@github.com>
Co-authored-by: Jake Schroeder <jake.schroeder@isophex.com>
Co-authored-by: Rizumu Ayaka <rizumu@ayaka.moe>
2025-10-02 13:58:47 -07:00
Christian Byrne
3818ba5d17 fix Vue node header width (#5895)
## Summary

Added `w-full` class to Vue node header to ensure full width layout
consistency.

## Changes

- **What**: Applied [Tailwind CSS w-full
utility](https://tailwindcss.com/docs/width#full-width) to NodeHeader
component for consistent width behavior

## Review Focus

If this is best place to set the class

## Screenshots (if applicable)

*Before*

<img width="931" height="919" alt="image"
src="https://github.com/user-attachments/assets/fe94ddad-f43b-4441-a924-60aeaff94041"
/>

*After*

<img width="931" height="919" alt="Screenshot from 2025-10-02 10-38-53"
src="https://github.com/user-attachments/assets/596681ad-309a-4fab-a343-bfbb73d72f6c"
/>

┆Issue is synchronized with this [Notion
page](https://www.notion.so/PR-5895-fix-Vue-node-header-width-2806d73d365081bb82ddf6abe8665f8b)
by [Unito](https://www.unito.io)
2025-10-02 13:29:43 -07:00
Rizumu Ayaka
7e4c756258 feat: inputs/outputs filter to widget dropdown (#5894)
related https://github.com/Comfy-Org/ComfyUI_frontend/issues/5827

┆Issue is synchronized with this [Notion
page](https://www.notion.so/PR-5894-feat-inputs-outputs-filter-to-widget-dropdown-2806d73d365081498d92d0576b7da6a8)
by [Unito](https://www.unito.io)

---------

Co-authored-by: bymyself <cbyrne@comfy.org>
2025-10-02 13:06:08 -07:00
Alexander Brown
37fab21daf Cleanup: YAGNI readonly props, private swap on ComfyApp, Canvas resize events simplification, v-memos on individual instances (#5869)
## Summary

Assorted cleanup opportunities found while working through the Vue node
rendering logic cleanup.

## Review Focus

Am I wrong that the readonly logic was never actually executing because
it was defined as False in GraphCanvas when making each LGraphNode?

Is there an edge case or some other reason that the ResizeObserver
wouldn't work as a single signal to resize the canvas?

┆Issue is synchronized with this [Notion
page](https://www.notion.so/PR-5869-Cleanup-YAGNI-readonly-props-private-swap-on-ComfyApp-Canvas-resize-events-simplificat-27e6d73d3650811ba1dcf29e8d43091e)
by [Unito](https://www.unito.io)

---------

Co-authored-by: github-actions <github-actions@github.com>
2025-10-02 10:35:10 -07:00
Alexander Piskun
9c97fb359d feat(auth): Allow SSO login only for whitelisted addresses (localhost) (#5815)
## Summary

Hide Google/GitHub SSO login options when the UI is accessed from
**non‑local** addresses.
This PR also adds a **static whitelist** (editable in code) so we can
allow additional hosts if needed.

Default whitelisted addresses:

1. `localhost` and any subdomain: `*.localhost`
2. IPv4 loopback `127.0.0.0/8` (e.g., `127.x.y.z`)
4. IPv6 loopback `::1` (including equivalent textual forms such as
`::0001`)

## Changes

- **What**: 
* Add `src/utils/hostWhitelist.ts` with `normalizeHost` and
`isHostWhitelisted` helpers.
  * Update `SignInContent.vue` to **hide** SSO options when
`isHostWhitelisted(normalizeHost(window.location.hostname))` returns
`false`.
- **Breaking**:
* Users accessing from Runpod or other previously allowed **non‑local**
hosts will **lose** SSO login options.
If we need to keep SSO there, we should add those hosts to the whitelist
in `hostWhitelist.ts`.

## Review Focus

1. Verify that logging in from local addresses (`localhost`,
`*.localhost`, `127.0.0.1`, `::1`) **does not change** the current
behavior: SSO is visible.
2. Verify that from a **non‑local** address, SSO options are **not**
displayed.

## Screenshots (if applicable)

UI opened from `192.168.2.109` address:

<img width="500" height="990" alt="Screenshot From 2025-09-27 13-22-15"
src="https://github.com/user-attachments/assets/c97b10a1-b069-43e4-a26b-a71eeb228a51"
/>

UI opened from default `127.0.0.1` address(nothing changed):

<img width="462" height="955" alt="Screenshot From 2025-09-27 13-35-27"
src="https://github.com/user-attachments/assets/bb2bf21c-dc8d-49cb-b48e-8fc6e408023c"
/>

┆Issue is synchronized with this [Notion
page](https://www.notion.so/PR-5815-feat-auth-Allow-SSO-login-only-for-whitelisted-addresses-localhost-27b6d73d365081ccbe84c034cf8e416d)
by [Unito](https://www.unito.io)
2025-10-01 23:09:11 -07:00
snomiao
c662c77305 Add Playwright composite action to reduce workflow duplication (#5754)
This PR introduces a reusable composite action for Playwright setup to
reduce duplication across workflows.

## Changes
- Created `.github/actions/setup-playwright/action.yml` composite action
that:
  - Detects or uses provided Playwright version
  - Caches Playwright browsers with intelligent cache keys
  - Installs browsers only when cache miss occurs
  - Installs OS dependencies when cache hit occurs
  
## Technical Details
- **Important:** The composite action requires `shell: bash` for all
`run` steps as per [GitHub Actions requirements for composite
actions](https://docs.github.com/en/actions/creating-actions/creating-a-composite-action#creating-an-action-metadata-file).
This is a mandatory field for composite actions, unlike regular workflow
steps.
- Updated workflow paths to account for repository checkout locations
(some workflows checkout to subdirectories like `ComfyUI_frontend/`)
- Uses conditional caching to avoid redundant browser installations

## Benefits
- Reduces code duplication across 6 workflow files
- Centralizes Playwright caching logic  
- Consistent browser setup across all workflows
- Easier maintenance and updates
- Faster CI runs through intelligent caching

## Affected Workflows
- `.github/workflows/test-ui.yaml` (2 uses)
- `.github/workflows/i18n-custom-nodes.yaml`
- `.github/workflows/i18n-node-defs.yaml`
- `.github/workflows/i18n.yaml`
- `.github/workflows/test-browser-exp.yaml`

---------

Co-authored-by: GitHub Action <action@github.com>
2025-10-02 14:20:48 +09:00
Marcel Petrick
d0e81cdd33 fix(docs): correct typos in comments and strings found during code view (#5880)
Non-functional changes only:
- Fixed minor spelling mistakes in comments
- Corrected typos in user-facing strings
- No variables, logic, or functional code was modified.

Signed-off-by: Marcel Petrick <mail@marcelpetrick.it>

┆Issue is synchronized with this [Notion
page](https://www.notion.so/PR-5880-fix-docs-correct-typos-in-comments-and-strings-found-during-code-view-27f6d73d3650815db62af6115991304a)
by [Unito](https://www.unito.io)

---------

Signed-off-by: Marcel Petrick <mail@marcelpetrick.it>
Co-authored-by: Alexander Brown <DrJKL0424@gmail.com>
Co-authored-by: Benjamin Lu <benjaminlu1107@gmail.com>
2025-10-01 18:35:38 -07:00
Johnpaul Chiwetelu
01b3aeae68 Prune console.log() (#5867)
Introduce a no-console rule in ESLint configuration and remove existing
console log statements throughout the codebase, replacing some with
warnings or comments.

┆Issue is synchronized with this [Notion
page](https://www.notion.so/PR-5867-Prune-console-log-27e6d73d365081bcbad8c36cfb5b258c)
by [Unito](https://www.unito.io)
2025-10-01 18:34:58 -07:00
Terry Jia
20731fe3f0 pass nodeId to widget component (#5853)
## Summary

pass nodeId to widget component, which is a prerequirist for
https://github.com/Comfy-Org/ComfyUI_frontend/pull/5765

┆Issue is synchronized with this [Notion
page](https://www.notion.so/PR-5853-pass-nodeData-to-widget-component-27e6d73d3650811e9e48ceb7c3a00545)
by [Unito](https://www.unito.io)
2025-10-01 21:31:49 -04:00
Christian Byrne
3f291672d4 fix progress state on Vue nodes in subgraphs (#5842)
## Summary

Fixes two errors with subgraph progress states:

1. Nodes inside subgraphs were not having progress state shown
2. Subgraph nodes (outer representation) themselves did not have a
visible progress state

1 is fixed by using locator IDs instead of local node IDs.

2 is fixed by ensuring the subgraph title button does not wrap to a
newline and thus block the progress bar under the node header.

## Changes

- **What**: Updated `useNodeExecutionState` composable to use
`nodeLocatorId` for tracking execution state across subgraph boundaries
- **What**: Modified NodeHeader layout to fix subgraph enter button
positioning with proper flexbox gap

## Review Focus

Execution state tracking accuracy for nested subgraph nodes and
NodeHeader layout consistency across different node types.

┆Issue is synchronized with this [Notion
page](https://www.notion.so/PR-5842-fix-progress-state-on-Vue-nodes-in-subgraphs-27c6d73d365081cb8335c8bb5dbd74f7)
by [Unito](https://www.unito.io)

---------

Co-authored-by: github-actions <github-actions@github.com>
2025-09-30 15:01:18 -07:00
Christian Byrne
f16f5a0bc6 When restoring workflow tabs from previous session, don't skip workflows that were modified (#5857)
## Summary

In https://github.com/Comfy-Org/ComfyUI_frontend/pull/2238, we added
feature to restore open tabs from previous session. At that time, it was
decided to not restore the tabs if they had a modified worklow - the
reason being that we would not be able to restore the actual state.
However, MANY users have expressed frustration with this - so, for now,
restore the tabs even if they were modified in the previous session (and
unsaved).

There are already e2e test cases for this feature here:
26cf45ed36/browser_tests/tests/interaction.spec.ts (L679)

And unit tests for the relevant workflow store methods here:
26cf45ed36/tests-ui/tests/store/workflowStore.test.ts (L184)

Resolves https://github.com/Comfy-Org/ComfyUI_frontend/issues/5848

## Changes

- **What**: Modified filter in `restoreState` computed property to
persist both saved and modified workflows

## Review Focus

Impact on browser storage when users have many modified workflows open
simultaneously.

┆Issue is synchronized with this [Notion
page](https://www.notion.so/PR-5857-When-restoring-workflow-tabs-from-previous-session-don-t-skip-workflows-that-were-modifi-27e6d73d36508182a900d2918d0fb163)
by [Unito](https://www.unito.io)
2025-09-29 22:24:44 -07:00
filtered
4fc7d6352f [devex] Fix .vue import failures silently discarded (#5852)
## Summary

Removes the old Vue shim; this is not needed in modern Vue. It actually
appears to be detrimental, forcing `any` types and causing broken
imports to be ignored by some tooling.

## Changes

- **What**: Deletes unnecessary TS decl.
- **Breaking**: Nein.
- **Dependencies**: Null.

## Review Focus

The **Approve** button.

## Screenshots (if applicable)

<img width="114" height="31" alt="image"
src="https://github.com/user-attachments/assets/3bb3d895-8b4c-4540-8f9b-a110c338d666"
/>

┆Issue is synchronized with this [Notion
page](https://www.notion.so/PR-5852-devex-Fix-vue-import-failures-silently-discarded-27e6d73d3650819eb956f2aaf55420f2)
by [Unito](https://www.unito.io)
2025-09-29 22:24:28 -07:00
Simula_r
c47cedcec2 Fix/vue nodes tooltips (#5856)
## Summary

Make vue node tooltips support color modes and hide when user drags node
or zooms in or out.

IMPORTANT: this approach is non ideal. But for sake of time its a valid
escape hatch. The reason for this approach is because of how primevue
exposes tooltips via a directive and the inability to modify its state /
conditionally render it directly. Instead we must get the actual tooltip
element from the dom and trigger a mouseleave event.

Follow up PR would be refactoring the entire useNodeTooltip.ts
composable and tooltip system from primevue to something like RekaUI
which is a much more declarative approach. To start we could just
refactor Vue nodes themselves to RekaUI tooltips and then later migrate
the other instances.

## Changes

- **What**:  hide tooltips on drag and zoom. Use color themes

## Review Focus

Tooltip hover states after dragging. 
Fixes: 
-
https://www.notion.so/comfy-org/Bug-Fix-tooltip-appearing-when-clicking-and-dragging-Vue-node-header-2796d73d365081f692fdde30c51580e1?source=copy_link
-
https://www.notion.so/comfy-org/Bug-Fix-chevron-color-customization-in-tooltip-pseudo-element-27b6d73d3650814abc25fc0eefda1648?source=copy_link
-
https://www.notion.so/comfy-org/Bug-Bug-Tooltip-positioning-breaks-with-zoom-due-to-missing-appendTo-prop-27b6d73d36508186858bd1cb4336ec03?source=copy_link

## Screenshots (if applicable)


https://github.com/user-attachments/assets/06c70f6c-bf64-4b6d-8e6f-739995549940

┆Issue is synchronized with this [Notion
page](https://www.notion.so/PR-5856-Fix-vue-nodes-tooltips-27e6d73d36508177a77bf7f2f27344f4)
by [Unito](https://www.unito.io)

---------

Co-authored-by: Jake Schroeder <jake.schroeder@isophex.com>
2025-09-29 22:18:14 -07:00
Terry Jia
28a779d41a Check if the wheel event is from an element that wants to capture wheel events (#5821)
## Summary

Add generic wheel event capture mechanism for interactive widgets in
vueNodes system to prevent event bubbling to canvas.

  ## Changes

- What: Add event handling logic in LGraphNode.vue and GraphCanvas.vue
that checks for data-capture-wheel attribute to determine whether wheel
events should be forwarded to the canvas
- How it works: Components that need to capture wheel events (like
Three.js scenes) can add data-capture-wheel="true" attribute to prevent
wheel events from bubbling up to the canvas zoom handler

prerequirist for https://github.com/Comfy-Org/ComfyUI_frontend/pull/5765

┆Issue is synchronized with this [Notion
page](https://www.notion.so/PR-5821-Check-if-the-wheel-event-is-from-an-element-that-wants-to-capture-wheel-events-27b6d73d3650812493b5f13849147e6c)
by [Unito](https://www.unito.io)
2025-09-29 19:51:37 -07:00
filtered
ed5d258ab6 Extract shared utilities into workspace package (#5843)
## Summary

Extracts shared formatting and network utilities into dedicated
workspace package.

## Changes

- **What**: Created `@comfyorg/shared-frontend-utils` package containing
formatUtil and networkUtil
- **Breaking**: None - utilities remain accessible via path aliases in
`tsconfig`

Split `createAnnotatedPath` and `electronMirrorCheck` out and left in
frontend, due to their tightly-coupled nature. See [discussion on this
PR](https://github.com/Comfy-Org/ComfyUI_frontend/pull/5843#issuecomment-3344724727).
2025-09-29 18:52:40 -07:00
Benjamin Lu
5d0aee59a6 Increase vue slot/link functionality (#5710)
## Summary

Increase functionality for slots and links, covered with playwright
tests.

## Features

- Allow for reroute anchors to work when dragging from input slot
- Allow for dragging existing links from input slot
- Allow for ctrl/command + alt to create new link from input slot
- Allow shift to drag all connected links on output slot
- Connect links with reroutes (only when dragged from vue slot)

## Tests Added

### Playwright

- Dragging input to input drags existing link
- Dropping an input link back on its slot restores the original
connection
- Ctrl+alt drag from an input starts a fresh link
- Should reuse the existing origin when dragging an input link
- Shift-dragging an output with multiple links should drag all links
- Rerouted input drag preview remains anchored to reroute
- Rerouted output shift-drag preview remains anchored to reroute

## Notes

The double rendering system for links being dragged, it works right now,
maybe they can be coalesced later.

Edit: As in the adapter, can be removed in a followup PR

Also, it's known that more features will arrive in smaller PRs, this PR
actually should've been much smaller.

The next ones coming up are drop on canvas support, snap to node, type
compatibility highlighting, and working with subgraphs.

┆Issue is synchronized with this [Notion
page](https://www.notion.so/PR-5710-Increase-vue-slot-link-functionality-2756d73d3650814f8995f7782244803b)
by [Unito](https://www.unito.io)

---------

Co-authored-by: github-actions <github-actions@github.com>
2025-09-29 18:23:32 -07:00
Arjan Singh
d852bab617 [chore] make experiment asset api setting hidden (#5851)
## Summary

This way no one can accidentally enable it when they are messing around.

┆Issue is synchronized with this [Notion
page](https://www.notion.so/PR-5851-chore-make-experiment-asset-api-setting-hidden-27d6d73d36508113a6c1e41a764325f3)
by [Unito](https://www.unito.io)
2025-09-29 16:14:16 -07:00
Alexander Brown
dd93ac43d9 fix: Only add the listeners for DomWidget components once (#5846)
## Summary

Fixes the laggy textarea select noted in Discord.

## Changes

- **What**: Fixes the case where a DomWidget that was repeatedly made
visible accumulated as many event listeners as times it was toggled on.

┆Issue is synchronized with this [Notion
page](https://www.notion.so/PR-5846-fix-Only-add-the-listeners-for-DomWidget-components-once-27d6d73d3650818382e0d0c565fc862a)
by [Unito](https://www.unito.io)
2025-09-29 13:52:49 -05:00
Christian Byrne
e0b1a6d212 [test] fix flaky Vue upload widget browser tests using randomize url param (#5845)
## Summary

Fix browser tests that use filenames in loader nodes. When the files
don't exist, the fallback/error component shows the request URL which
contains random cache-busting param which makes tests fail due to
non-deterministic nature.


[Context](https://github.com/Comfy-Org/ComfyUI_frontend/pull/5831#discussion_r2386582256)

┆Issue is synchronized with this [Notion
page](https://www.notion.so/PR-5845-test-fix-flaky-Vue-upload-widget-browser-tests-using-randomize-url-param-27d6d73d36508107a0d0d52d2764a028)
by [Unito](https://www.unito.io)

---------

Co-authored-by: Claude <noreply@anthropic.com>
Co-authored-by: github-actions <github-actions@github.com>
2025-09-28 23:28:52 -07:00
Christian Byrne
bbd8d67f5f designate canvasOnly on runtime-generated virtual widgets so they are hidden in Vue renderer (#5831)
## Summary

Added `canvasOnly` flag to runtime-generated widgets to prevent Vue
renderer from displaying them while keeping canvas functionality intact.

## Changes

- **What**: Added `canvasOnly` widget option to hide upload, webcam, and
refresh widgets from Vue renderer

In the Canvas (LiteGraph) system, there was a small set of widgets with
strictly defined components. There, if we wanted some unique or
relatively complex behavior (like an upload butotn), we needed to create
a separate widget that would be coupled to the original widget at
runtime (and would not be serialized).

In the Vue renderer system, we can simply add flags to the inputSpec or
widget options and conditionally render complex UI additions -- i.e.,
there is no need for the hard-to-maintain runtime widget associations.
Expressing such things entirely in the view layer simplifies business
logic related to graph state, as we no longer need to account for
preserving the connections between runtime widgets and their special
siblings -- we also do not need to worry about the implications for
state serialization.

## Related

- https://github.com/Comfy-Org/ComfyUI_frontend/pull/5798

┆Issue is synchronized with this [Notion
page](https://www.notion.so/PR-5831-designate-canvasOnly-on-runtime-generated-virtual-widgets-so-they-are-hidden-in-Vue-ren-27c6d73d365081fb8641feec010190df)
by [Unito](https://www.unito.io)

---------

Co-authored-by: github-actions <github-actions@github.com>
2025-09-28 18:48:29 -07:00
filtered
5c707a1b93 Extract registry types into workspace package (#5840)
## Summary

Extracts ComfyUI registry types into a dedicated workspace package for
better modularity.

## Changes

- **What**: Created `@comfyorg/registry-types` package to house
generated type definitions
- **Breaking**: None - maintains backward compatibility through
re-exports at original path
- **Dependencies**: Added `@comfyorg/registry-types` as workspace
dependency

## Review Focus

Is this the right granularity for package extraction, or should registry
types be part of a larger shared package?

PR split into two tiny diffs:
- [Part
one](f8d3d2fa01)
- [Part
two](f8d3d2fa01..c48ca84336)

┆Issue is synchronized with this [Notion
page](https://www.notion.so/PR-5840-Extract-registry-types-into-workspace-package-27c6d73d365081dbb824d680ce739316)
by [Unito](https://www.unito.io)
2025-09-28 18:28:42 -07:00
Christian Byrne
a30705161d [type] properly type Vue node tooltip config pt object (#5832)
## Summary

Changes `any` type to proper type per the documentation here
https://primevue.org/tooltip/#api.tooltip.interfaces.TooltipOptions.pt

┆Issue is synchronized with this [Notion
page](https://www.notion.so/PR-5832-type-properly-type-Vue-node-tooltip-config-pt-object-27c6d73d365081ea99c2c719d9ee6586)
by [Unito](https://www.unito.io)
2025-09-28 11:50:02 -07:00
Alexander Piskun
aa212bea90 add pricing for WanImageToImageApi node (#5829)
## Summary

Currently the price is constant.

## Screenshots (if applicable)

<img width="452" height="380" alt="Screenshot From 2025-09-28 18-01-47"
src="https://github.com/user-attachments/assets/b9026be9-ef88-417f-aaca-b5a29eb23c55"
/>

┆Issue is synchronized with this [Notion
page](https://www.notion.so/PR-5829-add-pricing-for-WanImageToImageApi-node-27c6d73d36508137b1baf75c0031f172)
by [Unito](https://www.unito.io)
2025-09-28 09:48:18 -07:00
Arjan Singh
a2c7db9dc2 [fix] add InputSlot and dot error state (#5813)
## Summary

Error states were not getting propagated down to the InputSlots from the
API Repsonse

I created a provider and injected error state. It seemed like a way
better idea than prop drilling or building a composable that only two
nodes (`InputSlot` and `OutputSlot`) would need.

## Changes

The follow are now error code red when an input node has errors:
1. There's a error round border around the dot.
2. The dot is error colored.
3. The input text is error colored.

This treatment was okay after feedback from design.

## Screenshots - Error State

<img width="749" height="616" alt="Screenshot 2025-09-26 at 9 02 58 PM"
src="https://github.com/user-attachments/assets/55c7edc9-081b-4a9d-9753-120465959b5d"
/>

┆Issue is synchronized with this [Notion
page](https://www.notion.so/PR-5813-fix-add-InputSlot-and-dot-error-state-27b6d73d36508151a955e485f00a2d05)
by [Unito](https://www.unito.io)

---------

Co-authored-by: github-actions <github-actions@github.com>
2025-09-27 20:14:13 -07:00
Alexander Brown
840f7f04fa Cleanup: Litegraph/Vue synchronization work (#5789)
## Summary

Cleanup and fixes to the existing syncing logic.

## Review Focus

This is probably enough to review and test now.

Main things that should still work: 
- moving nodes around
- adding new ones
- switching back and forth between Vue and Litegraph

Let me know if you find any bugs that weren't already present there.

┆Issue is synchronized with this [Notion
page](https://www.notion.so/PR-5789-WIP-Litegraph-Vue-synchronization-work-27a6d73d3650811682cacacb82367b9e)
by [Unito](https://www.unito.io)
2025-09-27 16:01:59 -07:00