Commit Graph

5376 Commits

Author SHA1 Message Date
Alexander Brown
874ef3ba0c Lint: Add eslint import plugin (#5955)
## Summary

Adds the linter, turns on the recommended and a few extra rules, fixes
existing violations.

Doesn't prohibit `../../...` imports yet, that'll be it's own PR.

## Changes

- **What**: Consistent and fixable imports
- **Dependencies**: The plugin and parser

## Review Focus

How do you feel about the recommended rules?
What about the extra ones?
[Any
more](https://github.com/un-ts/eslint-plugin-import-x?tab=readme-ov-file#rules)
you'd want to turn on?

┆Issue is synchronized with this [Notion
page](https://www.notion.so/PR-5955-Lint-Add-eslint-import-plugin-2856d73d3650819985c0fb9ca3fa94b0)
by [Unito](https://www.unito.io)
2025-10-07 20:31:00 -07:00
Arjan Singh
45ebc59033 chore(package.json): increase memory available for build command (#5968)
## Summary

Increased default node memory allocation to 8GB for building the app.

I was running out of memory on default settings and at 4GB manually
allocated.

┆Issue is synchronized with this [Notion
page](https://www.notion.so/PR-5968-chore-package-json-increase-memory-available-for-build-command-2866d73d365081e78ab2e387113aaced)
by [Unito](https://www.unito.io)
2025-10-07 19:31:11 -07:00
Alexander Brown
fc1d040e06 Devex: Add additional trigger for Playwright updates (#5960)
## Summary

Allow for secondary trigger for updating screenshots:
> Adding a comment starting with `/update-playwright`

## Review Focus

- Is this the command you'd expect?
- Should I also add `/playwright-update`?

┆Issue is synchronized with this [Notion
page](https://www.notion.so/PR-5960-Devex-Add-additional-trigger-for-Playwright-updates-2856d73d365081768f70d0a8aafa9c11)
by [Unito](https://www.unito.io)
2025-10-07 19:06:51 -07:00
Christian Byrne
8fc54646de apply stylelint auto fixes (#5940)
## Summary

Applied stylelint auto-fixes and resolved manual CSS issues across 25
files to achieve full compliance with stylelint rules.

## Changes

- **What**: Auto-fixed 68 CSS issues (legacy color functions,
font-weight keywords, shorthand properties, pseudo-element notation) and
manually resolved 6 remaining issues (duplicate selectors, vendor prefix
duplicates, font fallbacks, Vue v-bind whitelisting)
- **Config**: Disabled `no-descending-specificity` rule (43 warnings
require architectural CSS refactor)

## Review Focus

Verify no visual regressions from modernized CSS syntax:
- Modern [color function
notation](https://www.w3.org/TR/css-color-4/#funcdef-rgb): `rgba(0, 0,
0, 0.5)` → `rgb(0 0 0 / 50%)`
- Numeric font weights: `bold`/`normal` → `700`/`400`
- Pseudo-element double colons: `:before` → `::before

┆Issue is synchronized with this [Notion
page](https://www.notion.so/PR-5940-apply-stylelint-auto-fixes-2846d73d365081ee8031c212a69a4bd4)
by [Unito](https://www.unito.io)

---------

Co-authored-by: DrJKL <DrJKL0424@gmail.com>
2025-10-07 18:49:50 -07:00
Christian Byrne
fe0eaaefb3 fix mask editor on cloud by allowing crossorigin on image data (#5957)
## Summary

Fixed cross-origin canvas taint
[error](https://comfy-org.sentry.io/issues/6927234287/?referrer=slack&notification_uuid=e2ac931f-c955-43a2-a345-76fa8b164504&alert_rule_id=16146009&alert_type=issue)
in mask editor by adding CORS support to image loading.

## Background

When images from different origins are drawn to canvas without CORS
headers, browsers "taint" the canvas to prevent data extraction attacks.
This breaks `getImageData()` calls with a SecurityError. The [W3C
standard
solution](https://developer.mozilla.org/en-US/docs/Web/API/HTMLImageElement/crossOrigin)
is `crossOrigin = 'anonymous'`.

Intended flow:

1. Frontend sets img.crossOrigin = 'anonymous'
2. Browser sends CORS preflight to GCS: "Can cloud.comfy.org access this
image?"
3. GCS must respond: "Yes, that origin is allowed"
4. Browser loads image with CORS headers enabled
5. Canvas operations work without taint

## Review Focus

Canvas security model compliance and compatibility with cloud deployment
image redirects to GCS.

┆Issue is synchronized with this [Notion
page](https://www.notion.so/PR-5957-fix-mask-editor-on-cloud-by-allowing-crossorigin-on-image-data-2856d73d3650819a84b2fed19d85d815)
by [Unito](https://www.unito.io)
2025-10-07 18:04:38 -07:00
Alexander Brown
99b3a59679 Style: Standardize icon use Part 1 (#5947)
## Summary

Remove the mix of class based and component style icons in favor of just
[classes](https://iconify.design/docs/usage/css/tailwind/tailwind4/#basic-usage).

## Changes

- **What**: Migrate existing lucide icons

## Review Focus

What differs between the icons before and now?

┆Issue is synchronized with this [Notion
page](https://www.notion.so/PR-5947-Style-Standardize-icon-use-Part-1-2846d73d365081bfa66ceb6bdaa9ff02)
by [Unito](https://www.unito.io)

---------

Co-authored-by: github-actions <github-actions@github.com>
2025-10-07 17:53:38 -07:00
Alexander Brown
0616c049e4 hotfix: quick test updates for sora2 pricing badge. (#5966)
## Summary

Update expectations post-merge.

See https://github.com/Comfy-Org/ComfyUI_frontend/pull/5958
2025-10-07 17:14:43 -07:00
Marwan Ahmed
34d5a4523a OpenAIVideoSora2 Frontend pricing (#5958)
test: update OpenAIVideoSora2 tests to use `size` instead of
`resolution`

Refactored all OpenAIVideoSora2 test cases in useNodePricing.test.ts to
align with
the updated node logic that replaces the `resolution` widget with
`size`.
Adjusted validation, pricing, and error message expectations
accordingly.

┆Issue is synchronized with this [Notion
page](https://www.notion.so/PR-5958-Update-OpenAIVideoSora2-tests-for-new-size-based-pricing-logic-2856d73d365081c9919dd256cce40492)
by [Unito](https://www.unito.io)
2025-10-07 16:48:15 -07:00
Alexander Brown
f62175ed0c Fix: Missing Node Title Editor bug (#5963)
Found by @marawan206

## Summary

Fixes the title editor glitching when the node doesn't have an initial
value

## Screenshots (if applicable)

### Before

https://github.com/user-attachments/assets/4c4efbfd-73b9-4733-8227-fe2de59648d4

### After

https://github.com/user-attachments/assets/30f3279e-aa2b-451b-9bee-c134d3f8374c

┆Issue is synchronized with this [Notion
page](https://www.notion.so/PR-5963-Fix-Missing-Node-Title-Editor-bug-2856d73d365081389edbda546eca3bbb)
by [Unito](https://www.unito.io)
2025-10-07 22:53:32 +00:00
Christian Byrne
d9157925f5 make Vue nodes resizable (#5936)
## Summary

Implemented node resizing functionality for Vue nodes.


https://github.com/user-attachments/assets/a7536045-1fa5-401b-8d18-7c26b4dfbfc3

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

## Review Focus

ResizeObserver as single source of truth pattern eliminates feedback
loops between manual resize and reactive layout updates. Intrinsic
content sizing calculation temporarily resets DOM styles to measure
natural content dimensions.

```mermaid
graph TD
    A[User Drags Handle] --> B[Direct DOM Style Update]
    B --> C[ResizeObserver Detects Change]
    C --> D[Layout Store Update]
    D --> E[Slot Position Sync]
    
    style A fill:#f9f9f9,stroke:#333,color:#000
    style E fill:#f9f9f9,stroke:#333,color:#000
```

┆Issue is synchronized with this [Notion
page](https://www.notion.so/PR-5936-make-Vue-nodes-resizable-2846d73d36508160b3b9db49ad8b273e)
by [Unito](https://www.unito.io)

---------

Co-authored-by: Claude <noreply@anthropic.com>
Co-authored-by: DrJKL <DrJKL@users.noreply.github.com>
Co-authored-by: github-actions <github-actions@github.com>
2025-10-07 15:53:10 -07:00
Christian Byrne
89f4452488 [test] fix flaky Vue group/frame test (minimap flakiness) (#5962)
Attempts to fix flakiness when groups are enabled on the minimap and the
screenshot is taken too early, before the render completes. See
[comment](https://github.com/Comfy-Org/ComfyUI_frontend/pull/5942#issuecomment-3374615335)
for more context.

May or may not solve the flakiness.

┆Issue is synchronized with this [Notion
page](https://www.notion.so/PR-5962-wait-for-frame-on-group-creation-test-2856d73d365081f6a059ebfc5a03857c)
by [Unito](https://www.unito.io)
2025-10-07 15:15:36 -07:00
Simula_r
247080f0d7 fix: node header DOM hierarchy (#5961)
## Summary

Fix: node header DOM hierarchy to position tooltip over text and
constrain LOD fallback to text instead of full width. Keep node header
full width to accommodate for colored background.

## Screenshots (if applicable)

<img width="1418" height="933" alt="image"
src="https://github.com/user-attachments/assets/804116d1-2444-4891-a04f-a2dfe8d586ff"
/>
<img width="1420" height="930" alt="image"
src="https://github.com/user-attachments/assets/a884edd0-055b-4dc7-b44c-a88b8376e018"
/>

┆Issue is synchronized with this [Notion
page](https://www.notion.so/PR-5961-fix-node-header-DOM-hierarchy-2856d73d3650814eae04ef96fae062fe)
by [Unito](https://www.unito.io)
2025-10-07 15:04:27 -07:00
Christian Byrne
61d0a12aae fix "what's changed" release toast attention level logic (#5959)
## Summary

Currently, the "What's Changed" popup toast in bottom left appears after
updating if three conditions are true:

1. Using Desktop app
2. Don't have notifications disabled in settings
3. Have not seen/dismissed the notification before

Then the fourth condition is

4. At least 1 of the last 2 notifications is medium or high priority

However, we only ever show the most recent notification, so this logic
is flawed. In addition, it presents issues:

- When the changelog is first generated by AI, it is marked as "low"
priority until human review. But if the changelog _prior_ to that is
"medium" or "high", the AI-generated one might get shown anyway - which
frustrates the intended process.

There's also a bug fixed here concidentally where if the server only
returns a single entry, it is never shown (due to `slice(0, -1)` syntax
when checking priorities).

## Changes

- **What**: Updated Pinia release store to read `attention` from the
newest release only and expanded unit coverage for toast visibility

┆Issue is synchronized with this [Notion
page](https://www.notion.so/PR-5959-fix-what-s-changed-release-toast-attention-level-logic-2856d73d36508141b9b2d8d3b11153b2)
by [Unito](https://www.unito.io)
2025-10-07 12:47:47 -07:00
snomiao
6617de771f fix: Add checkout step before using local action in update-locales workflow (#5938)
## Problem
The `update-locales` workflow was failing with the error:
```
Can't find 'action.yml', 'action.yaml' or 'Dockerfile' under '/home/runner/work/ComfyUI_frontend/ComfyUI_frontend/.github/actions/setup-frontend'. 
Did you forget to run actions/checkout before running your local action?
```

Ref:
https://github.com/Comfy-Org/ComfyUI_frontend/actions/runs/18270266173/job/52011427608

## Solution
Added a checkout step using `actions/checkout@v5` before the "Setup
Frontend" step. This ensures the repository code (including the local
action definition) is available before GitHub Actions tries to use it.

## Changes
- Added checkout step to `.github/workflows/update-locales.yaml`
- Uses `actions/checkout@v5` to checkout the repository before
referencing the local custom action

This is a minimal fix that follows GitHub Actions best practices.

┆Issue is synchronized with this [Notion
page](https://www.notion.so/PR-5938-fix-Add-checkout-step-before-using-local-action-in-update-locales-workflow-2846d73d365081cfb720ffaa528ce26e)
by [Unito](https://www.unito.io)

---------

Co-authored-by: github-actions <github-actions@github.com>
2025-10-07 12:20:13 -07:00
Simula_r
893621265c fix: node deletion handling in vue nodes when switching from litegrap… (#5909)
## Summary

Fix node deletion when switching from litegraph -> vue node mode. 

## Background:
 
There is a race condition where we have [2 watch() functions that are
both tracking
shouldRenderVueNodes.value](f58365b20b/src/composables/graph/useVueNodeLifecycle.ts (L85)):
  - For vue node lifecycle
  - For slot/link sync lifecycle

Each watch() separately sets graph.onNodeRemoved to its own cleanup
handler. But without flush: 'sync', the slot sync watch runs AFTER vue
nodes and overwrites the callback. So when deletion happens,
graph.onNodeRemoved points to the slot handler (or undefined) instead of
the vue cleanup handler, and the vue node never gets removed from the
DOM.

## Review Focus
We are making use of the watch() option "fush: sync" in the link and
slot watch() so maybe there is side effects from firing this when
dependencies change synchronously.

## Screenshots (if applicable)


https://github.com/user-attachments/assets/6951fa50-61d5-4c63-88e9-e113f603ff77


┆Issue is synchronized with this [Notion
page](https://www.notion.so/PR-5909-fix-node-deletion-handling-in-vue-nodes-when-switching-from-litegrap-2826d73d365081bdba35c3d8728d6251)
by [Unito](https://www.unito.io)

---------

Co-authored-by: github-actions <github-actions@github.com>
2025-10-06 23:51:20 -07:00
Arjan Singh
338cbd4eed feat(hostWhitelist): allow comfy.org hosts to authenticate (#5952)
## Summary

Add `comfy.org` host names to the list of hosts that can authenticate
via SSO.

┆Issue is synchronized with this [Notion
page](https://www.notion.so/PR-5952-feat-hostWhitelist-allow-comfy-org-hosts-to-authenticate-2846d73d36508152a41af92ada2a698b)
by [Unito](https://www.unito.io)
2025-10-06 17:30:18 -07:00
Alexander Brown
9a452fc31a CI: Use main version number instead of pinning (#5951)
## Summary

Minimal change to use the versioned cache action instead of pinning to a
specific commit.

┆Issue is synchronized with this [Notion
page](https://www.notion.so/PR-5951-CI-Use-main-version-number-instead-of-pinning-2846d73d36508130821ffb659cb52464)
by [Unito](https://www.unito.io)
2025-10-06 23:54:22 +00:00
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
Alexander Brown
349f351f54 fix: unignore stylelint (#5935)
## Summary

Minimal fix to let Knip succeed but also use its built-in [stylelint
plugin](https://knip.dev/reference/plugins/stylelint).
2025-10-06 13:08:39 -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
filtered
022cf6dd8e Restrict Vite entry point to index.html (#5934)
## Summary

Restricts Vite's dependency optimization scanning entry points to the
root `index.html`, preventing excessive error messages from scanning
unintended files in other packages.

## Changes

- **What**: Adds `entries: ['index.html']` to `optimizeDeps` in
vite.config.mts
- **Breaking**: None

## Review Focus

May require additional entries or inversion - exclude-based approach
instead of include-based - if possible.

┆Issue is synchronized with this [Notion
page](https://www.notion.so/PR-5934-Restrict-Vite-entry-point-to-index-html-2846d73d3650816fbf45fa29493891ae)
by [Unito](https://www.unito.io)
2025-10-06 12:04:00 -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
Comfy Org PR Bot
dc0b729efa 1.28.6 (#5933)
Patch version increment to 1.28.6

┆Issue is synchronized with this [Notion
page](https://www.notion.so/PR-5933-1-28-6-2846d73d365081c59e1ed287f8c299b3)
by [Unito](https://www.unito.io)

Co-authored-by: AustinMroz <4284322+AustinMroz@users.noreply.github.com>
v1.28.6
2025-10-05 23:53:55 -05: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
1df6187972 [ci] add stylelint dependency and minimal config (#5926)
## Summary

Adds [stylelint](https://stylelint.io/) configuration and tooling to
enforce CSS/SCSS code quality and consistency across Vue components.

Starts with 21 focused rules for linting CSS in Vue SFC files and
standalone stylesheets. Configuration uses postcss-html to parse Vue
`<style>` blocks and includes whitelists for Tailwind v4 at-rules
(`@reference`, `@plugin`, `@custom-variant`, `@utility`) and
Electron-specific CSS properties (`speak: none`, `app-region`). Rules
emphasize modern CSS syntax (numeric font weights, modern color
functions, double-colon pseudo-elements) while avoiding overly
opinionated rules like hex color length enforcement (for now).

Currently finds 113 issues (79% auto-fixable). This PR only adds the
tooling via `pnpm stylelint` and `pnpm stylelint:fix` scripts - no
pre-commit hooks or CI integration yet. A follow-up PR will auto-fix the
fixable issues and optionally add enforcement to the commit workflow.

## Changes

- **What**: Integrated [stylelint](https://stylelint.io/) with Vue.js
support via postcss-html parser
- **Dependencies**: Added `stylelint@16.24.0`, `postcss-html@1.8.0`

## Review Focus

CSS rule strictness and Tailwind CSS compatibility - particularly the
`no-descending-specificity` rule and Tailwind-specific function ignores.

┆Issue is synchronized with this [Notion
page](https://www.notion.so/PR-5926-ci-add-stylelint-dependency-and-minimal-config-2836d73d3650813ea7b7eb714ba7748a)
by [Unito](https://www.unito.io)
2025-10-05 10:41:47 -07:00
filtered
c636900487 Add Desktop UI npm publishing workflows (#5915)
## Summary

Adds automated npm publishing for @comfyorg/desktop-ui package with
version management and release workflows.

- Ref: #5912

## Changes

- **What**: Three GitHub Actions workflows for desktop-ui npm publishing
automation

### Two functions

1. Bump action - Just creates a version bump PR for `desktop-ui`
2. Publish action - Can be run manually - essentially a function with
params / void return

### One automation

- Watches for matching commits, then calls the Publish action with
pre-filled details

## Review Focus

Security hardening and workflow correctness.

┆Issue is synchronized with this [Notion
page](https://www.notion.so/PR-5915-Add-Desktop-UI-npm-publishing-workflows-2826d73d365081d9b7f8d7f752536ceb)
by [Unito](https://www.unito.io)
2025-10-05 01:09:58 -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
1c6edd146b fix stone-100 and stone-200 color variable values swapped (#5923)
## Summary

The `stone-100` and `stone-200` were flipped. This PR swaps them to
align with [color
variables](https://www.figma.com/design/vALUV83vIdBzEsTJAhQgXq/Comfy-Design-System?node-id=0-1&p=f&vars=1&var-id=538-1913&m=dev)

<img width="813" height="321" alt="image"
src="https://github.com/user-attachments/assets/9b2a19ff-566c-425b-a4fe-9998578b872a"
/>

┆Issue is synchronized with this [Notion
page](https://www.notion.so/PR-5923-fix-stone-100-and-stone-200-color-variable-values-swapped-2826d73d3650815c8c4ae0627aa045d9)
by [Unito](https://www.unito.io)

---------

Co-authored-by: github-actions <github-actions@github.com>
2025-10-04 19:27:26 -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
Comfy Org PR Bot
5cff131144 1.28.5 (#5906)
Patch version increment to 1.28.5

┆Issue is synchronized with this [Notion
page](https://www.notion.so/PR-5906-1-28-5-2816d73d3650816c9f9bf791e20aa9c0)
by [Unito](https://www.unito.io)

Co-authored-by: AustinMroz <4284322+AustinMroz@users.noreply.github.com>
v1.28.5
2025-10-03 09:49:55 -05: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
Benjamin Lu
139ae87983 chore(eslint): allow default project for Playwright configs to fix pre-commit linting (#5901)
Summary
- Adds playwright.config.ts and playwright.i18n.config.ts to
typescript-eslint projectService.allowDefaultProject in
eslint.config.ts.

Why
- Pre-commit runs lint-staged, which lints staged TypeScript files
including Playwright config files.
- These configs are not included in any tsconfig, so typescript-eslint’s
project service can’t find a project and fails with:
"Parsing error: .../playwright.config.ts was not found by the project
service. Consider either including it in the tsconfig.json or including
it in allowDefaultProject".

What this changes
- Whitelists the two Playwright config files to use the default project
(isolated file parsing) so ESLint can parse and lint them without being
part of a tsconfig.
- Does not affect application code linting, which remains fully
type-aware via existing tsconfigs.

Alternatives considered
- Include these configs in a dedicated ESLint tsconfig (e.g.,
tsconfig.eslint.json) and point ESLint to it.
- Exclude Playwright config files from lint-staged (would reduce lint
coverage for them).
- Keep as TypeScript but non-type-aware: current approach is minimal and
avoids touching tsconfig scopes.

Verification
- Reproduced pre-commit failure when changing playwright.config.ts.
- After this change, `pnpm exec eslint --cache --fix
playwright.config.ts` succeeds.
- `pnpm typecheck` passes.

Notes
- No changes to Playwright runtime behavior. This only affects linting.

┆Issue is synchronized with this [Notion
page](https://www.notion.so/PR-5901-chore-eslint-allow-default-project-for-Playwright-configs-to-fix-pre-commit-linting-2816d73d36508156b94dfeff79a91c7f)
by [Unito](https://www.unito.io)
2025-10-02 21:14:34 -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
filtered
7b1cce1d0e Add VS Code CSS validation support (#5893)
## Summary

Adds VS Code custom CSS data for proper validation of non-standard CSS
properties and Tailwind v4 directives.

## Changes

- **What**: Custom CSS data files for VS Code CSS language service
validation
  - `app-region` - Electron draggable regions  
  - `speak` - Deprecated aural stylesheet property
  - `@custom-variant` - Tailwind v4 custom variant definitions
  - `@utility` - Tailwind v4 custom utility definitions
- Fixes broken documentation links in existing Tailwind directive
references

## Review Focus

Documentation links verified against current Tailwind CSS and Electron
documentation.

## Screenshots

Current: Yellow squigglies

<img width="338" height="179" alt="image"
src="https://github.com/user-attachments/assets/652040f5-8e0b-486b-95f6-2fa8f9bf9ba7"
/><img width="499" height="180" alt="image"
src="https://github.com/user-attachments/assets/43d16210-7fbf-4ef8-b0e1-9a16e59d1d85"
/>

Proposed: Satisfying lack of warnings

<img width="173" height="62" alt="image"
src="https://github.com/user-attachments/assets/25f1c1c4-22b7-483b-9848-3030a3c0dc86"
/>

┆Issue is synchronized with this [Notion
page](https://www.notion.so/PR-5893-Add-VS-Code-CSS-validation-support-2806d73d3650813fb5f1e176360c5b7e)
by [Unito](https://www.unito.io)

---------

Consequences of `@apply` usage may include but are not limited to:
- A strong talking-to
- Receipt of a corrective directive missive
- Upsetting @DrJKL

Co-authored-by: Alexander Brown <drjkl@comfy.org>
2025-10-02 20:25:45 -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