drawio-mcp-server 2.0.4 → 2.1.0

package/build/prefetch-assets.js

@@ -1,11 +1,12 @@
 import { ensureAssets } from "./assets/index.js";
+import { create_logger } from "./mcp_console_logger.js";
 async function main() {
-    const { assetRoot } = await ensureAssets({}, (message) => {
-        console.log(message);
-    });
-    console.log(`Assets ready at ${assetRoot}`);
+    const log = create_logger();
+    const { assetRoot } = await ensureAssets({}, log);
+    log.log("info", `Assets ready at ${assetRoot}`);
 }
 main().catch((error) => {
-    console.error("Failed to prefetch draw.io assets", error);
+    const log = create_logger();
+    log.log("error", "Failed to prefetch draw.io assets", error);
     process.exit(1);
 });

package/build/real-environment/document-targeting.test.js

@@ -0,0 +1,124 @@
+import { afterAll, beforeAll, describe, expect, it } from "@jest/globals";
+import { createRealEnvironmentContext, disposeRealEnvironmentContext, openConnectedDrawioPage, resetDiagram, } from "./harness.js";
+import { expectNoBrowserErrors, expectNoServerErrors } from "./assertions.js";
+import { callToolJson } from "./tools.js";
+import { expectToolSuccess, unwrapToolPayload } from "./test-helpers.js";
+function firstText(result) {
+    return result.content.find((item) => item.type === "text")?.text;
+}
+describe("real environment/document targeting", () => {
+    let context;
+    beforeAll(async () => {
+        context = await createRealEnvironmentContext();
+    }, 180000);
+    afterAll(async () => {
+        await disposeRealEnvironmentContext(context);
+    });
+    it("lists connected documents and requires target_document when multiple tabs are connected", async () => {
+        await resetDiagram(context);
+        context.browserMessages.length = 0;
+        const logCountBefore = context.logger.entries.length;
+        const { payload: renamedDocOnePayload } = await callToolJson(context, "rename-page", {
+            page: { index: 0 },
+            name: "Doc One Page A",
+        });
+        expectToolSuccess(renamedDocOnePayload);
+        const docOneCurrentPage = unwrapToolPayload(renamedDocOnePayload);
+        expect(docOneCurrentPage.name).toBe("Doc One Page A");
+        const { payload: createdDocOnePagePayload } = await callToolJson(context, "create-page", {
+            name: "Doc One Page B",
+        });
+        expectToolSuccess(createdDocOnePagePayload);
+        const docOneSecondPage = unwrapToolPayload(createdDocOnePagePayload);
+        expect(docOneSecondPage.name).toBe("Doc One Page B");
+        const { payload: singleDocumentPayload } = await callToolJson(context, "list-documents", {});
+        expectToolSuccess(singleDocumentPayload);
+        const [docOne] = unwrapToolPayload(singleDocumentPayload);
+        expect(docOne).toMatchObject({
+            page_count: 2,
+            current_page: {
+                id: docOneCurrentPage.id,
+                name: "Doc One Page A",
+                is_current: true,
+            },
+        });
+        const secondPage = await openConnectedDrawioPage({
+            browser: context.browser,
+            httpPort: context.httpPort,
+            wsPort: context.wsPort,
+            browserMessages: context.browserMessages,
+        });
+        try {
+            const { payload: twoDocumentsPayload } = await callToolJson(context, "list-documents", {});
+            expectToolSuccess(twoDocumentsPayload);
+            const documents = unwrapToolPayload(twoDocumentsPayload);
+            expect(documents).toHaveLength(2);
+            const refreshedDocOne = documents.find((document) => document.id === docOne.id);
+            const docTwo = documents.find((document) => document.id !== docOne.id);
+            expect(refreshedDocOne?.page_count).toBe(2);
+            expect(docTwo).toBeDefined();
+            const { payload: renamedDocTwoPayload } = await callToolJson(context, "rename-page", {
+                target_document: { id: docTwo.id },
+                page: { index: 0 },
+                name: "Doc Two Page Only",
+            });
+            expectToolSuccess(renamedDocTwoPayload);
+            const docTwoCurrentPage = unwrapToolPayload(renamedDocTwoPayload);
+            expect(docTwoCurrentPage.name).toBe("Doc Two Page Only");
+            const ambiguousListPages = (await context.client.callTool({
+                name: "list-pages",
+                arguments: {},
+            }));
+            expect(ambiguousListPages.isError).toBe(true);
+            expect(firstText(ambiguousListPages)).toContain("Multiple Draw.io documents are connected");
+            const { payload: docOnePagesPayload } = await callToolJson(context, "list-pages", {
+                target_document: { id: docOne.id },
+            });
+            expectToolSuccess(docOnePagesPayload);
+            const docOnePages = unwrapToolPayload(docOnePagesPayload);
+            expect(docOnePages.map((page) => page.name)).toEqual([
+                "Doc One Page A",
+                "Doc One Page B",
+            ]);
+            const { payload: docTwoPagesPayload } = await callToolJson(context, "list-pages", {
+                target_document: { id: docTwo.id },
+            });
+            expectToolSuccess(docTwoPagesPayload);
+            const docTwoPages = unwrapToolPayload(docTwoPagesPayload);
+            expect(docTwoPages).toEqual([
+                {
+                    index: 0,
+                    id: docTwoCurrentPage.id,
+                    name: "Doc Two Page Only",
+                    is_current: true,
+                },
+            ]);
+            const { payload: finalDocumentsPayload } = await callToolJson(context, "list-documents", {});
+            expectToolSuccess(finalDocumentsPayload);
+            const finalDocuments = unwrapToolPayload(finalDocumentsPayload);
+            const finalDocOne = finalDocuments.find((document) => document.id === docOne.id);
+            const finalDocTwo = finalDocuments.find((document) => document.id === docTwo.id);
+            expect(finalDocOne).toMatchObject({
+                page_count: 2,
+                current_page: {
+                    id: docOneCurrentPage.id,
+                    name: "Doc One Page A",
+                    is_current: true,
+                },
+            });
+            expect(finalDocTwo).toMatchObject({
+                page_count: 1,
+                current_page: {
+                    id: docTwoCurrentPage.id,
+                    name: "Doc Two Page Only",
+                    is_current: true,
+                },
+            });
+        }
+        finally {
+            await secondPage.close();
+        }
+        await expectNoBrowserErrors(context, "document-targeting");
+        await expectNoServerErrors(context, "document-targeting", logCountBefore);
+    }, 180000);
+});

