@antelopejs/dms 0.0.1

package/frontend-vue/tests/onboarding-register.test.ts

@@ -0,0 +1,128 @@
+import { readFileSync } from "node:fs";
+import { transpileModule } from "typescript";
+import { computed, reactive, ref } from "vue";
+import * as z from "zod";
+import striptags from "striptags";
+import { afterEach, beforeEach, expect, it, vi } from "vitest";
+
+const register = vi.fn();
+const login = vi.fn();
+const complete = vi.fn();
+const redirect = vi.fn();
+const addToast = vi.fn();
+const apiError = vi.fn();
+const replaceLocation = vi.fn();
+const data = {
+  name: "Admin",
+  email: "admin@example.test",
+  password: "test-only",
+};
+
+function loadSubmit() {
+  const component = readFileSync(
+    new URL(
+      "../layers/dms-onboarding/app/components/onboarding/steps/register.vue",
+      import.meta.url,
+    ),
+    "utf8",
+  );
+  const script = component
+    .split('<script setup lang="ts">')[1]!
+    .split("</script>")[0]!;
+  const source = script.replace(/^import .*;$/gm, "");
+  const { outputText } = transpileModule(source, {});
+  return new Function("z", "striptags", `${outputText}; return onSubmit;`)(
+    z,
+    striptags,
+  );
+}
+
+beforeEach(() => {
+  vi.stubGlobal("ref", ref);
+  vi.stubGlobal("reactive", reactive);
+  vi.stubGlobal("computed", computed);
+  vi.stubGlobal("passwordSchema", z.string());
+  vi.stubGlobal("usePasswordStrength", () => ({}));
+  vi.stubGlobal("useI18n", () => ({ t: (key: string) => key }));
+  vi.stubGlobal("useAuthFetch", () => ({ $authFetch: register }));
+  vi.stubGlobal("$fetch", login);
+  vi.stubGlobal("useToast", () => ({ add: addToast }));
+  vi.stubGlobal("useHomepage", () => "/");
+  vi.stubGlobal("useDmsApp", () => ({
+    runWithContext: (fn: () => unknown) => fn(),
+  }));
+  vi.stubGlobal("useSiteLayout", () => ({ siteLayoutTree: ref(undefined) }));
+  vi.stubGlobal("setOnboardingComplete", complete);
+  vi.stubGlobal("firstAccessiblePagePath", () => "/dashboard");
+  vi.stubGlobal("usePostLoginRedirect", redirect);
+  vi.stubGlobal("useApiError", apiError);
+  vi.stubGlobal("window", { location: { replace: replaceLocation } });
+});
+
+afterEach(() => {
+  vi.unstubAllGlobals();
+  vi.resetAllMocks();
+});
+
+it("registers, logs in, redirects, then shows a single success confirmation", async () => {
+  await loadSubmit()({ data });
+
+  expect(register).toHaveBeenCalledWith("/api/onboarding/register", {
+    method: "POST",
+    body: data,
+  });
+  expect(complete).toHaveBeenCalledOnce();
+  expect(login).toHaveBeenCalledWith("/auth/login", {
+    method: "POST",
+    body: { email: data.email, password: data.password },
+  });
+  expect(redirect).toHaveBeenCalledOnce();
+  expect(redirect.mock.calls[0]![0]()).toBe("/dashboard");
+  expect(addToast).toHaveBeenCalledExactlyOnceWith({
+    title: "page.onboarding.success.title",
+    color: "success",
+  });
+  expect(login.mock.invocationCallOrder[0]).toBeLessThan(
+    redirect.mock.invocationCallOrder[0]!,
+  );
+  expect(redirect.mock.invocationCallOrder[0]).toBeLessThan(
+    addToast.mock.invocationCallOrder[0]!,
+  );
+  expect(apiError).not.toHaveBeenCalled();
+});
+
+it("does not log in or confirm success when registration fails", async () => {
+  register.mockRejectedValueOnce(new Error("Registration failed"));
+  await loadSubmit()({ data });
+  expect(complete).not.toHaveBeenCalled();
+  expect(login).not.toHaveBeenCalled();
+  expect(addToast).not.toHaveBeenCalled();
+  expect(apiError).toHaveBeenCalledOnce();
+  expect(replaceLocation).not.toHaveBeenCalled();
+});
+
+it("opens login without allowing another registration after automatic login fails", async () => {
+  login.mockRejectedValueOnce(new Error("Login failed"));
+  const submit = loadSubmit();
+  await submit({ data });
+  await submit({ data });
+  expect(register).toHaveBeenCalledOnce();
+  expect(complete).toHaveBeenCalledOnce();
+  expect(redirect).not.toHaveBeenCalled();
+  expect(addToast).not.toHaveBeenCalled();
+  expect(replaceLocation).toHaveBeenCalledExactlyOnceWith("/auth");
+});
+
+it.each(["Session failed", "Layout failed"])(
+  "uses a full reload to recover from %s after login",
+  async (message) => {
+    redirect.mockRejectedValueOnce(new Error(message));
+    const submit = loadSubmit();
+    await submit({ data });
+    await submit({ data });
+    expect(register).toHaveBeenCalledOnce();
+    expect(login).toHaveBeenCalledOnce();
+    expect(replaceLocation).toHaveBeenCalledExactlyOnceWith("/auth");
+    expect(addToast).not.toHaveBeenCalled();
+  },
+);

