npm - mulmocast - Versions diffs - 2.1.26 → 2.1.27 - Mend

mulmocast 2.1.26 → 2.1.27

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.

Files changed (5) hide show

package/assets/html/chart.html CHANGED Viewed

@@ -17,21 +17,33 @@
 <body>
     <h1>${title}</h1>
     <div class="chart-container">
-        <canvas id="myChart"></canvas>
+        <canvas id="myChart" data-chart-ready="false"></canvas>
     </div>
     <!-- Plain JavaScript instead of TypeScript -->
     <script>
-        // Wait for DOM to be fully loaded
-        document.addEventListener('DOMContentLoaded', function() {
-            // Get the canvas element
+        // Wait for DOM and Chart.js to be ready, then render.
+        function initChart() {
+            if (!window.Chart) return false;
             const ctx = document.getElementById('myChart');
-            // Create the data object (no TypeScript interfaces)
+            if (!ctx) return false;
             const chartData = ${chart_data};
-            // Initialize the chart
             new Chart(ctx, chartData);
+            requestAnimationFrame(() => {
+                requestAnimationFrame(() => {
+                    ctx.dataset.chartReady = "true";
+                });
+            });
+            return true;
+        }
+        function waitForChart() {
+            if (initChart()) return;
+            setTimeout(waitForChart, 50);
+        }
+        document.addEventListener('DOMContentLoaded', function() {
+            waitForChart();
         });
     </script>
 </body>

package/lib/cli/bin.js CHANGED Viewed

File without changes

package/lib/mcp/server.js CHANGED Viewed

File without changes

package/lib/utils/markdown.js CHANGED Viewed

@@ -1,35 +1,113 @@
 import { marked } from "marked";
 import puppeteer from "puppeteer";
 const isCI = process.env.CI === "true";
+const reuseBrowser = process.env.MULMO_PUPPETEER_REUSE !== "0";
+const browserLaunchArgs = isCI ? ["--no-sandbox"] : [];
+// Shared browser to avoid spawning a new Chromium per render.
+let sharedBrowserPromise = null;
+let sharedBrowserRefs = 0;
+let sharedBrowserCloseTimer = null;
+// Acquire a browser instance; reuse a shared one when enabled.
+const acquireBrowser = async () => {
+    if (!reuseBrowser) {
+        return await puppeteer.launch({ args: browserLaunchArgs });
+    }
+    sharedBrowserRefs += 1;
+    if (sharedBrowserCloseTimer) {
+        clearTimeout(sharedBrowserCloseTimer);
+        sharedBrowserCloseTimer = null;
+    }
+    if (!sharedBrowserPromise) {
+        sharedBrowserPromise = puppeteer.launch({ args: browserLaunchArgs });
+    }
+    const currentPromise = sharedBrowserPromise;
+    try {
+        return await currentPromise;
+    }
+    catch (error) {
+        if (sharedBrowserPromise === currentPromise) {
+            sharedBrowserPromise = null;
+        }
+        sharedBrowserRefs = Math.max(0, sharedBrowserRefs - 1);
+        throw error;
+    }
+};
+// Release the browser; close only after a short idle window.
+const releaseBrowser = async (browser) => {
+    if (!reuseBrowser) {
+        await browser.close().catch(() => { });
+        return;
+    }
+    sharedBrowserRefs = Math.max(0, sharedBrowserRefs - 1);
+    if (sharedBrowserRefs > 0 || !sharedBrowserPromise) {
+        return;
+    }
+    // Delay close to allow back-to-back renders to reuse the browser.
+    sharedBrowserCloseTimer = setTimeout(async () => {
+        const current = sharedBrowserPromise;
+        sharedBrowserPromise = null;
+        sharedBrowserCloseTimer = null;
+        if (current) {
+            await (await current).close().catch(() => { });
+        }
+    }, 300);
+};
+// Wait for a single animation frame to let canvas paints settle.
+const waitForNextFrame = async (page) => {
+    await page.evaluate(() => new Promise((resolve) => {
+        requestAnimationFrame(() => resolve());
+    }));
+};
 export const renderHTMLToImage = async (html, outputPath, width, height, isMermaid = false, omitBackground = false) => {
-    // Use Puppeteer to render HTML to an image
-    const browser = await puppeteer.launch({
-        args: isCI ? ["--no-sandbox"] : [],
-    });
-    const page = await browser.newPage();
-    // Set the page content to the HTML generated from the Markdown
-    await page.setContent(html);
-    // Adjust page settings if needed (like width, height, etc.)
-    await page.setViewport({ width, height });
-    await page.addStyleTag({ content: "html,body{margin:0;padding:0;overflow:hidden}" });
-    if (isMermaid) {
-        await page.waitForFunction(() => {
-            const el = document.querySelector(".mermaid");
-            return el && el.dataset.ready === "true";
-        }, { timeout: 20000 });
-    }
-    // Measure the size of the page and scale the page to the width and height
-    await page.evaluate(({ vw, vh }) => {
-        const de = document.documentElement;
-        const sw = Math.max(de.scrollWidth, document.body.scrollWidth || 0);
-        const sh = Math.max(de.scrollHeight, document.body.scrollHeight || 0);
-        const scale = Math.min(vw / (sw || vw), vh / (sh || vh), 1); // <=1 で縮小のみ
-        de.style.overflow = "hidden";
-        document.body.style.zoom = String(scale);
-    }, { vw: width, vh: height });
-    // Step 3: Capture screenshot of the page (which contains the Markdown-rendered HTML)
-    await page.screenshot({ path: outputPath, omitBackground });
-    await browser.close();
+    // Charts are rendered in a dedicated browser to avoid shared-page timing issues.
+    const useSharedBrowser = reuseBrowser && !html.includes("data-chart-ready");
+    const browser = useSharedBrowser ? await acquireBrowser() : await puppeteer.launch({ args: browserLaunchArgs });
+    let page = null;
+    try {
+        page = await browser.newPage();
+        // Adjust page settings if needed (like width, height, etc.)
+        await page.setViewport({ width, height });
+        // Set the page content to the HTML generated from the Markdown
+        await page.setContent(html, { waitUntil: "domcontentloaded" });
+        await page.addStyleTag({ content: "html,body{margin:0;padding:0;overflow:hidden}" });
+        if (isMermaid) {
+            await page.waitForFunction(() => {
+                const element = document.querySelector(".mermaid");
+                return element && element.dataset.ready === "true";
+            }, { timeout: 20000 });
+        }
+        if (html.includes("data-chart-ready")) {
+            await page.waitForFunction(() => {
+                const canvas = document.querySelector("canvas[data-chart-ready='true']");
+                return !!canvas;
+            }, { timeout: 20000 });
+            // Give the browser a couple of frames to paint the canvas.
+            await waitForNextFrame(page);
+            await waitForNextFrame(page);
+        }
+        // Measure the size of the page and scale the page to the width and height
+        await page.evaluate(({ vw, vh }) => {
+            const documentElement = document.documentElement;
+            const scrollWidth = Math.max(documentElement.scrollWidth, document.body.scrollWidth || 0);
+            const scrollHeight = Math.max(documentElement.scrollHeight, document.body.scrollHeight || 0);
+            const scale = Math.min(vw / (scrollWidth || vw), vh / (scrollHeight || vh), 1); // <=1 で縮小のみ
+            documentElement.style.overflow = "hidden";
+            document.body.style.zoom = String(scale);
+        }, { vw: width, vh: height });
+        // Step 3: Capture screenshot of the page (which contains the Markdown-rendered HTML)
+        await page.screenshot({ path: outputPath, omitBackground });
+    }
+    finally {
+        if (page) {
+            await page.close().catch(() => { });
+        }
+        if (useSharedBrowser) {
+            await releaseBrowser(browser);
+        }
+        else {
+            await browser.close().catch(() => { });
+        }
+    }
 };
 export const renderMarkdownToImage = async (markdown, style, outputPath, width, height) => {
     const header = `<head><style>${style}</style></head>`;

package/package.json CHANGED Viewed

@@ -1,6 +1,6 @@
 {
   "name": "mulmocast",
-  "version": "2.1.26",
+  "version": "2.1.27",
   "description": "",
   "type": "module",
   "main": "lib/index.node.js",