@portnet/ui 6.0.2 → 6.0.3

package/dist/esm/v2/__tests__/rowActions.test.js

@@ -0,0 +1,182 @@
+/**
+ * @jest-environment jsdom
+ */
+import "@testing-library/jest-dom";
+import { render, screen } from "@testing-library/react";
+import userEvent from "@testing-library/user-event";
+import { buildRowActions, buildRowActionMenu, MAX_ROW_ACTIONS } from "../patterns/rowActions";
+
+/**
+ * rowActions (G-41) — promoted from `refonte-frontend` (Area 5).
+ *
+ * Each assertion pins a Charter rule the descriptor layer carries, or a defect
+ * the promoted implementation had been written to prevent. The per-row
+ * evaluation of the predicates is the load-bearing part: a boolean would force
+ * the host to rebuild the array per row, which is how a table row and a mobile
+ * card end up offering different actions for the same record.
+ */
+import { Fragment as _Fragment, jsx as _jsx } from "react/jsx-runtime";
+const BROUILLON = {
+  id: 1,
+  status: "DRAFT"
+};
+const SOUMIS = {
+  id: 2,
+  status: "SOUMIS"
+};
+describe("buildRowActionMenu", () => {
+  test("hidden is evaluated PER ROW, not once for the array", () => {
+    const descriptors = [{
+      id: "open",
+      label: "Consulter",
+      onClick: jest.fn()
+    }, {
+      id: "del",
+      label: "Supprimer",
+      onClick: jest.fn(),
+      hidden: row => row.status !== "DRAFT"
+    }];
+    expect(buildRowActionMenu(descriptors, BROUILLON)).toHaveLength(2);
+    expect(buildRowActionMenu(descriptors, SOUMIS)).toHaveLength(1);
+  });
+  test("disabled is evaluated per row too, and keeps the item visible", () => {
+    const items = buildRowActionMenu([{
+      id: "edit",
+      label: "Modifier",
+      onClick: jest.fn(),
+      disabled: row => row.status !== "DRAFT"
+    }], SOUMIS);
+    expect(items).toHaveLength(1);
+    expect(items[0]?.disabled).toBe(true);
+  });
+
+  /** R-B.6 — a destructive action is separated and marked, not merely last. */
+  test("a divider precedes the first destructive action", () => {
+    const items = buildRowActionMenu([{
+      id: "open",
+      label: "Consulter",
+      onClick: jest.fn()
+    }, {
+      id: "del",
+      label: "Supprimer",
+      onClick: jest.fn(),
+      danger: true
+    }, {
+      id: "purge",
+      label: "Purger",
+      onClick: jest.fn(),
+      danger: true
+    }], BROUILLON);
+    expect(items.map(i => Boolean(i.divider))).toEqual([false, true, false, false]);
+  });
+
+  /**
+   * A menu does not open on a rule. The separator only appears if something
+   * precedes it — a row whose ONLY action is destructive gets no divider.
+   */
+  test("no leading divider when the destructive action comes first", () => {
+    const items = buildRowActionMenu([{
+      id: "del",
+      label: "Supprimer",
+      onClick: jest.fn(),
+      danger: true
+    }], BROUILLON);
+    expect(items).toHaveLength(1);
+    expect(items[0]?.divider).toBeUndefined();
+  });
+  test("nothing visible yields an empty list, so a caller can skip the trigger", () => {
+    expect(buildRowActionMenu([{
+      id: "del",
+      label: "Supprimer",
+      onClick: jest.fn(),
+      hidden: () => true
+    }], BROUILLON)).toEqual([]);
+  });
+  test("onClick is bound to the row it was built for", () => {
+    const onClick = jest.fn();
+    const items = buildRowActionMenu([{
+      id: "open",
+      label: "Consulter",
+      onClick
+    }], SOUMIS);
+    items[0]?.onClick?.();
+    expect(onClick).toHaveBeenCalledWith(SOUMIS);
+  });
+
+  /**
+   * R-3.3 caps what one screen may offer at once, and `OverflowMenu`'s own
+   * contract recommends ≤ 7 items. Exceeding it is a host decision, so it warns
+   * in development rather than truncating — silently dropping an action would
+   * hide a business capability.
+   */
+  test(`warns past ${MAX_ROW_ACTIONS} visible actions, without dropping any`, () => {
+    const warn = jest.spyOn(console, "warn").mockImplementation(() => undefined);
+    const descriptors = Array.from({
+      length: MAX_ROW_ACTIONS + 1
+    }, (_, i) => ({
+      id: `a${i}`,
+      label: `Action ${i}`,
+      onClick: jest.fn()
+    }));
+    const items = buildRowActionMenu(descriptors, BROUILLON);
+    expect(items).toHaveLength(MAX_ROW_ACTIONS + 1);
+    expect(warn).toHaveBeenCalled();
+    warn.mockRestore();
+  });
+});
+describe("buildRowActions", () => {
+  /**
+   * R-K.1 — the reason this layer exists. The implementation it replaced
+   * revealed its actions on hover, with a `mouseup` listener on `document` and
+   * no keyboard equivalent: consulting or deleting a record was unreachable
+   * without a mouse. `OverflowMenu` is an ARIA menu, so the trigger is a
+   * button and the items are reachable by keyboard.
+   */
+  test("renders a keyboard-reachable trigger, named by the caller", async () => {
+    const onClick = jest.fn();
+    const render$ = buildRowActions([{
+      id: "open",
+      label: "Consulter le dossier",
+      onClick
+    }], "Actions sur le dossier");
+    render(/*#__PURE__*/_jsx(_Fragment, {
+      children: render$(SOUMIS)
+    }));
+    const trigger = screen.getByRole("button", {
+      name: "Actions sur le dossier"
+    });
+    await userEvent.click(trigger);
+    await userEvent.click(screen.getByRole("menuitem", {
+      name: "Consulter le dossier"
+    }));
+    expect(onClick).toHaveBeenCalledWith(SOUMIS);
+  });
+  test("renders nothing when no action applies to the row", () => {
+    const render$ = buildRowActions([{
+      id: "del",
+      label: "Supprimer",
+      onClick: jest.fn(),
+      hidden: () => true
+    }]);
+    const {
+      container
+    } = render(/*#__PURE__*/_jsx(_Fragment, {
+      children: render$(BROUILLON)
+    }));
+    expect(container).toBeEmptyDOMElement();
+  });
+  test("the default trigger name is generic, so hosts localise it per resource", () => {
+    const render$ = buildRowActions([{
+      id: "open",
+      label: "Consulter",
+      onClick: jest.fn()
+    }]);
+    render(/*#__PURE__*/_jsx(_Fragment, {
+      children: render$(SOUMIS)
+    }));
+    expect(screen.getByRole("button", {
+      name: "Actions"
+    })).toBeInTheDocument();
+  });
+});
+//# sourceMappingURL=rowActions.test.js.map

