@vizhub/runtime 0.1.4 → 0.2.0

package/dist/common/packageJson.test.js

@@ -0,0 +1,146 @@
+import { describe, it, expect } from "vitest";
+import { packageJSON, dependencies, getConfiguredLibraries, dependencySource, getLicense, } from "./packageJson";
+describe("packageJson", () => {
+    const mockFiles = {
+        "package.json": JSON.stringify({
+            dependencies: {
+                react: "17.0.2",
+                d3: "7.0.0",
+            },
+            vizhub: {
+                libraries: {
+                    d3: { path: "/dist/d3.min.js" },
+                },
+            },
+            license: "Apache-2.0",
+        }),
+    };
+    const emptyFiles = {};
+    const invalidFiles = {
+        "package.json": "invalid json",
+    };
+    describe("packageJSON", () => {
+        it("should parse valid package.json", () => {
+            const result = packageJSON(mockFiles);
+            expect(result).toHaveProperty("dependencies");
+            expect(result.dependencies).toHaveProperty("react", "17.0.2");
+        });
+        it("should return empty object for missing package.json", () => {
+            const result = packageJSON(emptyFiles);
+            expect(result).toEqual({
+                dependencies: {},
+                vizhub: {},
+                license: "MIT",
+            });
+        });
+        it("should handle invalid JSON", () => {
+            const result = packageJSON(invalidFiles);
+            expect(result).toEqual({
+                dependencies: {},
+                vizhub: {},
+                license: "MIT",
+            });
+        });
+    });
+    describe("dependencies", () => {
+        it("should return dependencies from package.json", () => {
+            const result = dependencies(mockFiles);
+            expect(result).toEqual({
+                react: "17.0.2",
+                d3: "7.0.0",
+            });
+        });
+        it("should return empty object when no dependencies", () => {
+            const result = dependencies(emptyFiles);
+            expect(result).toEqual({});
+        });
+    });
+    describe("getConfiguredLibraries", () => {
+        it("should return configured libraries", () => {
+            const result = getConfiguredLibraries(mockFiles);
+            expect(result).toEqual({
+                d3: { path: "/dist/d3.min.js" },
+            });
+        });
+        it("should return empty object when no libraries configured", () => {
+            const result = getConfiguredLibraries(emptyFiles);
+            expect(result).toEqual({});
+        });
+    });
+    describe("dependencySource", () => {
+        it("should generate correct URL with path - jsdelivr", () => {
+            const dependency = { name: "d3", version: "7.0.0" };
+            const libraries = { d3: { path: "/dist/d3.min.js" } };
+            const result = dependencySource(dependency, libraries);
+            expect(result).toBe("https://cdn.jsdelivr.net/npm/d3@7.0.0/dist/d3.min.js");
+        });
+        it("should generate correct URL without path - jsdelivr", () => {
+            const dependency = {
+                name: "react",
+                version: "17.0.2",
+            };
+            const libraries = {};
+            const result = dependencySource(dependency, libraries);
+            expect(result).toBe("https://cdn.jsdelivr.net/npm/react@17.0.2");
+        });
+        it("should generate correct URL with path - unpkg", () => {
+            const dependency = { name: "d3", version: "7.0.0" };
+            const libraries = { d3: { path: "/dist/d3.min.js" } };
+            const result = dependencySource(dependency, libraries, "unpkg");
+            expect(result).toBe("https://unpkg.com/d3@7.0.0/dist/d3.min.js");
+        });
+        it("should generate correct URL without path - unpkg", () => {
+            const dependency = {
+                name: "react",
+                version: "17.0.2",
+            };
+            const libraries = {};
+            const result = dependencySource(dependency, libraries, "unpkg");
+            expect(result).toBe("https://unpkg.com/react@17.0.2");
+        });
+    });
+    describe("getLicense", () => {
+        it("should return license from package.json", () => {
+            const result = getLicense(mockFiles);
+            expect(result).toBe("Apache-2.0");
+        });
+        it("should return default MIT license when not specified", () => {
+            const result = getLicense(emptyFiles);
+            expect(result).toBe("MIT");
+        });
+    });
+    describe("Edge cases", () => {
+        it("should handle malformed library configuration", () => {
+            const malformedFiles = {
+                "package.json": JSON.stringify({
+                    dependencies: { d3: "7.0.0" },
+                    vizhub: { libraries: { d3: null } },
+                }),
+            };
+            const result = getConfiguredLibraries(malformedFiles);
+            expect(result).toEqual({ d3: null });
+        });
+        it("should handle empty version strings", () => {
+            const dependency = { name: "react", version: "" };
+            const result = dependencySource(dependency, {});
+            expect(result).toBe("https://cdn.jsdelivr.net/npm/react@");
+        });
+        it("should handle special characters in dependency names", () => {
+            const specialCharDep = {
+                name: "@angular/core",
+                version: "14.0.0",
+            };
+            const result = dependencySource(specialCharDep, {});
+            expect(result).toBe("https://cdn.jsdelivr.net/npm/@angular/core@14.0.0");
+        });
+        it("should handle unusual license formats", () => {
+            const unusualLicenseFiles = {
+                "package.json": JSON.stringify({
+                    license: { type: "MIT" },
+                }),
+            };
+            const result = getLicense(unusualLicenseFiles);
+            expect(result).toBe("MIT");
+        });
+    });
+});

