mirror of
https://github.com/Comfy-Org/ComfyUI_frontend.git
synced 2026-07-15 11:44:10 +00:00
## Summary Move Vue widget render-only metadata out of the graph node manager and into dedicated widget render state alongside widget values. ## Changes - **What**: Adds `WidgetRenderState` in `widgetValueStore`, removes `SafeWidgetData` from `useGraphNodeManager`, and has Vue widget rendering compose from raw LiteGraph widgets plus store-backed value/render state. - **What**: Updates promoted widget, app mode, parameter panel, preview, tooltip, and widget tests for the new render-state boundary. - **What**: Hardens related browser tests against branded id typing and brittle default workflow node ids. ## Review Focus Please look closely at the ownership boundary between raw LiteGraph widgets, `WidgetState`, and `WidgetRenderState`, especially promoted widget metadata and linked-widget rendering. ## Validation - `pnpm typecheck` - `pnpm typecheck:browser` - focused widget/node unit tests - focused Playwright check for `Should display added widgets` --------- Co-authored-by: GitHub Action <action@github.com> Co-authored-by: Claude Opus 4.8 (1M context) <noreply@anthropic.com> Co-authored-by: Amp <amp@ampcode.com> Co-authored-by: github-actions <github-actions@github.com> Co-authored-by: AustinMroz <austin@comfy.org>
38 lines
980 B
JavaScript
38 lines
980 B
JavaScript
//es
|
|
// eslint-disable-next-line import-x/no-unresolved -- import is correct at time of test execution
|
|
import { app } from '../../scripts/app.js'
|
|
|
|
function legacyWidget(node, inputName, inputData) {
|
|
if (!node.widgets) node.widgets = []
|
|
const widget = {
|
|
draw: function (ctx, node, widget_width, y, H) {
|
|
ctx.save()
|
|
ctx.fillStyle = '#7F7'
|
|
ctx.fillRect(15, y, widget_width - 15 * 2, H)
|
|
ctx.restore()
|
|
},
|
|
mouse: function mouseAnnotated(event, [x, y], node) {
|
|
const widget_width = this.width || node.size[0]
|
|
if (x < 30) {
|
|
this.value--
|
|
} else if (x > widget_width - 30 && x < widget_width) {
|
|
this.value++
|
|
}
|
|
},
|
|
name: inputName,
|
|
options: {},
|
|
type: 'DEVTOOLS.LEGACYWIDGET',
|
|
value: 0,
|
|
y: 0
|
|
}
|
|
node.widgets.push(widget)
|
|
return { widget }
|
|
}
|
|
|
|
app.registerExtension({
|
|
name: 'DevTools.LegacyWidget',
|
|
async getCustomWidgets() {
|
|
return { DEVTOOLSLEGACYWIDGET: legacyWidget }
|
|
}
|
|
})
|