package/dist/esm/v2/__tests__/rowActions.test.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"rowActions.test.js","names":["render","screen","userEvent","buildRowActions","buildRowActionMenu","MAX_ROW_ACTIONS","Fragment","_Fragment","jsx","_jsx","BROUILLON","id","status","SOUMIS","describe","test","descriptors","label","onClick","jest","fn","hidden","row","expect","toHaveLength","items","disabled","toBe","danger","map","i","Boolean","divider","toEqual","toBeUndefined","toHaveBeenCalledWith","warn","spyOn","console","mockImplementation","undefined","Array","from","length","_","toHaveBeenCalled","mockRestore","render$","children","trigger","getByRole","name","click","container","toBeEmptyDOMElement","toBeInTheDocument"],"sources":["../../../../src/lib/v2/__tests__/rowActions.test.tsx"],"sourcesContent":["/**\r\n * @jest-environment jsdom\r\n */\r\nimport \"@testing-library/jest-dom\";\r\nimport { render, screen } from \"@testing-library/react\";\r\nimport userEvent from \"@testing-library/user-event\";\r\nimport {\r\n  buildRowActions,\r\n  buildRowActionMenu,\r\n  MAX_ROW_ACTIONS,\r\n} from \"../patterns/rowActions\";\r\nimport type { RowActionDescriptor } from \"../patterns/rowActions\";\r\n\r\n/**\r\n * rowActions (G-41) — promoted from `refonte-frontend` (Area 5).\r\n *\r\n * Each assertion pins a Charter rule the descriptor layer carries, or a defect\r\n * the promoted implementation had been written to prevent. The per-row\r\n * evaluation of the predicates is the load-bearing part: a boolean would force\r\n * the host to rebuild the array per row, which is how a table row and a mobile\r\n * card end up offering different actions for the same record.\r\n */\r\n\r\ninterface Dossier {\r\n  id: number;\r\n  status: string;\r\n}\r\n\r\nconst BROUILLON: Dossier = { id: 1, status: \"DRAFT\" };\r\nconst SOUMIS: Dossier = { id: 2, status: \"SOUMIS\" };\r\n\r\ndescribe(\"buildRowActionMenu\", () => {\r\n  test(\"hidden is evaluated PER ROW, not once for the array\", () => {\r\n    const descriptors: RowActionDescriptor<Dossier>[] = [\r\n      { id: \"open\", label: \"Consulter\", onClick: jest.fn() },\r\n      {\r\n        id: \"del\",\r\n        label: \"Supprimer\",\r\n        onClick: jest.fn(),\r\n        hidden: (row) => row.status !== \"DRAFT\",\r\n      },\r\n    ];\r\n\r\n    expect(buildRowActionMenu(descriptors, BROUILLON)).toHaveLength(2);\r\n    expect(buildRowActionMenu(descriptors, SOUMIS)).toHaveLength(1);\r\n  });\r\n\r\n  test(\"disabled is evaluated per row too, and keeps the item visible\", () => {\r\n    const items = buildRowActionMenu<Dossier>(\r\n      [\r\n        {\r\n          id: \"edit\",\r\n          label: \"Modifier\",\r\n          onClick: jest.fn(),\r\n          disabled: (row) => row.status !== \"DRAFT\",\r\n        },\r\n      ],\r\n      SOUMIS\r\n    );\r\n    expect(items).toHaveLength(1);\r\n    expect(items[0]?.disabled).toBe(true);\r\n  });\r\n\r\n  /** R-B.6 — a destructive action is separated and marked, not merely last. */\r\n  test(\"a divider precedes the first destructive action\", () => {\r\n    const items = buildRowActionMenu<Dossier>(\r\n      [\r\n        { id: \"open\", label: \"Consulter\", onClick: jest.fn() },\r\n        { id: \"del\", label: \"Supprimer\", onClick: jest.fn(), danger: true },\r\n        { id: \"purge\", label: \"Purger\", onClick: jest.fn(), danger: true },\r\n      ],\r\n      BROUILLON\r\n    );\r\n    expect(items.map((i) => Boolean(i.divider))).toEqual([false, true, false, false]);\r\n  });\r\n\r\n  /**\r\n   * A menu does not open on a rule. The separator only appears if something\r\n   * precedes it — a row whose ONLY action is destructive gets no divider.\r\n   */\r\n  test(\"no leading divider when the destructive action comes first\", () => {\r\n    const items = buildRowActionMenu<Dossier>(\r\n      [{ id: \"del\", label: \"Supprimer\", onClick: jest.fn(), danger: true }],\r\n      BROUILLON\r\n    );\r\n    expect(items).toHaveLength(1);\r\n    expect(items[0]?.divider).toBeUndefined();\r\n  });\r\n\r\n  test(\"nothing visible yields an empty list, so a caller can skip the trigger\", () => {\r\n    expect(\r\n      buildRowActionMenu<Dossier>(\r\n        [{ id: \"del\", label: \"Supprimer\", onClick: jest.fn(), hidden: () => true }],\r\n        BROUILLON\r\n      )\r\n    ).toEqual([]);\r\n  });\r\n\r\n  test(\"onClick is bound to the row it was built for\", () => {\r\n    const onClick = jest.fn();\r\n    const items = buildRowActionMenu<Dossier>(\r\n      [{ id: \"open\", label: \"Consulter\", onClick }],\r\n      SOUMIS\r\n    );\r\n    items[0]?.onClick?.();\r\n    expect(onClick).toHaveBeenCalledWith(SOUMIS);\r\n  });\r\n\r\n  /**\r\n   * R-3.3 caps what one screen may offer at once, and `OverflowMenu`'s own\r\n   * contract recommends ≤ 7 items. Exceeding it is a host decision, so it warns\r\n   * in development rather than truncating — silently dropping an action would\r\n   * hide a business capability.\r\n   */\r\n  test(`warns past ${MAX_ROW_ACTIONS} visible actions, without dropping any`, () => {\r\n    const warn = jest.spyOn(console, \"warn\").mockImplementation(() => undefined);\r\n    const descriptors: RowActionDescriptor<Dossier>[] = Array.from(\r\n      { length: MAX_ROW_ACTIONS + 1 },\r\n      (_, i) => ({ id: `a${i}`, label: `Action ${i}`, onClick: jest.fn() })\r\n    );\r\n\r\n    const items = buildRowActionMenu(descriptors, BROUILLON);\r\n\r\n    expect(items).toHaveLength(MAX_ROW_ACTIONS + 1);\r\n    expect(warn).toHaveBeenCalled();\r\n    warn.mockRestore();\r\n  });\r\n});\r\n\r\ndescribe(\"buildRowActions\", () => {\r\n  /**\r\n   * R-K.1 — the reason this layer exists. The implementation it replaced\r\n   * revealed its actions on hover, with a `mouseup` listener on `document` and\r\n   * no keyboard equivalent: consulting or deleting a record was unreachable\r\n   * without a mouse. `OverflowMenu` is an ARIA menu, so the trigger is a\r\n   * button and the items are reachable by keyboard.\r\n   */\r\n  test(\"renders a keyboard-reachable trigger, named by the caller\", async () => {\r\n    const onClick = jest.fn();\r\n    const render$ = buildRowActions<Dossier>(\r\n      [{ id: \"open\", label: \"Consulter le dossier\", onClick }],\r\n      \"Actions sur le dossier\"\r\n    );\r\n\r\n    render(<>{render$(SOUMIS)}</>);\r\n\r\n    const trigger = screen.getByRole(\"button\", { name: \"Actions sur le dossier\" });\r\n    await userEvent.click(trigger);\r\n    await userEvent.click(\r\n      screen.getByRole(\"menuitem\", { name: \"Consulter le dossier\" })\r\n    );\r\n\r\n    expect(onClick).toHaveBeenCalledWith(SOUMIS);\r\n  });\r\n\r\n  test(\"renders nothing when no action applies to the row\", () => {\r\n    const render$ = buildRowActions<Dossier>([\r\n      { id: \"del\", label: \"Supprimer\", onClick: jest.fn(), hidden: () => true },\r\n    ]);\r\n    const { container } = render(<>{render$(BROUILLON)}</>);\r\n    expect(container).toBeEmptyDOMElement();\r\n  });\r\n\r\n  test(\"the default trigger name is generic, so hosts localise it per resource\", () => {\r\n    const render$ = buildRowActions<Dossier>([\r\n      { id: \"open\", label: \"Consulter\", onClick: jest.fn() },\r\n    ]);\r\n    render(<>{render$(SOUMIS)}</>);\r\n    expect(screen.getByRole(\"button\", { name: \"Actions\" })).toBeInTheDocument();\r\n  });\r\n});\r\n"],"mappings":"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","ignoreList":[]}

