Fix widget reactivity by AustinMroz · Pull Request #7539 · Comfy-Org/ComfyUI_frontend

AustinMroz · 2025-12-16T03:12:51Z

┆Issue is synchronized with this Notion page by Unito

coderabbitai · 2025-12-16T03:13:07Z

📝 Walkthrough

Walkthrough

The dynamic component binding in NodeWidgets.vue was changed from one-way :model-value prop binding to two-way v-model binding, while preserving the custom @update:model-value event handler for handling update events.

Changes

Cohort / File(s)	Summary
Component Binding Update `src/renderer/extensions/vueNodes/components/NodeWidgets.vue`	Updated dynamic component binding from `:model-value` prop to `v-model` for two-way binding while maintaining custom `@update:model-value` event handler

Pre-merge checks and finishing touches

✅ Passed checks (2 passed)

Check name	Status	Explanation
Linked Issues check	✅ Passed	PR implements v-model binding for widget reactivity as required by #7095, addressing the reactive widget.value objective through component binding changes.
Out of Scope Changes check	✅ Passed	All changes are scoped to NodeWidgets.vue component binding and directly support the widget reactivity objective from #7095.

✨ Finishing touches

🧪 Generate unit tests (beta)

Create PR with unit tests
Post copyable unit tests in a comment
Commit unit tests in branch austin/reactive-widgets

📜 Recent review details

Configuration used: CodeRabbit UI

Review profile: ASSERTIVE

Plan: Pro

📥 Commits

Reviewing files that changed from the base of the PR and between 108cfaa and a433c53.

📒 Files selected for processing (1)

src/renderer/extensions/vueNodes/components/NodeWidgets.vue (1 hunks)

🧰 Additional context used

📓 Path-based instructions (9)

src/**/*.vue

📄 CodeRabbit inference engine (.github/copilot-instructions.md)

src/**/*.vue: Use the Vue 3 Composition API instead of the Options API when writing Vue components (exception: when overriding or extending PrimeVue components for compatibility)
Use setup() function for component logic
Utilize ref and reactive for reactive state
Implement computed properties with computed()
Use watch and watchEffect for side effects
Implement lifecycle hooks with onMounted, onUpdated, etc.
Utilize provide/inject for dependency injection
Use vue 3.5 style of default prop declaration
Use Tailwind CSS for styling
Implement proper props and emits definitions
Utilize Vue 3's Teleport component when needed
Use Suspense for async components
Follow Vue 3 style guide and naming conventions

Files:

src/renderer/extensions/vueNodes/components/NodeWidgets.vue

src/**/*.{vue,ts}

📄 CodeRabbit inference engine (.github/copilot-instructions.md)

src/**/*.{vue,ts}: Leverage VueUse functions for performance-enhancing styles
Implement proper error handling
Use vue-i18n in composition API for any string literals. Place new translation entries in src/locales/en/main.json

Files:

src/renderer/extensions/vueNodes/components/NodeWidgets.vue

src/**/*.{ts,tsx,vue}

📄 CodeRabbit inference engine (src/CLAUDE.md)

src/**/*.{ts,tsx,vue}: Sanitize HTML with DOMPurify to prevent XSS attacks
Avoid using @ts-expect-error; use proper TypeScript types instead
Use es-toolkit for utility functions instead of other utility libraries
Implement proper TypeScript types throughout the codebase

Files:

src/renderer/extensions/vueNodes/components/NodeWidgets.vue

src/**/{composables,components}/**/*.{ts,tsx,vue}

📄 CodeRabbit inference engine (src/CLAUDE.md)

Clean up subscriptions in state management to prevent memory leaks

Files:

src/renderer/extensions/vueNodes/components/NodeWidgets.vue

src/**/*.{vue,ts,tsx}

📄 CodeRabbit inference engine (src/CLAUDE.md)

Follow Vue 3 composition API style guide

Files:

src/renderer/extensions/vueNodes/components/NodeWidgets.vue

src/**/{components,composables}/**/*.{ts,tsx,vue}

📄 CodeRabbit inference engine (src/CLAUDE.md)

Use vue-i18n for ALL user-facing strings by adding them to src/locales/en/main.json

Files:

src/renderer/extensions/vueNodes/components/NodeWidgets.vue

**/*.vue

📄 CodeRabbit inference engine (AGENTS.md)

**/*.vue: Use Vue 3 SFCs (Single File Components) with Composition API only; do not use Options API
Vue components must use <script setup lang="ts"> for component logic
Use Vue 3.5 TypeScript style for default prop declaration with reactive props destructuring; do not use withDefaults or runtime props declaration
Prefer useModel to separately defining a prop and emit
Use Tailwind 4 utility classes for styling; avoid using <style> blocks in Vue components
Use semantic Tailwind values from style.css theme instead of the dark: variant; for example, use bg-node-component-surface instead of dark: prefixes
Always use cn() utility from @/utils/tailwindUtil to merge Tailwind class names; do not use :class="[]" syntax
Use ref for reactive state in Vue Composition API components
Implement computed properties with computed() from Vue; avoid using a ref with a watch if a computed would work instead
Use watch and watchEffect for side effects in Vue components
Implement lifecycle hooks using onMounted, onUpdated, and other Vue lifecycle functions
Use provide/inject for dependency injection; do not use dependency injection if a Store or shared composable would be simpler
Do not import Vue macros unnecessarily; only use when needed
Be judicious with addition of new refs or other state: prefer props, avoid redundant computed, and prefer computed over watch
Use VueUse functions for performance-enhancing styles
In Vue Components, implement proper props and emits definitions
Utilize Vue 3's Teleport component when needed
Use Suspense for async components
Implement proper error handling in Vue components
Follow Vue 3 style guide and naming conventions
Use vue-i18n in composition API for any string literals; place new translation entries in src/locales/en/main.json
Avoid new usage of PrimeVue components; prefer shadcn/vue or Reka UI instead

Files:

src/renderer/extensions/vueNodes/components/NodeWidgets.vue

