Comfy-Org/ComfyUI_frontend
1
0
Fork 0
mirror of https://github.com/Comfy-Org/ComfyUI_frontend.git synced 2026-02-04 07:00:23 +00:00
Code Issues Packages Projects Releases Wiki Activity

[bugfix] Remove placeholder IMAGE widget to restore previous functionality (#5349)

Browse Source 
* Remove IMAGE widget

* Remove IMAGE widget test expectations
This commit is contained in:
Benjamin Lu
2025-09-04 10:33:02 -07:00
committed by GitHub
parent c6fc8e6f0f
commit 969c8e6325
6 changed files with 0 additions and 60 deletions
Download Patch File Download Diff File Expand all files Collapse all files

29
src/renderer/extensions/vueNodes/widgets/components/WidgetImage.vue
View File

@@ -1,29 +0,0 @@
<template>
<div class="flex flex-col gap-1">
<label v-if="widget.name" class="text-sm opacity-80">{{
widget.name
}}</label>
<Image v-bind="filteredProps" :src="widget.value" />
</div>
</template>
<script setup lang="ts">
import Image from 'primevue/image'
import { computed } from 'vue'
import type { SimplifiedWidget } from '@/types/simplifiedWidget'
import {
IMAGE_EXCLUDED_PROPS,
filterWidgetProps
} from '@/utils/widgetPropFilter'
// Image widgets typically don't have v-model, they display a source URL/path
const props = defineProps<{
widget: SimplifiedWidget<string>
readonly?: boolean
}>()
const filteredProps = computed(() =>
filterWidgetProps(props.widget.options, IMAGE_EXCLUDED_PROPS)
)
</script>

20
src/renderer/extensions/vueNodes/widgets/composables/useImageWidget.ts
View File

@@ -1,20 +0,0 @@
import type { LGraphNode } from '@/lib/litegraph/src/litegraph'
import type { IImageWidget } from '@/lib/litegraph/src/types/widgets'
import type {
ImageInputSpec,
InputSpec as InputSpecV2
} from '@/schemas/nodeDef/nodeDefSchemaV2'
import type { ComfyWidgetConstructorV2 } from '@/scripts/widgets'
export const useImageWidget = (): ComfyWidgetConstructorV2 => {
return (node: LGraphNode, inputSpec: InputSpecV2): IImageWidget => {
const { name, options = {} } = inputSpec as ImageInputSpec
const widget = node.addWidget('image', name, '', () => {}, {
serialize: true,
...options
}) as IImageWidget
return widget
}
}

2
src/renderer/extensions/vueNodes/widgets/composables/useWidgetRenderer.ts
View File

@@ -38,8 +38,6 @@ const TYPE_TO_ENUM_MAP: Record<string, string> = {
// Advanced widgets
color: WidgetType.COLOR,
COLOR: WidgetType.COLOR,
image: WidgetType.IMAGE,
IMAGE: WidgetType.IMAGE,
imagecompare: WidgetType.IMAGECOMPARE,
IMAGECOMPARE: WidgetType.IMAGECOMPARE,
galleria: WidgetType.GALLERIA,

2
src/renderer/extensions/vueNodes/widgets/registry/widgetRegistry.ts
View File

@@ -9,7 +9,6 @@ import WidgetChart from '../components/WidgetChart.vue'
import WidgetColorPicker from '../components/WidgetColorPicker.vue'
import WidgetFileUpload from '../components/WidgetFileUpload.vue'
import WidgetGalleria from '../components/WidgetGalleria.vue'
import WidgetImage from '../components/WidgetImage.vue'
import WidgetImageCompare from '../components/WidgetImageCompare.vue'
import WidgetInputText from '../components/WidgetInputText.vue'
import WidgetMarkdown from '../components/WidgetMarkdown.vue'
@@ -67,7 +66,6 @@ export const widgetTypeToComponent: Record<string, Component> = {
[WidgetType.TEXTAREA]: WidgetTextarea,
[WidgetType.TOGGLESWITCH]: WidgetToggleSwitch,
[WidgetType.CHART]: WidgetChart,
[WidgetType.IMAGE]: WidgetImage,
[WidgetType.IMAGECOMPARE]: WidgetImageCompare,
[WidgetType.GALLERIA]: WidgetGalleria,
[WidgetType.FILEUPLOAD]: WidgetFileUpload,

2
src/scripts/widgets.ts
View File

@@ -14,7 +14,6 @@ import { useFloatWidget } from '@/renderer/extensions/vueNodes/widgets/composabl
import { useGalleriaWidget } from '@/renderer/extensions/vueNodes/widgets/composables/useGalleriaWidget'
import { useImageCompareWidget } from '@/renderer/extensions/vueNodes/widgets/composables/useImageCompareWidget'
import { useImageUploadWidget } from '@/renderer/extensions/vueNodes/widgets/composables/useImageUploadWidget'
import { useImageWidget } from '@/renderer/extensions/vueNodes/widgets/composables/useImageWidget'
import { useIntWidget } from '@/renderer/extensions/vueNodes/widgets/composables/useIntWidget'
import { useMarkdownWidget } from '@/renderer/extensions/vueNodes/widgets/composables/useMarkdownWidget'
import { useMultiSelectWidget } from '@/renderer/extensions/vueNodes/widgets/composables/useMultiSelectWidget'
@@ -301,7 +300,6 @@ export const ComfyWidgets: Record<string, ComfyWidgetConstructor> = {
IMAGEUPLOAD: useImageUploadWidget(),
FILEUPLOAD: transformWidgetConstructorV2ToV1(useFileUploadWidget()),
COLOR: transformWidgetConstructorV2ToV1(useColorWidget()),
IMAGE: transformWidgetConstructorV2ToV1(useImageWidget()),
IMAGECOMPARE: transformWidgetConstructorV2ToV1(useImageCompareWidget()),
TREESELECT: transformWidgetConstructorV2ToV1(useTreeSelectWidget()),
MULTISELECT: transformWidgetConstructorV2ToV1(useMultiSelectWidget()),

5
tests-ui/tests/renderer/extensions/vueNodes/widgets/composables/useWidgetRenderer.test.ts
View File

@@ -66,11 +66,6 @@ describe('useWidgetRenderer', () => {
expect(getWidgetComponent('COLOR')).toBe(WidgetType.COLOR)
})
it('should map image types to IMAGE widget', () => {
expect(getWidgetComponent('image')).toBe(WidgetType.IMAGE)
expect(getWidgetComponent('IMAGE')).toBe(WidgetType.IMAGE)
})
it('should map file types to FILEUPLOAD widget', () => {
expect(getWidgetComponent('file')).toBe(WidgetType.FILEUPLOAD)
expect(getWidgetComponent('FILEUPLOAD')).toBe(WidgetType.FILEUPLOAD)