package/dist/esm/v2/__tests__/useFocusOnRouteChange.test.js

@@ -0,0 +1,155 @@
+import "@testing-library/jest-dom";
+import { render, screen } from "@testing-library/react";
+import AppMain from "../patterns/AppMain";
+import useFocusOnRouteChange from "../hooks/useFocusOnRouteChange";
+
+/**
+ * G-60 — focus on page change.
+ *
+ * What this guards is invisible by construction: after a route change in a
+ * single-page application the pixels are perfect and the focus is on
+ * `document.body`, so the next Tab starts at the top of the BROWSER rather than
+ * the page. Only an assertion catches it.
+ *
+ * The harness mirrors the real arrangement — the hook is called by a component
+ * INSIDE the landmark it targets, because that is where a router puts it — and
+ * drives the key by prop rather than importing a router: the hook is
+ * router-agnostic and its tests should be too.
+ */
+import { jsx as _jsx } from "react/jsx-runtime";
+function Page({
+  routeKey
+}) {
+  useFocusOnRouteChange(routeKey);
+  return /*#__PURE__*/_jsx("button", {
+    type: "button",
+    children: "Action de la page"
+  });
+}
+function Harness({
+  routeKey
+}) {
+  return /*#__PURE__*/_jsx(AppMain, {
+    children: /*#__PURE__*/_jsx(Page, {
+      routeKey: routeKey
+    })
+  });
+}
+describe("useFocusOnRouteChange", () => {
+  /* The browser already places focus at the start of the document on load.
+   * Moving it then would fight the browser and scroll a deep-linked page away
+   * from its anchor. */
+  it("leaves focus alone on the first render", () => {
+    render(/*#__PURE__*/_jsx(Harness, {
+      routeKey: "/demandes"
+    }));
+    expect(screen.getByRole("main")).not.toHaveFocus();
+  });
+  it("moves focus to the landmark when the key changes", () => {
+    const {
+      rerender
+    } = render(/*#__PURE__*/_jsx(Harness, {
+      routeKey: "/demandes"
+    }));
+
+    /* Focus somewhere inside the old page, as a user would have it after
+       clicking the action that navigates. */
+    screen.getByRole("button").focus();
+    expect(screen.getByRole("button")).toHaveFocus();
+    rerender(/*#__PURE__*/_jsx(Harness, {
+      routeKey: "/demandes/42"
+    }));
+    expect(screen.getByRole("main")).toHaveFocus();
+  });
+
+  /* A re-render with the SAME key must not steal focus — a listing re-renders
+   * on every keystroke of its search field, and the host is told to watch the
+   * pathname precisely so that state changes are not page changes. */
+  it("does not move focus when the key is unchanged", () => {
+    const {
+      rerender
+    } = render(/*#__PURE__*/_jsx(Harness, {
+      routeKey: "/demandes"
+    }));
+    screen.getByRole("button").focus();
+    rerender(/*#__PURE__*/_jsx(Harness, {
+      routeKey: "/demandes"
+    }));
+    expect(screen.getByRole("button")).toHaveFocus();
+  });
+  it("honours a custom target id", () => {
+    function CustomPage({
+      routeKey
+    }) {
+      useFocusOnRouteChange(routeKey, {
+        targetId: "zone-principale"
+      });
+      return null;
+    }
+    const {
+      rerender
+    } = render(/*#__PURE__*/_jsx(AppMain, {
+      id: "zone-principale",
+      children: /*#__PURE__*/_jsx(CustomPage, {
+        routeKey: "/a"
+      })
+    }));
+    rerender(/*#__PURE__*/_jsx(AppMain, {
+      id: "zone-principale",
+      children: /*#__PURE__*/_jsx(CustomPage, {
+        routeKey: "/b"
+      })
+    }));
+    expect(screen.getByRole("main")).toHaveFocus();
+  });
+  it("can be suspended", () => {
+    function DisabledPage({
+      routeKey
+    }) {
+      useFocusOnRouteChange(routeKey, {
+        enabled: false
+      });
+      return /*#__PURE__*/_jsx("button", {
+        type: "button",
+        children: "Action"
+      });
+    }
+    const {
+      rerender
+    } = render(/*#__PURE__*/_jsx(AppMain, {
+      children: /*#__PURE__*/_jsx(DisabledPage, {
+        routeKey: "/a"
+      })
+    }));
+    screen.getByRole("button").focus();
+    rerender(/*#__PURE__*/_jsx(AppMain, {
+      children: /*#__PURE__*/_jsx(DisabledPage, {
+        routeKey: "/b"
+      })
+    }));
+    expect(screen.getByRole("button")).toHaveFocus();
+  });
+
+  /* A host may render the hook on a shell that mounts before its landmark —
+   * a pre-auth screen, an error boundary. Throwing there would replace a
+   * missing focus move with a crash. */
+  it("does nothing when the target is absent", () => {
+    function Orphan({
+      routeKey
+    }) {
+      useFocusOnRouteChange(routeKey);
+      return /*#__PURE__*/_jsx("span", {
+        children: "sans landmark"
+      });
+    }
+    const {
+      rerender
+    } = render(/*#__PURE__*/_jsx(Orphan, {
+      routeKey: "/a"
+    }));
+    expect(() => rerender(/*#__PURE__*/_jsx(Orphan, {
+      routeKey: "/b"
+    }))).not.toThrow();
+  });
+});
+//# sourceMappingURL=useFocusOnRouteChange.test.js.map