**/*.{ts,tsx,js,jsx,vue,json}

📄 CodeRabbit inference engine (AGENTS.md)

Code style: Use 2-space indentation, single quotes, no trailing semicolons, and 80-character line width (see .prettierrc)

Files:

src/renderer/extensions/vueNodes/components/NodeWidgets.vue

**/*.{ts,tsx,vue}

📄 CodeRabbit inference engine (AGENTS.md)

**/*.{ts,tsx,vue}: Imports must be sorted and grouped by plugin; run pnpm format before committing
Use TypeScript for type safety; never use any type - use proper TypeScript types
Never use as any type assertions; fix the underlying type issue instead
Use es-toolkit for utility functions
Write code that is expressive and self-documenting; avoid comments unless absolutely necessary; do not add or retain redundant comments
Keep functions short and functional
Minimize nesting in code (e.g., deeply nested if or for statements); apply the Arrow Anti-Pattern principle
Avoid mutable state; prefer immutability and assignment at point of declaration
Favor pure functions, especially testable ones

Files:

src/renderer/extensions/vueNodes/components/NodeWidgets.vue

🧠 Learnings (8)

📓 Common learnings

Learnt from: CR
Repo: Comfy-Org/ComfyUI_frontend PR: 0
File: .github/copilot-instructions.md:0-0
Timestamp: 2025-11-24T19:47:02.860Z
Learning: Applies to src/**/*.vue : Utilize ref and reactive for reactive state

Learnt from: CR
Repo: Comfy-Org/ComfyUI_frontend PR: 0
File: AGENTS.md:0-0
Timestamp: 2025-12-09T20:22:23.620Z
Learning: Applies to **/*.vue : Prefer `useModel` to separately defining a prop and emit

Learnt from: CR
Repo: Comfy-Org/ComfyUI_frontend PR: 0
File: src/components/CLAUDE.md:0-0
Timestamp: 2025-11-24T19:47:45.616Z
Learning: Applies to src/components/**/*.vue : Prefer emit/event-name for state changes over other communication patterns

📚 Learning: 2025-12-09T20:22:23.620Z

Learnt from: CR
Repo: Comfy-Org/ComfyUI_frontend PR: 0
File: AGENTS.md:0-0
Timestamp: 2025-12-09T20:22:23.620Z
Learning: Applies to **/*.vue : Prefer `useModel` to separately defining a prop and emit

Applied to files:

src/renderer/extensions/vueNodes/components/NodeWidgets.vue

📚 Learning: 2025-11-24T19:47:45.616Z

Learnt from: CR
Repo: Comfy-Org/ComfyUI_frontend PR: 0
File: src/components/CLAUDE.md:0-0
Timestamp: 2025-11-24T19:47:45.616Z
Learning: Applies to src/components/**/*.vue : Replace PrimeVue InputSwitch component with ToggleSwitch

Applied to files:

src/renderer/extensions/vueNodes/components/NodeWidgets.vue

📚 Learning: 2025-11-24T19:47:45.616Z

Learnt from: CR
Repo: Comfy-Org/ComfyUI_frontend PR: 0
File: src/components/CLAUDE.md:0-0
Timestamp: 2025-11-24T19:47:45.616Z
Learning: Applies to src/components/**/*.vue : Prefer emit/event-name for state changes over other communication patterns

Applied to files:

src/renderer/extensions/vueNodes/components/NodeWidgets.vue

📚 Learning: 2025-12-09T03:49:52.828Z

Learnt from: christian-byrne
Repo: Comfy-Org/ComfyUI_frontend PR: 6300
File: src/platform/updates/components/WhatsNewPopup.vue:5-13
Timestamp: 2025-12-09T03:49:52.828Z
Learning: In Vue files across the ComfyUI_frontend repo, when a button is needed, prefer the repo's common button components from src/components/button/ (IconButton.vue, TextButton.vue, IconTextButton.vue) over plain HTML <button> elements. These components wrap PrimeVue with the project’s design system styling. Use only the common button components for consistency and theming, and import them from src/components/button/ as needed.

Applied to files:

src/renderer/extensions/vueNodes/components/NodeWidgets.vue

📚 Learning: 2025-12-09T21:40:12.361Z

Learnt from: benceruleanlu
Repo: Comfy-Org/ComfyUI_frontend PR: 7297
File: src/components/actionbar/ComfyActionbar.vue:33-43
Timestamp: 2025-12-09T21:40:12.361Z
Learning: In Vue single-file components, allow inline Tailwind CSS class strings for static classes and avoid extracting them into computed properties solely for readability. Prefer keeping static class names inline for simplicity and performance. For dynamic or conditional classes, use Vue bindings (e.g., :class) to compose classes.

Applies to all Vue files in the repository (e.g., src/**/*.vue) where Tailwind utilities are used for static styling.

Applied to files:

src/renderer/extensions/vueNodes/components/NodeWidgets.vue

📚 Learning: 2025-12-11T03:55:51.755Z

Learnt from: simula-r
Repo: Comfy-Org/ComfyUI_frontend PR: 7252
File: src/renderer/extensions/vueNodes/components/ImagePreview.vue:151-158
Timestamp: 2025-12-11T03:55:51.755Z
Learning: In Vue components under src/renderer/extensions/vueNodes (e.g., ImagePreview.vue and LGraphNode.vue), implement image gallery keyboard navigation so that it responds to the node's focus state rather than requiring focus inside the image preview wrapper. Achieve this by wiring keyEvent handling at the node focus level and injecting or propagating key events (arrow keys) to the gallery when the node is focused/selected. This improves accessibility and aligns navigation with node-level focus behavior.

Applied to files:

src/renderer/extensions/vueNodes/components/NodeWidgets.vue

📚 Learning: 2025-12-11T12:25:15.470Z

Learnt from: christian-byrne
Repo: Comfy-Org/ComfyUI_frontend PR: 7358
File: src/components/dialog/content/signin/SignUpForm.vue:45-54
Timestamp: 2025-12-11T12:25:15.470Z
Learning: This repository uses CI automation to format code (pnpm format). Do not include manual formatting suggestions in code reviews for Comfy-Org/ComfyUI_frontend. If formatting issues are detected, rely on the CI formatter or re-run pnpm format. Focus reviews on correctness, readability, performance, accessibility, and maintainability rather than style formatting.