package/dist/common/sucrasePlugin.d.ts

@@ -0,0 +1,2 @@
+import type { Plugin } from "rollup";
+export declare function sucrasePlugin(): Plugin;

package/dist/common/sucrasePlugin.js

@@ -0,0 +1,24 @@
+import { transform } from "sucrase";
+export function sucrasePlugin() {
+    return {
+        name: "sucrase",
+        transform(code, id) {
+            // Transform .js, .jsx, and .tsx files
+            if (!id.match(/\.(?:js|[jt]sx)$/)) {
+                return null;
+            }
+            const result = transform(code, {
+                transforms: ["jsx", "typescript"],
+                filePath: id, // For source maps
+                sourceMapOptions: {
+                    compiledFilename: "bundle.js",
+                },
+                production: true,
+            });
+            return {
+                code: result.code,
+                map: result.sourceMap,
+            };
+        },
+    };
+}

package/dist/common/virtualFileSystem.d.ts

@@ -0,0 +1,3 @@
+import { Plugin } from "rollup";
+import { FileCollection } from "../types";
+export declare const virtualFileSystem: (files: FileCollection) => Plugin;

package/dist/common/virtualFileSystem.js

@@ -0,0 +1,75 @@
+const normalizePath = (filepath) => {
+    // Remove leading ./
+    let normalized = filepath.replace(/^\.\//, "");
+    // Replace multiple slashes with single slash
+    normalized = normalized.replace(/\/+/g, "/");
+    // Remove trailing slash
+    normalized = normalized.replace(/\/$/, "");
+    return normalized;
+};
+const joinPaths = (base, relative) => {
+    // Get directory name of base path
+    const baseDir = base.includes("/")
+        ? base.slice(0, base.lastIndexOf("/"))
+        : "";
+    // Handle .. by removing one directory level
+    const parts = relative.split("/");
+    const resultParts = baseDir
+        ? baseDir.split("/")
+        : [];
+    for (const part of parts) {
+        if (part === "..") {
+            resultParts.pop();
+        }
+        else if (part !== "." && part !== "") {
+            resultParts.push(part);
+        }
+    }
+    return resultParts.join("/");
+};
+export const virtualFileSystem = (files) => {
+    return {
+        name: "virtual-file-system",
+        resolveId(source, importer) {
+            // Handle relative paths
+            if (source.startsWith("./") ||
+                source.startsWith("../")) {
+                const resolvedPath = importer
+                    ? normalizePath(joinPaths(importer, source))
+                    : normalizePath(source);
+                // Try exact match first
+                if (files[resolvedPath]) {
+                    return resolvedPath;
+                }
+                // Try with extensions if no exact match is found
+                const extensions = [".js", ".jsx", ".ts", ".tsx"];
+                for (const ext of extensions) {
+                    const pathWithExt = resolvedPath + ext;
+                    if (files[pathWithExt]) {
+                        return pathWithExt;
+                    }
+                }
+            }
+            // Handle bare module imports
+            if (files[source]) {
+                return source;
+            }
+            // Try bare imports with extensions
+            const extensions = [".js", ".jsx", ".ts", ".tsx"];
+            for (const ext of extensions) {
+                const pathWithExt = source + ext;
+                if (files[pathWithExt]) {
+                    return pathWithExt;
+                }
+            }
+            return null;
+        },
+        load(id) {
+            // Return the contents if the file exists in our virtual system
+            if (files[id]) {
+                return files[id];
+            }
+            return null;
+        },
+    };
+};

package/dist/determineRuntimeVersion.d.ts

@@ -0,0 +1,2 @@
+import { FileCollection, runtimeVersion } from "./types";
+export declare const determineRuntimeVersion: (files: FileCollection) => runtimeVersion | null;

package/dist/determineRuntimeVersion.js

@@ -0,0 +1,22 @@
+export const determineRuntimeVersion = (files) => {
+    if (Object.keys(files).length === 0) {
+        return null;
+    }
+    const hasIndexHTML = "index.html" in files;
+    const hasIndexJS = "index.js" in files;
+    const hasIndexJSX = "index.jsx" in files;
+    if (hasIndexHTML) {
+        const hasModuleScript = files["index.html"].includes('type="module"');
+        if (hasModuleScript) {
+            return "v4";
+        }
+        if (hasIndexJS || hasIndexJSX) {
+            return "v2";
+        }
+        return "v1";
+    }
+    if (!hasIndexHTML && hasIndexJS) {
+        return "v3";
+    }
+    return null;
+};

package/dist/determineRuntimeVersion.test.d.ts

@@ -0,0 +1 @@
+export {};

package/dist/determineRuntimeVersion.test.js

@@ -0,0 +1,101 @@
+import { describe, it, expect } from "vitest";
+import { determineRuntimeVersion } from "./determineRuntimeVersion";
+import { jsScriptTagTypeModule, jsScriptTagTypeModules, fetchInterception, esmBuild, } from "./test/fixtures/v4";
+describe("determineRuntimeVersion", () => {
+    it("should return null when there are no files", () => {
+        const mockFiles = {};
+        const result = determineRuntimeVersion(mockFiles);
+        expect(result).toBe(null);
+    });
+    it("should return v1 when only index.html exists", () => {
+        const mockFiles = {
+            "index.html": "<html></html>",
+        };
+        const result = determineRuntimeVersion(mockFiles);
+        expect(result).toBe("v1");
+    });
+    it("should return v2 when both index.html and index.js exist", () => {
+        const mockFiles = {
+            "index.html": "<html></html>",
+            "index.js": 'console.log("Hello");',
+        };
+        const result = determineRuntimeVersion(mockFiles);
+        expect(result).toBe("v2");
+    });
+    it("should return v2 when both index.html and index.jsx exist", () => {
+        const mockFiles = {
+            "index.html": "<html></html>",
+            "index.jsx": 'console.log("Hello");',
+        };
+        const result = determineRuntimeVersion(mockFiles);
+        expect(result).toBe("v2");
+    });
+    it("should return v3 when only index.js exists", () => {
+        const mockFiles = {
+            "index.js": 'console.log("Hello");',
+        };
+        const result = determineRuntimeVersion(mockFiles);
+        expect(result).toBe("v3");
+    });
+    it("should return null when only index.jsx exists (no v3 support for JSX)", () => {
+        const mockFiles = {
+            "index.jsx": 'console.log("Hello");',
+        };
+        const result = determineRuntimeVersion(mockFiles);
+        expect(result).toBe(null);
+    });
+    it("should return v4 when index.html contains script type=module with importmap", () => {
+        const mockFiles = {
+            "index.html": `
+        <!DOCTYPE html>
+        <html>
+          <head>
+            <script type="importmap">
+              { "imports": { "test": "./test.js" } }
+            </script>
+          </head>
+          <body>
+            <script type="module" src="index.js"></script>
+          </body>
+        </html>
+      `,
+            "index.js": 'import { hello } from "test"; console.log(hello);',
+            "test.js": 'export const hello = "world";',
+        };
+        const result = determineRuntimeVersion(mockFiles);
+        expect(result).toBe("v4");
+    });
+    it("should return v4 when multiple module scripts are present", () => {
+        const mockFiles = {
+            "index.html": `
+        <!DOCTYPE html>
+        <html>
+          <body>
+            <script type="module" src="index.js"></script>
+          </body>
+        </html>
+      `,
+            "index.js": 'import { hello } from "./utils.js"; console.log(hello);',
+            "utils.js": 'export const hello = "world";',
+        };
+        const result = determineRuntimeVersion(mockFiles);
+        expect(result).toBe("v4");
+    });
+    // Test v4 fixtures
+    it("should detect v4 for jsScriptTagTypeModule fixture", () => {
+        const result = determineRuntimeVersion(jsScriptTagTypeModule);
+        expect(result).toBe("v4");
+    });
+    it("should detect v4 for jsScriptTagTypeModules fixture", () => {
+        const result = determineRuntimeVersion(jsScriptTagTypeModules);
+        expect(result).toBe("v4");
+    });
+    it("should detect v4 for fetchInterception fixture", () => {
+        const result = determineRuntimeVersion(fetchInterception);
+        expect(result).toBe("v4");
+    });
+    it("should detect v4 for esmBuild fixture", () => {
+        const result = determineRuntimeVersion(esmBuild);
+        expect(result).toBe("v4");
+    });
+});

package/dist/fixtures/basicHTML.d.ts

@@ -0,0 +1,2 @@
+import { VizFiles } from "@vizhub/viz-types";
+export declare const basicHTML: VizFiles;

package/dist/fixtures/basicHTML.js

@@ -0,0 +1,22 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.basicHTML = void 0;
+const viz_types_1 = require("@vizhub/viz-types");
+exports.basicHTML = {
+    [(0, viz_types_1.generateVizFileId)()]: {
+        name: "index.html",
+        text: `<!DOCTYPE html>
+<html>
+  <head>
+    <title>My HTML Document</title>
+  </head>
+  <body>
+    <h1>Hello, World!</h1>
+    <p>This is my first HTML document.</p>
+    <script>
+      console.log('Hello, World!');
+    </script>
+  </body>
+</html>`,
+    },
+};

package/dist/fixtures/fetchProxy.d.ts

@@ -0,0 +1,2 @@
+import { VizFiles } from "@vizhub/viz-types";
+export declare const fetchProxy: VizFiles;

package/dist/fixtures/fetchProxy.js

@@ -0,0 +1,25 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.fetchProxy = void 0;
+const viz_types_1 = require("@vizhub/viz-types");
+exports.fetchProxy = {
+    [(0, viz_types_1.generateVizFileId)()]: {
+        name: "index.html",
+        text: `<!DOCTYPE html>
+<html>
+  <body>
+    <script src="index.js"></script>
+  </body>
+</html>`,
+    },
+    [(0, viz_types_1.generateVizFileId)()]: {
+        name: "index.js",
+        text: `fetch("data.csv")
+        .then((response) => response.text())
+        .then(console.log);`,
+    },
+    [(0, viz_types_1.generateVizFileId)()]: {
+        name: "data.csv",
+        text: `Hello, Fetch!`,
+    },
+};

package/dist/fixtures/index.d.ts

@@ -0,0 +1,3 @@
+export { basicHTML } from "./basicHTML";
+export { jsScriptTag } from "./jsScriptTag";
+export { fetchProxy } from "./fetchProxy";

package/dist/fixtures/index.js

@@ -0,0 +1,9 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.fetchProxy = exports.jsScriptTag = exports.basicHTML = void 0;
+var basicHTML_1 = require("./basicHTML");
+Object.defineProperty(exports, "basicHTML", { enumerable: true, get: function () { return basicHTML_1.basicHTML; } });
+var jsScriptTag_1 = require("./jsScriptTag");
+Object.defineProperty(exports, "jsScriptTag", { enumerable: true, get: function () { return jsScriptTag_1.jsScriptTag; } });
+var fetchProxy_1 = require("./fetchProxy");
+Object.defineProperty(exports, "fetchProxy", { enumerable: true, get: function () { return fetchProxy_1.fetchProxy; } });

package/dist/fixtures/jsScriptTag.d.ts

@@ -0,0 +1,2 @@
+import { VizFiles } from "@vizhub/viz-types";
+export declare const jsScriptTag: VizFiles;

package/dist/fixtures/jsScriptTag.js

@@ -0,0 +1,19 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.jsScriptTag = void 0;
+const viz_types_1 = require("@vizhub/viz-types");
+exports.jsScriptTag = {
+    [(0, viz_types_1.generateVizFileId)()]: {
+        name: "index.html",
+        text: `<!DOCTYPE html>
+<html>
+  <body>
+    <script src="index.js"></script>
+  </body>
+</html>`,
+    },
+    [(0, viz_types_1.generateVizFileId)()]: {
+        name: "index.js",
+        text: `console.log('Hello, JS!');`,
+    },
+};

package/dist/index.d.ts

@@ -1,8 +1,14 @@
-export type { V3BuildResult } from './v3Runtime';
-export type { VizCache } from './v3Runtime/vizCache';
-export { computeSrcDoc } from './computeSrcDoc';
-export { setJSDOM } from './v2Runtime/getComputedIndexHtml';
-export { useRuntime } from './useRuntime';
-export { createVizCache } from './v3Runtime/vizCache';
-export { cleanRollupErrorMessage } from './v3Runtime/cleanRollupErrorMessage';
-//# sourceMappingURL=index.d.ts.map
+import { FileCollection } from "magic-sandbox";
+import type { RollupBuild, RollupOptions } from "rollup";
+import { VizCache } from "./v3/vizCache";
+import { SlugCache } from "./v3/slugCache";
+import { SvelteCompiler } from "./v3/transformSvelte";
+export declare const buildHTML: ({ files, rollup, enableSourcemap, vizCache, vizId, slugCache, getSvelteCompiler, }: {
+    files?: FileCollection;
+    rollup?: (options: RollupOptions) => Promise<RollupBuild>;
+    enableSourcemap?: boolean;
+    vizCache?: VizCache;
+    vizId?: string;
+    slugCache?: SlugCache;
+    getSvelteCompiler?: () => Promise<SvelteCompiler>;
+}) => Promise<string>;