@antelopejs/dms 0.5.6 → 0.6.1

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

@@ -0,0 +1,120 @@
+import { effectScope } from "vue";
+import { describe, expect, it } from "vitest";
+import { usePeriod } from "../layers/dms-core/app/composables/period/usePeriod";
+import { usePeriodDraft } from "../layers/dms-ui/app/build/composables/period/usePeriodDraft";
+import { localeWeekStart } from "../layers/dms-core/app/utils/regional";
+import {
+  formatPeriodRange,
+  periodDuration,
+} from "../layers/dms-ui/app/build/composables/period/periodDisplay";
+
+function setup() {
+  const scope = effectScope();
+  const result = scope.run(() => {
+    const period = usePeriod({
+      defaultPreset: "this-month",
+      presets: ["last-7-days", "this-month", "custom"],
+    });
+    return { period, draft: usePeriodDraft(period) };
+  });
+  if (!result) throw new Error("scope did not run");
+  return { ...result, stop: () => scope.stop() };
+}
+
+describe("period draft", () => {
+  it("stages presets and comparisons without moving the period", () => {
+    const { period, draft, stop } = setup();
+    const before = period.state.value.key;
+
+    draft.selectPreset("last-7-days");
+    draft.selectComparison("previous-period");
+
+    expect(draft.isDirty.value).toBe(true);
+    expect(draft.compareRange.value).not.toBeNull();
+    expect(period.state.value.key).toBe(before);
+    stop();
+  });
+
+  it("commits the staged selection on apply", () => {
+    const { period, draft, stop } = setup();
+
+    draft.selectPreset("last-7-days");
+    draft.selectComparison("previous-year");
+    draft.apply();
+
+    expect(period.preset.value).toBe("last-7-days");
+    expect(period.comparison.value).toBe("previous-year");
+    expect(draft.isDirty.value).toBe(false);
+    stop();
+  });
+
+  it("applies a picked range as the custom preset", () => {
+    const { period, draft, stop } = setup();
+    const range = {
+      from: new Date(2026, 8, 14),
+      to: new Date(2026, 8, 20, 23, 59, 59, 999),
+    };
+
+    draft.selectRange(range);
+    expect(period.preset.value).toBe("this-month");
+    draft.apply();
+
+    expect(period.preset.value).toBe("custom");
+    expect(period.state.value.range).toEqual(range);
+    stop();
+  });
+
+  it("drops staged changes on reset", () => {
+    const { period, draft, stop } = setup();
+
+    draft.selectPreset("last-7-days");
+    draft.reset();
+
+    expect(draft.preset.value).toBe(period.preset.value);
+    expect(draft.isDirty.value).toBe(false);
+    stop();
+  });
+
+  it("starts a custom selection on the whole days on screen", () => {
+    const { draft, stop } = setup();
+
+    draft.selectPreset("custom");
+
+    const range = draft.customRange.value;
+    expect(range?.from.getHours()).toBe(0);
+    expect(range?.to.getHours()).toBe(23);
+    stop();
+  });
+});
+
+describe("period display", () => {
+  it("counts whole days, and hours below a day", () => {
+    expect(
+      periodDuration({
+        from: new Date(2026, 8, 1),
+        to: new Date(2026, 8, 30, 23, 59, 59, 999),
+      }),
+    ).toEqual({ unit: "days", count: 30 });
+    expect(
+      periodDuration({
+        from: new Date(2026, 8, 1, 10),
+        to: new Date(2026, 8, 1, 11),
+      }),
+    ).toEqual({ unit: "hours", count: 1 });
+  });
+
+  it("keeps the year off a comparison label on request", () => {
+    const range = {
+      from: new Date(2026, 7, 1),
+      to: new Date(2026, 7, 30, 23, 59, 59, 999),
+    };
+    expect(formatPeriodRange(range, "en-US")).toContain("2026");
+    expect(formatPeriodRange(range, "en-US", false)).not.toContain("2026");
+  });
+
+  it("starts the week on Monday for the DMS locales", () => {
+    expect(localeWeekStart("en")).toBe(1);
+    expect(localeWeekStart("fr")).toBe(1);
+    expect(localeWeekStart("fr-FR")).toBe(1);
+  });
+});

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