Applied to files:

src/renderer/extensions/vueNodes/components/NodeWidgets.vue

⏰ Context from checks skipped due to timeout of 90000ms. You can increase the timeout in your CodeRabbit configuration to a maximum of 15 minutes (900000ms). (4)

GitHub Check: lint-and-format
GitHub Check: setup
GitHub Check: test
GitHub Check: collect

Thanks for using CodeRabbit! It's free for OSS, and your support helps us grow. If you like it, consider giving us a shout-out.

❤️ Share

_{Comment @coderabbitai help to get the list of available commands and usage tips.}

github-actions · 2025-12-16T03:13:10Z

🎭 Playwright Test Results

⚠️ Tests passed with flaky tests

⏰ Completed at: 12/16/2025, 03:23:30 AM UTC

📈 Summary

Total Tests: 506
Passed: 495 ✅
Failed: 0
Flaky: 2 ⚠️
Skipped: 9 ⏭️

📊 Test Reports by Browser

✅ chromium: View Report • ✅ 483 / ❌ 0 / ⚠️ 2 / ⏭️ 9
✅ chromium-2x: View Report • ✅ 2 / ❌ 0 / ⚠️ 0 / ⏭️ 0
✅ chromium-0.5x: View Report • ✅ 1 / ❌ 0 / ⚠️ 0 / ⏭️ 0
✅ mobile-chrome: View Report • ✅ 9 / ❌ 0 / ⚠️ 0 / ⏭️ 0

🎉 Click on the links above to view detailed test results for each browser configuration.

github-actions · 2025-12-16T03:13:13Z

🎨 Storybook Build Status

✅ Build completed successfully!

⏰ Completed at: 12/16/2025, 03:14:27 AM UTC

🔗 Links

📊 View Workflow Run
🎨 View Storybook

🎉 Your Storybook is ready for review!

github-actions · 2025-12-16T03:15:26Z

Bundle Size Report

Summary

Raw size: 17.1 MB baseline 17.1 MB — 🔴 +33 B
Gzip: 3.38 MB baseline 3.38 MB — 🔴 +30 B
Brotli: 2.6 MB baseline 2.6 MB — 🟢 -159 B
Bundles: 98 current • 98 baseline • 40 added / 40 removed

Category Glance
App Entry Points 🔴 +33 B (3.25 MB) · Vendor & Third-Party ⚪ 0 B (8.56 MB) · Other ⚪ 0 B (3.75 MB) · Graph Workspace ⚪ 0 B (990 kB) · Panels & Settings ⚪ 0 B (298 kB) · UI Components ⚪ 0 B (184 kB) · + 3 more

Per-category breakdown

App Entry Points — 3.25 MB (baseline 3.25 MB) • 🔴 +33 B

Main entry bundles and manifests

File	Before	After	Δ Raw	Δ Gzip	Δ Brotli
assets/index-CX2EeRDg.js (new)	—	3.02 MB	🔴 +3.02 MB	🔴 +628 kB	🔴 +478 kB
~~assets/index-CWSabC8_.js~~ (removed)	3.02 MB	—	🟢 -3.02 MB	🟢 -628 kB	🟢 -478 kB
~~assets/index-B6haG5xc.js~~ (removed)	227 kB	—	🟢 -227 kB	🟢 -48.6 kB	🟢 -39.9 kB
assets/index-BHv9Uaw-.js (new)	—	227 kB	🔴 +227 kB	🔴 +48.6 kB	🔴 +39.9 kB
assets/index-6mGyQttU.js (new)	—	345 B	🔴 +345 B	🔴 +246 B	🔴 +230 B
~~assets/index-DCYg2hR5.js~~ (removed)	345 B	—	🟢 -345 B	🟢 -245 B	🟢 -200 B

Status: 3 added / 3 removed

Graph Workspace — 990 kB (baseline 990 kB) • ⚪ 0 B

Graph editor runtime, canvas, workflow orchestration

File	Before	After	Δ Raw	Δ Gzip	Δ Brotli
~~assets/GraphView-BOC56rgD.js~~ (removed)	990 kB	—	🟢 -990 kB	🟢 -191 kB	🟢 -146 kB
assets/GraphView-TW5sZCW4.js (new)	—	990 kB	🔴 +990 kB	🔴 +191 kB	🔴 +146 kB

Status: 1 added / 1 removed

Views & Navigation — 6.54 kB (baseline 6.54 kB) • ⚪ 0 B

Top-level views, pages, and routed surfaces

File	Before	After	Δ Raw	Δ Gzip	Δ Brotli
assets/UserSelectView-BNB7zbT7.js (new)	—	6.54 kB	🔴 +6.54 kB	🔴 +2.14 kB	🔴 +1.89 kB
~~assets/UserSelectView-DUXqoZtV.js~~ (removed)	6.54 kB	—	🟢 -6.54 kB	🟢 -2.13 kB	🟢 -1.89 kB

Status: 1 added / 1 removed

Panels & Settings — 298 kB (baseline 298 kB) • ⚪ 0 B

Configuration panels, inspectors, and settings screens