package/frontend-vue/tests/page-layout-background-refresh.test.ts

@@ -0,0 +1,321 @@
+// @vitest-environment jsdom
+import {
+  computed,
+  createApp,
+  defineComponent,
+  h,
+  nextTick,
+  onUnmounted,
+  reactive,
+  ref,
+  Suspense,
+  watch,
+  type App,
+  type Ref,
+} from "vue";
+import { afterEach, beforeEach, expect, it, vi } from "vitest";
+import { usePageLayout } from "../layers/dms-layout/app/composables/page/usePageLayout";
+import { useSiteLayout } from "../layers/dms-layout/app/composables/page/useSiteLayout";
+import type { PageLayout } from "../layers/dms-layout/app/types/page";
+
+const URL = "/page/layout";
+const NEXT_URL = "/page/updated-layout";
+const CACHED_URL = "/cached/layout";
+const state = new Map<string, Ref>();
+const authFetch = vi.fn();
+const unmounted = vi.fn();
+let app: App;
+let host: HTMLDivElement;
+
+function deferred<T>() {
+  let resolve!: (value: T) => void;
+  let reject!: (error: Error) => void;
+  const promise = new Promise<T>((res, rej) => {
+    resolve = res;
+    reject = rej;
+  });
+  return { promise, resolve, reject };
+}
+
+function pageLayout(label: string): PageLayout {
+  return { components: { form: { options: { label } } }, layout: {} };
+}
+
+function siteResponse(label: string, layoutUrl = URL, hasAccess = true) {
+  return {
+    siteLayout: {
+      pages: {
+        "/page": {
+          id: "page",
+          fullId: "page",
+          fullSlug: "/page",
+          displayName: label,
+          layoutUrl,
+          hasAccess,
+        },
+      },
+      categories: {},
+    },
+    siteLayoutTree: undefined,
+    quickActions: undefined,
+    modules: {},
+    isOwner: false,
+  };
+}
+
+const DirtyField = defineComponent({
+  props: { label: String },
+  setup(props) {
+    const value = ref("");
+    onUnmounted(unmounted);
+    return () =>
+      h("label", [
+        props.label,
+        h("input", {
+          value: value.value,
+          onInput: (event: Event) => {
+            value.value = (event.target as HTMLInputElement).value;
+          },
+        }),
+      ]);
+  },
+});
+
+const Page = defineComponent({
+  async setup() {
+    const { pageLayout: layout } = await usePageLayout();
+    return () =>
+      h(
+        "main",
+        Object.entries(layout.value?.components ?? {}).map(([key, component]) =>
+          h(DirtyField, { key, ...component.options }),
+        ),
+      );
+  },
+});
+
+async function mountDirtyPage() {
+  const layout = useSiteLayout();
+  layout.siteLayout.value = siteResponse("old menu").siteLayout;
+  layout.pageLayouts.value = { [URL]: pageLayout("old field") };
+  app = createApp({
+    render: () => h(Suspense, null, { default: () => h(Page) }),
+  });
+  app.mount(host);
+  await vi.waitFor(() => expect(host.querySelector("input")).not.toBeNull());
+  const input = host.querySelector("input")!;
+  input.value = "unsaved draft";
+  input.dispatchEvent(new Event("input", { bubbles: true }));
+  await nextTick();
+  return { layout, input };
+}
+
+function expectDraft(input: HTMLInputElement) {
+  expect(host.querySelector("input")).toBe(input);
+  expect(input.value).toBe("unsaved draft");
+  expect(unmounted).not.toHaveBeenCalled();
+}
+
+function siteWithCachedPage(label: string, hasAccess = true) {
+  const shared = siteResponse(label, URL, hasAccess);
+  return {
+    ...shared,
+    siteLayout: {
+      ...shared.siteLayout,
+      pages: {
+        ...shared.siteLayout.pages,
+        "/cached": {
+          ...shared.siteLayout.pages["/page"],
+          layoutUrl: CACHED_URL,
+          hasAccess: true,
+        },
+      },
+    },
+  };
+}
+
+async function startRefreshDuringInitialLoad(hasAccess = true) {
+  const layout = useSiteLayout();
+  layout.siteLayout.value = siteWithCachedPage("old menu").siteLayout;
+  layout.pageLayouts.value = { [CACHED_URL]: pageLayout("cached field") };
+  const initial = deferred<PageLayout>();
+  const cached = deferred<PageLayout>();
+  const current = deferred<PageLayout>();
+  authFetch
+    .mockReturnValueOnce(initial.promise)
+    .mockResolvedValueOnce(siteWithCachedPage("new menu", hasAccess))
+    .mockReturnValueOnce(cached.promise)
+    .mockReturnValueOnce(current.promise);
+  app = createApp({
+    render: () => h(Suspense, null, { default: () => h(Page) }),
+  });
+  app.mount(host);
+  const refresh = layout.refresh({ fatal: false });
+  await vi.waitFor(() => expect(authFetch).toHaveBeenCalledWith(CACHED_URL));
+  initial.resolve(pageLayout("initial field"));
+  await vi.waitFor(() => expect(host.querySelector("input")).not.toBeNull());
+  const input = host.querySelector("input")!;
+  input.value = "unsaved draft";
+  input.dispatchEvent(new Event("input", { bubbles: true }));
+  await nextTick();
+  return { layout, refresh, cached, current, input };
+}
+
+beforeEach(() => {
+  state.clear();
+  host = document.createElement("div");
+  document.body.append(host);
+  const runtime = {};
+  const route = reactive({ path: "/page" });
+  vi.stubGlobal("computed", computed);
+  vi.stubGlobal("watch", watch);
+  vi.stubGlobal("useDmsApp", () => runtime);
+  vi.stubGlobal("useDmsRoute", () => route);
+  vi.stubGlobal("useDmsState", (key: string, initial: () => unknown) => {
+    if (!state.has(key)) state.set(key, ref(initial()));
+    return state.get(key);
+  });
+  vi.stubGlobal("useAuthFetch", () => ({ $authFetch: authFetch }));
+  vi.stubGlobal("useSiteLayout", useSiteLayout);
+});
+
+afterEach(() => {
+  app?.unmount();
+  host.remove();
+  vi.unstubAllGlobals();
+  vi.resetAllMocks();
+});
+
+it.each([URL, NEXT_URL])(
+  "keeps a dirty mounted field while revalidating %s, then commits together",
+  async (nextUrl) => {
+    const { layout, input } = await mountDirtyPage();
+    const shared = deferred<ReturnType<typeof siteResponse>>();
+    const page = deferred<PageLayout>();
+    authFetch
+      .mockReturnValueOnce(shared.promise)
+      .mockReturnValueOnce(page.promise);
+    const refresh = layout.refresh({ fatal: false });
+    await nextTick();
+    expectDraft(input);
+    shared.resolve(siteResponse("new menu", nextUrl));
+    await vi.waitFor(() => expect(authFetch).toHaveBeenCalledWith(nextUrl));
+    expectDraft(input);
+    expect(layout.siteLayout.value?.pages["/page"]?.displayName).toBe(
+      "old menu",
+    );
+    page.resolve(pageLayout("new field"));
+    await refresh;
+    await nextTick();
+    expectDraft(input);
+    expect(host.textContent).toContain("new field");
+    expect(layout.siteLayout.value?.pages["/page"]?.displayName).toBe(
+      "new menu",
+    );
+    expect(authFetch).toHaveBeenCalledTimes(2);
+  },
+);
+
+it.each(["shared", "page"])(
+  "preserves the dirty field and old data after a transient %s failure",
+  async (phase) => {
+    const { layout, input } = await mountDirtyPage();
+    const shared = deferred<ReturnType<typeof siteResponse>>();
+    const page = deferred<PageLayout>();
+    authFetch
+      .mockReturnValueOnce(shared.promise)
+      .mockReturnValueOnce(page.promise);
+    const refresh = layout.refresh({ fatal: false });
+    const rejected = expect(refresh).rejects.toThrow("temporary outage");
+    if (phase === "page") {
+      shared.resolve(siteResponse("new menu"));
+      await vi.waitFor(() => expect(authFetch).toHaveBeenCalledWith(URL));
+      page.reject(new Error("temporary outage"));
+    } else shared.reject(new Error("temporary outage"));
+    await rejected;
+    await nextTick();
+    expectDraft(input);
+    expect(host.textContent).toContain("old field");
+    expect(layout.siteLayout.value?.pages["/page"]?.displayName).toBe(
+      "old menu",
+    );
+  },
+);
+
+it("drops the old identity's field and ignores background results after cache replacement", async () => {
+  const { layout } = await mountDirtyPage();
+  const shared = deferred<ReturnType<typeof siteResponse>>();
+  const page = deferred<PageLayout>();
+  authFetch
+    .mockReturnValueOnce(shared.promise)
+    .mockReturnValueOnce(page.promise);
+  const refresh = layout.refresh({ fatal: false });
+  shared.resolve(siteResponse("old identity refresh"));
+  await vi.waitFor(() => expect(authFetch).toHaveBeenCalledWith(URL));
+  layout.siteLayout.value = { pages: {}, categories: {} };
+  layout.pageLayouts.value = {};
+  await nextTick();
+  expect(host.querySelector("input")).toBeNull();
+  page.resolve(pageLayout("old identity secret"));
+  await refresh;
+  await nextTick();
+  expect(host.querySelector("input")).toBeNull();
+  expect(layout.pageLayouts.value).toEqual({});
+  expect(layout.siteLayout.value.pages).toEqual({});
+});
+
+it("removes a field whose access was revoked without refetching its layout", async () => {
+  const { layout } = await mountDirtyPage();
+  authFetch.mockResolvedValue(siteResponse("access revoked", URL, false));
+  await layout.refresh({ fatal: false });
+  await nextTick();
+  expect(host.querySelector("input")).toBeNull();
+  expect(layout.pageLayouts.value).toEqual({});
+  expect(authFetch).toHaveBeenCalledExactlyOnceWith("/dms/sitelayout");
+});
+
+it("ignores a background site response after the page cache is replaced", async () => {
+  const { layout } = await mountDirtyPage();
+  const shared = deferred<ReturnType<typeof siteResponse>>();
+  authFetch.mockReturnValueOnce(shared.promise);
+  const refresh = layout.refresh({ fatal: false });
+  layout.pageLayouts.value = { [URL]: pageLayout("new identity field") };
+  await nextTick();
+  shared.resolve(siteResponse("old identity menu"));
+  await refresh;
+  await nextTick();
+  expect(host.textContent).toContain("new identity field");
+  expect(layout.siteLayout.value?.pages["/page"]?.displayName).toBe("old menu");
+  expect(authFetch).toHaveBeenCalledExactlyOnceWith("/dms/sitelayout");
+});
+
+it("revalidates layouts added during staging without unmounting their dirty fields", async () => {
+  const { layout, refresh, cached, current, input } =
+    await startRefreshDuringInitialLoad();
+  expectDraft(input);
+  cached.resolve(pageLayout("updated cached field"));
+  await vi.waitFor(() => expect(authFetch).toHaveBeenCalledTimes(4));
+  expectDraft(input);
+  expect(layout.siteLayout.value?.pages["/page"]?.displayName).toBe("old menu");
+  current.resolve(pageLayout("updated current field"));
+  await refresh;
+  await nextTick();
+  expectDraft(input);
+  expect(host.textContent).toContain("updated current field");
+  expect(layout.siteLayout.value?.pages["/page"]?.displayName).toBe("new menu");
+  expect(Object.keys(layout.pageLayouts.value).sort()).toEqual(
+    [CACHED_URL, URL].sort(),
+  );
+});
+
+it("does not retain a newly cached layout revoked by the staged site", async () => {
+  const { layout, refresh, cached, input } =
+    await startRefreshDuringInitialLoad(false);
+  expectDraft(input);
+  cached.resolve(pageLayout("updated cached field"));
+  await refresh;
+  await nextTick();
+  expect(host.querySelector("input")).toBeNull();
+  expect(layout.pageLayouts.value[URL]).toBeUndefined();
+  expect(authFetch).toHaveBeenCalledTimes(3);
+});