package/build/real-environment/export-diagram.test.js

@@ -334,7 +334,7 @@ describe("real environment/export-diagram", () => {
             const plainSvg = findText(plainContent, "<svg");
             expect(plainSvg).toBeDefined();
             expect(plainSvg.text).not.toContain("mxfile");
-            expect(embeddedData.length).toBeGreaterThan(plainSvg.text.length);
+            expect(embeddedData).not.toBe(plainSvg.text);
             const metaContent = findText(embeddedContent, "Exported svg");
             expect(metaContent).toBeDefined();
             expect(metaContent.text).toContain("image/svg+xml");

package/build/real-environment/harness.js

@@ -1,27 +1,81 @@
 import { chromium, } from "@playwright/test";
 import { Client } from "@modelcontextprotocol/sdk/client/index.js";
 import { InMemoryTransport } from "@modelcontextprotocol/sdk/inMemory.js";
+import { spawnCaddy } from "drawio-mcp-dev-proxy";
+import { createServer } from "node:net";
 import { ensureAssets } from "../assets/index.js";
-import { getHttpFeatureConfig } from "../config.js";
+import { defaultConfig, getHttpFeatureConfig, } from "../config.js";
 import { createDrawioMcpApp } from "../index.js";
 import { MemoryLogger } from "./logger.js";
 import { createArtifactRunDir } from "./screenshot.js";
+async function getFreePort() {
+    return new Promise((resolve, reject) => {
+        const srv = createServer();
+        srv.once("error", reject);
+        srv.listen(0, "127.0.0.1", () => {
+            const addr = srv.address();
+            if (addr && typeof addr === "object") {
+                const port = addr.port;
+                srv.close(() => resolve(port));
+            }
+            else {
+                srv.close(() => reject(new Error("could not resolve free port")));
+            }
+        });
+    });
+}
 export async function createRealEnvironmentContext() {
     const logger = new MemoryLogger();
     const browserMessages = [];
     const artifactRunDir = await createArtifactRunDir();
-    await ensureAssets({}, () => undefined);
-    const app = createDrawioMcpApp({ log: logger });
+    await ensureAssets({}, logger);
+    const app = createDrawioMcpApp({ config: defaultConfig(), log: logger });
     const wsServer = await app.startWebSocketServer(0);
     const wsPort = Number(wsServer.address().port);
-    const config = {
-        extensionPort: wsPort,
-        httpPort: 0,
-        transports: [],
-        editorEnabled: true,
-    };
-    const startedHttp = await app.startHttpServer(0, config, getHttpFeatureConfig(config));
-    const httpPort = startedHttp.port;
+    const useHttps = process.env.HARNESS_HTTPS === "1";
+    let caddy = null;
+    let proxyPort = null;
+    let webSocketUrl;
+    let upstreamHttpPort;
+    if (useHttps) {
+        proxyPort = await getFreePort();
+        const httpUpstream = await getFreePort();
+        caddy = await spawnCaddy({
+            proxyPort,
+            httpUpstream,
+            wsUpstream: wsPort,
+        });
+        webSocketUrl = `wss://localhost:${proxyPort}/ws`;
+        const config = {
+            extensionPort: wsPort,
+            httpPort: httpUpstream,
+            transports: ["http"],
+            editorEnabled: true,
+            webSocketUrl,
+            logger: "console",
+            tlsEnabled: false,
+            tlsAuto: false,
+        };
+        await app.startHttpServer(httpUpstream, config, getHttpFeatureConfig(config));
+        upstreamHttpPort = httpUpstream;
+    }
+    else {
+        const config = {
+            extensionPort: wsPort,
+            httpPort: 0,
+            transports: ["http"],
+            editorEnabled: true,
+            logger: "console",
+            tlsEnabled: false,
+            tlsAuto: false,
+        };
+        const startedHttp = await app.startHttpServer(0, config, getHttpFeatureConfig(config));
+        upstreamHttpPort = startedHttp.port;
+    }
+    const httpPort = useHttps ? proxyPort : upstreamHttpPort;
+    const baseUrl = useHttps
+        ? `https://localhost:${proxyPort}/`
+        : `http://localhost:${upstreamHttpPort}/`;
     const [clientTransport, serverTransport] = InMemoryTransport.createLinkedPair();
     const client = new Client({
         name: "real-environment-test",
@@ -33,27 +87,23 @@ export async function createRealEnvironmentContext() {
         client.connect(clientTransport),
     ]);
     const browser = await chromium.launch({ headless: true });
-    const page = await browser.newPage();
-    page.on("console", (message) => {
-        browserMessages.push({
-            type: message.type(),
-            text: message.text(),
-        });
+    const browserContext = await browser.newContext({
+        ignoreHTTPSErrors: useHttps,
     });
-    await page.addInitScript((port) => {
-        const store = {
-            websocketPort: port,
-        };
-        window.__DRAWIO_MCP_TEST_HOOKS__ = true;
-        window.localStorage.setItem("drawio-mcp-plugin-config", JSON.stringify(store));
-        window.localStorage.setItem("drawio-mcp-config", JSON.stringify(store));
-    }, wsPort);
-    await page.goto(`http://localhost:${httpPort}/`, {
-        waitUntil: "domcontentloaded",
+    const page = await openConnectedDrawioPage({
+        browserContext,
+        baseUrl,
+        webSocketUrl,
+        httpPort,
+        wsPort,
+        browserMessages,
     });
-    await waitForPluginReady(page);
+    const proxy = caddy
+        ? { stop: () => caddy.stop(), proxyPort: caddy.proxyPort }
+        : null;
     return {
         browser,
+        browserContext,
         page,
         client,
         app,
@@ -62,12 +112,48 @@ export async function createRealEnvironmentContext() {
         artifactRunDir,
         httpPort,
         wsPort,
+        baseUrl,
+        proxy,
     };
 }
+export async function openConnectedDrawioPage({ browser, browserContext, baseUrl, webSocketUrl, httpPort, wsPort, browserMessages, }) {
+    const page = browserContext
+        ? await browserContext.newPage()
+        : await browser.newPage();
+    const editorUrl = baseUrl ?? `http://localhost:${httpPort}/`;
+    if (browserMessages) {
+        page.on("console", (message) => {
+            browserMessages.push({
+                type: message.type(),
+                text: message.text(),
+            });
+        });
+    }
+    await page.addInitScript((args) => {
+        const store = {
+            websocketPort: args.port,
+        };
+        if (args.websocketUrl) {
+            store.websocketUrl = args.websocketUrl;
+        }
+        window.__DRAWIO_MCP_TEST_HOOKS__ = true;
+        window.localStorage.setItem("drawio-mcp-plugin-config", JSON.stringify(store));
+        window.localStorage.setItem("drawio-mcp-config", JSON.stringify(store));
+    }, { port: wsPort, websocketUrl: webSocketUrl });
+    await page.goto(editorUrl, { waitUntil: "domcontentloaded" });
+    await waitForPluginReady(page);
+    return page;
+}
 export async function disposeRealEnvironmentContext(context) {
-    await context.client.close();
-    await context.browser.close();
-    await context.app.close();
+    if (!context)
+        return;
+    await context.client?.close();
+    await context.browserContext?.close();
+    await context.browser?.close();
+    await context.app?.close();
+    if (context.proxy) {
+        await context.proxy.stop();
+    }
 }
 export async function waitForPluginReady(page) {
     await page.waitForFunction(() => {
@@ -160,6 +246,7 @@ export async function resetDiagram(context) {
     await context.client.callTool({
         name: "import-diagram",
         arguments: {
+            target_page: { index: 0 },
             data: emptyDiagram,
             format: "xml",
             mode: "replace",

package/build/real-environment/import-mermaid.test.js

@@ -0,0 +1,81 @@
+import { afterAll, beforeAll, describe, expect, it } from "@jest/globals";
+import { createRealEnvironmentContext, disposeRealEnvironmentContext, resetDiagram, } from "./harness.js";
+import { expectNoBrowserErrors, expectNoServerErrors } from "./assertions.js";
+import { callToolJson } from "./tools.js";
+const FLOWCHART = "graph TD\nA[Start] --> B[Stop]";
+describe("real environment/import-mermaid", () => {
+    let context;
+    beforeAll(async () => {
+        context = await createRealEnvironmentContext();
+    }, 180000);
+    afterAll(async () => {
+        await disposeRealEnvironmentContext(context);
+    });
+    it("native mode converts a flowchart to native cells on the target page", async () => {
+        await resetDiagram(context);
+        context.browserMessages.length = 0;
+        const logCountBefore = context.logger.entries.length;
+        const { payload } = await callToolJson(context, "import-mermaid", {
+            target_page: { index: 0 },
+            mermaid_source: FLOWCHART,
+            mode: "native",
+            insert_mode: "add",
+        });
+        expect(payload.success).toBe(true);
+        expect(payload.result?.mode).toBe("native");
+        expect(typeof payload.result?.xml).toBe("string");
+        expect(payload.result?.xml ?? "").toContain("mxGraphModel");
+        await context.page.waitForFunction(() => {
+            const ui = window.ui;
+            const model = ui?.editor?.graph?.getModel?.();
+            const cells = Object.values(model?.cells ?? {});
+            return cells.some((cell) => cell?.vertex === true);
+        });
+        await expectNoBrowserErrors(context, "import-mermaid:native");
+        await expectNoServerErrors(context, "import-mermaid:native", logCountBefore);
+    }, 180000);
+    it("embed mode produces XML carrying the mermaidData attribute", async () => {
+        await resetDiagram(context);
+        const { payload } = await callToolJson(context, "import-mermaid", {
+            target_page: { index: 0 },
+            mermaid_source: FLOWCHART,
+            mode: "embed",
+            insert_mode: "replace",
+        });
+        expect(payload.success).toBe(true);
+        expect(payload.result?.mode).toBe("embed");
+        expect(payload.result?.xml ?? "").toContain("mermaidData");
+        expect(payload.result?.xml ?? "").toContain("shape=image");
+    }, 180000);
+    it("requires target_page for replace and add modes", async () => {
+        await resetDiagram(context);
+        const result = await context.client.callTool({
+            name: "import-mermaid",
+            arguments: {
+                mermaid_source: FLOWCHART,
+                mode: "native",
+                insert_mode: "add",
+            },
+        });
+        expect(result.isError).toBe(true);
+        const content = result.content;
+        expect(String(content[0]?.text ?? "")).toContain("`target_page` is required");
+    }, 180000);
+    it("allows new-page imports without target_page", async () => {
+        await resetDiagram(context);
+        const { payload: beforePagesPayload } = await callToolJson(context, "list-pages", {});
+        expect(beforePagesPayload.success).toBe(true);
+        const { payload } = await callToolJson(context, "import-mermaid", {
+            mermaid_source: FLOWCHART,
+            mode: "native",
+            insert_mode: "new-page",
+        });
+        expect(payload.success).toBe(true);
+        expect(payload.result?.mode).toBe("native");
+        expect(payload.result?.xml ?? "").toContain("mxGraphModel");
+        const { payload: afterPagesPayload } = await callToolJson(context, "list-pages", {});
+        expect(afterPagesPayload.success).toBe(true);
+        expect(afterPagesPayload.result).toHaveLength(beforePagesPayload.result.length + 1);
+        expect(afterPagesPayload.result.at(-1)?.is_current).toBe(true);
+    }, 180000);
+});