File	Before	After	Δ Raw	Δ Gzip	Δ Brotli
assets/LegacyCreditsPanel-Dod1LC3J.js (new)	—	21.4 kB	🔴 +21.4 kB	🔴 +5.15 kB	🔴 +4.5 kB
~~assets/LegacyCreditsPanel-LklV2sz3.js~~ (removed)	21.4 kB	—	🟢 -21.4 kB	🟢 -5.15 kB	🟢 -4.5 kB
~~assets/KeybindingPanel-BRiOpkTh.js~~ (removed)	13.6 kB	—	🟢 -13.6 kB	🟢 -3.42 kB	🟢 -3.02 kB
assets/KeybindingPanel-DLGDRPVq.js (new)	—	13.6 kB	🔴 +13.6 kB	🔴 +3.42 kB	🔴 +3.02 kB
assets/ExtensionPanel-BrmFrsUD.js (new)	—	10.8 kB	🔴 +10.8 kB	🔴 +2.57 kB	🔴 +2.26 kB
~~assets/ExtensionPanel-D-dnI0HB.js~~ (removed)	10.8 kB	—	🟢 -10.8 kB	🟢 -2.57 kB	🟢 -2.26 kB
assets/AboutPanel-C67Z2J5b.js (new)	—	9.16 kB	🔴 +9.16 kB	🔴 +2.46 kB	🔴 +2.21 kB
~~assets/AboutPanel-CVZvKEr-.js~~ (removed)	9.16 kB	—	🟢 -9.16 kB	🟢 -2.46 kB	🟢 -2.21 kB
~~assets/ServerConfigPanel-DVAmnew8.js~~ (removed)	6.56 kB	—	🟢 -6.56 kB	🟢 -1.83 kB	🟢 -1.63 kB
assets/ServerConfigPanel-UnHvXSM0.js (new)	—	6.56 kB	🔴 +6.56 kB	🔴 +1.83 kB	🔴 +1.63 kB
~~assets/UserPanel-C99DgIKt.js~~ (removed)	6.23 kB	—	🟢 -6.23 kB	🟢 -1.72 kB	🟢 -1.51 kB
assets/UserPanel-CNEbtf26.js (new)	—	6.23 kB	🔴 +6.23 kB	🔴 +1.72 kB	🔴 +1.51 kB
assets/settings-B_sqawkt.js	27.3 kB	27.3 kB	⚪ 0 B	⚪ 0 B	⚪ 0 B
assets/settings-BhbWhsRg.js	101 B	101 B	⚪ 0 B	⚪ 0 B	⚪ 0 B
assets/settings-BlDXT7wp.js	21.7 kB	21.7 kB	⚪ 0 B	⚪ 0 B	⚪ 0 B
assets/settings-Bz8HAvJu.js	21.1 kB	21.1 kB	⚪ 0 B	⚪ 0 B	⚪ 0 B
assets/settings-C2vW8UNv.js	24.2 kB	24.2 kB	⚪ 0 B	⚪ 0 B	⚪ 0 B
assets/settings-C9vsDM17.js	25.1 kB	25.1 kB	⚪ 0 B	⚪ 0 B	⚪ 0 B
assets/settings-DWD49kQp.js	33.3 kB	33.3 kB	⚪ 0 B	⚪ 0 B	⚪ 0 B
assets/settings-DZE27_Iz.js	25.9 kB	25.9 kB	⚪ 0 B	⚪ 0 B	⚪ 0 B
assets/settings-OXaZPcZF.js	26.6 kB	26.6 kB	⚪ 0 B	⚪ 0 B	⚪ 0 B
assets/settings-RbkKsnDG.js	25.2 kB	25.2 kB	⚪ 0 B	⚪ 0 B	⚪ 0 B

Status: 6 added / 6 removed

UI Components — 184 kB (baseline 184 kB) • ⚪ 0 B

Reusable component library chunks

File	Before	After	Δ Raw	Δ Gzip	Δ Brotli
assets/Load3D.vue_vue_type_script_setup_true_lang-d0LE2vib.js (new)	—	53.7 kB	🔴 +53.7 kB	🔴 +8.48 kB	🔴 +7.29 kB
~~assets/Load3D.vue_vue_type_script_setup_true_lang-tSb_CWvh.js~~ (removed)	53.7 kB	—	🟢 -53.7 kB	🟢 -8.48 kB	🟢 -7.29 kB
~~assets/WidgetSelect.vue_vue_type_script_setup_true_lang-BkuP-biP.js~~ (removed)	48 kB	—	🟢 -48 kB	🟢 -10.3 kB	🟢 -8.99 kB
assets/WidgetSelect.vue_vue_type_script_setup_true_lang-Bv7vM7eL.js (new)	—	48 kB	🔴 +48 kB	🔴 +10.3 kB	🔴 +8.97 kB
~~assets/LazyImage.vue_vue_type_script_setup_true_lang-Cku0Z0Gk.js~~ (removed)	48 kB	—	🟢 -48 kB	🟢 -10.6 kB	🟢 -9.32 kB
assets/LazyImage.vue_vue_type_script_setup_true_lang-CmpZA0J6.js (new)	—	48 kB	🔴 +48 kB	🔴 +10.7 kB	🔴 +9.32 kB
assets/WidgetInputNumber.vue_vue_type_script_setup_true_lang-BuunoKqM.js (new)	—	19.5 kB	🔴 +19.5 kB	🔴 +5.04 kB	🔴 +4.47 kB
~~assets/WidgetInputNumber.vue_vue_type_script_setup_true_lang-XTclvzr6.js~~ (removed)	19.5 kB	—	🟢 -19.5 kB	🟢 -5.04 kB	🟢 -4.47 kB
assets/ComfyQueueButton-Bhi-CRoa.js (new)	—	8.44 kB	🔴 +8.44 kB	🔴 +2.48 kB	🔴 +2.21 kB
~~assets/ComfyQueueButton-C8HusUGe.js~~ (removed)	8.44 kB	—	🟢 -8.44 kB	🟢 -2.48 kB	🟢 -2.21 kB
~~assets/WidgetLayoutField.vue_vue_type_script_setup_true_lang-BwRRmHtT.js~~ (removed)	2.14 kB	—	🟢 -2.14 kB	🟢 -888 B	🟢 -764 B
assets/WidgetLayoutField.vue_vue_type_script_setup_true_lang-qCsXeZ9Z.js (new)	—	2.14 kB	🔴 +2.14 kB	🔴 +889 B	🔴 +765 B
~~assets/MediaTitle.vue_vue_type_script_setup_true_lang-DfugxoSI.js~~ (removed)	897 B	—	🟢 -897 B	🟢 -500 B	🟢 -429 B
assets/MediaTitle.vue_vue_type_script_setup_true_lang-WSVLl_ZV.js (new)	—	897 B	🔴 +897 B	🔴 +501 B	🔴 +443 B
assets/UserAvatar.vue_vue_type_script_setup_true_lang-CiSnQExp.js	1.34 kB	1.34 kB	⚪ 0 B	⚪ 0 B	⚪ 0 B
assets/WidgetButton-CUWIT83D.js	2.04 kB	2.04 kB	⚪ 0 B	⚪ 0 B	⚪ 0 B

