test(stock-orders): Edit button row coverage

Asserts the Edit button appears on draft rows only, and that clicking
it opens the modal with the right editPurchaseId. The mock stops
forwarding the click to the row's onClick via the existing
e.stopPropagation() pattern in the implementation.

Co-authored-by: Orca <help@stably.ai>
This commit is contained in:
SJCoetz 2026-07-31 14:01:40 +02:00
parent 1d2499a17a
commit 7b3601eab2

View file

@ -76,11 +76,17 @@ vi.mock("@/components/stock-orders/quick-draft-modal", () => ({
QuickDraftModal: ({
open,
onOpenChange,
editPurchaseId,
}: {
open: boolean;
onOpenChange: (b: boolean) => void;
editPurchaseId?: string;
}) => (
<div data-testid="quick-draft-modal" data-open={open}>
<div
data-testid="quick-draft-modal"
data-open={open}
data-edit-purchase-id={editPurchaseId ?? ""}
>
<button
type="button"
data-testid="quick-draft-modal-close"
@ -135,4 +141,85 @@ describe("StockOrdersPage — quick draft button", () => {
fireEvent.click(screen.getByTestId("quick-draft-modal-close"));
expect(modal.dataset.open).toBe("false");
});
});
describe("StockOrdersPage — edit draft button", () => {
beforeEach(() => {
_resetState();
});
afterEach(() => {
cleanup();
});
// Minimal row shape — the page reads id / status / purchase_number off
// the row, and the page itself derives `item_count` from a separate
// PB call. The helper fields below are kept so the mock's getList
// returns a row shape that satisfies the BaseRecord + StockPurchase
// interfaces without TS shouting during render.
function makeRow(overrides: {
id: string;
status: "draft" | "sent" | "received" | "cancelled";
purchase_number: string;
}) {
return {
id: overrides.id,
created: "2026-07-30 10:00:00.000Z",
updated: "2026-07-30 10:00:00.000Z",
collectionId: "stock_purchases",
collectionName: "stock_purchases",
purchase_number: overrides.purchase_number,
supplier: "supplier-1",
status: overrides.status,
notes: "",
email_error: "",
email_message_id: "",
item_count: 0,
expand: { supplier: { id: "supplier-1", suppliername: "Steel & Pipe Co" } },
};
}
it("renders an Edit button on draft rows", async () => {
_state.items.push(
makeRow({ id: "po-abc", status: "draft", purchase_number: "PO26000001STK" }),
);
render(<StockOrdersPage />);
const editButton = await screen.findByTestId("edit-draft-button");
expect(editButton).toBeInTheDocument();
expect(editButton).toHaveAttribute(
"aria-label",
"Edit draft PO26000001STK",
);
});
it("does NOT render an Edit button on non-draft rows", async () => {
_state.items.push(
makeRow({ id: "po-sent", status: "sent", purchase_number: "PO26000002STK" }),
);
render(<StockOrdersPage />);
// Wait for the table to render at least one row (the page filters by
// status "" → all, so the sent row will appear). Then assert no
// Edit button exists anywhere.
await screen.findByTestId("quick-draft-modal");
expect(screen.queryByTestId("edit-draft-button")).toBeNull();
});
it("clicking Edit opens the modal with editPurchaseId set to the row id", async () => {
_state.items.push(
makeRow({ id: "po-abc", status: "draft", purchase_number: "PO26000001STK" }),
);
render(<StockOrdersPage />);
const modal = await screen.findByTestId("quick-draft-modal");
expect(modal.dataset.open).toBe("false");
expect(modal.dataset.editPurchaseId).toBe("");
const editButton = await screen.findByTestId("edit-draft-button");
fireEvent.click(editButton);
expect(modal.dataset.open).toBe("true");
expect(modal.dataset.editPurchaseId).toBe("po-abc");
});
});