Files
kandev/apps/web/lib/plugins/host-api.test.ts
T
João Salavisa adad46fab1 feat(plugins): richer frontend SDK — page chrome, nav icons, more host UI (#1759)
* feat(plugins): richer frontend SDK — page chrome, nav icons, more host UI

Give native UI plugins the primitives to render kandev-native pages while
keeping everything configurable:

- registerRoute gains an options arg; plugin routes get a first-party
  PageTopbar title bar by default (title/icon derived from the nav item for
  the same path, or set via { topbar: { title, subtitle, icon, backHref,
  backLabel, actions } }). Pass { topbar: false } to render full-bleed and
  own the chrome.
- NavItem.icon now resolves against a curated name map (lib/plugins/icons.ts);
  unknown/missing names fall back to the puzzle glyph.
- host.ui expands to the primitives a native-feeling page needs (Dialog,
  DropdownMenu, Pagination, Sheet, Select, Tabs, Table, Tooltip, ...) plus
  first-party PageTopbar, Combobox, and TaskCreateDialog. Plugins must use
  these host instances — a bundled second copy of any Radix/portal component
  splits React context.
- host.navigate(href, { replace? }) for soft SPA navigation into native
  routes, and host.api.baseUrl for reaching first-party REST without
  re-deriving the split-origin backend URL.

The registry records each plugin's display name for derived titles and
getRoutes() entries now carry pluginId + options. Contract doc
(PLUGIN-API.md) updated to match.

* fix(plugins): expose full Sheet subcomponent family on host.ui

host.ui advertised Sheet but only exposed Sheet/Content/Header/Title, so
plugins (which must use host instances for portal/context components)
couldn't build an uncontrolled sheet — no Trigger/Close/Footer/Description.
Add the missing four for parity with the Dialog family.

* fix(plugins): clear plugin display name on unregisterPlugin

unregisterPlugin bulk-revoked every other registration but left the entry
in pluginNames, so getPluginName returned a stale name after disable and
names leaked across enable/disable cycles. Delete the name too, with a
regression test.

---------

Co-authored-by: Kandev Agent <agent@kandev.dev>
2026-07-17 18:10:49 +01:00

136 lines
4.2 KiB
TypeScript

import { describe, it, expect, vi, afterEach } from "vitest";
import * as React from "react";
import { createAppStore } from "@/lib/state/store";
import { buildHostApi } from "./host-api";
/** Curated primitives a plugin needs to build a full native-feeling page. */
const EXPECTED_UI_PRIMITIVES = [
"Alert",
"Badge",
"Button",
"Card",
"Checkbox",
"Dialog",
"DropdownMenu",
"Input",
"Label",
"Pagination",
"ScrollArea",
"Select",
"Sheet",
"SheetClose",
"SheetContent",
"SheetDescription",
"SheetFooter",
"SheetHeader",
"SheetTitle",
"SheetTrigger",
"Spinner",
"Switch",
"Table",
"Tabs",
"Textarea",
"Tooltip",
];
describe("buildHostApi", () => {
const originalFetch = global.fetch;
afterEach(() => {
global.fetch = originalFetch;
vi.unstubAllEnvs();
});
it("scopes api.fetch to /api/plugins/{pluginId}/... and forwards init", async () => {
const fetchMock = vi.fn().mockResolvedValue(new Response(null, { status: 200 }));
global.fetch = fetchMock as unknown as typeof fetch;
const host = buildHostApi("jira", createAppStore(), "light");
await host.api.fetch("/issues", { method: "POST" });
expect(fetchMock).toHaveBeenCalledTimes(1);
const [url, init] = fetchMock.mock.calls[0];
expect(url).toContain("/api/plugins/jira/issues");
expect(init).toEqual({ method: "POST" });
});
it("normalizes a path that doesn't start with a slash", async () => {
const fetchMock = vi.fn().mockResolvedValue(new Response(null, { status: 200 }));
global.fetch = fetchMock as unknown as typeof fetch;
const host = buildHostApi("jira", createAppStore(), "light");
await host.api.fetch("issues");
const [url] = fetchMock.mock.calls[0];
expect(url).toContain("/api/plugins/jira/issues");
});
it("exposes the host React instance and a jsx alias for React.createElement", () => {
const host = buildHostApi("jira", createAppStore(), "dark");
expect(host.React).toBe(React);
expect(host.jsx).toBe(React.createElement);
});
it("wires store.getState/setState/subscribe to the passed StoreApi", () => {
const store = createAppStore();
const getStateSpy = vi.spyOn(store, "getState");
const setStateSpy = vi.spyOn(store, "setState");
const subscribeSpy = vi.spyOn(store, "subscribe");
const host = buildHostApi("jira", store, "dark");
expect(host.store.getState()).toBe(store.getState());
host.store.setState({});
const listener = vi.fn();
const unsubscribe = host.store.subscribe(listener);
expect(getStateSpy).toHaveBeenCalled();
expect(setStateSpy).toHaveBeenCalled();
expect(subscribeSpy).toHaveBeenCalled();
unsubscribe();
});
it("exposes the requested theme and a curated ui component subset", () => {
const host = buildHostApi("jira", createAppStore(), "dark");
expect(host.theme).toBe("dark");
// Expanded primitive set for full native-feeling plugin pages.
for (const name of EXPECTED_UI_PRIMITIVES) {
expect(host.ui[name], `host.ui.${name}`).toBeDefined();
}
});
it("exposes first-party app components for native flows and page chrome", () => {
const host = buildHostApi("jira", createAppStore(), "light");
expect(host.ui.PageTopbar).toBeDefined();
expect(host.ui.TaskCreateDialog).toBeDefined();
expect(host.ui.Combobox).toBeDefined();
});
it("exposes navigate() that soft-navigates via history push/replace", () => {
const host = buildHostApi("jira", createAppStore(), "light");
const pushSpy = vi.spyOn(window.history, "pushState");
const replaceSpy = vi.spyOn(window.history, "replaceState");
host.navigate("/somewhere");
expect(pushSpy).toHaveBeenCalledWith({}, "", "/somewhere");
host.navigate("/elsewhere", { replace: true });
expect(replaceSpy).toHaveBeenCalledWith({}, "", "/elsewhere");
pushSpy.mockRestore();
replaceSpy.mockRestore();
});
it("exposes the backend API origin on api.baseUrl", () => {
const host = buildHostApi("jira", createAppStore(), "light");
expect(typeof host.api.baseUrl).toBe("string");
});
it("sets pluginId on the returned host api", () => {
const host = buildHostApi("jira", createAppStore(), "light");
expect(host.pluginId).toBe("jira");
});
});