Status: 7 added / 7 removed

Data & Services — 12.5 kB (baseline 12.5 kB) • ⚪ 0 B

Stores, services, APIs, and repositories

File	Before	After	Δ Raw	Δ Gzip	Δ Brotli
assets/keybindingService-CaD648sL.js (new)	—	7.51 kB	🔴 +7.51 kB	🔴 +1.84 kB	🔴 +1.58 kB
~~assets/keybindingService-SYJewunK.js~~ (removed)	7.51 kB	—	🟢 -7.51 kB	🟢 -1.83 kB	🟢 -1.58 kB
assets/audioService-DeIumDCU.js (new)	—	2.2 kB	🔴 +2.2 kB	🔴 +959 B	🔴 +830 B
~~assets/audioService-z74a9HWY.js~~ (removed)	2.2 kB	—	🟢 -2.2 kB	🟢 -961 B	🟢 -828 B
assets/serverConfigStore-Bwn3ENCR.js	2.83 kB	2.83 kB	⚪ 0 B	⚪ 0 B	⚪ 0 B

Status: 2 added / 2 removed

Utilities & Hooks — 3.18 kB (baseline 3.18 kB) • ⚪ 0 B

Helpers, composables, and utility bundles

File	Before	After	Δ Raw	Δ Gzip	Δ Brotli
assets/audioUtils-T2UjDRq9.js (new)	—	1.41 kB	🔴 +1.41 kB	🔴 +652 B	🔴 +547 B
~~assets/audioUtils-XQ3SEIf-.js~~ (removed)	1.41 kB	—	🟢 -1.41 kB	🟢 -652 B	🟢 -542 B
assets/mathUtil-CD4DsosH.js	1.32 kB	1.32 kB	⚪ 0 B	⚪ 0 B	⚪ 0 B
assets/nodeFilterUtil-CXKCRJ-m.js	460 B	460 B	⚪ 0 B	⚪ 0 B	⚪ 0 B

Status: 1 added / 1 removed

Vendor & Third-Party — 8.56 MB (baseline 8.56 MB) • ⚪ 0 B

External libraries and shared vendor chunks

File	Before	After	Δ Raw	Δ Gzip	Δ Brotli
assets/vendor-chart-Cqf0KagN.js	452 kB	452 kB	⚪ 0 B	⚪ 0 B	⚪ 0 B
assets/vendor-other-S7nymsLT.js	3.98 MB	3.98 MB	⚪ 0 B	⚪ 0 B	⚪ 0 B
assets/vendor-primevue-BzWEaXhK.js	1.96 MB	1.96 MB	⚪ 0 B	⚪ 0 B	⚪ 0 B
assets/vendor-three-aR6ntw5X.js	1.37 MB	1.37 MB	⚪ 0 B	⚪ 0 B	⚪ 0 B
assets/vendor-tiptap-BIIubbA1.js	232 kB	232 kB	⚪ 0 B	⚪ 0 B	⚪ 0 B
assets/vendor-vue-BPEtaHlw.js	160 kB	160 kB	⚪ 0 B	⚪ 0 B	⚪ 0 B
assets/vendor-xterm-BZLod3g9.js	407 kB	407 kB	⚪ 0 B	⚪ 0 B	⚪ 0 B

Other — 3.75 MB (baseline 3.75 MB) • ⚪ 0 B

Bundles that do not match a named category