@@ -82,6 +82,18 @@ describe("previous-period comparison", () => {
     expect(range.from.getTime() - compare!.to.getTime()).toBe(1);
   });
 
+  it("keeps whole-day comparisons on midnight across a DST change", () => {
+    // October 2026 holds the European DST change (Oct 25); the previous
+    // 31 days must still start at local midnight.
+    const range = {
+      from: new Date(2026, 9, 1),
+      to: new Date(new Date(2026, 10, 1).getTime() - 1),
+    };
+    const compare = resolveComparisonRange("previous-period", range, null);
+    expect(compare!.from).toEqual(new Date(2026, 7, 31));
+    expect(compare!.to.getTime()).toBe(range.from.getTime() - 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);

package/frontend-vue/tests/period-scope-first-fetch.test.ts

@@ -9,6 +9,7 @@
  */
 import {
   computed,
+  createApp,
   createSSRApp,
   defineAsyncComponent,
   defineComponent,
@@ -44,7 +45,7 @@ const { usePeriod } = await import(
 const { registerPeriodScope } = await import(
   "../layers/dms-core/app/composables/period/usePeriodScope"
 );
-const { useChartFetch } = await import(
+const { useChartFetch, PENDING_SCOPE_TIMEOUT_MS } = await import(
   "../layers/dms-ui/app/composables/chart/useChartFetch"
 );
 const KpiCard = (
@@ -52,7 +53,9 @@ const KpiCard = (
 ).default;
 
 const SCOPE = "demo";
-const GRACE_MS = 250;
+// usePeriodScope warns about a missing scope after this long; a card must not
+// give up on its scope that early (a selector chunk can land later).
+const MISSING_SCOPE_WARN_MS = 250;
 // useChartFetch debounces every refresh past the first by 180ms; settle past
 // that, or a duplicate first fetch lands after the assertions and goes unseen.
 const SETTLE_MS = 300;
@@ -261,16 +264,98 @@ describe("period-scoped cards on first paint", () => {
     expect(html).not.toContain("<span>0</span>");
   });
 
-  it("stops loading when no selector ever registers the scope", async () => {
-    const Orphan = defineComponent({
+  it("keeps loading while a late selector may still register the scope", async () => {
+    const Late = defineComponent({
       setup: () => () =>
-        h(Card, { url: "/api/metrics/kpi/orphan", scope: "never-registered" }),
+        h(Card, { url: "/api/metrics/kpi/late", scope: "late-scope" }),
     });
-    const { container } = await ssrThenHydrate(Orphan);
-    await new Promise((resolve) => setTimeout(resolve, GRACE_MS + 50));
+    const { container } = await ssrThenHydrate(Late);
+    await new Promise((resolve) =>
+      setTimeout(resolve, MISSING_SCOPE_WARN_MS + 50),
+    );
     await nextTick();
 
     expect(requests).toHaveLength(0);
-    expect(container.querySelector(".card")?.textContent).toBe("false");
+    expect(container.querySelector(".card")?.textContent).toBe("true");
+  });
+
+  it("stops loading when no selector ever registers the scope", async () => {
+    vi.useFakeTimers({ shouldAdvanceTime: true });
+    try {
+      const Orphan = defineComponent({
+        setup: () => () =>
+          h(Card, {
+            url: "/api/metrics/kpi/orphan",
+            scope: "never-registered",
+          }),
+      });
+      const { container } = await ssrThenHydrate(Orphan);
+      vi.advanceTimersByTime(PENDING_SCOPE_TIMEOUT_MS + 50);
+      await nextTick();
+
+      expect(requests).toHaveLength(0);
+      expect(container.querySelector(".card")?.textContent).toBe("false");
+    } finally {
+      vi.useRealTimers();
+    }
+  });
+});
+
+describe("chart fetch loading state", () => {
+  it("stays loading when an aborted request settles after a newer one started", async () => {
+    const pending: Array<{
+      url: string;
+      resolve: (value: unknown) => void;
+      reject: (error: unknown) => void;
+    }> = [];
+    vi.stubGlobal("useAuthFetch", () => ({
+      $authFetch: (url: string, opts: { signal: AbortSignal }) =>
+        new Promise((resolve, reject) => {
+          pending.push({ url, resolve, reject });
+          opts.signal.addEventListener("abort", () =>
+            reject(Object.assign(new Error("aborted"), { name: "AbortError" })),
+          );
+        }),
+    }));
+    const watched = ref(0);
+    let loading: { value: boolean } | undefined;
+    let refresh: (() => Promise<void>) | undefined;
+    const Probe = defineComponent({
+      setup() {
+        const fetch = useChartFetch<{ value: number }>({
+          fetchUrl: "/api/metrics/kpi/race",
+          watchSource: () => watched.value,
+        });
+        loading = fetch.isLoading;
+        refresh = fetch.refresh;
+        return () => h("div");
+      },
+    });
+    const app = createApp(Probe);
+    app.mount(document.createElement("div"));
+    mounted.push(app);
+    await nextTick();
+    expect(pending).toHaveLength(1);
+
+    // A second request supersedes the first, whose abort settles meanwhile.
+    void refresh?.();
+    await new Promise((resolve) => setTimeout(resolve, 0));
+    expect(pending).toHaveLength(2);
+    expect(loading?.value).toBe(true);
+
+    pending[1]!.resolve({ value: 2 });
+    await new Promise((resolve) => setTimeout(resolve, 0));
+    expect(loading?.value).toBe(false);
+
+    // New inputs: loading from the change on, through the debounce.
+    watched.value = 1;
+    await nextTick();
+    expect(loading?.value).toBe(true);
+    vi.stubGlobal("useAuthFetch", () => ({
+      $authFetch: async (url: string) => {
+        requests.push(url);
+        return { value: 1 };
+      },
+    }));
   });
 });

package/frontend-vue/tests/permission-preview-partial.test.ts

@@ -0,0 +1,301 @@
+// @vitest-environment jsdom
+import {
+  computed,
+  createApp,
+  defineComponent,
+  h,
+  ref,
+  type App,
+  type PropType,
+  type Ref,
+  type VNode,
+} from "vue";
+import type { NavigationMenuItem } from "@nuxt/ui";
+import { afterEach, beforeEach, describe, expect, it, vi } from "vitest";
+import {
+  applyPreviewEntryStates,
+  type PermissionPreviewResult,
+  type PreviewEntryState,
+  type PreviewLockableEntry,
+  resolvePreviewEntryState,
+} from "#dms-core/app/build/utils/permission-preview";
+import { MENU_STATUS_TEXT_CLASSES } from "#dms-core/app/utils/menu";
+import NavigationMenu from "../layers/dms-layout/app/components/navigation/NavigationMenu.vue";
+
+// "Preview as role": an entry the previewed role opens without all of it (a
+// block, an action or one of its entries lost) is drawn with the orange hatch
+// and lock; one it cannot open keeps the red ones. Never outside a preview.
+
+const HIDDEN = new Set(["pages.sales.invoices"]);
+const PARTIAL = new Set(["pages.sales", "pages.sales.orders", "settings"]);
+
+describe("resolvePreviewEntryState", () => {
+  it("draws refused and partial entries only while a preview runs", () => {
+    expect(resolvePreviewEntryState(true, HIDDEN, PARTIAL, "settings")).toBe(
+      "partial",
+    );
+    expect(
+      resolvePreviewEntryState(true, HIDDEN, PARTIAL, "pages.sales.invoices"),
+    ).toBe("hidden");
+    expect(resolvePreviewEntryState(true, HIDDEN, PARTIAL, "modules")).toBe(
+      null,
+    );
+    expect(resolvePreviewEntryState(true, HIDDEN, PARTIAL, undefined)).toBe(
+      null,
+    );
+    expect(resolvePreviewEntryState(false, HIDDEN, PARTIAL, "settings")).toBe(
+      null,
+    );
+  });
+
+  it("never draws a refused entry as partial", () => {
+    const both = new Set(["pages.sales.invoices"]);
+    expect(
+      resolvePreviewEntryState(true, both, both, "pages.sales.invoices"),
+    ).toBe("hidden");
+  });
+});
+
+describe("applyPreviewEntryStates", () => {
+  interface Entry extends PreviewLockableEntry {
+    label: string;
+    state?: PreviewEntryState;
+    children?: Entry[];
+  }
+  const MENU: Entry[] = [
+    {
+      label: "Sales",
+      fullId: "pages.sales",
+      children: [
+        { label: "Orders", fullId: "pages.sales.orders" },
+        { label: "Invoices", fullId: "pages.sales.invoices" },
+      ],
+    },
+    { label: "Settings", fullId: "settings" },
+    { label: "Modules", fullId: "modules" },
+  ];
+  const statesOf = (entries: Entry[]): string[] =>
+    entries.flatMap((entry) => [
+      ...(entry.state ? [`${entry.label}:${entry.state}`] : []),
+      ...statesOf(entry.children ?? []),
+    ]);
+
+  it("passes each entry its state, nested entries included", () => {
+    const drawn = applyPreviewEntryStates(
+      MENU,
+      (fullId) => resolvePreviewEntryState(true, HIDDEN, PARTIAL, fullId),
+      (entry, state) => ({ ...entry, state }),
+    );
+    expect(statesOf(drawn)).toEqual([
+      "Sales:partial",
+      "Orders:partial",
+      "Invoices:hidden",
+      "Settings:partial",
+    ]);
+  });
+
+  it("draws nothing outside a preview", () => {
+    const drawn = applyPreviewEntryStates(
+      MENU,
+      (fullId) => resolvePreviewEntryState(false, HIDDEN, PARTIAL, fullId),
+      (entry, state) => ({ ...entry, state }),
+    );
+    expect(statesOf(drawn)).toEqual([]);
+  });
+});
+
+describe("NavigationMenu in a role preview", () => {
+  const WARNING_HATCH = "dms-hatch-partial";
+  const ERROR_HATCH = "dms-hatch-locked";
+  const ITEMS: NavigationMenuItem[] = [
+    {
+      label: "Sales",
+      fullId: "pages.sales",
+      icon: "i-ph-chart-line",
+      children: [
+        { label: "Orders", fullId: "pages.sales.orders", to: "/orders" },
+        { label: "Invoices", fullId: "pages.sales.invoices", to: "/invoices" },
+      ],
+    },
+    { label: "Reports", fullId: "pages.reports", to: "/reports" },
+  ];
+  const RESULT: PermissionPreviewResult = {
+    page: null,
+    blocks: {},
+    hiddenEntries: ["pages.sales.invoices"],
+    partialEntries: ["pages.sales", "pages.sales.orders"],
+    outOfScope: 0,
+  };
+
+  let app: App | undefined;
+  let host: HTMLDivElement;
+  let state: Map<string, Ref<unknown>>;
+
+  // Renders each item the way UNavigationMenu hands them over: its classes,
+  // its title and the trailing icon's classes, nested items included.
+  const MenuStub = defineComponent({
+    props: {
+      items: {
+        type: Array as PropType<NavigationMenuItem[][]>,
+        required: true,
+      },
+    },
+    setup(props) {
+      const renderItem = (item: NavigationMenuItem): VNode =>
+        h("div", { "data-entry": item.fullId }, [
+          h(
+            "a",
+            {
+              class: item.class,
+              title: item.title,
+              "data-state": item.previewState,
+              "data-trailing": item.trailingIcon,
+              "data-trailing-class": item.ui?.linkTrailingIcon,
+            },
+            item.label,
+          ),
+          ...(item.children ?? []).map(renderItem),
+        ]);
+      return () => h("nav", props.items.flat().map(renderItem));
+    },
+  });
+
+  function mount(previewing: boolean) {
+    state.set(
+      "dms-permission-preview-session",
+      ref(
+        previewing
+          ? {
+              id: "p1",
+              roleId: "r1",
+              roleName: "Support",
+              permissions: [],
+              unsaved: false,
+              returnTo: "/settings/roles",
+              updatedAt: 0,
+            }
+          : null,
+      ),
+    );
+    // A stale result alone never draws anything: only a running preview does.
+    state.set("dms-permission-preview-result", ref(RESULT));
+    app = createApp(NavigationMenu, { items: ITEMS });
+    app.component("UNavigationMenu", MenuStub);
+    app.mount(host);
+  }
+
+  const entry = (fullId: string): HTMLAnchorElement =>
+    host.querySelector(`[data-entry="${fullId}"] > a`)!;
+
+  beforeEach(() => {
+    state = new Map();
+    vi.stubGlobal("computed", computed);
+    vi.stubGlobal("useI18n", () => ({
+      t: (key: string, values?: { role?: string }) =>
+        values?.role ? `${key}(${values.role})` : key,
+    }));
+    vi.stubGlobal("useDmsState", (key: string, initial: () => unknown) => {
+      if (!state.has(key)) state.set(key, ref(initial()));
+      return state.get(key);
+    });
+    vi.stubGlobal("usePrefetch", () => ({ prefetchPageLayout: vi.fn() }));
+    vi.stubGlobal("stripQueryAndHash", (path: string) => path);
+    vi.stubGlobal("MENU_STATUS_TEXT_CLASSES", MENU_STATUS_TEXT_CLASSES);
+    host = document.createElement("div");
+    document.body.append(host);
+  });
+
+  afterEach(() => {
+    app?.unmount();
+    app = undefined;
+    host.remove();
+    vi.unstubAllGlobals();
+  });
+
+  it("draws a partial entry and its group orange, a refused one red", () => {
+    mount(true);
+    const orders = entry("pages.sales.orders");
+    expect(orders.dataset.state).toBe("partial");
+    expect(orders.className).toContain(WARNING_HATCH);
+    expect(orders.className).not.toContain(ERROR_HATCH);
+    expect(orders.dataset.trailing).toBe("i-ph-lock-simple");
+    expect(orders.dataset.trailingClass).toContain("text-warning");
+    expect(orders.title).toBe(
+      "page.settings.roles.preview.menu_partial(Support)",
+    );
+
+    const sales = entry("pages.sales");
+    expect(sales.dataset.state).toBe("partial");
+    expect(sales.className).toContain(WARNING_HATCH);
+
+    const invoices = entry("pages.sales.invoices");
+    expect(invoices.dataset.state).toBe("hidden");
+    expect(invoices.className).toContain(ERROR_HATCH);
+    expect(invoices.dataset.trailingClass).toContain("text-error");
+
+    const reports = entry("pages.reports");
+    expect(reports.dataset.state).toBeUndefined();
+    expect(reports.className).not.toContain(WARNING_HATCH);
+  });
+
+  it("draws no partial state outside a preview", () => {
+    mount(false);
+    for (const fullId of [
+      "pages.sales",
+      "pages.sales.orders",
+      "pages.sales.invoices",
+      "pages.reports",
+    ]) {
+      const link = entry(fullId);
+      expect(link.dataset.state).toBeUndefined();
+      expect(link.className).not.toContain(WARNING_HATCH);
+      expect(link.className).not.toContain(ERROR_HATCH);
+      expect(link.dataset.trailing).toBeUndefined();
+    }
+  });
+});
+
+describe("PermissionVeil partial state (settings overview cards)", () => {
+  let app: App | undefined;
+  let host: HTMLDivElement;
+
+  afterEach(() => {
+    app?.unmount();
+    app = undefined;
+    host.remove();
+  });
+
+  it("keeps the card usable under an orange hatch with the lock badge", async () => {
+    const { default: PermissionVeil } = await import(
+      "../layers/dms-ui/app/build/components/permission/PermissionVeil.vue"
+    );
+    host = document.createElement("div");
+    document.body.append(host);
+    const Stub = defineComponent({
+      props: { name: { type: String, default: undefined } },
+      setup:
+        (props, { slots }) =>
+        () =>
+          h("span", { "data-icon": props.name }, slots.default?.()),
+    });
+    app = createApp(() =>
+      h(
+        PermissionVeil,
+        { state: "partial", label: "Partial access", persistent: true },
+        () => h("a", { class: "card", href: "/settings/workspace/members" }),
+      ),
+    );
+    app.component("UTooltip", Stub);
+    app.component("UIcon", Stub);
+    app.mount(host);
+
+    const root = host.querySelector("[data-permission-veil]")!;
+    expect(root.getAttribute("data-permission-veil")).toBe("partial");
+    expect(root.querySelector("[inert]")).toBeNull();
+    const veil = root.querySelector(".absolute.inset-0")!;
+    expect(veil.className).toContain("pointer-events-none");
+    expect(veil.className).toContain("var(--ui-warning)");
+    expect(root.querySelector('[data-icon="i-ph-lock-simple"]')).not.toBeNull();
+    expect(root.textContent).toContain("Partial access");
+  });
+});

package/frontend-vue/tests/permission-preview-session.test.ts

@@ -0,0 +1,69 @@
+// @vitest-environment jsdom
+import { afterEach, beforeEach, expect, it, vi } from "vitest";
+import { computed, ref } from "vue";
+import { usePermissionPreview } from "../layers/dms-core/app/build/composables/auth/usePermissionPreview";
+import {
+  PERMISSION_PREVIEW_STORAGE_PREFIX,
+  PERMISSION_PREVIEW_TAB_KEY,
+} from "../layers/dms-core/app/build/utils/permission-preview";
+
+// A "Preview as role" tab only annotates what the viewer is served: its
+// requests leave as they are, run with the viewer's own rights. Signing out
+// forgets every preview this browser holds, so the next account does not find
+// the previous one's role name and draft permissions.
+
+const states = new Map<string, unknown>();
+
+beforeEach(() => {
+  states.clear();
+  vi.stubGlobal("computed", computed);
+  vi.stubGlobal("useDmsState", (key: string, init: () => unknown) => {
+    if (!states.has(key)) states.set(key, ref(init()));
+    return states.get(key);
+  });
+  localStorage.setItem(`${PERMISSION_PREVIEW_STORAGE_PREFIX}a`, "{}");
+  localStorage.setItem(`${PERMISSION_PREVIEW_STORAGE_PREFIX}b`, "{}");
+  localStorage.setItem("unrelated", "kept");
+  sessionStorage.setItem(PERMISSION_PREVIEW_TAB_KEY, "a");
+});
+
+afterEach(() => {
+  localStorage.clear();
+  sessionStorage.clear();
+  vi.unstubAllGlobals();
+});
+
+it("removes the previews of every tab and the session in memory", () => {
+  const preview = usePermissionPreview();
+  preview.session.value = {
+    id: "a",
+  } as unknown as typeof preview.session.value;
+
+  preview.purge();
+
+  expect(preview.session.value).toBeNull();
+  expect(sessionStorage.getItem(PERMISSION_PREVIEW_TAB_KEY)).toBeNull();
+  expect(Object.keys(localStorage)).toEqual(["unrelated"]);
+});
+
+it("lets a preview tab's requests through untouched", () => {
+  const nativeFetch = window.fetch;
+  const nativeOpen = XMLHttpRequest.prototype.open;
+  localStorage.setItem(
+    `${PERMISSION_PREVIEW_STORAGE_PREFIX}a`,
+    JSON.stringify({
+      id: "a",
+      roleId: null,
+      roleName: "Support",
+      permissions: [],
+      unsaved: false,
+      returnTo: "/settings/workspace/roles",
+      updatedAt: Date.now(),
+    }),
+  );
+  const preview = usePermissionPreview();
+
+  expect(preview.activate()).toBe(true);
+  expect(window.fetch).toBe(nativeFetch);
+  expect(XMLHttpRequest.prototype.open).toBe(nativeOpen);
+});