release: WRNexusJS 0.8.0

packages/image/test/optimize.test.ts

@@ -0,0 +1,46 @@
+import { expect, test } from "bun:test";
+import { mkdtempSync, readFileSync, writeFileSync } from "node:fs";
+import { tmpdir } from "node:os";
+import { join } from "node:path";
+import { optimizeImage } from "../src/index.ts";
+
+test("build optimizer emits deterministic bounded variants and a manifest", async () => {
+  const root = mkdtempSync(join(tmpdir(), "wrnexus-images-"));
+  const input = join(root, "Hero image.png");
+  writeFileSync(input, new Uint8Array([1, 2, 3]));
+  const manifest = await optimizeImage(input, {
+    outputDir: join(root, "output"),
+    widths: [800, 400, 800],
+    formats: ["webp", "avif"],
+    processor: {
+      async transform(_input, options) {
+        return {
+          data: new TextEncoder().encode(`${options.width}:${options.format}:${options.quality}`),
+          width: options.width,
+          height: options.width / 2,
+        };
+      },
+    },
+  });
+  expect(manifest.variants).toHaveLength(4);
+  expect(manifest.variants.map(({ width, format }) => `${width}:${format}`)).toEqual([
+    "400:webp",
+    "800:webp",
+    "400:avif",
+    "800:avif",
+  ]);
+  expect(readFileSync(manifest.variants[0]!.path, "utf8")).toBe("400:webp:80");
+});
+
+test("build optimizer rejects variant explosions and unsupported formats", async () => {
+  const processor = { transform: async () => ({ data: new Uint8Array(), width: 1, height: 1 }) };
+  await expect(
+    optimizeImage("input.png", {
+      outputDir: ".",
+      widths: [100, 200],
+      formats: ["webp", "avif"],
+      maxVariants: 3,
+      processor,
+    }),
+  ).rejects.toThrow("exceeds");
+});

packages/image/test/package-kit.test.ts

@@ -0,0 +1,50 @@
+import { describe, expect, test } from "bun:test";
+import {
+  createBlurPlaceholder,
+  createCdnImageLoader,
+  createPathImageLoader,
+  createPicture,
+  imagePreload,
+} from "../src/index.ts";
+
+describe("image package kit", () => {
+  test("creates AVIF/WebP picture plans and preload hints", () => {
+    const picture = createPicture({
+      src: "/hero.jpg",
+      alt: "Hero",
+      width: 1200,
+      height: 630,
+      widths: [480, 768, 1200],
+      formats: ["avif", "webp"],
+    });
+    expect(picture.sources.map((source) => source.type)).toEqual(["image/avif", "image/webp"]);
+    expect(imagePreload(picture.image)).toContain('rel="preload"');
+  });
+
+  test("requires HTTPS CDN endpoints and safe placeholder colors", () => {
+    expect(() => createCdnImageLoader("http://images.example.test")).toThrow();
+    expect(() => createBlurPlaceholder({ color: 'url("javascript:alert(1)")' })).toThrow();
+    expect(createBlurPlaceholder({ color: "#fff", accent: "var(--wire-color-surface)" })).toMatch(
+      /^data:image\/svg\+xml/,
+    );
+  });
+
+  test("keeps query parameters before URL fragments and rejects invalid dimensions", () => {
+    const picture = createPicture({
+      src: "/hero.jpg#preview",
+      alt: "Hero",
+      width: 640,
+      height: 360,
+    });
+    expect(picture.image.src).toContain("?w=640");
+    expect(picture.image.src.endsWith("#preview")).toBe(true);
+    expect(() => createBlurPlaceholder({ width: Number.NaN })).toThrow("finite");
+  });
+
+  test("encodes source paths in the local loader", () => {
+    const loader = createPathImageLoader();
+    expect(loader({ src: "/images/hero one.jpg", width: 640 })).toContain(
+      encodeURIComponent("/images/hero one.jpg"),
+    );
+  });
+});