File	Before	After	Δ Raw	Δ Gzip	Δ Brotli
~~assets/WidgetRecordAudio-BUKtEBFG.js~~ (removed)	20.4 kB	—	🟢 -20.4 kB	🟢 -5.23 kB	🟢 -4.62 kB
assets/WidgetRecordAudio-CO71vYus.js (new)	—	20.4 kB	🔴 +20.4 kB	🔴 +5.23 kB	🔴 +4.63 kB
~~assets/AudioPreviewPlayer-Czc_2nvJ.js~~ (removed)	13.4 kB	—	🟢 -13.4 kB	🟢 -3.37 kB	🟢 -3 kB
assets/AudioPreviewPlayer-vHkhDVtB.js (new)	—	13.4 kB	🔴 +13.4 kB	🔴 +3.37 kB	🔴 +3.01 kB
~~assets/NumberControlPopover-B05F_3XA.js~~ (removed)	6.31 kB	—	🟢 -6.31 kB	🟢 -1.93 kB	🟢 -1.7 kB
assets/NumberControlPopover-DUpiyWpm.js (new)	—	6.31 kB	🔴 +6.31 kB	🔴 +1.93 kB	🔴 +1.71 kB
assets/WidgetGalleria-BNU4IUbg.js (new)	—	4.1 kB	🔴 +4.1 kB	🔴 +1.44 kB	🔴 +1.3 kB
~~assets/WidgetGalleria-DS0grbM0.js~~ (removed)	4.1 kB	—	🟢 -4.1 kB	🟢 -1.44 kB	🟢 -1.3 kB
assets/WidgetColorPicker-BsGH1tRU.js (new)	—	3.41 kB	🔴 +3.41 kB	🔴 +1.38 kB	🔴 +1.23 kB
~~assets/WidgetColorPicker-tmCOlMOJ.js~~ (removed)	3.41 kB	—	🟢 -3.41 kB	🟢 -1.38 kB	🟢 -1.23 kB
~~assets/WidgetTextarea-BRkZDooj.js~~ (removed)	3.08 kB	—	🟢 -3.08 kB	🟢 -1.21 kB	🟢 -1.07 kB
assets/WidgetTextarea-DTv99XUR.js (new)	—	3.08 kB	🔴 +3.08 kB	🔴 +1.21 kB	🔴 +1.08 kB
assets/WidgetMarkdown-A-wMQg0O.js (new)	—	3.08 kB	🔴 +3.08 kB	🔴 +1.28 kB	🔴 +1.12 kB
~~assets/WidgetMarkdown-DCXDGlEp.js~~ (removed)	3.08 kB	—	🟢 -3.08 kB	🟢 -1.28 kB	🟢 -1.12 kB
~~assets/WidgetAudioUI-CEcvMPq9.js~~ (removed)	2.86 kB	—	🟢 -2.86 kB	🟢 -1.16 kB	🟢 -1.05 kB
assets/WidgetAudioUI-snJWitA0.js (new)	—	2.86 kB	🔴 +2.86 kB	🔴 +1.17 kB	🔴 +1.06 kB
~~assets/WidgetInputText-C4fXySsg.js~~ (removed)	1.99 kB	—	🟢 -1.99 kB	🟢 -917 B	🟢 -851 B
assets/WidgetInputText-CXcYa6ij.js (new)	—	1.99 kB	🔴 +1.99 kB	🔴 +918 B	🔴 +852 B
assets/WidgetToggleSwitch-Cv-ZMUzN.js (new)	—	1.76 kB	🔴 +1.76 kB	🔴 +833 B	🔴 +735 B
~~assets/WidgetToggleSwitch-rZEGhH96.js~~ (removed)	1.76 kB	—	🟢 -1.76 kB	🟢 -832 B	🟢 -728 B
assets/MediaImageBottom-CANTB5AZ.js (new)	—	1.55 kB	🔴 +1.55 kB	🔴 +735 B	🔴 +641 B
~~assets/MediaImageBottom-CHwbvoZo.js~~ (removed)	1.55 kB	—	🟢 -1.55 kB	🟢 -734 B	🟢 -641 B
assets/MediaAudioBottom-BTlFY4zc.js (new)	—	1.51 kB	🔴 +1.51 kB	🔴 +733 B	🔴 +650 B
~~assets/MediaAudioBottom-C2Efg3M5.js~~ (removed)	1.51 kB	—	🟢 -1.51 kB	🟢 -733 B	🟢 -650 B
assets/Media3DBottom-BrnM9z5P.js (new)	—	1.5 kB	🔴 +1.5 kB	🔴 +732 B	🔴 +650 B
~~assets/Media3DBottom-D4Yly7QH.js~~ (removed)	1.5 kB	—	🟢 -1.5 kB	🟢 -734 B	🟢 -650 B
~~assets/MediaVideoBottom-Bn-_vD5C.js~~ (removed)	1.5 kB	—	🟢 -1.5 kB	🟢 -730 B	🟢 -650 B
assets/MediaVideoBottom-nog9B3Xd.js (new)	—	1.5 kB	🔴 +1.5 kB	🔴 +730 B	🔴 +649 B
~~assets/Media3DTop-BEAn2DfO.js~~ (removed)	1.49 kB	—	🟢 -1.49 kB	🟢 -765 B	🟢 -648 B
assets/Media3DTop-BqSVjHt4.js (new)	—	1.49 kB	🔴 +1.49 kB	🔴 +765 B	🔴 +653 B
~~assets/WidgetSelect-B4QqRltA.js~~ (removed)	655 B	—	🟢 -655 B	🟢 -342 B	🟢 -289 B
assets/WidgetSelect-BY2bSFV-.js (new)	—	655 B	🔴 +655 B	🔴 +342 B	🔴 +291 B
assets/WidgetInputNumber-BM2A1VrU.js (new)	—	595 B	🔴 +595 B	🔴 +327 B	🔴 +271 B
~~assets/WidgetInputNumber-CcyV82ne.js~~ (removed)	595 B	—	🟢 -595 B	🟢 -329 B	🟢 -276 B
assets/Load3D-B4wv9k_p.js (new)	—	424 B	🔴 +424 B	🔴 +267 B	🔴 +225 B
~~assets/Load3D-CbGzLDwX.js~~ (removed)	424 B	—	🟢 -424 B	🟢 -266 B	🟢 -225 B
assets/WidgetLegacy-CAIFqYji.js (new)	—	364 B	🔴 +364 B	🔴 +238 B	🔴 +196 B
~~assets/WidgetLegacy-DbF4MOuy.js~~ (removed)	364 B	—	🟢 -364 B	🟢 -237 B	🟢 -196 B
assets/commands-_s-RvhJR.js	13.6 kB	13.6 kB	⚪ 0 B	⚪ 0 B	⚪ 0 B
assets/commands-BuUILW6P.js	13 kB	13 kB	⚪ 0 B	⚪ 0 B	⚪ 0 B
assets/commands-BV4R6fLx.js	14.9 kB	14.9 kB	⚪ 0 B	⚪ 0 B	⚪ 0 B
assets/commands-BWp4HdfU.js	101 B	101 B	⚪ 0 B	⚪ 0 B	⚪ 0 B
assets/commands-CLwPdnT6.js	14.2 kB	14.2 kB	⚪ 0 B	⚪ 0 B	⚪ 0 B
assets/commands-CWMchBmd.js	15.9 kB	15.9 kB	⚪ 0 B	⚪ 0 B	⚪ 0 B
assets/commands-DazTQhtc.js	12.9 kB	12.9 kB	⚪ 0 B	⚪ 0 B	⚪ 0 B
assets/commands-DmWrOe93.js	13.7 kB	13.7 kB	⚪ 0 B	⚪ 0 B	⚪ 0 B
assets/commands-DwiH7Kr6.js	13.8 kB	13.8 kB	⚪ 0 B	⚪ 0 B	⚪ 0 B
assets/commands-mS3LCNPn.js	14.5 kB	14.5 kB	⚪ 0 B	⚪ 0 B	⚪ 0 B
assets/main-6nlVHpc-.js	73.1 kB	73.1 kB	⚪ 0 B	⚪ 0 B	⚪ 0 B
assets/main-B_3IONzJ.js	113 kB	113 kB	⚪ 0 B	⚪ 0 B	⚪ 0 B
assets/main-BqRsXvrH.js	72.2 kB	72.2 kB	⚪ 0 B	⚪ 0 B	⚪ 0 B
assets/main-BZ-vlW9L.js	94 kB	94 kB	⚪ 0 B	⚪ 0 B	⚪ 0 B
assets/main-C3etCTkn.js	83.4 kB	83.4 kB	⚪ 0 B	⚪ 0 B	⚪ 0 B
assets/main-CG-hMOv1.js	84.2 kB	84.2 kB	⚪ 0 B	⚪ 0 B	⚪ 0 B
assets/main-ChsXwF7G.js	86.5 kB	86.5 kB	⚪ 0 B	⚪ 0 B	⚪ 0 B
assets/main-Cw9RZWRY.js	89 B	89 B	⚪ 0 B	⚪ 0 B	⚪ 0 B
assets/main-DjVXiGQX.js	99 kB	99 kB	⚪ 0 B	⚪ 0 B	⚪ 0 B
assets/main-Xp7hXzT2.js	81.7 kB	81.7 kB	⚪ 0 B	⚪ 0 B	⚪ 0 B
assets/MediaAudioTop-FQz4Thvl.js	1.46 kB	1.46 kB	⚪ 0 B	⚪ 0 B	⚪ 0 B
assets/MediaImageTop-B3anU6gM.js	1.75 kB	1.75 kB	⚪ 0 B	⚪ 0 B	⚪ 0 B
assets/MediaVideoTop-DhI-keBK.js	2.65 kB	2.65 kB	⚪ 0 B	⚪ 0 B	⚪ 0 B
assets/nodeDefs-B1kKcnvT.js	303 kB	303 kB	⚪ 0 B	⚪ 0 B	⚪ 0 B
assets/nodeDefs-BoX8ObAh.js	300 kB	300 kB	⚪ 0 B	⚪ 0 B	⚪ 0 B
assets/nodeDefs-Bw_Jitw_.js	101 B	101 B	⚪ 0 B	⚪ 0 B	⚪ 0 B
assets/nodeDefs-BZQ0wolS.js	360 kB	360 kB	⚪ 0 B	⚪ 0 B	⚪ 0 B
assets/nodeDefs-CHUJIOIF.js	310 kB	310 kB	⚪ 0 B	⚪ 0 B	⚪ 0 B
assets/nodeDefs-DAU0PVOW.js	297 kB	297 kB	⚪ 0 B	⚪ 0 B	⚪ 0 B
assets/nodeDefs-Db5kOxDZ.js	299 kB	299 kB	⚪ 0 B	⚪ 0 B	⚪ 0 B
assets/nodeDefs-DgiIrZvP.js	276 kB	276 kB	⚪ 0 B	⚪ 0 B	⚪ 0 B
assets/nodeDefs-DU4sfqO1.js	334 kB	334 kB	⚪ 0 B	⚪ 0 B	⚪ 0 B
assets/nodeDefs-Dw-Pdf3f.js	279 kB	279 kB	⚪ 0 B	⚪ 0 B	⚪ 0 B
assets/WidgetChart-CtDKuluF.js	2.48 kB	2.48 kB	⚪ 0 B	⚪ 0 B	⚪ 0 B
assets/WidgetImageCompare-DDdUO9Q8.js	2.21 kB	2.21 kB	⚪ 0 B	⚪ 0 B	⚪ 0 B
assets/widgetPropFilter-BIbGSUAt.js	1.28 kB	1.28 kB	⚪ 0 B	⚪ 0 B	⚪ 0 B

