@runwisp/ui 1.7.0 → 1.7.1

package/package.json

@@ -1,7 +1,7 @@
 {
   "name": "@runwisp/ui",
   "description": "Svelte 5 UI component library for RunWisp dashboards and admin interfaces.",
-  "version": "1.7.0",
+  "version": "1.7.1",
   "license": "Apache-2.0",
   "repository": {
     "type": "git",
@@ -49,8 +49,8 @@
   "devDependencies": {
     "@chromatic-com/storybook": "^5.2.1",
     "@eslint/js": "^10.0.1",
-    "@runwisp/eslint-config": "1.7.0",
-    "@runwisp/typescript-config": "1.7.0",
+    "@runwisp/eslint-config": "1.7.1",
+    "@runwisp/typescript-config": "1.7.1",
     "@storybook/addon-a11y": "^10.5.5",
     "@storybook/addon-docs": "^10.5.5",
     "@storybook/addon-svelte-csf": "^5.1.2",
@@ -92,7 +92,7 @@
     "@fontsource-variable/geist-mono": "^5.3.0",
     "@fontsource/tasa-orbiter": "^5.3.0",
     "@lucide/svelte": "^1.52.0",
-    "@runwisp/common": "1.7.0",
+    "@runwisp/common": "1.7.1",
     "@tanstack/svelte-virtual": "^3.13.35",
     "ansi-to-html": "^0.7.2",
     "cron-parser": "^5.7.0",

package/src/lib/log-console/LogCache.svelte.test.ts

@@ -0,0 +1,135 @@
+// SPDX-FileCopyrightText: PoppyCake, s.r.o.
+// SPDX-License-Identifier: Apache-2.0
+
+import { describe, expect, it } from "vitest";
+import { LogCache } from "./LogCache.svelte";
+
+describe("LogCache", () => {
+    it("merges a slice, skipping bad keys and reporting what changed", () => {
+        const cache = new LogCache();
+        expect(cache.mergeSlice({ 2: "two", 5: "five", [-1]: "neg" })).toEqual({
+            touched: true,
+            min: 2,
+            max: 5,
+        });
+        expect(cache.size).toBe(2);
+        expect(cache.mergeSlice({ 2: "two" }).touched).toBe(false);
+    });
+
+    it("keeps the widest line width even after that line is gone", () => {
+        const cache = new LogCache();
+        cache.mergeSlice({ 0: "x".repeat(40) });
+        cache.mergeSlice({ 0: "short" });
+        expect(cache.maxLineColumns).toBe(40);
+    });
+
+    it("only grows totals and the first available line from events", () => {
+        const cache = new LogCache();
+        cache.applyEvent({
+            lines: {},
+            sizeLines: 10,
+            sizeBytes: 300,
+            finished: false,
+            firstAvailableLine: 4,
+        });
+        cache.applyEvent({
+            lines: {},
+            sizeLines: 8,
+            sizeBytes: 100,
+            finished: false,
+            firstAvailableLine: 2,
+        });
+        expect([cache.totalLines, cache.totalBytes, cache.firstAvailableLine]).toEqual([
+            10, 300, 4,
+        ]);
+    });
+
+    it("records frame history only for lines that have some", () => {
+        const cache = new LogCache();
+        cache.applyEvent({
+            lines: { 3: "100%" },
+            sizeLines: 4,
+            finished: false,
+            frameCounts: { 3: 12, 1: 0 },
+        });
+        expect([...cache.frameCounts]).toEqual([[3, 12]]);
+    });
+
+    it("orders the live overlay stdout, stderr, then other streams by name", () => {
+        const cache = new LogCache();
+        cache.applyRegion({ stream: "zeta", epoch: 1, rows: ["z"] });
+        cache.applyRegion({ stream: "stderr", epoch: 1, rows: ["e"] });
+        cache.applyRegion({ stream: "alpha", epoch: 1, rows: ["a"] });
+        cache.applyRegion({ stream: "stdout", epoch: 1, rows: ["o1", "o2"] });
+        expect(cache.overlayRows).toEqual(["o1", "o2", "e", "a", "z"]);
+
+        cache.applyRegion({ stream: "zeta", epoch: 2, rows: [] });
+        expect(cache.overlayRows).toEqual(["o1", "o2", "e", "a"]);
+    });
+
+    it("keeps region frames out of the committed lines and drops them once finished", () => {
+        const cache = new LogCache();
+        const res = cache.applyEvent({
+            lines: {},
+            sizeLines: 0,
+            finished: false,
+            region: { stream: "stdout", epoch: 1, rows: ["[##..] 50%"] },
+        });
+        expect(res.touched).toBe(false);
+        expect(cache.size).toBe(0);
+        expect(cache.overlayRows).toEqual(["[##..] 50%"]);
+
+        cache.applyEvent({ lines: { 0: "done" }, sizeLines: 1, finished: true });
+        expect(cache.overlayRows).toEqual([]);
+        expect(cache.finished).toBe(true);
+    });
+
+    it("prunes lines far from the viewport once the cache is full", () => {
+        const cache = new LogCache();
+        const slice: Record<number, string> = {};
+        for (let n = 0; n < cache.MAX_CACHE_SIZE; n++) slice[n] = "l";
+        cache.mergeSlice(slice);
+
+        cache.prune(40_000, 40_100);
+        expect(cache.lines.has(40_050)).toBe(true);
+        expect(cache.lines.has(0)).toBe(false);
+        expect(cache.size).toBeLessThan(cache.MAX_CACHE_SIZE);
+    });
+
+    it("leaves a cache under the limit alone", () => {
+        const cache = new LogCache();
+        cache.mergeSlice({ 0: "a", 99_999: "b" });
+        cache.prune(50_000, 50_010);
+        expect(cache.size).toBe(2);
+    });
+
+    it("judges a range complete within what the server still holds", () => {
+        const cache = new LogCache();
+        cache.applyEvent({
+            lines: { 5: "a", 6: "b" },
+            sizeLines: 7,
+            finished: false,
+            firstAvailableLine: 5,
+        });
+        expect(cache.isRangeComplete(0, 100)).toBe(true);
+        cache.applyEvent({ lines: {}, sizeLines: 8, finished: false });
+        expect(cache.isRangeComplete(0, 100)).toBe(false);
+    });
+
+    it("resets to empty", () => {
+        const cache = new LogCache();
+        cache.applyEvent({
+            lines: { 0: "a" },
+            sizeLines: 1,
+            finished: true,
+            firstAvailableLine: 1,
+        });
+        cache.reset();
+        expect([cache.size, cache.totalLines, cache.finished, cache.firstAvailableLine]).toEqual([
+            0,
+            0,
+            false,
+            0,
+        ]);
+    });
+});

package/src/lib/log-console/LogFetcher.svelte.test.ts

@@ -0,0 +1,159 @@
+// SPDX-FileCopyrightText: PoppyCake, s.r.o.
+// SPDX-License-Identifier: Apache-2.0
+
+import { afterEach, beforeEach, describe, expect, it, vi } from "vitest";
+import { LogCache } from "./LogCache.svelte";
+import { LogFetcher } from "./LogFetcher.svelte";
+import type { LogEvent, LogSlice } from "./types";
+
+const CHUNK = 4096;
+
+/** A cache that knows the log is `total` lines long but holds none of them. */
+function emptyCache(total: number): LogCache {
+    const cache = new LogCache();
+    cache.applyEvent({ lines: {}, sizeLines: total, finished: false });
+    return cache;
+}
+
+/** A fetch whose calls stay pending until the test settles them. */
+function deferredFetch() {
+    const pending: { from: number; to: number; settle: (v: LogSlice | LogEvent) => void }[] = [];
+    const fn = vi.fn(
+        (from: number, to: number) =>
+            new Promise<LogSlice | LogEvent>((resolve) => {
+                pending.push({ from, to, settle: resolve });
+            }),
+    );
+    return { fn, pending };
+}
+
+const live: LogFetcher[] = [];
+
+function start(...args: ConstructorParameters<typeof LogFetcher>): LogFetcher {
+    const fetcher = new LogFetcher(...args);
+    live.push(fetcher);
+    return fetcher;
+}
+
+beforeEach(() => {
+    vi.useFakeTimers();
+});
+
+afterEach(() => {
+    for (const fetcher of live.splice(0)) fetcher.destroy();
+    vi.useRealTimers();
+});
+
+describe("LogFetcher", () => {
+    it("fetches a missing chunk once, merges it, and reports the loaded range", async () => {
+        const cache = emptyCache(10);
+        const onLoaded = vi.fn();
+        const fetchLogs = vi.fn(() => ({ 0: "a", 9: "j" }));
+        const fetcher = start(cache, fetchLogs, onLoaded);
+
+        fetcher.enqueue(0, 9);
+        fetcher.enqueue(2, 5); // same chunk, already queued
+        await vi.runAllTimersAsync();
+
+        expect(fetchLogs).toHaveBeenCalledExactlyOnceWith(0, 9);
+        expect(cache.lines.get(9)).toBe("j");
+        expect(onLoaded).toHaveBeenCalledWith(0, 9);
+        expect(fetcher.isFetching).toBe(false);
+    });
+
+    it("applies an event response, not just a slice", async () => {
+        const cache = emptyCache(1);
+        const fetcher = start(cache, () => ({ lines: { 0: "x" }, sizeLines: 3, finished: true }));
+        fetcher.enqueue(0, 0);
+        await vi.runAllTimersAsync();
+        expect([cache.totalLines, cache.finished]).toEqual([3, true]);
+    });
+
+    it("skips a range the cache already holds", async () => {
+        const cache = emptyCache(2);
+        cache.mergeSlice({ 0: "a", 1: "b" });
+        const fetchLogs = vi.fn(() => ({}));
+        const fetcher = start(cache, fetchLogs);
+        fetcher.enqueue(0, 1);
+        await vi.runAllTimersAsync();
+        expect(fetchLogs).not.toHaveBeenCalled();
+    });
+
+    it("never asks for lines rotated away", async () => {
+        const cache = emptyCache(CHUNK * 2);
+        cache.applyEvent({
+            lines: {},
+            sizeLines: CHUNK * 2,
+            finished: false,
+            firstAvailableLine: CHUNK + 5,
+        });
+        const fetchLogs = vi.fn(() => ({}));
+        const fetcher = start(cache, fetchLogs);
+        fetcher.enqueue(0, CHUNK * 2 - 1);
+        await vi.runAllTimersAsync();
+        expect(fetchLogs.mock.calls).toEqual([[CHUNK, CHUNK * 2 - 1]]);
+    });
+
+    it("keeps at most two chunks in flight", async () => {
+        const { fn, pending } = deferredFetch();
+        const fetcher = start(emptyCache(CHUNK * 3), fn);
+
+        fetcher.enqueue(0, 0);
+        await vi.advanceTimersByTimeAsync(fetcher.MIN_REQUEST_INTERVAL_MS);
+        fetcher.enqueue(CHUNK, CHUNK * 3 - 1);
+        await vi.advanceTimersByTimeAsync(fetcher.MIN_REQUEST_INTERVAL_MS * 5);
+        expect(fn).toHaveBeenCalledTimes(2);
+        expect(fetcher.isFetching).toBe(true);
+
+        pending[0]?.settle({});
+        await vi.advanceTimersByTimeAsync(fetcher.MIN_REQUEST_INTERVAL_MS * 5);
+        expect(fn).toHaveBeenCalledTimes(3);
+    });
+
+    it("drops queued chunks the viewport has left behind", async () => {
+        const fetchLogs = vi.fn((_from: number, _to: number) => ({}));
+        const fetcher = start(emptyCache(CHUNK * 10), fetchLogs);
+        fetcher.enqueue(0, CHUNK * 10 - 1);
+        fetcher.pruneQueue(CHUNK * 9, CHUNK * 10 - 1);
+        await vi.runAllTimersAsync();
+        expect(fetchLogs.mock.calls.map(([from]) => from / CHUNK)).toEqual([7, 8, 9]);
+    });
+
+    it("recovers from a failed fetch so the chunk can be asked for again", async () => {
+        const fetchLogs = vi
+            .fn()
+            .mockRejectedValueOnce(new Error("503"))
+            .mockResolvedValue({ 0: "a" });
+        const cache = emptyCache(1);
+        const fetcher = start(cache, fetchLogs);
+        fetcher.enqueue(0, 0);
+        await vi.runAllTimersAsync();
+        expect(fetcher.isFetching).toBe(false);
+        fetcher.enqueue(0, 0);
+        await vi.runAllTimersAsync();
+        expect(cache.lines.get(0)).toBe("a");
+    });
+
+    it("requests only the incomplete chunks in view, up to the cap", async () => {
+        const cache = emptyCache(CHUNK * 4);
+        const filled: Record<number, string> = {};
+        for (let n = CHUNK; n < CHUNK * 2; n++) filled[n] = "x";
+        cache.mergeSlice(filled);
+        const fetchLogs = vi.fn((_from: number, _to: number) => ({}));
+        const fetcher = start(cache, fetchLogs);
+
+        fetcher.maybeRequestMissing(0, CHUNK * 4 - 1, 3);
+        await vi.runAllTimersAsync();
+        expect(fetchLogs.mock.calls.map(([from]) => from / CHUNK)).toEqual([0, 2]);
+    });
+
+    it("does nothing without a fetch function or after destroy", async () => {
+        const fetchLogs = vi.fn(() => ({}));
+        new LogFetcher(emptyCache(5), undefined).enqueue(0, 4);
+        const fetcher = start(emptyCache(5), fetchLogs);
+        fetcher.enqueue(0, 4);
+        fetcher.destroy();
+        await vi.runAllTimersAsync();
+        expect(fetchLogs).not.toHaveBeenCalled();
+    });
+});

package/src/lib/utils/toast.svelte.test.ts

@@ -0,0 +1,46 @@
+// SPDX-FileCopyrightText: PoppyCake, s.r.o.
+// SPDX-License-Identifier: Apache-2.0
+
+import { afterEach, beforeEach, describe, expect, it, vi } from "vitest";
+import { toast } from "./toast.svelte";
+
+beforeEach(() => {
+    vi.useFakeTimers();
+});
+
+afterEach(() => {
+    for (const t of toast.items) toast.remove(t.id);
+    vi.useRealTimers();
+});
+
+describe("toast", () => {
+    it("expires after its duration", () => {
+        toast.success("Saved", { duration: 1000 });
+        expect(toast.items.map((t) => [t.type, t.message])).toEqual([["success", "Saved"]]);
+        vi.advanceTimersByTime(999);
+        expect(toast.items).toHaveLength(1);
+        vi.advanceTimersByTime(1);
+        expect(toast.items).toHaveLength(0);
+    });
+
+    it("folds a repeat into the shown toast and restarts its clock", () => {
+        const first = toast.error("Run failed", { duration: 1000 });
+        vi.advanceTimersByTime(800);
+        expect(toast.error("Run failed", { duration: 1000 })).toBe(first);
+        vi.advanceTimersByTime(800);
+        expect(toast.items).toHaveLength(1);
+        vi.advanceTimersByTime(200);
+        expect(toast.items).toHaveLength(0);
+    });
+
+    it("keeps a zero-duration toast until it is removed", () => {
+        const onClick = vi.fn();
+        const id = toast.info("Deleted run", { duration: 0, action: { label: "Undo", onClick } });
+        toast.warning("Disk almost full");
+        vi.advanceTimersByTime(60_000);
+        expect(toast.items.map((t) => t.id)).toEqual([id]);
+        expect(toast.items[0]?.action?.label).toBe("Undo");
+        toast.remove(id);
+        expect(toast.items).toHaveLength(0);
+    });
+});