package/dist/esm/v2/__tests__/useFocusOnRouteChange.test.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"useFocusOnRouteChange.test.js","names":["render","screen","AppMain","useFocusOnRouteChange","jsx","_jsx","Page","routeKey","type","children","Harness","describe","it","expect","getByRole","not","toHaveFocus","rerender","focus","CustomPage","targetId","id","DisabledPage","enabled","Orphan","toThrow"],"sources":["../../../../src/lib/v2/__tests__/useFocusOnRouteChange.test.tsx"],"sourcesContent":["import \"@testing-library/jest-dom\";\r\nimport { render, screen } from \"@testing-library/react\";\r\n\r\nimport AppMain from \"../patterns/AppMain\";\r\nimport useFocusOnRouteChange from \"../hooks/useFocusOnRouteChange\";\r\n\r\n/**\r\n * G-60 — focus on page change.\r\n *\r\n * What this guards is invisible by construction: after a route change in a\r\n * single-page application the pixels are perfect and the focus is on\r\n * `document.body`, so the next Tab starts at the top of the BROWSER rather than\r\n * the page. Only an assertion catches it.\r\n *\r\n * The harness mirrors the real arrangement — the hook is called by a component\r\n * INSIDE the landmark it targets, because that is where a router puts it — and\r\n * drives the key by prop rather than importing a router: the hook is\r\n * router-agnostic and its tests should be too.\r\n */\r\n\r\nfunction Page({ routeKey }: { routeKey: string }) {\r\n  useFocusOnRouteChange(routeKey);\r\n  return <button type=\"button\">Action de la page</button>;\r\n}\r\n\r\nfunction Harness({ routeKey }: { routeKey: string }) {\r\n  return (\r\n    <AppMain>\r\n      <Page routeKey={routeKey} />\r\n    </AppMain>\r\n  );\r\n}\r\n\r\ndescribe(\"useFocusOnRouteChange\", () => {\r\n  /* The browser already places focus at the start of the document on load.\r\n   * Moving it then would fight the browser and scroll a deep-linked page away\r\n   * from its anchor. */\r\n  it(\"leaves focus alone on the first render\", () => {\r\n    render(<Harness routeKey=\"/demandes\" />);\r\n    expect(screen.getByRole(\"main\")).not.toHaveFocus();\r\n  });\r\n\r\n  it(\"moves focus to the landmark when the key changes\", () => {\r\n    const { rerender } = render(<Harness routeKey=\"/demandes\" />);\r\n\r\n    /* Focus somewhere inside the old page, as a user would have it after\r\n       clicking the action that navigates. */\r\n    screen.getByRole(\"button\").focus();\r\n    expect(screen.getByRole(\"button\")).toHaveFocus();\r\n\r\n    rerender(<Harness routeKey=\"/demandes/42\" />);\r\n\r\n    expect(screen.getByRole(\"main\")).toHaveFocus();\r\n  });\r\n\r\n  /* A re-render with the SAME key must not steal focus — a listing re-renders\r\n   * on every keystroke of its search field, and the host is told to watch the\r\n   * pathname precisely so that state changes are not page changes. */\r\n  it(\"does not move focus when the key is unchanged\", () => {\r\n    const { rerender } = render(<Harness routeKey=\"/demandes\" />);\r\n\r\n    screen.getByRole(\"button\").focus();\r\n    rerender(<Harness routeKey=\"/demandes\" />);\r\n\r\n    expect(screen.getByRole(\"button\")).toHaveFocus();\r\n  });\r\n\r\n  it(\"honours a custom target id\", () => {\r\n    function CustomPage({ routeKey }: { routeKey: string }) {\r\n      useFocusOnRouteChange(routeKey, { targetId: \"zone-principale\" });\r\n      return null;\r\n    }\r\n\r\n    const { rerender } = render(\r\n      <AppMain id=\"zone-principale\">\r\n        <CustomPage routeKey=\"/a\" />\r\n      </AppMain>\r\n    );\r\n    rerender(\r\n      <AppMain id=\"zone-principale\">\r\n        <CustomPage routeKey=\"/b\" />\r\n      </AppMain>\r\n    );\r\n\r\n    expect(screen.getByRole(\"main\")).toHaveFocus();\r\n  });\r\n\r\n  it(\"can be suspended\", () => {\r\n    function DisabledPage({ routeKey }: { routeKey: string }) {\r\n      useFocusOnRouteChange(routeKey, { enabled: false });\r\n      return <button type=\"button\">Action</button>;\r\n    }\r\n\r\n    const { rerender } = render(\r\n      <AppMain>\r\n        <DisabledPage routeKey=\"/a\" />\r\n      </AppMain>\r\n    );\r\n    screen.getByRole(\"button\").focus();\r\n    rerender(\r\n      <AppMain>\r\n        <DisabledPage routeKey=\"/b\" />\r\n      </AppMain>\r\n    );\r\n\r\n    expect(screen.getByRole(\"button\")).toHaveFocus();\r\n  });\r\n\r\n  /* A host may render the hook on a shell that mounts before its landmark —\r\n   * a pre-auth screen, an error boundary. Throwing there would replace a\r\n   * missing focus move with a crash. */\r\n  it(\"does nothing when the target is absent\", () => {\r\n    function Orphan({ routeKey }: { routeKey: string }) {\r\n      useFocusOnRouteChange(routeKey);\r\n      return <span>sans landmark</span>;\r\n    }\r\n\r\n    const { rerender } = render(<Orphan routeKey=\"/a\" />);\r\n    expect(() => rerender(<Orphan routeKey=\"/b\" />)).not.toThrow();\r\n  });\r\n});\r\n"],"mappings":"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","ignoreList":[]}