Status: 19 added / 19 removed

AustinMroz · 2025-12-16T04:10:56Z

I'll open follow-up PRs for the parts this doesn't actually include:

Doubles value control updates
Reactive inputs
Combo control widgets
Color Picker fixes

With reactivity fixed, control widgets would apply twice. This is fixed by using the litegraph implementation. Also adds control widget support for combos Followup to #7539. Known Issue: - Primitive node do not have litegraph callbacks properly setup. As a result, they will display an updated value when modified by control widgets. Fixing this will requires a larger, separate PR ┆Issue is synchronized with this [Notion page](https://www.notion.so/PR-7550-Fix-doubled-control-application-2cb6d73d365081739a2fc40fdfb3630e) by [Unito](https://www.unito.io)

Closes Comfy-Org#7095 ┆Issue is synchronized with this [Notion page](https://www.notion.so/PR-7539-Fix-widget-reactivity-2cb6d73d3650816d8977ebda35ab88b9) by [Unito](https://www.unito.io)

With reactivity fixed, control widgets would apply twice. This is fixed by using the litegraph implementation. Also adds control widget support for combos Followup to Comfy-Org#7539. Known Issue: - Primitive node do not have litegraph callbacks properly setup. As a result, they will display an updated value when modified by control widgets. Fixing this will requires a larger, separate PR ┆Issue is synchronized with this [Notion page](https://www.notion.so/PR-7550-Fix-doubled-control-application-2cb6d73d365081739a2fc40fdfb3630e) by [Unito](https://www.unito.io)

Closes #7095 ┆Issue is synchronized with this [Notion page](https://www.notion.so/PR-7539-Fix-widget-reactivity-2cb6d73d3650816d8977ebda35ab88b9) by [Unito](https://www.unito.io)

comfy-pr-bot · 2025-12-20T20:22:01Z

@AustinMroz Successfully backported to #7675

comfy-pr-bot · 2025-12-20T20:22:05Z

@AustinMroz Successfully backported to #7676

Backport of #7539 to `cloud/1.35` Automatically created by backport workflow. ┆Issue is synchronized with this [Notion page](https://www.notion.so/PR-7676-backport-cloud-1-35-Fix-widget-reactivity-2cf6d73d365081948570c4517e1ad776) by [Unito](https://www.unito.io) --------- Co-authored-by: AustinMroz <austin@comfy.org> Co-authored-by: github-actions <github-actions@github.com>

