diff --git a/src/schemas/apiSchema.ts b/src/schemas/apiSchema.ts index 985bf9321a..aeb3522cdb 100644 --- a/src/schemas/apiSchema.ts +++ b/src/schemas/apiSchema.ts @@ -21,6 +21,7 @@ const zOutputs = z .object({ audio: z.array(zResultItem).optional(), images: z.array(zResultItem).optional(), + video: z.array(zResultItem).optional(), animated: z.array(z.boolean()).optional() }) .passthrough() diff --git a/src/stores/queueStore.ts b/src/stores/queueStore.ts index ef5ca057b4..413616b013 100644 --- a/src/stores/queueStore.ts +++ b/src/stores/queueStore.ts @@ -89,23 +89,23 @@ export class ResultItemImpl { } get htmlVideoType(): string | undefined { - const defaultType = undefined - - if (!this.isVhsFormat) { - return defaultType - } - - if (this.format?.endsWith('webm')) { + if (this.isWebm) { return 'video/webm' } - if (this.format?.endsWith('mp4')) { - return 'video/mp4' + + if (this.isVhsFormat) { + if (this.format?.endsWith('webm')) { + return 'video/webm' + } + if (this.format?.endsWith('mp4')) { + return 'video/mp4' + } } - return defaultType + return } get isVideo(): boolean { - return !this.isImage && !!this.format?.startsWith('video/') + return this.mediaType === 'video' || !!this.format?.startsWith('video/') } get isGif(): boolean { @@ -116,6 +116,10 @@ export class ResultItemImpl { return this.filename.endsWith('.webp') } + get isWebm(): boolean { + return this.filename.endsWith('.webm') + } + get isImage(): boolean { return this.mediaType === 'images' || this.isGif || this.isWebp } diff --git a/tests-ui/tests/store/queueStore.test.ts b/tests-ui/tests/store/queueStore.test.ts index 5d5d569706..b603f9ea12 100644 --- a/tests-ui/tests/store/queueStore.test.ts +++ b/tests-ui/tests/store/queueStore.test.ts @@ -41,4 +41,55 @@ describe('TaskItemImpl', () => { expect(taskItem.outputs['node-1'].images).toBeDefined() expect(taskItem.outputs['node-1'].images[0].filename).toBe('test.png') }) + + it('should recognize webm video from core', () => { + const taskItem = new TaskItemImpl( + 'History', + [0, 'prompt-id', {}, {}, []], + { status_str: 'success', messages: [] }, + { + 'node-1': { + video: [{ filename: 'test.webm', type: 'output', subfolder: '' }] + } + } + ) + + const output = taskItem.flatOutputs[0] + + expect(output.htmlVideoType).toBe('video/webm') + expect(output.isVideo).toBe(true) + expect(output.isWebm).toBe(true) + expect(output.isVhsFormat).toBe(false) + expect(output.isImage).toBe(false) + }) + + // https://github.com/Kosinkadink/ComfyUI-VideoHelperSuite/blob/0a75c7958fe320efcb052f1d9f8451fd20c730a8/videohelpersuite/nodes.py#L578-L590 + it('should recognize webm video from VHS', () => { + const taskItem = new TaskItemImpl( + 'History', + [0, 'prompt-id', {}, {}, []], + { status_str: 'success', messages: [] }, + { + 'node-1': { + gifs: [ + { + filename: 'test.webm', + type: 'output', + subfolder: '', + format: 'video/webm', + frame_rate: 30 + } + ] + } + } + ) + + const output = taskItem.flatOutputs[0] + + expect(output.htmlVideoType).toBe('video/webm') + expect(output.isVideo).toBe(true) + expect(output.isWebm).toBe(true) + expect(output.isVhsFormat).toBe(true) + expect(output.isImage).toBe(false) + }) })