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

fix: browser_tests Phase 2 - null assertions

Browse Source 
Amp-Thread-ID: https://ampcode.com/threads/T-019c1797-ff0a-7418-840b-8c76fb81eeec
Co-authored-by: Amp <amp@ampcode.com>
This commit is contained in:
Alexander Brown
2026-01-31 21:17:24 -08:00
parent b56045c462
commit 302e9d5be7
11 changed files with 115 additions and 109 deletions
Download Patch File Download Diff File Expand all files Collapse all files

10
browser_tests/fixtures/helpers/SubgraphHelper.ts
View File

@@ -28,7 +28,7 @@ export class SubgraphHelper {
async (params) => {
const { slotType, action, targetSlotName } = params
const app = window.app!
const currentGraph = app.canvas.graph
const currentGraph = app.canvas!.graph!
// Check if we're in a subgraph
if (currentGraph.constructor.name !== 'Subgraph') {
@@ -242,7 +242,7 @@ export class SubgraphHelper {
? await targetSlot.getPosition() // Connect to existing slot
: await targetSlot.getOpenSlotPosition() // Create new slot
await this.comfyPage.dragDrop(
await this.comfyPage.canvasOps.dragAndDrop(
await sourceSlot.getPosition(),
targetPosition
)
@@ -267,7 +267,7 @@ export class SubgraphHelper {
const targetPosition = await targetSlot.getPosition()
await this.comfyPage.dragDrop(sourcePosition, targetPosition)
await this.comfyPage.canvasOps.dragAndDrop(sourcePosition, targetPosition)
await this.comfyPage.nextFrame()
}
@@ -287,7 +287,7 @@ export class SubgraphHelper {
? await targetSlot.getPosition() // Connect to existing slot
: await targetSlot.getOpenSlotPosition() // Create new slot
await this.comfyPage.dragDrop(
await this.comfyPage.canvasOps.dragAndDrop(
await sourceSlot.getPosition(),
targetPosition
)
@@ -310,7 +310,7 @@ export class SubgraphHelper {
? await sourceSlot.getPosition() // Connect from existing slot
: await sourceSlot.getOpenSlotPosition() // Create new slot
await this.comfyPage.dragDrop(
await this.comfyPage.canvasOps.dragAndDrop(
sourcePosition,
await targetSlot.getPosition()
)

66
browser_tests/fixtures/utils/litegraphUtils.ts
View File

@@ -23,7 +23,7 @@ export class SubgraphSlotReference {
async getPosition(): Promise<Position> {
const pos: [number, number] = await this.comfyPage.page.evaluate(
([type, slotName]) => {
const currentGraph = window.app!.canvas.graph
const currentGraph = window.app!.canvas.graph!
// Check if we're in a subgraph
if (currentGraph.constructor.name !== 'Subgraph') {
@@ -33,14 +33,16 @@ export class SubgraphSlotReference {
}
const slots =
type === 'input' ? currentGraph.inputs : currentGraph.outputs
type === 'input'
? (currentGraph as any).inputs
: (currentGraph as any).outputs
if (!slots || slots.length === 0) {
throw new Error(`No ${type} slots found in subgraph`)
}
// Find the specific slot or use the first one if no name specified
const slot = slotName
? slots.find((s) => s.name === slotName)
? slots.find((s: any) => s.name === slotName)
: slots[0]
if (!slot) {
@@ -70,7 +72,7 @@ export class SubgraphSlotReference {
async getOpenSlotPosition(): Promise<Position> {
const pos: [number, number] = await this.comfyPage.page.evaluate(
([type]) => {
const currentGraph = window.app!.canvas.graph
const currentGraph = window.app!.canvas.graph!
if (currentGraph.constructor.name !== 'Subgraph') {
throw new Error(
@@ -79,7 +81,9 @@ export class SubgraphSlotReference {
}
const node =
type === 'input' ? currentGraph.inputNode : currentGraph.outputNode
type === 'input'
? (currentGraph as any).inputNode
: (currentGraph as any).outputNode
if (!node) {
throw new Error(`No ${type} node found in subgraph`)
@@ -112,11 +116,12 @@ class NodeSlotReference {
const pos: [number, number] = await this.node.comfyPage.page.evaluate(
([type, id, index]) => {
// Use canvas.graph to get the current graph (works in both main graph and subgraphs)
const node = window.app!.canvas.graph.getNodeById(id)
const node = window.app!.canvas.graph!.getNodeById(id)
if (!node) throw new Error(`Node ${id} not found.`)
const rawPos = node.getConnectionPos(type === 'input', index)
const convertedPos = window.app!.canvas.ds.convertOffsetToCanvas(rawPos)
const convertedPos =
window.app!.canvas.ds!.convertOffsetToCanvas(rawPos)
// Debug logging - convert Float64Arrays to regular arrays for visibility
console.warn(
@@ -126,7 +131,7 @@ class NodeSlotReference {
nodeSize: [node.size[0], node.size[1]],
rawConnectionPos: [rawPos[0], rawPos[1]],
convertedPos: [convertedPos[0], convertedPos[1]],
currentGraphType: window.app!.canvas.graph.constructor.name
currentGraphType: window.app!.canvas.graph!.constructor.name
}
)
@@ -142,7 +147,7 @@ class NodeSlotReference {
async getLinkCount() {
return await this.node.comfyPage.page.evaluate(
([type, id, index]) => {
const node = window.app!.canvas.graph.getNodeById(id)
const node = window.app!.canvas.graph!.getNodeById(id)
if (!node) throw new Error(`Node ${id} not found.`)
if (type === 'input') {
return node.inputs[index].link == null ? 0 : 1
@@ -155,7 +160,7 @@ class NodeSlotReference {
async removeLinks() {
await this.node.comfyPage.page.evaluate(
([type, id, index]) => {
const node = window.app!.canvas.graph.getNodeById(id)
const node = window.app!.canvas.graph!.getNodeById(id)
if (!node) throw new Error(`Node ${id} not found.`)
if (type === 'input') {
node.disconnectInput(index)
@@ -180,15 +185,15 @@ class NodeWidgetReference {
async getPosition(): Promise<Position> {
const pos: [number, number] = await this.node.comfyPage.page.evaluate(
([id, index]) => {
const node = window.app!.canvas.graph.getNodeById(id)
const node = window.app!.canvas.graph!.getNodeById(id)
if (!node) throw new Error(`Node ${id} not found.`)
const widget = node.widgets[index]
const widget = node.widgets![index]
if (!widget) throw new Error(`Widget ${index} not found.`)
const [x, y, w, _h] = node.getBounding()
return window.app!.canvasPosToClientPos([
x + w / 2,
y + window.LiteGraph!['NODE_TITLE_HEIGHT'] + widget.last_y + 1
y + window.LiteGraph!['NODE_TITLE_HEIGHT'] + widget.last_y! + 1
])
},
[this.node.id, this.index] as const
@@ -205,9 +210,9 @@ class NodeWidgetReference {
async getSocketPosition(): Promise<Position> {
const pos: [number, number] = await this.node.comfyPage.page.evaluate(
([id, index]) => {
const node = window.app!.graph.getNodeById(id)
const node = window.app!.graph!.getNodeById(id)
if (!node) throw new Error(`Node ${id} not found.`)
const widget = node.widgets[index]
const widget = node.widgets![index]
if (!widget) throw new Error(`Widget ${index} not found.`)
const slot = node.inputs.find(
@@ -217,8 +222,8 @@ class NodeWidgetReference {
const [x, y] = node.getBounding()
return window.app!.canvasPosToClientPos([
x + slot.pos[0],
y + slot.pos[1] + window.LiteGraph!['NODE_TITLE_HEIGHT']
x + slot.pos![0],
y + slot.pos![1] + window.LiteGraph!['NODE_TITLE_HEIGHT']
])
},
[this.node.id, this.index] as const
@@ -239,7 +244,7 @@ class NodeWidgetReference {
const pos = await this.getPosition()
const canvas = this.node.comfyPage.canvas
const canvasPos = (await canvas.boundingBox())!
await this.node.comfyPage.dragDrop(
await this.node.comfyPage.canvasOps.dragAndDrop(
{
x: canvasPos.x + pos.x,
y: canvasPos.y + pos.y
@@ -254,9 +259,9 @@ class NodeWidgetReference {
async getValue() {
return await this.node.comfyPage.page.evaluate(
([id, index]) => {
const node = window.app!.graph.getNodeById(id)
const node = window.app!.graph!.getNodeById(id)
if (!node) throw new Error(`Node ${id} not found.`)
const widget = node.widgets[index]
const widget = node.widgets![index]
if (!widget) throw new Error(`Widget ${index} not found.`)
return widget.value
},
@@ -271,7 +276,7 @@ export class NodeReference {
) {}
async exists(): Promise<boolean> {
return await this.comfyPage.page.evaluate((id) => {
const node = window.app!.canvas.graph.getNodeById(id)
const node = window.app!.canvas.graph!.getNodeById(id)
return !!node
}, this.id)
}
@@ -288,12 +293,11 @@ export class NodeReference {
}
}
async getBounding(): Promise<Position & Size> {
const [x, y, width, height]: [number, number, number, number] =
await this.comfyPage.page.evaluate((id) => {
const node = window.app!.canvas.graph.getNodeById(id)
if (!node) throw new Error('Node not found')
return node.getBounding()
}, this.id)
const [x, y, width, height] = await this.comfyPage.page.evaluate((id) => {
const node = window.app!.canvas.graph!.getNodeById(id)
if (!node) throw new Error('Node not found')
return [...node.getBounding()] as [number, number, number, number]
}, this.id)
return {
x,
y,
@@ -328,9 +332,9 @@ export class NodeReference {
async getProperty<T>(prop: string): Promise<T> {
return await this.comfyPage.page.evaluate(
([id, prop]) => {
const node = window.app!.canvas.graph.getNodeById(id)
const node = window.app!.canvas.graph!.getNodeById(id)
if (!node) throw new Error('Node not found')
return node[prop]
return (node as unknown as Record<string, T>)[prop]
},
[this.id, prop] as const
)
@@ -389,7 +393,7 @@ export class NodeReference {
) {
const originSlot = await this.getOutput(originSlotIndex)
const targetWidget = await targetNode.getWidget(targetWidgetIndex)
await this.comfyPage.dragDrop(
await this.comfyPage.canvasOps.dragAndDrop(
await originSlot.getPosition(),
await targetWidget.getSocketPosition()
)
@@ -402,7 +406,7 @@ export class NodeReference {
) {
const originSlot = await this.getOutput(originSlotIndex)
const targetSlot = await targetNode.getInput(targetSlotIndex)
await this.comfyPage.dragDrop(
await this.comfyPage.canvasOps.dragAndDrop(
await originSlot.getPosition(),
await targetSlot.getPosition()
)

4
browser_tests/helpers/actionbar.ts
View File

@@ -42,13 +42,13 @@ class ComfyQueueButtonOptions {
public async setMode(mode: AutoQueueMode) {
await this.page.evaluate((mode) => {
window.app.extensionManager.queueSettings.mode = mode
window.app!.extensionManager.queueSettings.mode = mode
}, mode)
}
public async getMode() {
return await this.page.evaluate(() => {
return window.app.extensionManager.queueSettings.mode
return window.app!.extensionManager.queueSettings.mode
})
}
}

2
browser_tests/helpers/templates.ts
View File

@@ -33,7 +33,7 @@ export class ComfyTemplates {
async getAllTemplates(): Promise<TemplateInfo[]> {
const templates: WorkflowTemplates[] = await this.page.evaluate(() =>
window.app.api.getCoreWorkflowTemplates()
window.app!.api.getCoreWorkflowTemplates()
)
return templates.flatMap((t) => t.templates)
}

9
browser_tests/tests/actionbar.spec.ts
View File

@@ -52,10 +52,11 @@ test.describe('Actionbar', { tag: '@ui' }, () => {
const node = window.app!.graph!._nodes.find(
(n) => n.type === 'EmptyLatentImage'
)
node.widgets[0].value = value
window[
'app'
].extensionManager.workflow.activeWorkflow.changeTracker.checkState()
node!.widgets![0].value = value
;(
window.app!.extensionManager as any
).workflow.activeWorkflow.changeTracker.checkState()
}, value)
}

15
browser_tests/tests/groupNode.spec.ts
View File

@@ -2,6 +2,7 @@ import { expect } from '@playwright/test'
import type { ComfyPage } from '../fixtures/ComfyPage'
import { comfyPageFixture as test } from '../fixtures/ComfyPage'
import type { NodeLibrarySidebarTab } from '../fixtures/components/SidebarTab'
import { DefaultGraphPositions } from '../fixtures/constants/defaultGraphPositions'
import type { NodeReference } from '../fixtures/utils/litegraphUtils'
@@ -14,7 +15,7 @@ test.describe('Group Node', { tag: '@node' }, () => {
const groupNodeName = 'DefautWorkflowGroupNode'
const groupNodeCategory = 'group nodes>workflow'
const groupNodeBookmarkName = `workflow>${groupNodeName}`
let libraryTab
let libraryTab: NodeLibrarySidebarTab
test.beforeEach(async ({ comfyPage }) => {
await comfyPage.settings.setSetting('Comfy.UseNewMenu', 'Top')
@@ -119,7 +120,7 @@ test.describe('Group Node', { tag: '@node' }, () => {
test('Manage group opens with the correct group selected', async ({
comfyPage
}) => {
const makeGroup = async (name, type1, type2) => {
const makeGroup = async (name: string, type1: string, type2: string) => {
const node1 = (await comfyPage.nodeOps.getNodeRefsByType(type1))[0]
const node2 = (await comfyPage.nodeOps.getNodeRefsByType(type2))[0]
await node1.click('title')
@@ -161,15 +162,13 @@ test.describe('Group Node', { tag: '@node' }, () => {
const {
extra: { groupNodes }
} = window.app!.graph!
const { nodes } = groupNodes[nodeName]
return nodes.reduce((acc: number, node) => {
return acc + node.inputs.length
}, 0)
const { nodes } = groupNodes![nodeName]
return nodes.reduce((acc, node) => acc + (node.inputs?.length ?? 0), 0)
}, groupNodeName)
const visibleInputCount = await comfyPage.page.evaluate((id) => {
const node = window.app!.graph!.getNodeById(id)
return node.inputs.length
return node!.inputs.length
}, groupNodeId)
// Verify there are 4 total inputs (2 VAE decode nodes with 2 inputs each)
@@ -314,7 +313,7 @@ test.describe('Group Node', { tag: '@node' }, () => {
await test.step('Load workflow containing a group node pasted from a different workflow', async () => {
await comfyPage.page.evaluate(
(workflow) => window.app!.loadGraphData(workflow),
(workflow) => window.app!.loadGraphData(workflow as any),
currentGraphState
)
await comfyPage.nextFrame()

8
browser_tests/tests/remoteWidgets.spec.ts
View File

@@ -27,22 +27,22 @@ test.describe('Remote COMBO Widget', { tag: '@widget' }, () => {
): Promise<string[] | undefined> => {
return await comfyPage.page.evaluate((name) => {
const node = window.app!.graph!.nodes.find((node) => node.title === name)
return node.widgets[0].options.values
return node!.widgets![0].options.values as string[] | undefined
}, nodeName)
}
const getWidgetValue = async (comfyPage: ComfyPage, nodeName: string) => {
return await comfyPage.page.evaluate((name) => {
const node = window.app!.graph!.nodes.find((node) => node.title === name)
return node.widgets[0].value
return node!.widgets![0].value
}, nodeName)
}
const clickRefreshButton = (comfyPage: ComfyPage, nodeName: string) => {
return comfyPage.page.evaluate((name) => {
const node = window.app!.graph!.nodes.find((node) => node.title === name)
const buttonWidget = node.widgets.find((w) => w.name === 'refresh')
return buttonWidget?.callback()
const buttonWidget = node!.widgets!.find((w) => w.name === 'refresh')
return buttonWidget?.callback?.(buttonWidget.value)
}, nodeName)
}

2
browser_tests/tests/selectionToolboxSubmenus.spec.ts
View File

@@ -28,7 +28,7 @@ test.describe(
// Drag the KSampler to the center of the screen
const nodePos = await ksamplerNodes[0].getPosition()
const viewportSize = comfyPage.page.viewportSize()
const viewportSize = comfyPage.page.viewportSize()!
const centerX = viewportSize.width / 3
const centerY = viewportSize.height / 2
await comfyPage.canvasOps.dragAndDrop(

16
browser_tests/tests/subgraph-rename-dialog.spec.ts
View File

@@ -26,8 +26,8 @@ test.describe('Subgraph Slot Rename Dialog', { tag: '@subgraph' }, () => {
// Get initial slot label
const initialInputLabel = await comfyPage.page.evaluate(() => {
const graph = window.app!.canvas.graph
return graph.inputs?.[0]?.label || graph.inputs?.[0]?.name || null
const graph = window.app!.canvas.graph as any
return graph?.inputs?.[0]?.label || graph?.inputs?.[0]?.name || null
})
// First rename
@@ -55,8 +55,8 @@ test.describe('Subgraph Slot Rename Dialog', { tag: '@subgraph' }, () => {
// Verify the rename worked
const afterFirstRename = await comfyPage.page.evaluate(() => {
const graph = window.app!.canvas.graph
const slot = graph.inputs?.[0]
const graph = window.app!.canvas.graph as any
const slot = graph?.inputs?.[0]
return {
label: slot?.label || null,
name: slot?.name || null,
@@ -98,8 +98,8 @@ test.describe('Subgraph Slot Rename Dialog', { tag: '@subgraph' }, () => {
// Verify the second rename worked
const afterSecondRename = await comfyPage.page.evaluate(() => {
const graph = window.app!.canvas.graph
return graph.inputs?.[0]?.label || null
const graph = window.app!.canvas.graph as any
return graph?.inputs?.[0]?.label || null
})
expect(afterSecondRename).toBe(SECOND_RENAMED_NAME)
})
@@ -114,8 +114,8 @@ test.describe('Subgraph Slot Rename Dialog', { tag: '@subgraph' }, () => {
// Get initial output slot label
const initialOutputLabel = await comfyPage.page.evaluate(() => {
const graph = window.app!.canvas.graph
return graph.outputs?.[0]?.label || graph.outputs?.[0]?.name || null
const graph = window.app!.canvas.graph as any
return graph?.outputs?.[0]?.label || graph?.outputs?.[0]?.name || null
})
// First rename

67
browser_tests/tests/subgraph.spec.ts
View File

@@ -26,8 +26,8 @@ test.describe('Subgraph Operations', { tag: ['@slow', '@subgraph'] }, () => {
comfyPage: typeof test.prototype.comfyPage,
type: 'inputs' | 'outputs'
): Promise<number> {
return await comfyPage.page.evaluate((slotType) => {
return window.app!.canvas.graph[slotType]?.length || 0
return await comfyPage.page.evaluate((slotType: 'inputs' | 'outputs') => {
return (window.app!.canvas.graph as any)?.[slotType]?.length || 0
}, type)
}
@@ -36,7 +36,7 @@ test.describe('Subgraph Operations', { tag: ['@slow', '@subgraph'] }, () => {
comfyPage: typeof test.prototype.comfyPage
): Promise<number> {
return await comfyPage.page.evaluate(() => {
return window.app!.canvas.graph.nodes?.length || 0
return window.app!.canvas.graph!.nodes?.length || 0
})
}
@@ -132,8 +132,8 @@ test.describe('Subgraph Operations', { tag: ['@slow', '@subgraph'] }, () => {
await subgraphNode.navigateIntoSubgraph()
const initialInputLabel = await comfyPage.page.evaluate(() => {
const graph = window.app!.canvas.graph
return graph.inputs?.[0]?.label || null
const graph = window.app!.canvas.graph as any
return graph?.inputs?.[0]?.label || null
})
await comfyPage.subgraph.rightClickInputSlot(initialInputLabel)
@@ -151,8 +151,8 @@ test.describe('Subgraph Operations', { tag: ['@slow', '@subgraph'] }, () => {
await comfyPage.nextFrame()
const newInputName = await comfyPage.page.evaluate(() => {
const graph = window.app!.canvas.graph
return graph.inputs?.[0]?.label || null
const graph = window.app!.canvas.graph as any
return graph?.inputs?.[0]?.label || null
})
expect(newInputName).toBe(RENAMED_INPUT_NAME)
@@ -166,8 +166,8 @@ test.describe('Subgraph Operations', { tag: ['@slow', '@subgraph'] }, () => {
await subgraphNode.navigateIntoSubgraph()
const initialInputLabel = await comfyPage.page.evaluate(() => {
const graph = window.app!.canvas.graph
return graph.inputs?.[0]?.label || null
const graph = window.app!.canvas.graph as any
return graph?.inputs?.[0]?.label || null
})
await comfyPage.subgraph.doubleClickInputSlot(initialInputLabel)
@@ -183,8 +183,8 @@ test.describe('Subgraph Operations', { tag: ['@slow', '@subgraph'] }, () => {
await comfyPage.nextFrame()
const newInputName = await comfyPage.page.evaluate(() => {
const graph = window.app!.canvas.graph
return graph.inputs?.[0]?.label || null
const graph = window.app!.canvas.graph as any
return graph?.inputs?.[0]?.label || null
})
expect(newInputName).toBe(RENAMED_INPUT_NAME)
@@ -198,8 +198,8 @@ test.describe('Subgraph Operations', { tag: ['@slow', '@subgraph'] }, () => {
await subgraphNode.navigateIntoSubgraph()
const initialOutputLabel = await comfyPage.page.evaluate(() => {
const graph = window.app!.canvas.graph
return graph.outputs?.[0]?.label || null
const graph = window.app!.canvas.graph as any
return graph?.outputs?.[0]?.label || null
})
await comfyPage.subgraph.doubleClickOutputSlot(initialOutputLabel)
@@ -216,8 +216,8 @@ test.describe('Subgraph Operations', { tag: ['@slow', '@subgraph'] }, () => {
await comfyPage.nextFrame()
const newOutputName = await comfyPage.page.evaluate(() => {
const graph = window.app!.canvas.graph
return graph.outputs?.[0]?.label || null
const graph = window.app!.canvas.graph as any
return graph?.outputs?.[0]?.label || null
})
expect(newOutputName).toBe(renamedOutputName)
@@ -233,8 +233,8 @@ test.describe('Subgraph Operations', { tag: ['@slow', '@subgraph'] }, () => {
await subgraphNode.navigateIntoSubgraph()
const initialInputLabel = await comfyPage.page.evaluate(() => {
const graph = window.app!.canvas.graph
return graph.inputs?.[0]?.label || null
const graph = window.app!.canvas.graph as any
return graph?.inputs?.[0]?.label || null
})
// Test that right-click still works for renaming
@@ -254,8 +254,8 @@ test.describe('Subgraph Operations', { tag: ['@slow', '@subgraph'] }, () => {
await comfyPage.nextFrame()
const newInputName = await comfyPage.page.evaluate(() => {
const graph = window.app!.canvas.graph
return graph.inputs?.[0]?.label || null
const graph = window.app!.canvas.graph as any
return graph?.inputs?.[0]?.label || null
})
expect(newInputName).toBe(rightClickRenamedName)
@@ -271,15 +271,16 @@ test.describe('Subgraph Operations', { tag: ['@slow', '@subgraph'] }, () => {
await subgraphNode.navigateIntoSubgraph()
const initialInputLabel = await comfyPage.page.evaluate(() => {
const graph = window.app!.canvas.graph
return graph.inputs?.[0]?.label || null
const graph = window.app!.canvas.graph as any
return graph?.inputs?.[0]?.label || null
})
// Use direct pointer event approach to double-click on label
await comfyPage.page.evaluate(() => {
const app = window.app
const graph = app.canvas.graph
const input = graph.inputs?.[0]
const app = window.app!
const graph = app.canvas.graph as any
const input = graph?.inputs?.[0]
if (!input?.labelPos) {
throw new Error('Could not get label position for testing')
@@ -297,17 +298,17 @@ test.describe('Subgraph Operations', { tag: ['@slow', '@subgraph'] }, () => {
stopPropagation: () => {}
}
const inputNode = graph.inputNode
const inputNode = graph?.inputNode
if (inputNode?.onPointerDown) {
inputNode.onPointerDown(
leftClickEvent,
leftClickEvent as any,
app.canvas.pointer,
app.canvas.linkConnector
)
// Trigger double-click if pointer has the handler
if (app.canvas.pointer.onDoubleClick) {
app.canvas.pointer.onDoubleClick(leftClickEvent)
app.canvas.pointer.onDoubleClick(leftClickEvent as any)
}
}
})
@@ -326,8 +327,8 @@ test.describe('Subgraph Operations', { tag: ['@slow', '@subgraph'] }, () => {
await comfyPage.nextFrame()
const newInputName = await comfyPage.page.evaluate(() => {
const graph = window.app!.canvas.graph
return graph.inputs?.[0]?.label || null
const graph = window.app!.canvas.graph as any
return graph?.inputs?.[0]?.label || null
})
expect(newInputName).toBe(labelClickRenamedName)
@@ -340,7 +341,7 @@ test.describe('Subgraph Operations', { tag: ['@slow', '@subgraph'] }, () => {
'subgraphs/subgraph-compressed-target-slot'
)
const step = await comfyPage.page.evaluate(() => {
return window.app.graph.nodes[0].widgets[0].options.step
return window.app!.graph!.nodes[0].widgets![0].options.step
})
expect(step).toBe(10)
})
@@ -350,7 +351,7 @@ test.describe('Subgraph Operations', { tag: ['@slow', '@subgraph'] }, () => {
test('Can create subgraph from selected nodes', async ({ comfyPage }) => {
await comfyPage.workflow.loadWorkflow('default')
const _initialNodeCount = await getGraphNodeCount(comfyPage)
await getGraphNodeCount(comfyPage)
await comfyPage.keyboard.selectAll()
await comfyPage.nextFrame()
@@ -459,7 +460,7 @@ test.describe('Subgraph Operations', { tag: ['@slow', '@subgraph'] }, () => {
const initialNodeCount = await getGraphNodeCount(comfyPage)
const nodesInSubgraph = await comfyPage.page.evaluate(() => {
const nodes = window.app!.canvas.graph.nodes
const nodes = window.app!.canvas.graph!.nodes
return nodes?.[0]?.id || null
})
@@ -689,7 +690,7 @@ test.describe('Subgraph Operations', { tag: ['@slow', '@subgraph'] }, () => {
// Check that the subgraph node has no widgets after removing the text slot
const widgetCount = await comfyPage.page.evaluate(() => {
return window.app!.canvas.graph.nodes[0].widgets?.length || 0
return window.app!.canvas.graph!.nodes[0].widgets?.length || 0
})
expect(widgetCount).toBe(0)

25
browser_tests/tests/widget.spec.ts
View File

@@ -61,8 +61,8 @@ test.describe('Combo text widget', { tag: ['@screenshot', '@widget'] }, () => {
return window
.app!.graph!.nodes.find(
(node) => node.title === 'Node With Optional Combo Input'
)
.widgets.find((widget) => widget.name === 'optional_combo_input')
)!
.widgets!.find((widget) => widget.name === 'optional_combo_input')!
.options.values
})
@@ -98,8 +98,9 @@ test.describe('Combo text widget', { tag: ['@screenshot', '@widget'] }, () => {
return window
.app!.graph!.nodes.find(
(node) => node.title === 'Node With V2 Combo Input'
)
.widgets.find((widget) => widget.name === 'combo_input').options.values
)!
.widgets!.find((widget) => widget.name === 'combo_input')!.options
.values
})
expect(comboValues).toEqual(['A', 'B'])
})
@@ -125,7 +126,7 @@ test.describe('Slider widget', { tag: ['@screenshot', '@widget'] }, () => {
const widget = await node.getWidget(0)
await comfyPage.page.evaluate(() => {
const widget = window.app!.graph!.nodes[0].widgets[0]
const widget = window.app!.graph!.nodes[0].widgets![0]
widget.callback = (value: number) => {
window.widgetValue = value
}
@@ -146,7 +147,7 @@ test.describe('Number widget', { tag: ['@screenshot', '@widget'] }, () => {
const node = (await comfyPage.nodeOps.getFirstNodeRef())!
const widget = await node.getWidget(0)
await comfyPage.page.evaluate(() => {
const widget = window.app!.graph!.nodes[0].widgets[0]
const widget = window.app!.graph!.nodes[0].widgets![0]
widget.callback = (value: number) => {
window.widgetValue = value
}
@@ -170,8 +171,8 @@ test.describe(
await comfyPage.workflow.loadWorkflow('nodes/single_ksampler')
await comfyPage.page.evaluate(() => {
window.graph!.nodes[0].addWidget('number', 'new_widget', 10)
window.graph!.setDirtyCanvas(true, true)
window.app!.graph!.nodes[0].addWidget('number', 'new_widget', 10, null)
window.app!.graph!.setDirtyCanvas(true, true)
})
await expect(comfyPage.canvas).toHaveScreenshot(
@@ -253,11 +254,11 @@ test.describe('Image widget', { tag: ['@screenshot', '@widget'] }, () => {
const targetNode = graph.nodes[6]
targetNode.imgs = [image1, image2]
targetNode.imageIndex = 1
app.canvas.setDirty(true)
app!.canvas.setDirty(true)
const x = targetNode.pos[0] + targetNode.size[0] - 41
const y = targetNode.pos[1] + targetNode.widgets.at(-1).last_y + 30
return app.canvasPosToClientPos([x, y])
const y = targetNode.pos[1] + targetNode.widgets!.at(-1)!.last_y! + 30
return app!.canvasPosToClientPos([x, y])
})
const clip = { x, y, width: 35, height: 35 }
@@ -354,7 +355,7 @@ test.describe(
([loadId, saveId]) => {
// Set the output of the SaveAnimatedWEBP node to equal the loader node's image
window.app!.nodeOutputs[saveId] = window.app!.nodeOutputs[loadId]
app.canvas.setDirty(true)
app!.canvas.setDirty(true)
},
[loadAnimatedWebpNode.id, saveAnimatedWebpNode.id]
)