Backport of #7539 to `core/1.35` Automatically created by backport workflow. ┆Issue is synchronized with this [Notion page](https://www.notion.so/PR-7675-backport-core-1-35-Fix-widget-reactivity-2cf6d73d365081bb8521d4826d16debb) by [Unito](https://www.unito.io) --------- Co-authored-by: AustinMroz <austin@comfy.org> Co-authored-by: github-actions <github-actions@github.com>

With reactivity fixed, control widgets would apply twice. This is fixed by using the litegraph implementation. Also adds control widget support for combos Followup to #7539. Known Issue: - Primitive node do not have litegraph callbacks properly setup. As a result, they will display an updated value when modified by control widgets. Fixing this will requires a larger, separate PR ┆Issue is synchronized with this [Notion page](https://www.notion.so/PR-7550-Fix-doubled-control-application-2cb6d73d365081739a2fc40fdfb3630e) by [Unito](https://www.unito.io)

Closes #7095 ┆Issue is synchronized with this [Notion page](https://www.notion.so/PR-7539-Fix-widget-reactivity-2cb6d73d3650816d8977ebda35ab88b9) by [Unito](https://www.unito.io)

With reactivity fixed, control widgets would apply twice. This is fixed by using the litegraph implementation. Also adds control widget support for combos Followup to #7539. Known Issue: - Primitive node do not have litegraph callbacks properly setup. As a result, they will display an updated value when modified by control widgets. Fixing this will requires a larger, separate PR ┆Issue is synchronized with this [Notion page](https://www.notion.so/PR-7550-Fix-doubled-control-application-2cb6d73d365081739a2fc40fdfb3630e) by [Unito](https://www.unito.io)

Fix widget reactivity

a433c53

AustinMroz requested a review from a team as a code owner December 16, 2025 03:12

dosubot bot added the size:XS This PR changes 0-9 lines, ignoring generated files. label Dec 16, 2025

DrJKL approved these changes Dec 16, 2025

View reviewed changes

AustinMroz merged commit 4e257be into main Dec 16, 2025
32 checks passed

AustinMroz deleted the austin/reactive-widgets branch December 16, 2025 04:11

coderabbitai bot mentioned this pull request Dec 16, 2025

Make node inputs reactive in vue #7546

Merged

AustinMroz mentioned this pull request Dec 16, 2025

Fix doubled control application #7550

Merged

coderabbitai bot mentioned this pull request Dec 17, 2025

Ensure widgets always get a single callback #7579

Merged

christian-byrne added needs-backport Fix/change that needs to be cherry-picked to the current feature freeze branch core/1.35 labels Dec 20, 2025

comfy-pr-bot mentioned this pull request Dec 20, 2025

[backport core/1.35] Fix widget reactivity #7675

Merged

comfy-pr-bot mentioned this pull request Dec 20, 2025

[backport cloud/1.35] Fix widget reactivity #7676

Merged

github-actions bot removed the needs-backport Fix/change that needs to be cherry-picked to the current feature freeze branch label Dec 20, 2025

Yourz pushed a commit that referenced this pull request Dec 24, 2025

Fix widget reactivity (#7539)

167893f

Closes #7095 ┆Issue is synchronized with this [Notion page](https://www.notion.so/PR-7539-Fix-widget-reactivity-2cb6d73d3650816d8977ebda35ab88b9) by [Unito](https://www.unito.io)

christian-byrne mentioned this pull request Jan 5, 2026

Bump comfyui-frontend-package to 1.36.13 Comfy-Org/ComfyUI#11645

Merged

This was referenced Jan 20, 2026

Frontend code for custom number nodes #7768

Merged

Further number widget fixes #8251

Merged

Provide feedback

Saved searches

Use saved searches to filter your results more quickly

Fix widget reactivity#7539

Fix widget reactivity#7539
AustinMroz merged 1 commit intomainfrom
austin/reactive-widgets

AustinMroz commented Dec 16, 2025 •

edited by sync-by-unito bot

Loading

Uh oh!

coderabbitai bot commented Dec 16, 2025 •

edited

Loading

Walkthrough

Changes

Uh oh!

github-actions bot commented Dec 16, 2025 •

edited

Loading

Uh oh!

github-actions bot commented Dec 16, 2025 •

edited

Loading

Uh oh!

github-actions bot commented Dec 16, 2025

Uh oh!

AustinMroz commented Dec 16, 2025

Uh oh!

Uh oh!

comfy-pr-bot commented Dec 20, 2025

Uh oh!

comfy-pr-bot commented Dec 20, 2025

Uh oh!

Reviewers

Assignees

Labels

Projects

Milestone

Development

Uh oh!

4 participants

Conversation

AustinMroz commented Dec 16, 2025 • edited by sync-by-unito bot Loading Uh oh! There was an error while loading. Please reload this page.

Uh oh!

Uh oh!

coderabbitai bot commented Dec 16, 2025 • edited Loading Uh oh! There was an error while loading. Please reload this page.

Uh oh!

Walkthrough

Changes

Pre-merge checks and finishing touches

Uh oh!

github-actions bot commented Dec 16, 2025 • edited Loading Uh oh! There was an error while loading. Please reload this page.

Uh oh!

🎭 Playwright Test Results

📈 Summary

📊 Test Reports by Browser

Uh oh!

github-actions bot commented Dec 16, 2025 • edited Loading Uh oh! There was an error while loading. Please reload this page.

Uh oh!

🎨 Storybook Build Status

🔗 Links

Uh oh!

github-actions bot commented Dec 16, 2025

Bundle Size Report

Uh oh!

AustinMroz commented Dec 16, 2025

Uh oh!

Uh oh!

comfy-pr-bot commented Dec 20, 2025

Uh oh!

comfy-pr-bot commented Dec 20, 2025

Uh oh!

Reviewers

Assignees

Labels

Projects

Milestone

Development

Uh oh!

4 participants

AustinMroz commented Dec 16, 2025 •

edited by sync-by-unito bot

Loading

coderabbitai bot commented Dec 16, 2025 •

edited

Loading

github-actions bot commented Dec 16, 2025 •

edited

Loading

github-actions bot commented Dec 16, 2025 •

edited

Loading