package/frontend-vue/tests/page-layout-registration.test.ts

@@ -0,0 +1,70 @@
+import { computed, effectScope, nextTick, reactive, ref, watch } from "vue";
+import type { EffectScope } from "vue";
+import { afterEach, expect, it, vi } from "vitest";
+import { usePageLayout } from "../layers/dms-layout/app/composables/page/usePageLayout";
+
+let scope: EffectScope;
+
+afterEach(() => {
+  scope?.stop();
+  vi.unstubAllGlobals();
+});
+
+it("loads a page registered after setup without changing the route", async () => {
+  const route = { path: "/new-page" };
+  const layoutUrl = ref<string>();
+  const pageLayouts = ref<Record<string, string>>({});
+  const loadPageLayout = vi.fn(async (url: string) => {
+    pageLayouts.value[url] = url;
+    return url;
+  });
+  vi.stubGlobal("computed", computed);
+  vi.stubGlobal("watch", watch);
+  vi.stubGlobal("useDmsRoute", () => route);
+  vi.stubGlobal("useSiteLayout", () => ({
+    pageLayouts,
+    findMatchingRoute: () =>
+      layoutUrl.value
+        ? { metadata: { layoutUrl: layoutUrl.value } }
+        : undefined,
+    loadPageLayout,
+  }));
+  scope = effectScope();
+  const { pageLayout } = await scope.run(usePageLayout)!;
+  expect(pageLayout.value).toBeNull();
+  expect(loadPageLayout).not.toHaveBeenCalled();
+
+  layoutUrl.value = "/new-page/pagelayout";
+  await nextTick();
+  expect(loadPageLayout).toHaveBeenCalledExactlyOnceWith(
+    "/new-page/pagelayout",
+  );
+  expect(pageLayout.value).toBe("/new-page/pagelayout");
+  expect(route.path).toBe("/new-page");
+});
+
+it("keeps persistent consumers on the hydrated navigation cache without fetching", async () => {
+  const route = reactive({ path: "/first" });
+  const pageLayouts = ref<Record<string, string>>({ "/first/layout": "first" });
+  const loadPageLayout = vi.fn();
+  vi.stubGlobal("computed", computed);
+  vi.stubGlobal("watch", watch);
+  vi.stubGlobal("useDmsRoute", () => route);
+  vi.stubGlobal("useSiteLayout", () => ({
+    pageLayouts,
+    loadPageLayout,
+    findMatchingRoute: (path: string) => ({
+      metadata: { layoutUrl: `${path}/layout` },
+    }),
+  }));
+  scope = effectScope();
+  const layout = await scope.run(usePageLayout)!;
+  const page = await scope.run(usePageLayout)!;
+  expect(layout.pageLayout.value).toBe("first");
+  pageLayouts.value = { "/second/layout": "second" };
+  route.path = "/second";
+  await nextTick();
+  expect(layout.pageLayout.value).toBe("second");
+  expect(page.pageLayout.value).toBe("second");
+  expect(loadPageLayout).not.toHaveBeenCalled();
+});

