## 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)
## 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)
## 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)
## 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.
## 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>
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)
## 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)
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)
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)
## Summary
Converts 81 package dependencies to use pnpm catalog references for
centralized version management.
## Changes
- **What**: All dependencies matching catalog versions now use
`catalog:` references
- **Dependencies**: axios catalog entry corrected from ^1.11.0 to ^1.8.2
- Also removes a redundant knip config line
### Some things that shouldn't matter
- TypeScript was updated from ^5.4.5 to catalog reference (^5.9.2), but
the project was already resolving to 5.9.2 so this has no practical
impact.
- axios catalog version was corrected from ^1.11.0 back to ^1.8.2 to
match the main package version.
- Autoformatted LGraphNode.ts from another PR by running pnpm lint.
Oops.
## 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)
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>
Currently the claude review action will be skipped if any tests have
failed. This is not really necessary, it will be more efficient to allow
claude to review while still waiting for tests.
This accounts for scenario where there is an expected visual baseline
change, but the PR author doesn't want to regenerate baselines until
everything is approved and ready to merge (as generating right away
before you know whether changes will be requested can be a hassle).
┆Issue is synchronized with this [Notion
page](https://www.notion.so/PR-5882-ci-allow-Claude-review-even-when-Playwright-and-Vitest-checks-have-failed-27f6d73d365081ccbcdaff7104edc2fd)
by [Unito](https://www.unito.io)
By default, in this case the checkout action will checkout to github's
temporary merge base ref, which may include changes from the base branch
when the base branch moves.
This happened in this review:
https://github.com/Comfy-Org/ComfyUI_frontend/pull/5866#pullrequestreview-3287366541
To prevent this, the PR's HEAD SHA was specified to be used
specifically, keeping claude's reviews only looking at that PR's branch.
## Summary
Adds pnpm catalog to centralize dependency versions across the monorepo.
## Changes
- **What**: Consolidates dependencies into single default catalog with
[`prefer` mode](https://pnpm.io/catalogs#catalog-mode)
- **Dependencies**: No new dependencies - reorganizes existing version
management
## Review Focus
The catalog uses `prefer` mode which automatically uses catalog versions
for packages already in the catalog, falling back to direct versions for
packages not yet cataloged.
### Example Usage
When adding a dependency already in the catalog:
```bash
pnpm add vue
```
This automatically uses `"vue": "catalog:"` in `package.json` instead of
a direct version.
## 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>
## Summary
- Upgrades all GitHub Actions workflows to use `actions/checkout@v5`
- Updates 33 instances across 17 workflow files
- Ensures we're using the latest version with security patches and
improvements
## Changes
Updated the following workflow files from `actions/checkout@v4` to
`actions/checkout@v5`:
- `.github/workflows/backport.yaml`
- `.github/workflows/chromatic.yaml`
- `.github/workflows/claude-pr-review.yml`
- `.github/workflows/create-release-candidate-branch.yaml`
- `.github/workflows/dev-release.yaml`
- `.github/workflows/devtools-python.yaml`
- `.github/workflows/i18n-custom-nodes.yaml`
- `.github/workflows/json-validate.yaml`
- `.github/workflows/lint-and-format.yaml`
- `.github/workflows/pr-playwright-deploy.yaml`
- `.github/workflows/pr-storybook-deploy.yaml`
- `.github/workflows/test-ui.yaml`
- `.github/workflows/update-electron-types.yaml`
- `.github/workflows/update-manager-types.yaml`
- `.github/workflows/update-registry-types.yaml`
- `.github/workflows/version-bump.yaml`
- `.github/workflows/vitest.yaml`
Note: `.github/workflows/publish-frontend-types.yaml` and
`.github/workflows/release.yaml` were already using v5.
## Test plan
- [ ] CI workflows should continue to run successfully
- [ ] No functional changes - this is a dependency version upgrade only
🤖 Generated with [Claude Code](https://claude.ai/code)
┆Issue is synchronized with this [Notion
page](https://www.notion.so/PR-5859-ci-Upgrade-actions-checkout-from-v4-to-v5-27e6d73d3650815488adee20c74c0464)
by [Unito](https://www.unito.io)
Co-authored-by: Claude <noreply@anthropic.com>
## Summary
- Removed the optional `ref: master` parameter from the ComfyUI checkout
step in the setup-frontend action
- The ref parameter defaults to the repository's default branch when
omitted
## Details
The `ref: master` specification in
`.github/actions/setup-frontend/action.yml` is unnecessary since GitHub
Actions will automatically use the repository's default branch when the
ref parameter is not provided.
This simplifies the configuration and makes it more maintainable, as the
action will automatically follow any future changes to the default
branch name.
## Test plan
- [ ] Verify that GitHub Actions workflows using this composite action
still work correctly
- [ ] Confirm ComfyUI is checked out properly in CI/CD pipelines
Generated with [Claude Code](https://claude.ai/code)
┆Issue is synchronized with this [Notion
page](https://www.notion.so/PR-5858-Remove-optional-ref-master-from-setup-frontend-action-27e6d73d365081aeb632f2d0e76f267d)
by [Unito](https://www.unito.io)
Co-authored-by: Claude <noreply@anthropic.com>
## Summary
- Adds a local composite action at `.github/actions/setup-frontend` to
replace the external `Comfy-Org/ComfyUI_frontend_setup_action`
- Follows the same pattern as PR #5754 (sno-playwright-composite-action)
for consistency
- Updates workflows to use the new local composite action
## Motivation
Similar to the Playwright composite action, this change:
- Reduces external dependencies on separate action repositories
- Provides better control over versioning and updates
- Maintains consistency with other composite actions in the repository
- Simplifies maintenance by keeping all CI/CD logic in one place
## Changes
### New composite action: `.github/actions/setup-frontend/action.yml`
Direct mirror of the external action with the same 2 inputs:
- `extra_server_params`: Additional parameters to pass to ComfyUI server
- `devtools_ref`: Reference to use for ComfyUI_devtools
The action:
1. Checks out ComfyUI, ComfyUI_frontend, and ComfyUI_devtools
2. Sets up pnpm, Node.js (LTS), and Python (3.10)
3. Installs all dependencies (Python packages, npm packages)
4. Builds the frontend
5. Starts the ComfyUI server with the built frontend
### Updated workflows:
- `.github/workflows/i18n.yaml`
- `.github/workflows/i18n-node-defs.yaml`
- `.github/workflows/test-browser-exp.yaml`
All workflows now use the local composite action instead of
`Comfy-Org/ComfyUI_frontend_setup_action@v3`
## Test plan
- [ ] Verify all updated workflows pass CI tests
- [ ] Confirm the composite action works in all scenarios
- [ ] Check that build and server startup work as expected
## Related PRs
- #5754 - Similar approach for Playwright composite action
🤖 Generated with [Claude Code](https://claude.ai/code)
## Summary
- Improves Storybook deployment and PR comment workflow similar to the
Playwright improvements in #5425
- Creates unified deployment and commenting system for better
maintainability
- Adds Cloudflare Pages deployment for Storybook previews
## Deployment Cases Matrix
| Case | PR Type | Branch | Deployment | Features |
|------|---------|--------|------------|----------|
| **1** | Non-forked PR | `version-bump-*` | ✅ Chromatic | • Visual diff
testing<br>• Chromatic build URL<br>• Chromatic Storybook URL<br>• Shows
visual changes |
| **2** | Non-forked PR | All branches | ✅ Cloudflare Pages | • Live
Storybook preview<br>• pages.dev URL<br>• No visual diff |
| **3** | Forked PR | Any branch | ✅ Cloudflare Pages | • Live Storybook
preview<br>• pages.dev URL<br>• No visual diff<br>• Runs via separate
workflow to avoid permission problems |
### Key Points:
- **Chromatic** (paid service): Only for `version-bump-*` branches to
track visual changes between releases
- **Cloudflare Pages** (free): For all other PRs to provide Storybook
preview without visual diff
- **Security**: Forked PRs use a separate workflow with limited
permissions
## Changes
### New Features
- 🚀 **Cloudflare Pages Deployment**: Storybook builds are now deployed
to Cloudflare Pages for easy preview
- 🔄 **Unified Script**: Single reusable shell script handles both
deployment and PR comments
- 🔒 **Better Security**: Separate workflows for fork vs non-fork PRs
### Improvements
- ♻️ **Retry Logic**: Automatic retry (3 attempts) for failed
deployments
- 📝 **Better Comments**: Clearer PR comments with deployment links and
status
- 🎯 **Simplified Logic**: Workflow logic moved to reusable script for
easier maintenance
- ⚡ **Better Error Handling**: Proper handling of different workflow
conclusions
- 🐛 **Fixed Comment Output**: Deployment logs now properly redirected to
stderr
### Files Changed
- `scripts/cicd/pr-storybook-deploy-and-comment.sh` - New unified
deployment script
- `.github/workflows/chromatic.yaml` - Updated to use new script and add
deployment
- `.github/workflows/pr-storybook-deploy.yaml` - New workflow for forked
PRs
- `.github/workflows/pr-storybook-comment.yaml` - Removed (replaced by
new system)
## ⚠️ Required Setup
The Cloudflare Pages project `comfyui-storybook` needs to be created
under the organization's Cloudflare account:
```bash
# Using the account ID from GitHub secrets
export CLOUDFLARE_ACCOUNT_ID=5ae914d9b87bcf6bbe1ada5798f92a5f
export CLOUDFLARE_API_TOKEN=<org-token>
wrangler pages project create comfyui-storybook --production-branch main
```
**Note**: The project must be created under the same Cloudflare account
that's configured in the GitHub secrets.
## Test Plan
- [x] Create Cloudflare Pages project `comfyui-storybook`
- [x] Workflow runs successfully on all PRs
- [x] PR comments are posted correctly at start and completion
- [x] Storybook deploys to Cloudflare Pages with correct URL
- [ ] Fork PRs are handled by separate workflow
- [ ] Non-fork PRs get inline deployment
- [ ] version-bump-* branches show Chromatic info
## References
- Similar improvements for Playwright: #5459
- Based on pattern from sno-fix-playwright-comment-2 branch
🤖 Generated with [Claude Code](https://claude.ai/code)
---------
Co-authored-by: Claude <noreply@anthropic.com>
## 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).
## 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>
## 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>
## 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)
## Summary
Added CI workflow and npm script for Python syntax validation in
devtools directory.
## Changes
- **What**: Added GitHub Actions workflow for Python syntax checking
with `python3 -m compileall`
- **Dependencies**: Added `python3` binary to knip ignore list
## Review Focus
Workflow triggers correctly on devtools path changes and Python syntax
validation covers all relevant files.
┆Issue is synchronized with this [Notion
page](https://www.notion.so/PR-5841-ci-add-Python-syntax-checking-workflow-on-changes-to-devtools-27c6d73d365081b8963dd4600a233852)
by [Unito](https://www.unito.io)
## Summary
Added GitHub Actions workflow and shell script to validate JSON syntax
in repository files, as in the past we have committed locales files with
invalid JSON.
## Changes
- **What**: Added CI workflow for JSON validation with `jq` syntax
checking
- **Dependencies**: CI workflow requires `jq` (pre-installed on
ubuntu-latest runners)
## Review Focus
Script exclusion patterns for TSConfig files and environment variable
override mechanism (`JSON_LINT_EXCLUDES`).
┆Issue is synchronized with this [Notion
page](https://www.notion.so/PR-5837-ci-add-JSON-validation-CI-workflow-27c6d73d365081a199b1d9ae9e4edfa4)
by [Unito](https://www.unito.io)
## Summary
Updates AGENTS.md to be more universal and contributor-friendly by
removing user-specific preferences.
## Changes
- **What**: Refined AGENTS.md to remove individual preferences, one-time
setup tasks, and conflicting i18n instructions
## Review Focus
These updates make agent instructions work better for all contributors
by:
- Removing individual coding preferences in favor of project-wide
standards
- Eliminating one-time environment setup that clutters agent context
- Removing i18n instructions that caused agents to make unwanted changes
- Improving PR link formatting for better GitHub rendering
┆Issue is synchronized with this [Notion
page](https://www.notion.so/PR-5836-Generalize-AGENTS-md-for-all-contributors-27c6d73d365081e7acf6f37d9f8ceeaf)
by [Unito](https://www.unito.io)
## 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>
## 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)
## Summary
Refactored Vue node browser tests by organizing them into behavioral
categories, better reflecting the nature of browser tests as behind
user-action/behavior specifications.
- **What**: Reorganized Playwright browser tests into logical behavioral
folders (`interactions/`, `nodeStates/`)
- **Structure**: Created subdirectories for canvas interactions, link
interactions, node interactions, and node states
## Review Focus
Test file path changes and associated snapshot relocations ensure all
browser tests continue to run correctly in the new structure.
┆Issue is synchronized with this [Notion
page](https://www.notion.so/PR-5823-refactor-reorganize-Vue-node-browser-tests-into-subfolder-based-on-behaviors-and-states-27b6d73d365081aaa6f9e3a388165258)
by [Unito](https://www.unito.io)
## Summary
Enforced test file naming conventions with ESLint rules and renamed 26
test files from `.spec.ts` to `.test.ts`.
## Changes
- **What**: Added ESLint rules to enforce `.spec.ts` files only in
`browser_tests/tests/` and `.test.ts` files only in `src/`
- **What**: Renamed 26 component/unit test files from `.spec.ts` to
`.test.ts` to comply with new convention
┆Issue is synchronized with this [Notion
page](https://www.notion.so/PR-5820-enforce-test-file-naming-rule-27b6d73d365081269b32ddcc9d3a5048)
by [Unito](https://www.unito.io)
## Summary
Added Playwright E2E tests for Vue multiline string widget functionality
to ensure text input and persistence work correctly.
## Changes
- **What**: Created browser tests for multiline string widget in Vue
nodes implementation, covering text input, multiline text input, and
focus change behavior.
## Review Focus
Test coverage for text input persistence across focus changes and
multiline content handling in the CLIP Text Encode widget.
┆Issue is synchronized with this [Notion
page](https://www.notion.so/PR-5819-test-add-browser-tests-for-Vue-node-multiline-string-widgets-27b6d73d365081e2916ae663e2d44899)
by [Unito](https://www.unito.io)
## Summary
After the `pnpm`/`Nx` monorepo migration, `knip` emitted configuration
hints like “Remove or move unused top-level entry…/project…” because it
discovered multiple workspaces but our config still declared global
`entry`/`project` patterns:
```
> knip --cache
Configuration hints (4)
Remove or move unused top-level entry to one of workspaces: [{build,scripts}/**/*.{js,ts}, …]
Remove or move unused top-level project to one of workspaces: [**/*.{js,ts,vue}, …]
Remove from ignoreBinaries: only-allow
Remove from ignoreBinaries: openapi-typescript
```
Rewriting `knip.config.ts` to define those patterns inside the
`workspaces` map for `'.'`, `packages/tailwind-utils`, and
`packages/design-system` matches Knip’s documented workspace schema
(root key `'.'` plus per-package overrides) and aligns each package’s
source with the files it actually exposes.
Follow-up: trim `packages/design-system` entries to the real public
surface, add a wildcard workspace default for future packages, and
capture this expectation somewhere in the repo's docs.
┆Issue is synchronized with this [Notion
page](https://www.notion.so/PR-5809-Use-workspace-in-knip-config-27b6d73d365081b8ace9c82aee78b1db)
by [Unito](https://www.unito.io)
## Summary
Implemented fit-to-view functionality for Vue nodes with bounds
calculation and viewport animation support.
https://github.com/user-attachments/assets/2ec221f1-9194-4564-95f9-ad4da80f190a
## Changes
- **What**: Added Vue nodes support to fit-to-view command with [bounds
calculation](https://developer.mozilla.org/en-US/docs/Web/API/Element/getBoundingClientRect)
and LiteGraph integration
- **Dependencies**: Added dependency on `layoutStore` and
`selectionBounds` utility
## Review Focus
Bounds calculation accuracy for complex node layouts and animation
performance with large node selections. Verify proper fallback to legacy
LiteGraph behavior when Vue nodes disabled.
```mermaid
graph TD
A[Fit to View Command] --> B{Vue Nodes Enabled?}
B -->|Yes| C[Get Selected Nodes]
B -->|No| D[Legacy LiteGraph Method]
C --> E{Nodes Selected?}
E -->|Yes| F[Calculate Selected Bounds]
E -->|No| G[Calculate All Nodes Bounds]
F --> H[Convert to LiteGraph Format]
G --> H
H --> I[Animate to Bounds]
D --> J[Canvas fitViewToSelectionAnimated]
style A fill:#f9f9f9,stroke:#333,color:#333
style I fill:#f9f9f9,stroke:#333,color:#333
style J fill:#f9f9f9,stroke:#333,color:#333
```
┆Issue is synchronized with this [Notion
page](https://www.notion.so/PR-5782-Implement-fit-to-view-for-Vue-nodes-27a6d73d365081cb822cd93f557e77b2)
by [Unito](https://www.unito.io)
---------
Co-authored-by: filtered <176114999+webfiltered@users.noreply.github.com>
This pull request enhances the responsiveness of the `CommandMenubar`
component by introducing a "compact" mode for screens with limited
vertical space. When the window height is less than 700px, the menubar
adapts its submenu positioning and styling to improve usability on
smaller displays. The most important changes are grouped below:
**Responsive Behavior and State Management:**
* Added a reactive `windowHeight` reference and a computed
`isCompactHeight` property to detect when the window height is below
700px, enabling "compact" mode for the menubar. Event listeners for
window resize are now managed using `onMounted` and `onUnmounted`
lifecycle hooks to keep the state updated.
[[1]](diffhunk://#diff-10ee0e60e600a168bdd45e0b9f05a148f5b9ee48f54e6c7dee737ebe7b6192e6R314-R326)
[[2]](diffhunk://#diff-10ee0e60e600a168bdd45e0b9f05a148f5b9ee48f54e6c7dee737ebe7b6192e6L103-R104)
**Dynamic Styling and Class Application:**
* Updated the root element's class bindings to apply the
`comfy-command-menu-compact` class when `isCompactHeight` is true,
enabling conditional styling for compact mode.
**Compact Mode Styling:**
* Introduced new CSS rules for `.comfy-command-menu-compact` to force
submenus to open to the right and align with the top of the menu
container, ensuring better usability on short screens. Adjustments
include submenu positioning, alignment for nested menus, and ensuring
the submenu container uses the full available height.
*
/fix #5289https://github.com/user-attachments/assets/e7908b57-3f07-4fc4-a119-66f2b7e398c5
┆Issue is synchronized with this [Notion
page](https://www.notion.so/PR-5323-Add-compact-menu-style-for-smaller-window-heights-2636d73d3650816cb5aaf4ac76c39739)
by [Unito](https://www.unito.io)
## Summary
Fixed increment/decrement button lockup in number widgets when values
exceed JavaScript's safe integer limit (2^53 - 1).
## Changes
- **What**: Added precision-aware button disabling and user feedback to
`WidgetInputNumberInput` component using
[Number.isSafeInteger()](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Number/isSafeInteger)
- We still need to support values greater than 2^53 because they may be
in workflows.
## Review Focus
JavaScript floating-point precision behavior at scale - buttons hide
when arithmetic operations like `value + 1` would be unreliable due to
IEEE 754 limitations. Test coverage includes edge cases (NaN, Infinity)
and boundary conditions at MAX_SAFE_INTEGER.
```mermaid
graph TD
A[User Input] --> B{Value > 2^53?}
B -->|No| C[Show Buttons]
B -->|Yes| D[Hide Buttons]
D --> E[Show Tooltip]
E --> F[User Can Still Type]
style A fill:#f9f9f9,stroke:#333,color:#000
style F fill:#f9f9f9,stroke:#333,color:#000
```
┆Issue is synchronized with this [Notion
page](https://www.notion.so/PR-5787-fix-large-integer-precision-handling-in-Vue-int-widgets-27a6d73d365081d9ae00e485740cfafb)
by [Unito](https://www.unito.io)
This pull request refactors and improves the "More Options" popover
functionality for graph nodes in the UI. The main change is a rename and
redesign of the menu component from `MoreOptions` to `NodeOptions`,
introducing a global singleton pattern for popover control and enabling
context menu support on node right-click. This results in better
maintainability, more flexible triggering, and improved user experience.
**Node Options popover refactor and global control:**
* Renamed and refactored `MoreOptions.vue` to `NodeOptions.vue`,
removing the embedded button and exposing imperative methods (`toggle`,
`hide`, `isOpen`) for external control. The component now
registers/unregisters itself globally via `registerNodeOptionsInstance`.
[[1]](diffhunk://#diff-e0dbd5e37efd2c79e7317415455340b0dd150b758077b170a663f67d2453605eL2-R2)
[[2]](diffhunk://#diff-e0dbd5e37efd2c79e7317415455340b0dd150b758077b170a663f67d2453605eL203-R197)
[[3]](diffhunk://#diff-e0dbd5e37efd2c79e7317415455340b0dd150b758077b170a663f67d2453605eR294-R309)
* Added `NodeOptionsButton.vue` as a dedicated button component for
triggering the popover, decoupling the button UI from the popover logic.
* Implemented a global singleton pattern in `useMoreOptionsMenu.ts` for
controlling the `NodeOptions` popover from anywhere, with
`toggleNodeOptions` and `registerNodeOptionsInstance` functions.
[[1]](diffhunk://#diff-ae87bdb1e06725eb19b8d0fc82ec40a5f8ca831a6632767cc5d214fc903b89b6R35-R65)
[[2]](diffhunk://#diff-ae87bdb1e06725eb19b8d0fc82ec40a5f8ca831a6632767cc5d214fc903b89b6L184-R216)
**UI integration and event handling improvements:**
* Updated `SelectionToolbox.vue` to use the new `NodeOptionsButton`
instead of the previous embedded `MoreOptions` button, and added the
`NodeOptions` popover to the main `GraphCanvas.vue` template for global
accessibility.
[[1]](diffhunk://#diff-05d80ee1e28e634dc758394ddf1bfaa8e5ec72a186a6ea2e2b6f5dfba867b264L41-R41)
[[2]](diffhunk://#diff-05d80ee1e28e634dc758394ddf1bfaa8e5ec72a186a6ea2e2b6f5dfba867b264L71-R71)
[[3]](diffhunk://#diff-aaf17c713f29c6db8ea03efe7fc3483a858982e818a324b23cff89859e71559cR65)
[[4]](diffhunk://#diff-aaf17c713f29c6db8ea03efe7fc3483a858982e818a324b23cff89859e71559cR91)
* Added right-click context menu support to `LGraphNode.vue`, triggering
the node options popover at the cursor position and integrating with
node selection logic.
[[1]](diffhunk://#diff-a7744614cf842e54416047326db79ad81f7c7ab7bfb66ae2b46f5c73ac7d47f2R45)
[[2]](diffhunk://#diff-a7744614cf842e54416047326db79ad81f7c7ab7bfb66ae2b46f5c73ac7d47f2R141)
[[3]](diffhunk://#diff-a7744614cf842e54416047326db79ad81f7c7ab7bfb66ae2b46f5c73ac7d47f2L180-R187)
[[4]](diffhunk://#diff-a7744614cf842e54416047326db79ad81f7c7ab7bfb66ae2b46f5c73ac7d47f2R249-R263)
**Minor improvements and cleanup:**
* Updated references and variable names throughout the codebase to
reflect the new `NodeOptions` naming and logic.
[[1]](diffhunk://#diff-e0dbd5e37efd2c79e7317415455340b0dd150b758077b170a663f67d2453605eL53)
[[2]](diffhunk://#diff-e0dbd5e37efd2c79e7317415455340b0dd150b758077b170a663f67d2453605eR50)
[[3]](diffhunk://#diff-e0dbd5e37efd2c79e7317415455340b0dd150b758077b170a663f67d2453605eL75-R60)
[[4]](diffhunk://#diff-e0dbd5e37efd2c79e7317415455340b0dd150b758077b170a663f67d2453605eL91-L95)
[[5]](diffhunk://#diff-e0dbd5e37efd2c79e7317415455340b0dd150b758077b170a663f67d2453605eL110-R90)
[[6]](diffhunk://#diff-e0dbd5e37efd2c79e7317415455340b0dd150b758077b170a663f67d2453605eL133-R113)
[[7]](diffhunk://#diff-e0dbd5e37efd2c79e7317415455340b0dd150b758077b170a663f67d2453605eL146-R126)
[[8]](diffhunk://#diff-e0dbd5e37efd2c79e7317415455340b0dd150b758077b170a663f67d2453605eL157-R140)
This refactor makes the node options menu more modular, easier to
maintain, and more flexible for future UI improvements.
https://github.com/user-attachments/assets/9c2f2556-4544-4e20-9f22-8f485b0ceadc
┆Issue is synchronized with this [Notion
page](https://www.notion.so/PR-5790-Right-click-vue-nodes-27a6d73d365081a98263c88d2e09e629)
by [Unito](https://www.unito.io)
## Summary
Consolidates Tailwind configuration and styles into a shared
`@comfyorg/design-system` package for reuse across monorepo apps.
The goal was not to make changes to how the design system works; merely
to separate it cleanly. I _would_ strongly recommend some drastic
sweeping changes, however I believe that should be done after the
migration.
## Changes
- **What**: Migrates CSS files, Tailwind config, and custom icons to
design-system package
- **Dependencies**: Moves `@iconify-json/lucide` and `@iconify/tailwind`
to design-system package
This pull request refactors and simplifies the template workflow card
components and related UI in the codebase. The main changes focus on
removing unused or redundant components, improving visual and
interaction consistency, and enhancing error handling for images. Below
are the most important changes grouped by theme:
**Template Workflow Card Refactor and Cleanup**
* Removed the `TemplateWorkflowCard.vue` component and its associated
test file `TemplateWorkflowCard.spec.ts`, as well as the
`TemplateWorkflowCardSkeleton.vue` and `TemplateWorkflowList.vue`
components, indicating a shift away from the previous card-based
template workflow UI.
[[1]](diffhunk://#diff-49569af0404058e8257f3cc0716b066517ce7397dd58744b02aa0d0c61f2a815L1-L139)
[[2]](diffhunk://#diff-9fa6fc1470371f0b520d4deda4129fb313b1bea69888a376556f4bd824f9d751L1-L263)
[[3]](diffhunk://#diff-bc35b6f77d1cee6e86b05d0da80b7bd40013c7a6a97a89706d3bc52573e1c574L1-L30)
[[4]](diffhunk://#diff-48171f792b22022526fca411d3c3a366d48b675dab77943a20846ae079cbaf3bL1-L68)
* Removed the `TemplateSearchBar.vue` component, suggesting a redesign
or replacement of the search/filter UI for templates.
**UI and Interaction Improvements**
* Improved the `CardBottom.vue` component by making its height
configurable via a `fullHeight` prop, enhancing layout flexibility.
* Updated the `CardContainer.vue` component to add hover effects
(background, border, shadow, and padding) and support a new `none`
aspect ratio for more flexible card layouts.
**Image and Input Enhancements**
* Enhanced the `LazyImage.vue` component to display a default
placeholder image when an image fails to load, improving error handling
and user experience.
* Improved the `SearchBox.vue` component by making the input focusable
when clicking anywhere on the wrapper, and added a template ref for
better accessibility and usability.
[[1]](diffhunk://#diff-08f3b0c51fbfe63171509b9944bf7558228f6c2596a1ef5338e88ab64585791bL2-R5)
[[2]](diffhunk://#diff-08f3b0c51fbfe63171509b9944bf7558228f6c2596a1ef5338e88ab64585791bL16-R17)
[[3]](diffhunk://#diff-08f3b0c51fbfe63171509b9944bf7558228f6c2596a1ef5338e88ab64585791bR33-R39)
**Minor UI Tweaks**
* Adjusted label styling in `SingleSelect.vue` to remove unnecessary
overflow handling, simplifying the visual layout.
---------
Co-authored-by: Benjamin Lu <benceruleanlu@proton.me>
Co-authored-by: Alexander Brown <drjkl@comfy.org>
Co-authored-by: github-actions <github-actions@github.com>
Co-authored-by: Christian Byrne <cbyrne@comfy.org>
Co-authored-by: Claude <noreply@anthropic.com>
Co-authored-by: snomiao <snomiao@gmail.com>
Co-authored-by: GitHub Action <action@github.com>
Co-authored-by: filtered <176114999+webfiltered@users.noreply.github.com>
Co-authored-by: Comfy Org PR Bot <snomiao+comfy-pr@gmail.com>
Co-authored-by: Jin Yi <jin12cc@gmail.com>
## Summary
- Migrated all `npx` commands to `pnpx` to align with the pnpm ecosystem
- Updated all occurrences across the codebase for consistency
## Changes
- **Package.json scripts**: Updated test:browser, preinstall, and
collect-i18n scripts
- **GitHub Actions workflows**: Updated all workflow files that use npx
(test-ui, i18n, update-manager-types, etc.)
- **Documentation**: Updated browser_tests/README.md and
docs/extensions/development.md
- **Husky pre-commit hook**: Updated lint-staged and tsx commands
- **MCP configuration**: Updated .mcp.json to use pnpx
## Test Plan
- [ ] CI tests pass
- [ ] Local development commands work with pnpx
- [ ] GitHub Actions workflows execute successfully
🤖 Generated with Claude Code
┆Issue is synchronized with this [Notion
page](https://www.notion.so/PR-5329-chore-Replace-npx-with-pnpx-across-the-codebase-2646d73d36508127bd43d14b8364aeb1)
by [Unito](https://www.unito.io)
This pull request updates event handling in the selection toolbox
components to ensure that mouse wheel events are properly forwarded to
the canvas, improving interaction consistency across the UI.
**Event handling improvements:**
* Changed the wheel event handler in `SelectionToolbox.vue` to use
`canvasInteractions.forwardEventToCanvas` instead of
`canvasInteractions.handleWheel`, ensuring wheel events are consistently
forwarded to the canvas.
* Added the wheel event handler to the `MoreOptions.vue` popover,
forwarding wheel events to the canvas for submenu interactions.
**Code organization updates:**
* Imported `useCanvasInteractions` in `MoreOptions.vue` to access the
new event forwarding method.
* Instantiated `canvasInteractions` in `MoreOptions.vue` for use in
event handling.## Summary
https://github.com/user-attachments/assets/46046086-35e8-4cd1-a11a-365705beb9cd
┆Issue is synchronized with this [Notion
page](https://www.notion.so/PR-5781-Wheel-Selection-Toolbox-and-Popover-27a6d73d3650812c9c4fe8440ff7dd1d)
by [Unito](https://www.unito.io)
## Refactor conflict detection system and move to manager extension
### Description
This PR refactors the conflict detection system, moving it from the
global composables to the manager extension folder for better code
organization. Additionally, it improves test type safety and adds
comprehensive test coverage for utility functions.
### Main Changes
#### 📦 Code Organization
- **Moved conflict detection to manager extension** - Relocated all
conflict detection related composables, stores, and utilities from
global scope to `/workbench/extensions/manager/` for better modularity
(https://github.com/Comfy-Org/ComfyUI_frontend/pull/5722)
- **Moved from** `src/composables/useConflictDetection.ts` **to**
`src/workbench/extensions/manager/composables/useConflictDetection.ts`
- Moved related stores and composables to maintain cohesive module
structure
#### ♻️ Refactoring
- **Extracted utility functions** - Split conflict detection logic into
separate utility modules:
- `conflictUtils.ts` - Conflict consolidation and summary generation
- `systemCompatibility.ts` - OS and accelerator compatibility checking
- `versionUtil.ts` - Version compatibility checking
- **Removed duplicate state management** - Cleaned up redundant state
and unused functions
- **Improved naming conventions** - Renamed functions for better clarity
- **Removed unused system environment code** - Cleaned up deprecated
code
#### 🔧 Test Improvements
- **Fixed TypeScript errors** in all test files - removed all `any` type
usage
- **Added comprehensive test coverage**:
- `conflictUtils.test.ts` - 299 lines of tests for conflict utilities
- `systemCompatibility.test.ts` - 270 lines of tests for compatibility
checking
- `versionUtil.test.ts` - 342 lines of tests for version utilities
- **Updated mock objects** to match actual implementations
- **Aligned with backend changes** - Updated SystemStats structure to
include `pytorch_version`, `embedded_python`,
`required_frontend_version`
#### 🐛 Bug Fixes
- **Fixed OS detection bug** - Resolved issue where 'darwin' was
incorrectly matched as 'Windows' due to containing 'win' substring
- **Fixed import paths** - Updated all import paths after moving to
manager extension
- **Fixed unused exports** - Removed all unused function exports
- **Fixed lint errors** - Resolved all ESLint and Prettier issues
### File Structure Changes
```
Before:
src/
├── composables/
│ └── useConflictDetection.ts (1374 lines)
└── types/
After:
src/
├── utils/
│ ├── conflictUtils.ts (114 lines)
│ ├── systemCompatibility.ts (125 lines)
│ └── versionUtil.ts (enhanced)
└── workbench/extensions/manager/
├── composables/
│ ├── useConflictDetection.ts (758 lines)
│ └── [other composables]
└── stores/
└── conflictDetectionStore.ts
```
### Testing
All tests pass successfully:
- ✅ **155 test files passed**
- ✅ **2209 tests passed**
- ⏩ 19 skipped (intentionally skipped subgraph-related tests)
### Impact
- **Better code organization** - Manager-specific code is now properly
isolated
- **Improved maintainability** - Smaller, focused utility functions are
easier to test and maintain
- **Enhanced type safety** - No more `any` types in tests
- **Comprehensive test coverage** - All utility functions are thoroughly
tested
### Commits in this PR
1. OS detection bug fix and refactor
2. Remove unused system environment code
3. Improve function naming
4. Refactor conflict detection
5. Remove duplicate state and unused functions
6. Fix unused function exports
7. Move manager features to workbench extension folder
8. Fix import paths
9. Rename systemCompatibility file
10. Improve test type safety
11. Apply ESLint and Prettier fixes
## Screenshots (if applicable)
[screen-capture.webm](https://github.com/user-attachments/assets/b4595604-3761-4d98-ae8e-5693cd0c95bd)
┆Issue is synchronized with this [Notion
page](https://www.notion.so/PR-5436-Manager-refactor-conflict-detect-2686d73d36508186ba06f57dae3656e5)
by [Unito](https://www.unito.io)
---------
Co-authored-by: Claude <noreply@anthropic.com>
## Summary
Fixed Vue node output restoration by consolidating state management
through the node output store.
## Changes
- **What**: Refactored node output cleanup and restoration logic in
`ChangeTracker` and `ComfyApp` to use centralized store methods
- **Breaking**: Removed direct manipulation of `app.nodeOutputs` in
favor of store-managed state
## Review Focus
State synchronization between `app.nodeOutputs` and `nodeOutputs.value`
during restore/reset operations, ensuring Vue reactivity is maintained.
┆Issue is synchronized with this [Notion
page](https://www.notion.so/PR-5788-fix-restoring-outputs-in-Vue-nodes-persisting-node-outputs-when-switching-between-workfl-27a6d73d365081b39411fed7479d8ac5)
by [Unito](https://www.unito.io)
git commit -m "[auto-fix] Apply ESLint and Prettier fixes"
git commit -m "[automated] Apply ESLint and Prettier fixes"
git push
- name:Final validation
@@ -102,4 +100,4 @@ jobs:
owner: context.repo.owner,
repo: context.repo.repo,
body: '## ⚠️ Linting/Formatting Issues Found\n\nThis PR has linting or formatting issues that need to be fixed.\n\n**Since this PR is from a fork, auto-fix cannot be applied automatically.**\n\n### Option 1: Set up pre-commit hooks (recommended)\nRun this once to automatically format code on every commit:\n```bash\npnpm prepare\n```\n\n### Option 2: Fix manually\nRun these commands and push the changes:\n```bash\npnpm lint:fix\npnpm format\n```\n\nSee [CONTRIBUTING.md](https://github.com/Comfy-Org/ComfyUI_frontend/blob/main/CONTRIBUTING.md#git-pre-commit-hooks) for more details.'
"description":"Electron-specific CSS property that defines draggable regions in custom title bar windows. Setting 'drag' marks a rectangular area as draggable for moving the window; 'no-drag' excludes areas from the draggable region.",
"values":[
{
"name":"drag",
"description":"Marks the element as draggable for moving the Electron window"
},
{
"name":"no-drag",
"description":"Excludes the element from being used to drag the Electron window"
"description":"Use the `@apply` directive to inline any existing utility classes into your own custom CSS. This is useful when you find a common utility pattern in your HTML that you’d like to extract to a new component.",
"description":"DO NOT USE. IF YOU ARE CAUGHT USING @apply YOU WILL FACE SEVERE CONSEQUENCES.",
"description":"Use the `@custom-variant` directive to add a custom variant to your project. Custom variants can be used with utilities like `hover`, `focus`, and responsive breakpoints. Use `@slot` inside the variant to indicate where the utility's styles should be inserted.",
"description":"Use the `@utility` directive to add custom utilities to your project. Custom utilities work with all variants like `hover`, `focus`, and responsive variants. Use `--value()` to create functional utilities that accept arguments.",
- Playwright: place tests in `browser_tests/`; optional tags like `@mobile`, `@2x` are respected by config.
## Commit & Pull Request Guidelines
- Commits: Prefer Conventional Commits (e.g., `feat(ui): add sidebar`), `refactor(litegraph): …`. Use `[skip ci]` for locale-only updates when appropriate.
- PRs: Include clear description, linked issues (`Fixes #123`), and screenshots/GIFs for UI changes. Add/adjust tests and i18n strings when applicable.
- Commits: Use `[skip ci]` for locale-only updates when appropriate.
- PRs: Include clear description, linked issues (`- Fixes #123`), and screenshots/GIFs for UI changes.
- Quality gates: `pnpm lint`, `pnpm typecheck`, and relevant tests must pass. Keep PRs focused and small.
## Security & Configuration Tips
- Secrets: Use `.env` (see `.env_example`); do not commit secrets.
- Backend: Dev server expects ComfyUI backend at `localhost:8188` by default; configure via `.env`.
@@ -213,12 +213,6 @@ Here's how Claude Code can use the Playwright MCP server to inspect the interfac
- `pnpm i` to install all dependencies
- `pnpm test:unit` to execute all unit tests
### Component Tests
Component tests verify Vue components in `src/components/`.
- `pnpm test:component` to execute all component tests
### Playwright Tests
Playwright tests verify the whole app. See [browser_tests/README.md](browser_tests/README.md) for details.
@@ -229,7 +223,6 @@ Before submitting a PR, ensure all tests pass:
```bash
pnpm test:unit
pnpm test:component
pnpm test:browser
pnpm typecheck
pnpm lint
@@ -265,9 +258,9 @@ The project supports three types of icons, all with automatic imports (no manual
2. **Iconify Icons** - 200,000+ icons from various libraries: `<i-lucide:settings />`, `<i-mdi:folder />`
3. **Custom Icons** - Your own SVG icons: `<i-comfy:workflow />`
Icons are powered by the unplugin-icons system, which automatically discovers and imports icons as Vue components. Custom icons are stored in `src/assets/icons/custom/` and processed by `build/customIconCollection.ts` with automatic validation.
Icons are powered by the unplugin-icons system, which automatically discovers and imports icons as Vue components. Custom icons are stored in `packages/design-system/src/icons/` and processed by `packages/design-system/src/iconCollection.ts` with automatic validation.
For detailed instructions and code examples, see [src/assets/icons/README.md](src/assets/icons/README.md).
For detailed instructions and code examples, see [packages/design-system/src/icons/README.md](packages/design-system/src/icons/README.md).
console.log('Install ComfyUI with options:',options)
},
changeTheme:(theme: any)=>{
console.log('Change theme:',theme)
trackEvent:(_eventName: string,_data?: any)=>{}
},
installComfyUI:(_options: any)=>{},
changeTheme:(_theme: any)=>{},
getSystemPaths:()=>
Promise.resolve({
defaultInstallPath:'/Users/username/ComfyUI'
Some files were not shown because too many files have changed in this diff
Show More
Reference in New Issue
Block a user
Blocking a user prevents them from interacting with repositories, such as opening or commenting on pull requests or issues. Learn more about blocking a user.
