Commit Graph

11 Commits

Author SHA1 Message Date
Alexander Brown
c25f9a0e93 feat: synthetic widgets getter for SubgraphNode (proxy-widget-v2) (#8856)
## Summary

Replace the Proxy-based proxy widget system with a store-driven
architecture where `promotionStore` and `widgetValueStore` are the
single sources of truth for subgraph widget promotion and widget values,
and `SubgraphNode.widgets` is a synthetic getter composing lightweight
`PromotedWidgetView` objects from store state.

## Motivation

The subgraph widget promotion system previously scattered state across
multiple unsynchronized layers:

- **Persistence**: `node.properties.proxyWidgets` (tuples on the
LiteGraph node)
- **Runtime**: Proxy-based `proxyWidget.ts` with `Overlay` objects,
`DisconnectedWidget` singleton, and `isProxyWidget` type guards
- **UI**: Each Vue component independently calling `parseProxyWidgets()`
via `customRef` hacks
- **Mutation flags**: Imperative `widget.promoted = true/false` set on
`subgraph-opened` events

This led to 4+ independent parsings of the same data, complex cache
invalidation, and no reactive contract between the promotion state and
the rendering layer. Widget values were similarly owned by LiteGraph
with no Vue-reactive backing.

The core principle driving these changes: **Vue owns truth**. Pinia
stores are the canonical source; LiteGraph objects delegate to stores
via getters/setters; Vue components react to store state directly.

## Changes

### New stores (single sources of truth)

- **`promotionStore`** — Reactive `Map<NodeId, PromotionEntry[]>`
tracking which interior widgets are promoted on which SubgraphNode
instances. Graph-scoped by root graph ID to prevent cross-workflow state
collision. Replaces `properties.proxyWidgets` parsing, `customRef`
hacks, `widget.promoted` mutation, and the `subgraph-opened` event
listener.
- **`widgetValueStore`** — Graph-scoped `Map<WidgetKey, WidgetState>`
that is the canonical owner of widget values. `BaseWidget.value`
delegates to this store via getter/setter when a node ID is assigned.
Eliminates the need for Proxy-based value forwarding.

### Synthetic widgets getter (SubgraphNode)

`SubgraphNode.widgets` is now a getter that reads
`promotionStore.getPromotions(rootGraphId, nodeId)` and returns cached
`PromotedWidgetView` objects. No stubs, no Proxies, no fake widgets
persisted in the array. The setter is a no-op — mutations go through
`promotionStore`.

### PromotedWidgetView

A class behind a `createPromotedWidgetView` factory, implementing the
`PromotedWidgetView` interface. Delegates value/type/options/drawing to
the resolved interior widget and stores. Owns positional state (`y`,
`computedHeight`) for canvas layout. Cached by
`PromotedWidgetViewManager` for object-identity stability across frames.

### DOM widget promotion

Promoted DOM widgets (textarea, image upload, etc.) render on the
SubgraphNode surface via `positionOverride` in `domWidgetStore`.
`DomWidgets.vue` checks for overrides and uses the SubgraphNode's
coordinates instead of the interior node's.

### Promoted previews

New `usePromotedPreviews` composable resolves image/audio/video preview
widgets from promoted entries, enabling SubgraphNodes to display
previews of interior preview nodes.

### Deleted

- `proxyWidget.ts` (257 lines) — Proxy handler, `Overlay`,
`newProxyWidget`, `isProxyWidget`
- `DisconnectedWidget.ts` (39 lines) — Singleton Proxy target
- `useValueTransform.ts` (32 lines) — Replaced by store delegation

### Key architectural changes

- `BaseWidget.value` getter/setter delegates to `widgetValueStore` when
node ID is set
- `LGraph.add()` reordered: `node.graph` assigned before widget
`setNodeId` (enables store registration)
- `LGraph.clear()` cleans up graph-scoped stores to prevent stale
entries across workflow switches
- `promotionStore` and `widgetValueStore` state nested under root graph
UUID for multi-workflow isolation
- `SubgraphNode.serialize()` writes promotions back to
`properties.proxyWidgets` for persistence compatibility
- Legacy `-1` promotion entries resolved and migrated on first load with
dev warning

## Test coverage

- **3,700+ lines of new/updated tests** across 36 test files
- **Unit**: `promotionStore.test.ts`, `widgetValueStore.test.ts`,
`promotedWidgetView.test.ts` (921 lines),
`subgraphNodePromotion.test.ts`, `proxyWidgetUtils.test.ts`,
`DomWidgets.test.ts`, `PromotedWidgetViewManager.test.ts`,
`usePromotedPreviews.test.ts`, `resolvePromotedWidget.test.ts`,
`subgraphPseudoWidgetCache.test.ts`
- **E2E**: `subgraphPromotion.spec.ts` (622 lines) — promote/demote,
manual/auto promotion, paste preservation, seed control augmentation,
image preview promotion; `imagePreview.spec.ts` extended with
multi-promoted-preview coverage
- **Fixtures**: 2 new subgraph workflow fixtures for preview promotion
scenarios

## Review focus

- Graph-scoped store keying (`rootGraphId`) — verify isolation across
workflows/tabs and cleanup on `LGraph.clear()`
- `PromotedWidgetView` positional stability — `_arrangeWidgets` writes
to `y`/`computedHeight` on cached objects; getter returns fresh array
but stable object references
- DOM widget position override lifecycle — overrides set on promote,
cleared on demote/removal/subgraph navigation
- Legacy `-1` entry migration — resolved and written back on first load;
unresolvable entries dropped with dev warning
- Serialization round-trip — `promotionStore` state →
`properties.proxyWidgets` on serialize, hydrated back on configure

## Diff breakdown (excluding lockfile)

- 153 files changed, ~7,500 insertions, ~1,900 deletions (excluding
pnpm-lock.yaml churn)
- ~3,700 lines are tests
- ~300 lines deleted (proxyWidget.ts, DisconnectedWidget.ts,
useValueTransform.ts)

<!-- Fixes #ISSUE_NUMBER -->

┆Issue is synchronized with this [Notion
page](https://www.notion.so/PR-8856-feat-synthetic-widgets-getter-for-SubgraphNode-proxy-widget-v2-3076d73d365081c7b517f5ec7cb514f3)
by [Unito](https://www.unito.io)

---------

Co-authored-by: Amp <amp@ampcode.com>
Co-authored-by: github-actions <github-actions@github.com>
Co-authored-by: GitHub Action <action@github.com>
2026-02-23 13:33:41 -08:00
Christian Byrne
388c21a88d fix: lint-format CI failing on fork PRs due to missing secret (#8948)
## Summary

Fall back to `github.token` when `PR_GH_TOKEN` secret is unavailable on
fork PRs, fixing checkout failure.

## Changes

- **What**: The `ci-lint-format` workflow uses `secrets.PR_GH_TOKEN` for
checkout. Repository secrets are not available to workflows triggered by
fork PRs, causing `Input required and not supplied: token` errors (e.g.
[run
22124451916](https://github.com/Comfy-Org/ComfyUI_frontend/actions/runs/22124451916)).
The fix uses `github.token` as a fallback for fork PRs — this is always
available with read-only access, which is sufficient since the workflow
already skips commit/push for forks.

┆Issue is synchronized with this [Notion
page](https://www.notion.so/PR-8948-fix-lint-format-CI-failing-on-fork-PRs-due-to-missing-secret-30b6d73d365081dfb78cf05362a6653c)
by [Unito](https://www.unito.io)
2026-02-18 15:28:48 -08:00
sno
d7ec24abc3 fix: use PR_GH_TOKEN in lint/i18n workflows to trigger e2e tests (#8484)
## Summary

Add `PR_GH_TOKEN` to ci-lint-format and i18n-update-core workflows to
ensure commits trigger e2e test runs.

## Changes

- Add `token: ${{ secrets.PR_GH_TOKEN }}` to checkout step in
`.github/workflows/ci-lint-format.yaml`
- Add `token: ${{ secrets.PR_GH_TOKEN }}` to checkout step in
`.github/workflows/i18n-update-core.yaml`

## Context

This matches the pattern used consistently across all other workflows in
the repository (release-version-bump, version-bump-desktop-ui,
api-update-registry-api-types, i18n-update-nodes, etc.).

Without this token, commits made by these workflows don't trigger
downstream e2e tests, which can lead to issues being missed.

## Original Work

Original idea & implementation by @drjkl in commits:
- be3a8d61c - fix: use GitHub App token for lint/i18n workflows to
trigger e2e tests
- 50ccb254b - Add github app token action to pinact

This PR simplifies the approach to use the existing `PR_GH_TOKEN` secret
instead of GitHub App tokens, for consistency with the rest of the
repository.

## Test Plan

- [x] Verify workflows can checkout code successfully
- [x] Confirm commits from these workflows trigger e2e test runs

## It works!
<img width="1075" height="402" alt="image"
src="https://github.com/user-attachments/assets/31762d68-a37f-4926-b463-84d184d4309d"
/>

---------

Co-authored-by: Claude Sonnet 4.5 <noreply@anthropic.com>
Co-authored-by: GitHub Action <action@github.com>
2026-01-30 00:09:28 -08:00
Alexander Brown
bd4920febc Chore: Actions updates and cleanup (#8377)
## Summary

...

┆Issue is synchronized with this [Notion
page](https://www.notion.so/PR-8377-WIP-Chore-Actions-updates-and-cleanup-2f66d73d3650818483a8dffa32a6f245)
by [Unito](https://www.unito.io)

---------

Co-authored-by: Amp <amp@ampcode.com>
2026-01-28 21:22:39 -08:00
Alexander Brown
aa5125cef6 Chore: Oxfmt formatting pass (#8341)
## Summary

Expanding the covered files to format. One-time formatting pass. To be
added to the `.git-blame-ignore-revs`

┆Issue is synchronized with this [Notion
page](https://www.notion.so/PR-8341-Chore-Oxfmt-formatting-pass-2f56d73d365081f2988fcb7570f9a2a1)
by [Unito](https://www.unito.io)
2026-01-27 17:59:19 -08:00
Alexander Brown
b1dfbfaa09 chore: Replace prettier with oxfmt (#8177)
Configure oxfmt ignorePatterns to exclude non-JS/TS files (md, json,
css, yaml, etc.) to match previous Prettier behavior.

┆Issue is synchronized with this [Notion
page](https://www.notion.so/PR-8177-chore-configure-oxfmt-to-format-only-JS-TS-Vue-files-2ee6d73d3650815080f3cc8a4a932109)
by [Unito](https://www.unito.io)

---------

Co-authored-by: Amp <amp@ampcode.com>
2026-01-20 16:44:08 -08:00
Benjamin Lu
a9653ba9c7 Remove unsupported workflow description fields (#6881)
## Summary
Remove top-level `description` keys from workflows because they are not
valid in GitHub Actions workflow syntax (see
https://docs.github.com/en/actions/reference/workflows-and-actions/workflow-syntax?utm_source=chatgpt.com).

## Changes
- **What**: delete the unsupported `description:` field from all
workflow YAMLs under `.github/workflows/`.

## Review Focus
- Confirm workflows still show intended names and triggers without the
invalid `description` metadata.

┆Issue is synchronized with this [Notion
page](https://www.notion.so/PR-6881-Remove-unsupported-workflow-description-fields-2b56d73d365081ed9f20eb7f57956bc6)
by [Unito](https://www.unito.io)
2025-11-23 22:53:51 -07:00
Christian Byrne
5e4965d131 ci: add yamllint (#6682)
adds yaml linting to CI and applies rules to existing yaml files.

┆Issue is synchronized with this [Notion
page](https://www.notion.so/PR-6682-ci-add-yamllint-2aa6d73d365081b4b67ae9d9cc86760f)
by [Unito](https://www.unito.io)
2025-11-13 11:10:48 -07:00
Christian Byrne
647e62d4b7 [ci] run stylelint as part of CI tests (#6143)
## Summary

Final PR continuing from

- https://github.com/Comfy-Org/ComfyUI_frontend/pull/5926
- https://github.com/Comfy-Org/ComfyUI_frontend/pull/5940

actually run stylelint in lint workflows.

┆Issue is synchronized with this [Notion
page](https://www.notion.so/PR-6143-ci-run-stylelint-as-part-of-CI-and-pre-commit-hook-2916d73d3650811891bcc9f94379cc5f)
by [Unito](https://www.unito.io)

---------

Co-authored-by: DrJKL <DrJKL@users.noreply.github.com>
2025-10-23 12:06:52 -07:00
Copilot
aa943ac565 CI: Remove .cache caching from GitHub Actions workflows (#6097)
## Overview

Removes **all `actions/cache` steps** from GitHub Actions workflows
after empirical testing showed that they actually **slow down CI/CD by
11%** rather than speeding it up.

## Context

As discussed in #5988, the codebase has evolved with components moving
into the `/packages` directory structure. The review comment suggested
removing the entire `actions/cache` step rather than just the `.cache`
path to properly evaluate performance impact.

## Performance Benchmark Results

Empirical testing on this PR (commits 38695ae0b vs ab16635c5) revealed
that **removing cache steps improves CI performance across all
workflows**:

| Workflow | WITHOUT Cache | WITH Cache | Improvement |
|----------|---------------|------------|-------------|
| **CI: Lint Format** | 208s (3m 28s) | 226s (3m 46s) | **-18s (-8.7%)**
 |
| **CI: Tests Unit** | 160s (2m 40s) | 177s (2m 57s) | **-17s (-10.6%)**
 |
| **CI: Tests Storybook** | 65s (1m 5s) | 78s (1m 18s) | **-13s
(-20.0%)**  |
| **Total Pipeline** | **433s (7m 13s)** | **481s (8m 1s)** | **-48s
(-11.1%)**  |

### Why is caching slower?

1. **Cache overhead exceeds benefits**: Time spent saving/restoring
cache > time saved from cached content
2. **Complex cache key computation**: Hash calculations for file
patterns add processing time
3. **Network I/O cost**: Each cache step adds network round-trips
4. **Tools already optimize incrementally**: ESLint, Vitest, Prettier
handle their own incremental checks efficiently

## Changes

Removed the entire `actions/cache` step from 8 workflow files:

- `ci-lint-format.yaml` - Removed tool outputs cache (.eslintcache,
.prettierCache, .knip-cache, tsconfig.tsbuildinfo)
- `ci-tests-storybook.yaml` - Removed storybook-static and
tsconfig.tsbuildinfo cache (both jobs)
- `ci-tests-unit.yaml` - Removed coverage and .vitest-cache
- `api-update-electron-api-types.yaml` - Removed tsconfig.tsbuildinfo
cache
- `api-update-manager-api-types.yaml` - Removed tool cache and
ComfyUI-Manager repo cache
- `api-update-registry-api-types.yaml` - Removed tool cache and
comfy-api repo cache
- `release-draft-create.yaml` - Removed tsconfig.tsbuildinfo cache
- `release-pypi-dev.yaml` - Removed dist and tsconfig.tsbuildinfo cache

**What remains cached:**
-  pnpm packages via `cache: 'pnpm'` in setup-node actions (the most
valuable cache)
-  Tool-specific incremental caches generated fresh each run
-  Docker layer caching (where applicable)

## Testing

-  Empirical performance testing completed (see benchmark results
above)
-  All cache steps removed successfully
-  No structural changes to workflow logic
-  pnpm package caching remains active

## Conclusion

The benchmark data clearly shows that removing `actions/cache` steps
results in **faster, simpler CI workflows**. The overhead of cache
management exceeds any benefit, especially with pnpm package caching
already handling the most time-consuming dependency installations.

**Recommendation:  Proceed with this change**

## Test Methodology

1. **WITHOUT cache** (commit
[38695ae0b](https://github.com/Comfy-Org/ComfyUI_frontend/commit/38695ae0b)):
Removed all `actions/cache` steps → [Workflow
run](https://github.com/Comfy-Org/ComfyUI_frontend/actions/runs/18654024806)
2. **WITH cache** (commit
[ab16635c5](https://github.com/Comfy-Org/ComfyUI_frontend/commit/ab16635c5)):
Temporarily restored all `actions/cache` steps → [Workflow
run](https://github.com/Comfy-Org/ComfyUI_frontend/actions/runs/18654143363)
3. **Final state** (commit
[3ce876f87](https://github.com/Comfy-Org/ComfyUI_frontend/commit/3ce876f87)):
Restored no-cache version (current)

Fixes #5988

---------

Co-authored-by: copilot-swe-agent[bot] <198982749+Copilot@users.noreply.github.com>
Co-authored-by: snomiao <7323030+snomiao@users.noreply.github.com>
Co-authored-by: snomiao <snomiao@gmail.com>
Co-authored-by: Claude <noreply@anthropic.com>
2025-10-20 11:15:56 -07:00
snomiao
8cc5b52c64 refactor: reorganize GitHub workflows with consistent naming convention (#5891)
## Summary

This PR implements a systematic naming convention for all GitHub
workflows to improve organization and discoverability. All 22 workflows
have been renamed and grouped by logical categories with consistent
prefixes.

## Changes

### Naming Convention
- **`ci-*`**: Continuous Integration workflows (testing, linting,
validation)
- **`pr-*`**: PR-specific automation triggered by labels  
- **`release-*`**: Release management workflows
- **`types-*`**: TypeScript type generation workflows
- **`i18n-*`**: Internationalization workflows

### Key Renames
- `tests-ci.yaml` → `ci-tests-e2e.yaml`
- `vitest-tests.yaml` → `ci-tests-unit.yaml`
- `storybook-and-chromatic-ci.yaml` → `ci-tests-storybook.yaml`
- `auto-backport.yaml` → `pr-backport.yaml`
- `claude-pr-review.yml` → `pr-claude-review.yaml`
- `version-bump.yaml` → `release-version-bump.yaml`
- `publish-frontend-types.yaml` → `release-npm-types.yaml`
- `create-dev-pypi-package.yaml` → `release-pypi-dev.yaml`

### Test Workflow Improvements
- Grouped all test workflows under `ci-tests-*` pattern
- Fork-safe deployment workflows: `ci-tests-e2e-forks.yaml`,
`ci-tests-storybook-forks.yaml`
- Added comments explaining fork deployment security workarounds

### Documentation
- Added comprehensive `.github/workflows/README.md`
- Documents naming conventions, best practices, and workflow
organization
- Includes trigger patterns and external dependencies

## Benefits

1. **Better Organization**: Workflows are now grouped logically by
prefix
2. **Improved Discoverability**: Easy to find related workflows  
3. **Consistent Naming**: All workflows follow the same pattern
4. **Clear Purpose**: Workflow names immediately indicate their function
5. **Maintainable**: README provides guidelines for future workflows

## Test Plan

- [x] All workflow cross-references updated
- [x] Display names match new file names  
- [x] Fork deployment workflows properly reference main workflows
- [x] Release workflows reference correct npm types workflow
- [x] All workflows retain original functionality

🤖 Generated with [Claude Code](https://claude.ai/code)

┆Issue is synchronized with this [Notion
page](https://www.notion.so/PR-5891-refactor-reorganize-GitHub-workflows-with-consistent-naming-convention-2806d73d365081febe47c7511bf0507e)
by [Unito](https://www.unito.io)

---------

Co-authored-by: Claude <noreply@anthropic.com>
Co-authored-by: Alexander Brown <drjkl@comfy.org>
2025-10-17 08:32:33 +09:00