Use npm package @ComfyOrg/litegraph (#89)

* Use npm to manage litegraph

* Fix merge issues caused by BetaUI change

* Switch to @comfyorg/litegraph

* Fix various import

* Fix css apply order bug

* Fix package lock

* Update litegraph

* Update litegraph

* Update browsertest expectations

* Update test expectations [skip ci]

* Fix default view screenshot

---------

Co-authored-by: github-actions <github-actions@github.com>
This commit is contained in:
Chenlei Hu
2024-07-05 20:53:47 -04:00
committed by GitHub
parent 27c5bc1581
commit d6b2d5fb4f
63 changed files with 472 additions and 17982 deletions

View File

@@ -1,5 +1,4 @@
// @ts-nocheck
/// <reference path="../../src/types/litegraph.d.ts" />
import type { LiteGraph, LGraphCanvas } from "@comfyorg/litegraph";
/**
* @typedef { import("./src/scripts/app")["app"] } app
@@ -389,28 +388,28 @@ export class EzGraph {
}
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().outputs;
* const [pos] = ez.CLIPTextEncode(clip, { text: "positive" }).outputs;
* const [neg] = ez.CLIPTextEncode(clip, { text: "negative" }).outputs;
* const [latent] = ez.KSampler(model, pos, neg, ...ez.EmptyLatentImage().outputs).outputs;
* const [image] = ez.VAEDecode(latent, vae).outputs;
* const saveNode = ez.SaveImage(image);
* 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;
/**
* Quickly build and interact with a ComfyUI graph
* @example
* const { ez, graph } = Ez.graph(app);
* graph.clear();
* const [model, clip, vae] = ez.CheckpointLoaderSimple().outputs;
* const [pos] = ez.CLIPTextEncode(clip, { text: "positive" }).outputs;
* const [neg] = ez.CLIPTextEncode(clip, { text: "negative" }).outputs;
* const [latent] = ez.KSampler(model, pos, neg, ...ez.EmptyLatentImage().outputs).outputs;
* const [image] = ez.VAEDecode(latent, vae).outputs;
* const saveNode = ez.SaveImage(image);
* console.log(saveNode);
* graph.arrange();
* @param { app } app
* @param { boolean } clearGraph
* @param { LG["LiteGraph"] } LiteGraph
* @param { LG["LGraphCanvas"] } LGraphCanvas
* @returns { { graph: EzGraph, ez: Record<string, EzNodeFactory> } }
*/
graph(app, LiteGraph, LGraphCanvas, clearGraph = true) {
// Always set the active canvas so things work
LGraphCanvas.active_canvas = app.canvas;
if (clearGraph) {
app.graph.clear();

View File

@@ -39,13 +39,14 @@ export async function start(config: StartConfig = {}): Promise<StartResult> {
Object.assign(localStorage, config.localStorage ?? {});
document.body.innerHTML = html.toString();
mockApi(config);
const { app } = await import("../../src/scripts/app");
config.preSetup?.(app);
await app.setup();
mockApi(config);
const { app } = await import("../../src/scripts/app");
const { LiteGraph, LGraphCanvas } = await import("@comfyorg/litegraph");
config.preSetup?.(app);
await app.setup();
// @ts-ignore
return { ...Ez.graph(app, global["LiteGraph"], global["LGraphCanvas"]), app };
// @ts-ignore
return { ...Ez.graph(app, LiteGraph, LGraphCanvas), app };
}
/**

View File

@@ -18,20 +18,12 @@ function forEachKey(cb) {
}
export default {
setup(ctx) {
const lg = fs.readFileSync(path.resolve("./src/lib/litegraph.core.js"), "utf-8");
const globalTemp = {};
(function (console) {
eval(lg);
}).call(globalTemp, nop);
setup(ctx) {
forEachKey((k) => (ctx[k] = globalTemp[k]));
const lg_ext = fs.readFileSync(path.resolve("./src/lib/litegraph.extensions.js"), "utf-8");
eval(lg_ext);
},
},
teardown(ctx) {
forEachKey((k) => delete ctx[k]);
teardown(ctx) {
// forEachKey((k) => delete ctx[k]);
// Clear document after each run
document.getElementsByTagName("html")[0].innerHTML = "";