package/frontend-vue/tests/period-presets.test.ts

@@ -0,0 +1,96 @@
+import { describe, expect, it } from "vitest";
+import { resolvePresetRange } from "../layers/dms-core/app/composables/period/presetResolvers";
+import { resolveComparisonRange } from "../layers/dms-core/app/composables/period/compareResolvers";
+import {
+  MS_PER_DAY,
+  MS_PER_HOUR,
+  type PeriodRange,
+} from "../layers/dms-core/app/composables/period/types";
+
+const NOW = new Date(2026, 6, 28, 14, 37, 12, 500);
+const FALLBACK: PeriodRange = {
+  from: new Date(2026, 0, 1),
+  to: new Date(2026, 0, 31),
+};
+
+function durationOf(range: PeriodRange): number {
+  return range.to.getTime() - range.from.getTime();
+}
+
+function isStartOfDay(date: Date): boolean {
+  return (
+    date.getHours() === 0 &&
+    date.getMinutes() === 0 &&
+    date.getSeconds() === 0 &&
+    date.getMilliseconds() === 0
+  );
+}
+
+describe("relative presets", () => {
+  it("keeps last-hour on instant bounds ending now", () => {
+    const range = resolvePresetRange("last-hour", NOW, FALLBACK);
+    expect(range.to).toEqual(NOW);
+    expect(durationOf(range)).toBe(MS_PER_HOUR);
+    expect(isStartOfDay(range.from)).toBe(false);
+  });
+
+  it("keeps last-24h on instant bounds ending now", () => {
+    const range = resolvePresetRange("last-24h", NOW, FALLBACK);
+    expect(range.to).toEqual(NOW);
+    expect(durationOf(range)).toBe(MS_PER_DAY);
+  });
+
+  it("snaps last-90-days to calendar day boundaries, today included", () => {
+    const range = resolvePresetRange("last-90-days", NOW, FALLBACK);
+    expect(isStartOfDay(range.from)).toBe(true);
+    expect(range.to.getDate()).toBe(NOW.getDate());
+    expect(range.to.getHours()).toBe(23);
+    expect(Math.round(durationOf(range) / MS_PER_DAY)).toBe(90);
+  });
+
+  it("resolves the same day-count family consistently", () => {
+    const lengths = (
+      ["last-7-days", "last-30-days", "last-90-days"] as const
+    ).map((preset) =>
+      Math.round(
+        durationOf(resolvePresetRange(preset, NOW, FALLBACK)) / MS_PER_DAY,
+      ),
+    );
+    expect(lengths).toEqual([7, 30, 90]);
+  });
+});
+
+describe("previous-period comparison", () => {
+  it("returns the equal-length span immediately before a day range", () => {
+    const range = resolvePresetRange("last-7-days", NOW, FALLBACK);
+    const compare = resolveComparisonRange("previous-period", range, null);
+    expect(compare).not.toBeNull();
+    expect(durationOf(compare!)).toBe(durationOf(range));
+    expect(compare!.to.getTime()).toBe(range.from.getTime() - 1);
+  });
+
+  it("does not overlap the primary range", () => {
+    const range = resolvePresetRange("this-month", NOW, FALLBACK);
+    const compare = resolveComparisonRange("previous-period", range, null);
+    expect(compare!.to.getTime()).toBeLessThan(range.from.getTime());
+  });
+
+  it("compares an intraday range to the hour right before it", () => {
+    const range = resolvePresetRange("last-hour", NOW, FALLBACK);
+    const compare = resolveComparisonRange("previous-period", range, null);
+    expect(durationOf(compare!)).toBe(MS_PER_HOUR);
+    expect(range.from.getTime() - compare!.to.getTime()).toBe(1);
+  });
+
+  it("keeps previous-year on the same calendar dates", () => {
+    const range = resolvePresetRange("last-30-days", NOW, FALLBACK);
+    const compare = resolveComparisonRange("previous-year", range, null);
+    expect(compare!.from.getFullYear()).toBe(range.from.getFullYear() - 1);
+    expect(compare!.from.getDate()).toBe(range.from.getDate());
+  });
+
+  it("returns null when comparison is none", () => {
+    const range = resolvePresetRange("today", NOW, FALLBACK);
+    expect(resolveComparisonRange("none", range, null)).toBeNull();
+  });
+});

