Browse Source
* setup ui unit tests * Refactoring, adding connections * Few tweaks * Fix type * Add general test * Refactored and extended test * move to describe * for groups * Add test for converted widgets on missing nodes + fix crash * tidy * mores tests + refactor * throw earlier to get less confusing error * support outputs * more test * add ci action * use lts node * Fix? * Prevent connecting non matching combos * update * accidently removed npm i * Disable logging extension * added step to generate object_info * fix python * install python * install deps * fix cwd? * logging * Fix double resolve * create dir * update pkgpull/1814/head
pythongosssss
1 year ago
committed by
GitHub
16 changed files with 6680 additions and 18 deletions
@ -0,0 +1,25 @@
|
||||
name: Tests CI |
||||
|
||||
on: [push, pull_request] |
||||
|
||||
jobs: |
||||
test: |
||||
runs-on: ubuntu-latest |
||||
steps: |
||||
- uses: actions/checkout@v4 |
||||
- uses: actions/setup-node@v3 |
||||
with: |
||||
node-version: 18 |
||||
- uses: actions/setup-python@v4 |
||||
with: |
||||
python-version: '3.10' |
||||
- name: Install requirements |
||||
run: | |
||||
python -m pip install --upgrade pip |
||||
pip install -r requirements.txt |
||||
- name: Run Tests |
||||
run: | |
||||
npm install |
||||
npm run test:generate |
||||
npm test |
||||
working-directory: ./tests-ui |
||||
@ -0,0 +1,14 @@
|
||||
module.exports = async function () { |
||||
global.ResizeObserver = class ResizeObserver { |
||||
observe() {} |
||||
unobserve() {} |
||||
disconnect() {} |
||||
}; |
||||
|
||||
const { nop } = require("./utils/nopProxy"); |
||||
global.enableWebGLCanvas = nop; |
||||
|
||||
HTMLCanvasElement.prototype.getContext = nop; |
||||
|
||||
localStorage["Comfy.Settings.Comfy.Logging.Enabled"] = "false"; |
||||
}; |
||||
@ -0,0 +1,9 @@
|
||||
/** @type {import('jest').Config} */ |
||||
const config = { |
||||
testEnvironment: "jsdom", |
||||
setupFiles: ["./globalSetup.js"], |
||||
clearMocks: true, |
||||
resetModules: true, |
||||
}; |
||||
|
||||
module.exports = config; |
||||
File diff suppressed because it is too large
Load Diff
@ -0,0 +1,30 @@
|
||||
{ |
||||
"name": "comfui-tests", |
||||
"version": "1.0.0", |
||||
"description": "UI tests", |
||||
"main": "index.js", |
||||
"scripts": { |
||||
"test": "jest", |
||||
"test:generate": "node setup.js" |
||||
}, |
||||
"repository": { |
||||
"type": "git", |
||||
"url": "git+https://github.com/comfyanonymous/ComfyUI.git" |
||||
}, |
||||
"keywords": [ |
||||
"comfyui", |
||||
"test" |
||||
], |
||||
"author": "comfyanonymous", |
||||
"license": "GPL-3.0", |
||||
"bugs": { |
||||
"url": "https://github.com/comfyanonymous/ComfyUI/issues" |
||||
}, |
||||
"homepage": "https://github.com/comfyanonymous/ComfyUI#readme", |
||||
"devDependencies": { |
||||
"@babel/preset-env": "^7.22.20", |
||||
"@types/jest": "^29.5.5", |
||||
"jest": "^29.7.0", |
||||
"jest-environment-jsdom": "^29.7.0" |
||||
} |
||||
} |
||||
@ -0,0 +1,87 @@
|
||||
const { spawn } = require("child_process"); |
||||
const { resolve } = require("path"); |
||||
const { existsSync, mkdirSync, writeFileSync } = require("fs"); |
||||
const http = require("http"); |
||||
|
||||
async function setup() { |
||||
// Wait up to 30s for it to start
|
||||
let success = false; |
||||
let child; |
||||
for (let i = 0; i < 30; i++) { |
||||
try { |
||||
await new Promise((res, rej) => { |
||||
http |
||||
.get("http://127.0.0.1:8188/object_info", (resp) => { |
||||
let data = ""; |
||||
resp.on("data", (chunk) => { |
||||
data += chunk; |
||||
}); |
||||
resp.on("end", () => { |
||||
// Modify the response data to add some checkpoints
|
||||
const objectInfo = JSON.parse(data); |
||||
objectInfo.CheckpointLoaderSimple.input.required.ckpt_name[0] = ["model1.safetensors", "model2.ckpt"]; |
||||
|
||||
data = JSON.stringify(objectInfo, undefined, "\t"); |
||||
|
||||
const outDir = resolve("./data"); |
||||
if (!existsSync(outDir)) { |
||||
mkdirSync(outDir); |
||||
} |
||||
|
||||
const outPath = resolve(outDir, "object_info.json"); |
||||
console.log(`Writing ${Object.keys(objectInfo).length} nodes to ${outPath}`); |
||||
writeFileSync(outPath, data, { |
||||
encoding: "utf8", |
||||
}); |
||||
res(); |
||||
}); |
||||
}) |
||||
.on("error", rej); |
||||
}); |
||||
success = true; |
||||
break; |
||||
} catch (error) { |
||||
console.log(i + "/30", error); |
||||
if (i === 0) { |
||||
// Start the server on first iteration if it fails to connect
|
||||
console.log("Starting ComfyUI server..."); |
||||
|
||||
let python = resolve("../../python_embeded/python.exe"); |
||||
let args; |
||||
let cwd; |
||||
if (existsSync(python)) { |
||||
args = ["-s", "ComfyUI/main.py"]; |
||||
cwd = "../.."; |
||||
} else { |
||||
python = "python"; |
||||
args = ["main.py"]; |
||||
cwd = ".."; |
||||
} |
||||
args.push("--cpu"); |
||||
console.log(python, ...args); |
||||
child = spawn(python, args, { cwd }); |
||||
child.on("error", (err) => { |
||||
console.log(`Server error (${err})`); |
||||
i = 30; |
||||
}); |
||||
child.on("exit", (code) => { |
||||
if (!success) { |
||||
console.log(`Server exited (${code})`); |
||||
i = 30; |
||||
} |
||||
}); |
||||
} |
||||
await new Promise((r) => { |
||||
setTimeout(r, 1000); |
||||
}); |
||||
} |
||||
} |
||||
|
||||
child?.kill(); |
||||
|
||||
if (!success) { |
||||
throw new Error("Waiting for server failed..."); |
||||
} |
||||
} |
||||
|
||||
setup(); |
||||
@ -0,0 +1,319 @@
|
||||
// @ts-check
|
||||
/// <reference path="../node_modules/@types/jest/index.d.ts" />
|
||||
|
||||
const { start, makeNodeDef, checkBeforeAndAfterReload, assertNotNullOrUndefined } = require("../utils"); |
||||
const lg = require("../utils/litegraph"); |
||||
|
||||
/** |
||||
* @typedef { import("../utils/ezgraph") } Ez |
||||
* @typedef { ReturnType<Ez["Ez"]["graph"]>["ez"] } EzNodeFactory |
||||
*/ |
||||
|
||||
/** |
||||
* @param { EzNodeFactory } ez |
||||
* @param { InstanceType<Ez["EzGraph"]> } graph |
||||
* @param { InstanceType<Ez["EzInput"]> } input |
||||
* @param { string } widgetType |
||||
* @param { boolean } hasControlWidget |
||||
* @returns |
||||
*/ |
||||
async function connectPrimitiveAndReload(ez, graph, input, widgetType, hasControlWidget) { |
||||
// Connect to primitive and ensure its still connected after
|
||||
let primitive = ez.PrimitiveNode(); |
||||
primitive.outputs[0].connectTo(input); |
||||
|
||||
await checkBeforeAndAfterReload(graph, async () => { |
||||
primitive = graph.find(primitive); |
||||
let { connections } = primitive.outputs[0]; |
||||
expect(connections).toHaveLength(1); |
||||
expect(connections[0].targetNode.id).toBe(input.node.node.id); |
||||
|
||||
// Ensure widget is correct type
|
||||
const valueWidget = primitive.widgets.value; |
||||
expect(valueWidget.widget.type).toBe(widgetType); |
||||
|
||||
// Check if control_after_generate should be added
|
||||
if (hasControlWidget) { |
||||
const controlWidget = primitive.widgets.control_after_generate; |
||||
expect(controlWidget.widget.type).toBe("combo"); |
||||
} |
||||
|
||||
// Ensure we dont have other widgets
|
||||
expect(primitive.node.widgets).toHaveLength(1 + +!!hasControlWidget); |
||||
}); |
||||
|
||||
return primitive; |
||||
} |
||||
|
||||
describe("widget inputs", () => { |
||||
beforeEach(() => { |
||||
lg.setup(global); |
||||
}); |
||||
|
||||
afterEach(() => { |
||||
lg.teardown(global); |
||||
}); |
||||
|
||||
[ |
||||
{ name: "int", type: "INT", widget: "number", control: true }, |
||||
{ name: "float", type: "FLOAT", widget: "number", control: true }, |
||||
{ name: "text", type: "STRING" }, |
||||
{ |
||||
name: "customtext", |
||||
type: "STRING", |
||||
opt: { multiline: true }, |
||||
}, |
||||
{ name: "toggle", type: "BOOLEAN" }, |
||||
{ name: "combo", type: ["a", "b", "c"], control: true }, |
||||
].forEach((c) => { |
||||
test(`widget conversion + primitive works on ${c.name}`, async () => { |
||||
const { ez, graph } = await start({ |
||||
mockNodeDefs: makeNodeDef("TestNode", { [c.name]: [c.type, c.opt ?? {}] }), |
||||
}); |
||||
|
||||
// Create test node and convert to input
|
||||
const n = ez.TestNode(); |
||||
const w = n.widgets[c.name]; |
||||
w.convertToInput(); |
||||
expect(w.isConvertedToInput).toBeTruthy(); |
||||
const input = w.getConvertedInput(); |
||||
expect(input).toBeTruthy(); |
||||
|
||||
// @ts-ignore : input is valid here
|
||||
await connectPrimitiveAndReload(ez, graph, input, c.widget ?? c.name, c.control); |
||||
}); |
||||
}); |
||||
|
||||
test("converted widget works after reload", async () => { |
||||
const { ez, graph } = await start(); |
||||
let n = ez.CheckpointLoaderSimple(); |
||||
|
||||
const inputCount = n.inputs.length; |
||||
|
||||
// Convert ckpt name to an input
|
||||
n.widgets.ckpt_name.convertToInput(); |
||||
expect(n.widgets.ckpt_name.isConvertedToInput).toBeTruthy(); |
||||
expect(n.inputs.ckpt_name).toBeTruthy(); |
||||
expect(n.inputs.length).toEqual(inputCount + 1); |
||||
|
||||
// Convert back to widget and ensure input is removed
|
||||
n.widgets.ckpt_name.convertToWidget(); |
||||
expect(n.widgets.ckpt_name.isConvertedToInput).toBeFalsy(); |
||||
expect(n.inputs.ckpt_name).toBeFalsy(); |
||||
expect(n.inputs.length).toEqual(inputCount); |
||||
|
||||
// Convert again and reload the graph to ensure it maintains state
|
||||
n.widgets.ckpt_name.convertToInput(); |
||||
expect(n.inputs.length).toEqual(inputCount + 1); |
||||
|
||||
const primitive = await connectPrimitiveAndReload(ez, graph, n.inputs.ckpt_name, "combo", true); |
||||
|
||||
// Disconnect & reconnect
|
||||
primitive.outputs[0].connections[0].disconnect(); |
||||
let { connections } = primitive.outputs[0]; |
||||
expect(connections).toHaveLength(0); |
||||
|
||||
primitive.outputs[0].connectTo(n.inputs.ckpt_name); |
||||
({ connections } = primitive.outputs[0]); |
||||
expect(connections).toHaveLength(1); |
||||
expect(connections[0].targetNode.id).toBe(n.node.id); |
||||
|
||||
// Convert back to widget and ensure input is removed
|
||||
n.widgets.ckpt_name.convertToWidget(); |
||||
expect(n.widgets.ckpt_name.isConvertedToInput).toBeFalsy(); |
||||
expect(n.inputs.ckpt_name).toBeFalsy(); |
||||
expect(n.inputs.length).toEqual(inputCount); |
||||
}); |
||||
|
||||
test("converted widget works on clone", async () => { |
||||
const { graph, ez } = await start(); |
||||
let n = ez.CheckpointLoaderSimple(); |
||||
|
||||
// Convert the widget to an input
|
||||
n.widgets.ckpt_name.convertToInput(); |
||||
expect(n.widgets.ckpt_name.isConvertedToInput).toBeTruthy(); |
||||
|
||||
// Clone the node
|
||||
n.menu["Clone"].call(); |
||||
expect(graph.nodes).toHaveLength(2); |
||||
const clone = graph.nodes[1]; |
||||
expect(clone.id).not.toEqual(n.id); |
||||
|
||||
// Ensure the clone has an input
|
||||
expect(clone.widgets.ckpt_name.isConvertedToInput).toBeTruthy(); |
||||
expect(clone.inputs.ckpt_name).toBeTruthy(); |
||||
|
||||
// Ensure primitive connects to both nodes
|
||||
let primitive = ez.PrimitiveNode(); |
||||
primitive.outputs[0].connectTo(n.inputs.ckpt_name); |
||||
primitive.outputs[0].connectTo(clone.inputs.ckpt_name); |
||||
expect(primitive.outputs[0].connections).toHaveLength(2); |
||||
|
||||
// Convert back to widget and ensure input is removed
|
||||
clone.widgets.ckpt_name.convertToWidget(); |
||||
expect(clone.widgets.ckpt_name.isConvertedToInput).toBeFalsy(); |
||||
expect(clone.inputs.ckpt_name).toBeFalsy(); |
||||
}); |
||||
|
||||
test("shows missing node error on custom node with converted input", async () => { |
||||
const { graph } = await start(); |
||||
|
||||
const dialogShow = jest.spyOn(graph.app.ui.dialog, "show"); |
||||
|
||||
await graph.app.loadGraphData({ |
||||
last_node_id: 3, |
||||
last_link_id: 4, |
||||
nodes: [ |
||||
{ |
||||
id: 1, |
||||
type: "TestNode", |
||||
pos: [41.87329101561909, 389.7381480823742], |
||||
size: { 0: 220, 1: 374 }, |
||||
flags: {}, |
||||
order: 1, |
||||
mode: 0, |
||||
inputs: [{ name: "test", type: "FLOAT", link: 4, widget: { name: "test" }, slot_index: 0 }], |
||||
outputs: [], |
||||
properties: { "Node name for S&R": "TestNode" }, |
||||
widgets_values: [1], |
||||
}, |
||||
{ |
||||
id: 3, |
||||
type: "PrimitiveNode", |
||||
pos: [-312, 433], |
||||
size: { 0: 210, 1: 82 }, |
||||
flags: {}, |
||||
order: 0, |
||||
mode: 0, |
||||
outputs: [{ links: [4], widget: { name: "test" } }], |
||||
title: "test", |
||||
properties: {}, |
||||
}, |
||||
], |
||||
links: [[4, 3, 0, 1, 6, "FLOAT"]], |
||||
groups: [], |
||||
config: {}, |
||||
extra: {}, |
||||
version: 0.4, |
||||
}); |
||||
|
||||
expect(dialogShow).toBeCalledTimes(1); |
||||
expect(dialogShow.mock.calls[0][0]).toContain("the following node types were not found"); |
||||
expect(dialogShow.mock.calls[0][0]).toContain("TestNode"); |
||||
}); |
||||
|
||||
test("defaultInput widgets can be converted back to inputs", async () => { |
||||
const { graph, ez } = await start({ |
||||
mockNodeDefs: makeNodeDef("TestNode", { example: ["INT", { defaultInput: true }] }), |
||||
}); |
||||
|
||||
// Create test node and ensure it starts as an input
|
||||
let n = ez.TestNode(); |
||||
let w = n.widgets.example; |
||||
expect(w.isConvertedToInput).toBeTruthy(); |
||||
let input = w.getConvertedInput(); |
||||
expect(input).toBeTruthy(); |
||||
|
||||
// Ensure it can be converted to
|
||||
w.convertToWidget(); |
||||
expect(w.isConvertedToInput).toBeFalsy(); |
||||
expect(n.inputs.length).toEqual(0); |
||||
// and from
|
||||
w.convertToInput(); |
||||
expect(w.isConvertedToInput).toBeTruthy(); |
||||
input = w.getConvertedInput(); |
||||
|
||||
// Reload and ensure it still only has 1 converted widget
|
||||
if (!assertNotNullOrUndefined(input)) return; |
||||
|
||||
await connectPrimitiveAndReload(ez, graph, input, "number", true); |
||||
n = graph.find(n); |
||||
expect(n.widgets).toHaveLength(1); |
||||
w = n.widgets.example; |
||||
expect(w.isConvertedToInput).toBeTruthy(); |
||||
|
||||
// Convert back to widget and ensure it is still a widget after reload
|
||||
w.convertToWidget(); |
||||
await graph.reload(); |
||||
n = graph.find(n); |
||||
expect(n.widgets).toHaveLength(1); |
||||
expect(n.widgets[0].isConvertedToInput).toBeFalsy(); |
||||
expect(n.inputs.length).toEqual(0); |
||||
}); |
||||
|
||||
test("forceInput widgets can not be converted back to inputs", async () => { |
||||
const { graph, ez } = await start({ |
||||
mockNodeDefs: makeNodeDef("TestNode", { example: ["INT", { forceInput: true }] }), |
||||
}); |
||||
|
||||
// Create test node and ensure it starts as an input
|
||||
let n = ez.TestNode(); |
||||
let w = n.widgets.example; |
||||
expect(w.isConvertedToInput).toBeTruthy(); |
||||
const input = w.getConvertedInput(); |
||||
expect(input).toBeTruthy(); |
||||
|
||||
// Convert to widget should error
|
||||
expect(() => w.convertToWidget()).toThrow(); |
||||
|
||||
// Reload and ensure it still only has 1 converted widget
|
||||
if (assertNotNullOrUndefined(input)) { |
||||
await connectPrimitiveAndReload(ez, graph, input, "number", true); |
||||
n = graph.find(n); |
||||
expect(n.widgets).toHaveLength(1); |
||||
expect(n.widgets.example.isConvertedToInput).toBeTruthy(); |
||||
} |
||||
}); |
||||
|
||||
test("primitive can connect to matching combos on converted widgets", async () => { |
||||
const { ez } = await start({ |
||||
mockNodeDefs: { |
||||
...makeNodeDef("TestNode1", { example: [["A", "B", "C"], { forceInput: true }] }), |
||||
...makeNodeDef("TestNode2", { example: [["A", "B", "C"], { forceInput: true }] }), |
||||
}, |
||||
}); |
||||
|
||||
const n1 = ez.TestNode1(); |
||||
const n2 = ez.TestNode2(); |
||||
const p = ez.PrimitiveNode(); |
||||
p.outputs[0].connectTo(n1.inputs[0]); |
||||
p.outputs[0].connectTo(n2.inputs[0]); |
||||
expect(p.outputs[0].connections).toHaveLength(2); |
||||
const valueWidget = p.widgets.value; |
||||
expect(valueWidget.widget.type).toBe("combo"); |
||||
expect(valueWidget.widget.options.values).toEqual(["A", "B", "C"]); |
||||
}); |
||||
|
||||
test("primitive can not connect to non matching combos on converted widgets", async () => { |
||||
const { ez } = await start({ |
||||
mockNodeDefs: { |
||||
...makeNodeDef("TestNode1", { example: [["A", "B", "C"], { forceInput: true }] }), |
||||
...makeNodeDef("TestNode2", { example: [["A", "B"], { forceInput: true }] }), |
||||
}, |
||||
}); |
||||
|
||||
const n1 = ez.TestNode1(); |
||||
const n2 = ez.TestNode2(); |
||||
const p = ez.PrimitiveNode(); |
||||
p.outputs[0].connectTo(n1.inputs[0]); |
||||
expect(() => p.outputs[0].connectTo(n2.inputs[0])).toThrow(); |
||||
expect(p.outputs[0].connections).toHaveLength(1); |
||||
}); |
||||
|
||||
test("combo output can not connect to non matching combos list input", async () => { |
||||
const { ez } = await start({ |
||||
mockNodeDefs: { |
||||
...makeNodeDef("TestNode1", {}, [["A", "B"]]), |
||||
...makeNodeDef("TestNode2", { example: [["A", "B"], { forceInput: true}] }), |
||||
...makeNodeDef("TestNode3", { example: [["A", "B", "C"], { forceInput: true}] }), |
||||
}, |
||||
}); |
||||
|
||||
const n1 = ez.TestNode1(); |
||||
const n2 = ez.TestNode2(); |
||||
const n3 = ez.TestNode3(); |
||||
|
||||
n1.outputs[0].connectTo(n2.inputs[0]); |
||||
expect(() => n1.outputs[0].connectTo(n3.inputs[0])).toThrow(); |
||||
}); |
||||
}); |
||||
@ -0,0 +1,417 @@
|
||||
// @ts-check
|
||||
/// <reference path="../../web/types/litegraph.d.ts" />
|
||||
|
||||
/** |
||||
* @typedef { import("../../web/scripts/app")["app"] } app |
||||
* @typedef { import("../../web/types/litegraph") } LG |
||||
* @typedef { import("../../web/types/litegraph").IWidget } IWidget |
||||
* @typedef { import("../../web/types/litegraph").ContextMenuItem } ContextMenuItem |
||||
* @typedef { import("../../web/types/litegraph").INodeInputSlot } INodeInputSlot |
||||
* @typedef { import("../../web/types/litegraph").INodeOutputSlot } INodeOutputSlot |
||||
* @typedef { InstanceType<LG["LGraphNode"]> & { widgets?: Array<IWidget> } } LGNode |
||||
* @typedef { (...args: EzOutput[] | [...EzOutput[], Record<string, unknown>]) => EzNode } EzNodeFactory |
||||
*/ |
||||
|
||||
export class EzConnection { |
||||
/** @type { app } */ |
||||
app; |
||||
/** @type { InstanceType<LG["LLink"]> } */ |
||||
link; |
||||
|
||||
get originNode() { |
||||
return new EzNode(this.app, this.app.graph.getNodeById(this.link.origin_id)); |
||||
} |
||||
|
||||
get originOutput() { |
||||
return this.originNode.outputs[this.link.origin_slot]; |
||||
} |
||||
|
||||
get targetNode() { |
||||
return new EzNode(this.app, this.app.graph.getNodeById(this.link.target_id)); |
||||
} |
||||
|
||||
get targetInput() { |
||||
return this.targetNode.inputs[this.link.target_slot]; |
||||
} |
||||
|
||||
/** |
||||
* @param { app } app |
||||
* @param { InstanceType<LG["LLink"]> } link |
||||
*/ |
||||
constructor(app, link) { |
||||
this.app = app; |
||||
this.link = link; |
||||
} |
||||
|
||||
disconnect() { |
||||
this.targetInput.disconnect(); |
||||
} |
||||
} |
||||
|
||||
export class EzSlot { |
||||
/** @type { EzNode } */ |
||||
node; |
||||
/** @type { number } */ |
||||
index; |
||||
|
||||
/** |
||||
* @param { EzNode } node |
||||
* @param { number } index |
||||
*/ |
||||
constructor(node, index) { |
||||
this.node = node; |
||||
this.index = index; |
||||
} |
||||
} |
||||
|
||||
export class EzInput extends EzSlot { |
||||
/** @type { INodeInputSlot } */ |
||||
input; |
||||
|
||||
/** |
||||
* @param { EzNode } node |
||||
* @param { number } index |
||||
* @param { INodeInputSlot } input |
||||
*/ |
||||
constructor(node, index, input) { |
||||
super(node, index); |
||||
this.input = input; |
||||
} |
||||
|
||||
disconnect() { |
||||
this.node.node.disconnectInput(this.index); |
||||
} |
||||
} |
||||
|
||||
export class EzOutput extends EzSlot { |
||||
/** @type { INodeOutputSlot } */ |
||||
output; |
||||
|
||||
/** |
||||
* @param { EzNode } node |
||||
* @param { number } index |
||||
* @param { INodeOutputSlot } output |
||||
*/ |
||||
constructor(node, index, output) { |
||||
super(node, index); |
||||
this.output = output; |
||||
} |
||||
|
||||
get connections() { |
||||
return (this.node.node.outputs?.[this.index]?.links ?? []).map( |
||||
(l) => new EzConnection(this.node.app, this.node.app.graph.links[l]) |
||||
); |
||||
} |
||||
|
||||
/** |
||||
* @param { EzInput } input |
||||
*/ |
||||
connectTo(input) { |
||||
if (!input) throw new Error("Invalid input"); |
||||
|
||||
/** |
||||
* @type { LG["LLink"] | null } |
||||
*/ |
||||
const link = this.node.node.connect(this.index, input.node.node, input.index); |
||||
if (!link) { |
||||
const inp = input.input; |
||||
const inName = inp.name || inp.label || inp.type; |
||||
throw new Error( |
||||
`Connecting from ${input.node.node.type}[${inName}#${input.index}] -> ${this.node.node.type}[${ |
||||
this.output.name ?? this.output.type |
||||
}#${this.index}] failed.` |
||||
); |
||||
} |
||||
return link; |
||||
} |
||||
} |
||||
|
||||
export class EzNodeMenuItem { |
||||
/** @type { EzNode } */ |
||||
node; |
||||
/** @type { number } */ |
||||
index; |
||||
/** @type { ContextMenuItem } */ |
||||
item; |
||||
|
||||
/** |
||||
* @param { EzNode } node |
||||
* @param { number } index |
||||
* @param { ContextMenuItem } item |
||||
*/ |
||||
constructor(node, index, item) { |
||||
this.node = node; |
||||
this.index = index; |
||||
this.item = item; |
||||
} |
||||
|
||||
call(selectNode = true) { |
||||
if (!this.item?.callback) throw new Error(`Menu Item ${this.item?.content ?? "[null]"} has no callback.`); |
||||
if (selectNode) { |
||||
this.node.select(); |
||||
} |
||||
this.item.callback.call(this.node.node, undefined, undefined, undefined, undefined, this.node.node); |
||||
} |
||||
} |
||||
|
||||
export class EzWidget { |
||||
/** @type { EzNode } */ |
||||
node; |
||||
/** @type { number } */ |
||||
index; |
||||
/** @type { IWidget } */ |
||||
widget; |
||||
|
||||
/** |
||||
* @param { EzNode } node |
||||
* @param { number } index |
||||
* @param { IWidget } widget |
||||
*/ |
||||
constructor(node, index, widget) { |
||||
this.node = node; |
||||
this.index = index; |
||||
this.widget = widget; |
||||
} |
||||
|
||||
get value() { |
||||
return this.widget.value; |
||||
} |
||||
|
||||
set value(v) { |
||||
this.widget.value = v; |
||||
} |
||||
|
||||
get isConvertedToInput() { |
||||
// @ts-ignore : this type is valid for converted widgets
|
||||
return this.widget.type === "converted-widget"; |
||||
} |
||||
|
||||
getConvertedInput() { |
||||
if (!this.isConvertedToInput) throw new Error(`Widget ${this.widget.name} is not converted to input.`); |
||||
|
||||
return this.node.inputs.find((inp) => inp.input["widget"]?.name === this.widget.name); |
||||
} |
||||
|
||||
convertToWidget() { |
||||
if (!this.isConvertedToInput) |
||||
throw new Error(`Widget ${this.widget.name} cannot be converted as it is already a widget.`); |
||||
this.node.menu[`Convert ${this.widget.name} to widget`].call(); |
||||
} |
||||
|
||||
convertToInput() { |
||||
if (this.isConvertedToInput) |
||||
throw new Error(`Widget ${this.widget.name} cannot be converted as it is already an input.`); |
||||
this.node.menu[`Convert ${this.widget.name} to input`].call(); |
||||
} |
||||
} |
||||
|
||||
export class EzNode { |
||||
/** @type { app } */ |
||||
app; |
||||
/** @type { LGNode } */ |
||||
node; |
||||
|
||||
/** |
||||
* @param { app } app |
||||
* @param { LGNode } node |
||||
*/ |
||||
constructor(app, node) { |
||||
this.app = app; |
||||
this.node = node; |
||||
} |
||||
|
||||
get id() { |
||||
return this.node.id; |
||||
} |
||||
|
||||
get inputs() { |
||||
return this.#makeLookupArray("inputs", "name", EzInput); |
||||
} |
||||
|
||||
get outputs() { |
||||
return this.#makeLookupArray("outputs", "name", EzOutput); |
||||
} |
||||
|
||||
get widgets() { |
||||
return this.#makeLookupArray("widgets", "name", EzWidget); |
||||
} |
||||
|
||||
get menu() { |
||||
return this.#makeLookupArray(() => this.app.canvas.getNodeMenuOptions(this.node), "content", EzNodeMenuItem); |
||||
} |
||||
|
||||
select() { |
||||
this.app.canvas.selectNode(this.node); |
||||
} |
||||
|
||||
// /**
|
||||
// * @template { "inputs" | "outputs" } T
|
||||
// * @param { T } type
|
||||
// * @returns { Record<string, type extends "inputs" ? EzInput : EzOutput> & (type extends "inputs" ? EzInput [] : EzOutput[]) }
|
||||
// */
|
||||
// #getSlotItems(type) {
|
||||
// // @ts-ignore : these items are correct
|
||||
// return (this.node[type] ?? []).reduce((p, s, i) => {
|
||||
// if (s.name in p) {
|
||||
// throw new Error(`Unable to store input ${s.name} on array as name conflicts.`);
|
||||
// }
|
||||
// // @ts-ignore
|
||||
// p.push((p[s.name] = new (type === "inputs" ? EzInput : EzOutput)(this, i, s)));
|
||||
// return p;
|
||||
// }, Object.assign([], { $: this }));
|
||||
// }
|
||||
|
||||
/** |
||||
* @template { { new(node: EzNode, index: number, obj: any): any } } T |
||||
* @param { "inputs" | "outputs" | "widgets" | (() => Array<unknown>) } nodeProperty |
||||
* @param { string } nameProperty |
||||
* @param { T } ctor |
||||
* @returns { Record<string, InstanceType<T>> & Array<InstanceType<T>> } |
||||
*/ |
||||
#makeLookupArray(nodeProperty, nameProperty, ctor) { |
||||
const items = typeof nodeProperty === "function" ? nodeProperty() : this.node[nodeProperty]; |
||||
// @ts-ignore
|
||||
return (items ?? []).reduce((p, s, i) => { |
||||
if (!s) return p; |
||||
|
||||
const name = s[nameProperty]; |
||||
// @ts-ignore
|
||||
if (!name || name in p) { |
||||
throw new Error(`Unable to store ${nodeProperty} ${name} on array as name conflicts.`); |
||||
} |
||||
// @ts-ignore
|
||||
p.push((p[name] = new ctor(this, i, s))); |
||||
return p; |
||||
}, Object.assign([], { $: this })); |
||||
} |
||||
} |
||||
|
||||
export class EzGraph { |
||||
/** @type { app } */ |
||||
app; |
||||
|
||||
/** |
||||
* @param { app } app |
||||
*/ |
||||
constructor(app) { |
||||
this.app = app; |
||||
} |
||||
|
||||
get nodes() { |
||||
return this.app.graph._nodes.map((n) => new EzNode(this.app, n)); |
||||
} |
||||
|
||||
clear() { |
||||
this.app.graph.clear(); |
||||
} |
||||
|
||||
arrange() { |
||||
this.app.graph.arrange(); |
||||
} |
||||
|
||||
stringify() { |
||||
return JSON.stringify(this.app.graph.serialize(), undefined, "\t"); |
||||
} |
||||
|
||||
/** |
||||
* @param { number | LGNode | EzNode } obj |
||||
* @returns { EzNode } |
||||
*/ |
||||
find(obj) { |
||||
let match; |
||||
let id; |
||||
if (typeof obj === "number") { |
||||
id = obj; |
||||
} else { |
||||
id = obj.id; |
||||
} |
||||
|
||||
match = this.app.graph.getNodeById(id); |
||||
|
||||
if (!match) { |
||||
throw new Error(`Unable to find node with ID ${id}.`); |
||||
} |
||||
|
||||
return new EzNode(this.app, match); |
||||
} |
||||
|
||||
/** |
||||
* @returns { Promise<void> } |
||||
*/ |
||||
reload() { |
||||
const graph = JSON.parse(JSON.stringify(this.app.graph.serialize())); |
||||
return new Promise((r) => { |
||||
this.app.graph.clear(); |
||||
setTimeout(async () => { |
||||
await this.app.loadGraphData(graph); |
||||
r(); |
||||
}, 10); |
||||
}); |
||||
} |
||||
} |
||||
|
||||
export const Ez = { |
||||
/** |
||||
* Quickly build and interact with a ComfyUI graph |
||||
* @example |
||||
* const { ez, graph } = Ez.graph(app); |
||||
* graph.clear(); |
||||
* const [model, clip, vae] = ez.CheckpointLoaderSimple(); |
||||
* const [pos] = ez.CLIPTextEncode(clip, { text: "positive" }); |
||||
* const [neg] = ez.CLIPTextEncode(clip, { text: "negative" }); |
||||
* const [latent] = ez.KSampler(model, pos, neg, ...ez.EmptyLatentImage()); |
||||
* const [image] = ez.VAEDecode(latent, vae); |
||||
* const saveNode = ez.SaveImage(image).node; |
||||
* console.log(saveNode); |
||||
* graph.arrange(); |
||||
* @param { app } app |
||||
* @param { LG["LiteGraph"] } LiteGraph |
||||
* @param { LG["LGraphCanvas"] } LGraphCanvas |
||||
* @param { boolean } clearGraph |
||||
* @returns { { graph: EzGraph, ez: Record<string, EzNodeFactory> } } |
||||
*/ |
||||
graph(app, LiteGraph = window["LiteGraph"], LGraphCanvas = window["LGraphCanvas"], clearGraph = true) { |
||||
// Always set the active canvas so things work
|
||||
LGraphCanvas.active_canvas = app.canvas; |
||||
|
||||
if (clearGraph) { |
||||
app.graph.clear(); |
||||
} |
||||
|
||||
// @ts-ignore : this proxy handles utility methods & node creation
|
||||
const factory = new Proxy( |
||||
{}, |
||||
{ |
||||
get(_, p) { |
||||
if (typeof p !== "string") throw new Error("Invalid node"); |
||||
const node = LiteGraph.createNode(p); |
||||
if (!node) throw new Error(`Unknown node "${p}"`); |
||||
app.graph.add(node); |
||||
|
||||
/** |
||||
* @param {Parameters<EzNodeFactory>} args |
||||
*/ |
||||
return function (...args) { |
||||
const ezNode = new EzNode(app, node); |
||||
const inputs = ezNode.inputs; |
||||
|
||||
let slot = 0; |
||||
for (const arg of args) { |
||||
if (arg instanceof EzOutput) { |
||||
arg.connectTo(inputs[slot++]); |
||||
} else { |
||||
for (const k in arg) { |
||||
ezNode.widgets[k].value = arg[k]; |
||||
} |
||||
} |
||||
} |
||||
|
||||
return ezNode; |
||||
}; |
||||
}, |
||||
} |
||||
); |
||||
|
||||
return { graph: new EzGraph(app), ez: factory }; |
||||
}, |
||||
}; |
||||
@ -0,0 +1,71 @@
|
||||
const { mockApi } = require("./setup"); |
||||
const { Ez } = require("./ezgraph"); |
||||
|
||||
/** |
||||
* |
||||
* @param { Parameters<mockApi>[0] } config |
||||
* @returns |
||||
*/ |
||||
export async function start(config = undefined) { |
||||
mockApi(config); |
||||
const { app } = require("../../web/scripts/app"); |
||||
await app.setup(); |
||||
return Ez.graph(app, global["LiteGraph"], global["LGraphCanvas"]); |
||||
} |
||||
|
||||
/** |
||||
* @param { ReturnType<Ez["graph"]>["graph"] } graph
|
||||
* @param { (hasReloaded: boolean) => (Promise<void> | void) } cb
|
||||
*/ |
||||
export async function checkBeforeAndAfterReload(graph, cb) { |
||||
await cb(false); |
||||
await graph.reload(); |
||||
await cb(true); |
||||
} |
||||
|
||||
/** |
||||
* @param { string } name
|
||||
* @param { Record<string, string | [string | string[], any]> } input
|
||||
* @param { (string | string[])[] | Record<string, string | string[]> } output |
||||
* @returns { Record<string, import("../../web/types/comfy").ComfyObjectInfo> }
|
||||
*/ |
||||
export function makeNodeDef(name, input, output = {}) { |
||||
const nodeDef = { |
||||
name, |
||||
category: "test", |
||||
output: [], |
||||
output_name: [], |
||||
output_is_list: [], |
||||
input: { |
||||
required: {} |
||||
}, |
||||
}; |
||||
for(const k in input) { |
||||
nodeDef.input.required[k] = typeof input[k] === "string" ? [input[k], {}] : [...input[k]]; |
||||
} |
||||
if(output instanceof Array) { |
||||
output = output.reduce((p, c) => { |
||||
p[c] = c; |
||||
return p; |
||||
}, {}) |
||||
} |
||||
for(const k in output) { |
||||
nodeDef.output.push(output[k]); |
||||
nodeDef.output_name.push(k); |
||||
nodeDef.output_is_list.push(false); |
||||
} |
||||
|
||||
return { [name]: nodeDef }; |
||||
} |
||||
|
||||
/** |
||||
/** |
||||
* @template { any } T |
||||
* @param { T } x |
||||
* @returns { x is Exclude<T, null | undefined> } |
||||
*/ |
||||
export function assertNotNullOrUndefined(x) { |
||||
expect(x).not.toEqual(null); |
||||
expect(x).not.toEqual(undefined); |
||||
return true; |
||||
} |
||||
@ -0,0 +1,36 @@
|
||||
const fs = require("fs"); |
||||
const path = require("path"); |
||||
const { nop } = require("../utils/nopProxy"); |
||||
|
||||
function forEachKey(cb) { |
||||
for (const k of [ |
||||
"LiteGraph", |
||||
"LGraph", |
||||
"LLink", |
||||
"LGraphNode", |
||||
"LGraphGroup", |
||||
"DragAndScale", |
||||
"LGraphCanvas", |
||||
"ContextMenu", |
||||
]) { |
||||
cb(k); |
||||
} |
||||
} |
||||
|
||||
export function setup(ctx) { |
||||
const lg = fs.readFileSync(path.resolve("../web/lib/litegraph.core.js"), "utf-8"); |
||||
const globalTemp = {}; |
||||
(function (console) { |
||||
eval(lg); |
||||
}).call(globalTemp, nop); |
||||
|
||||
forEachKey((k) => (ctx[k] = globalTemp[k])); |
||||
require(path.resolve("../web/lib/litegraph.extensions.js")); |
||||
} |
||||
|
||||
export function teardown(ctx) { |
||||
forEachKey((k) => delete ctx[k]); |
||||
|
||||
// Clear document after each run
|
||||
document.getElementsByTagName("html")[0].innerHTML = "";
|
||||
} |
||||
@ -0,0 +1,6 @@
|
||||
export const nop = new Proxy(function () {}, { |
||||
get: () => nop, |
||||
set: () => true, |
||||
apply: () => nop, |
||||
construct: () => nop, |
||||
}); |
||||
@ -0,0 +1,45 @@
|
||||
require("../../web/scripts/api"); |
||||
|
||||
const fs = require("fs"); |
||||
const path = require("path"); |
||||
function* walkSync(dir) { |
||||
const files = fs.readdirSync(dir, { withFileTypes: true }); |
||||
for (const file of files) { |
||||
if (file.isDirectory()) { |
||||
yield* walkSync(path.join(dir, file.name)); |
||||
} else { |
||||
yield path.join(dir, file.name); |
||||
} |
||||
} |
||||
} |
||||
|
||||
/** |
||||
* @typedef { import("../../web/types/comfy").ComfyObjectInfo } ComfyObjectInfo |
||||
*/ |
||||
|
||||
/** |
||||
* @param { { mockExtensions?: string[], mockNodeDefs?: Record<string, ComfyObjectInfo> } } config |
||||
*/ |
||||
export function mockApi({ mockExtensions, mockNodeDefs } = {}) { |
||||
if (!mockExtensions) { |
||||
mockExtensions = Array.from(walkSync(path.resolve("../web/extensions/core"))) |
||||
.filter((x) => x.endsWith(".js")) |
||||
.map((x) => path.relative(path.resolve("../web"), x)); |
||||
} |
||||
if (!mockNodeDefs) { |
||||
mockNodeDefs = JSON.parse(fs.readFileSync(path.resolve("./data/object_info.json"))); |
||||
} |
||||
|
||||
jest.mock("../../web/scripts/api", () => ({ |
||||
get api() { |
||||
return { |
||||
addEventListener: jest.fn(), |
||||
getSystemStats: jest.fn(), |
||||
getExtensions: jest.fn(() => mockExtensions), |
||||
getNodeDefs: jest.fn(() => mockNodeDefs), |
||||
init: jest.fn(), |
||||
apiURL: jest.fn((x) => "../../web/" + x), |
||||
}; |
||||
}, |
||||
})); |
||||
} |
||||
Loading…
Reference in new issue