package/frontend-vue/tests/period-relative-refresh.test.ts

@@ -0,0 +1,61 @@
+import { afterEach, beforeEach, describe, expect, it, vi } from "vitest";
+import { usePeriod } from "../layers/dms-core/app/composables/period/usePeriod";
+import { isRelativePreset } from "../layers/dms-core/app/composables/period/presetResolvers";
+
+const REFRESH_MS = 60000;
+
+describe("relative preset refresh", () => {
+  beforeEach(() => {
+    vi.useFakeTimers();
+    vi.stubGlobal("window", globalThis);
+  });
+
+  afterEach(() => {
+    vi.useRealTimers();
+    vi.unstubAllGlobals();
+  });
+
+  it("classifies only the sliding presets as relative", () => {
+    expect(isRelativePreset("last-hour")).toBe(true);
+    expect(isRelativePreset("last-24h")).toBe(true);
+    expect(isRelativePreset("last-90-days")).toBe(false);
+    expect(isRelativePreset("this-month")).toBe(false);
+  });
+
+  it("slides a relative preset's range as time passes", () => {
+    const period = usePeriod({ defaultPreset: "last-hour" });
+    const initialTo = period.state.value.range.to.getTime();
+    vi.advanceTimersByTime(REFRESH_MS);
+    expect(period.state.value.range.to.getTime()).toBe(initialTo + REFRESH_MS);
+  });
+
+  it("changes the state key on each slide so consumers refetch", () => {
+    const period = usePeriod({ defaultPreset: "last-24h" });
+    const initialKey = period.state.value.key;
+    vi.advanceTimersByTime(REFRESH_MS);
+    expect(period.state.value.key).not.toBe(initialKey);
+  });
+
+  it("keeps calendar presets fixed while time passes", () => {
+    const period = usePeriod({ defaultPreset: "this-month" });
+    const initialKey = period.state.value.key;
+    vi.advanceTimersByTime(REFRESH_MS * 3);
+    expect(period.state.value.key).toBe(initialKey);
+  });
+
+  it("starts sliding after switching onto a relative preset", async () => {
+    const period = usePeriod({ defaultPreset: "this-month" });
+    period.setPreset("last-hour");
+    await vi.advanceTimersByTimeAsync(REFRESH_MS);
+    expect(period.state.value.range.to.getTime()).toBe(Date.now());
+  });
+
+  it("stops sliding after switching back to a calendar preset", async () => {
+    const period = usePeriod({ defaultPreset: "last-hour" });
+    period.setPreset("this-month");
+    await vi.advanceTimersByTimeAsync(0);
+    const initialKey = period.state.value.key;
+    await vi.advanceTimersByTimeAsync(REFRESH_MS * 2);
+    expect(period.state.value.key).toBe(initialKey);
+  });
+});