@12-apps/payments-frontend 1.3.1 → 1.4.1

package/src/components/checkout/__tests__/save-on-continue.test.tsx

@@ -1,165 +0,0 @@
-// @vitest-environment jsdom
-/**
- * The buyer's details must be persisted when they press "Continuar" on the
- * "Dados" step — NOT when a payment is raised.
- *
- * This is a regression test with a history: the save used to live only in the
- * order-creation path, which runs a whole step later, only once a payment
- * method is chosen, and which deliberately never writes the CPF. A buyer who
- * filled the form and then hit anything at all on the payment screen — no
- * provider configured, a declined card, an abandoned PIX, a closed tab — had
- * nothing stored.
- *
- * Since FUT-564 the write itself belongs to the host (`saveBuyerContact` port;
- * the storefront's implementation owns the wire shape and the blank-CPF-never-
- * clears rule, pinned in its own suite). What THIS suite pins is the flow's
- * side of the contract — TIMING, CONSENT and INDEPENDENCE: the port fires on
- * "Continuar", carries the CPF, respects the LGPD checkbox, and the step
- * advances no matter what the host does with the call.
- */
-import { act, renderHook, waitFor } from "@testing-library/react";
-import { afterEach, describe, expect, it, vi } from "vitest";
-
-import { useCheckoutController, type CheckoutHostPorts } from "../use-checkout-controller";
-import type { BuyerContact } from "../types";
-
-/** A valid CPF (passes the client-side check digits). */
-const VALID_CPF = "52998224725";
-
-/**
- * One test's own port set + recorder. Everything is a local — no module-level
- * mutable state, so the tests carry no order dependency between them
- * (`test-flakiness/no-test-isolation`). The stub only ever PUSHES onto its
- * container, never reassigns a closed-over binding (`no-global-state-mutation`).
- */
-function makePorts(): {
-  ports: CheckoutHostPorts;
-  savedContacts: () => BuyerContact[];
-  orderRequested: () => boolean;
-} {
-  const recorded: BuyerContact[] = [];
-  const createOrder = vi.fn();
-  return {
-    ports: {
-      createOrder,
-      saveBuyerContact: (contact) => {
-        recorded.push(contact);
-      },
-      onExitToMenu: vi.fn(),
-    },
-    savedContacts: () => recorded,
-    orderRequested: () => createOrder.mock.calls.length > 0,
-  };
-}
-
-afterEach(() => {
-  vi.restoreAllMocks();
-});
-
-describe('"Dados" step persists the buyer on Continuar', () => {
-  it("saves name, phone and CPF the moment Continuar is pressed", async () => {
-    const { ports, savedContacts, orderRequested } = makePorts();
-    const { result } = renderHook(() => useCheckoutController(ports));
-
-    act(() => {
-      result.current.setBuyer({ name: "Ana", phone: "11999999999", taxId: VALID_CPF });
-    });
-    act(() => {
-      result.current.goToPayment();
-    });
-
-    await waitFor(() => expect(savedContacts()).toHaveLength(1));
-    expect(savedContacts()[0]).toEqual({
-      name: "Ana",
-      phone: "11999999999",
-      taxId: VALID_CPF,
-    });
-    // The whole point: no order was created, and none needed to be.
-    expect(orderRequested()).toBe(false);
-  });
-
-  it("advances to Pagamento without waiting on the save", async () => {
-    const { ports, savedContacts } = makePorts();
-    // A host whose save blows up must not trap the buyer on the Dados step —
-    // the port is fire-and-forget, so the flow never sees the failure at all.
-    const { result } = renderHook(() => useCheckoutController(ports));
-
-    act(() => {
-      result.current.setBuyer({ name: "Ana", taxId: VALID_CPF });
-    });
-    act(() => {
-      result.current.goToPayment();
-    });
-
-    await waitFor(() => expect(savedContacts()).toHaveLength(1));
-    expect(result.current.step).toBe("payment");
-  });
-
-  it("does not save when the buyer declined the consent checkbox", async () => {
-    const { ports, savedContacts } = makePorts();
-    const { result } = renderHook(() => useCheckoutController(ports));
-
-    act(() => {
-      result.current.setBuyer({ name: "Ana", taxId: VALID_CPF });
-      result.current.setSaveProfile(false);
-    });
-    act(() => {
-      result.current.goToPayment();
-    });
-
-    await waitFor(() => expect(result.current.step).toBe("payment"));
-    expect(savedContacts()).toHaveLength(0);
-  });
-
-  it("does not save — or advance — when the CPF is invalid", async () => {
-    const { ports, savedContacts } = makePorts();
-    const { result } = renderHook(() => useCheckoutController(ports));
-
-    act(() => {
-      result.current.setBuyer({ name: "Ana", taxId: "11111111111" });
-    });
-    act(() => {
-      result.current.goToPayment();
-    });
-
-    await waitFor(() => expect(result.current.errorField).toBe("cpf"));
-    expect(result.current.step).toBe("dados");
-    expect(savedContacts()).toHaveLength(0);
-  });
-
-  it("lets a buyer with a CPF on file continue without retyping it", async () => {
-    const { ports, savedContacts } = makePorts();
-    // Third argument: the buyer already gave the store a CPF, so Dados was
-    // skipped and they reopened it through "Alterar". The field starts empty
-    // (the client never receives the saved value) — requiring one here stranded
-    // them on a form they had no way to satisfy.
-    const { result } = renderHook(() => useCheckoutController(ports, undefined, true));
-
-    act(() => {
-      result.current.setStep("dados");
-    });
-    act(() => {
-      result.current.goToPayment();
-    });
-
-    await waitFor(() => expect(result.current.step).toBe("payment"));
-    expect(result.current.errorField).toBeNull();
-    // Nothing typed ⇒ the port carries no values at all. What the HOST must do
-    // with a blank CPF (omit it so it can never clear the stored one) is the
-    // host's contract, pinned beside its `saveBuyerContact` implementation.
-    expect(savedContacts()[0]).toEqual({ name: undefined, phone: undefined, taxId: undefined });
-  });
-
-  it("still demands a CPF from a buyer who has none on file", async () => {
-    const { ports, savedContacts } = makePorts();
-    const { result } = renderHook(() => useCheckoutController(ports));
-
-    act(() => {
-      result.current.goToPayment();
-    });
-
-    await waitFor(() => expect(result.current.errorField).toBe("cpf"));
-    expect(result.current.step).toBe("dados");
-    expect(savedContacts()).toHaveLength(0);
-  });
-});

package/src/components/checkout/__tests__/second-host.test.tsx

@@ -1,86 +0,0 @@
-// @vitest-environment jsdom
-/**
- * The second-host proof (FUT-564 acceptance).
- *
- * This package's dependency graph contains NO `@12-apps/ui` — it is not even
- * resolvable from here — so a green run of this suite IS the proof that a host
- * without this repo's design system can mount the buyer checkout: every pixel
- * below renders through the raw-MUI default slots (`mui-defaults.tsx`),
- * because no `components` prop is passed and no provider sits above the flow.
- *
- * The walk is the buyer's own: Dados (CPF form, consent checkbox, pay bar) →
- * Pagamento (method picker) → the card form, with the order raised through the
- * host port. The load-bearing test ids must survive the default slots too —
- * they are the same hooks the storefront journeys click.
- */
-import { cleanup, fireEvent, render, screen, waitFor } from "@testing-library/react";
-import { afterEach, describe, expect, it, vi } from "vitest";
-
-import { CheckoutFlow } from "../checkout-flow";
-import type { CheckoutOrder, CreateOrderRequest, CreateOrderResult } from "../types";
-
-afterEach(cleanup);
-
-const CARD_ORDER: CheckoutOrder = {
-  orderId: "o-2nd-host",
-  status: "AWAITING_PAYMENT",
-  method: "CARD",
-  totalCents: 1000,
-  subtotalCents: 1000,
-  discountTotalCents: 0,
-  appliedDiscounts: [],
-  totalLabel: "R$ 10,00",
-};
-
-/** A valid CPF (passes the client-side check digits). */
-const VALID_CPF = "52998224725";
-
-describe("CheckoutFlow with no design system present (raw-MUI default slots)", () => {
-  it("walks Dados → Pagamento → card form through the default slots", async () => {
-    const createOrder = vi.fn<(input: CreateOrderRequest) => Promise<CreateOrderResult>>(
-      async () => ({ ok: true, data: CARD_ORDER }),
-    );
-
-    render(
-      <CheckoutFlow
-        cart={{ empty: false, totalLabel: "R$ 10,00", totalItems: 1 }}
-        createOrder={createOrder}
-        onExitToMenu={vi.fn()}
-      />,
-    );
-
-    // Dados renders through the defaults: stepper, CPF field, consent, pay bar.
-    expect(screen.getByTestId("checkout-stepper")).toBeTruthy();
-    expect(screen.getByTestId("buyer-save-profile")).toBeTruthy();
-    expect(screen.getByTestId("checkout-pay-bar")).toBeTruthy();
-
-    fireEvent.change(screen.getByTestId("buyer-cpf"), { target: { value: VALID_CPF } });
-    fireEvent.click(screen.getByTestId("checkout-continue"));
-
-    // Pagamento: the method picker, with both in-browser methods on offer.
-    await waitFor(() => expect(screen.getByTestId("checkout-method")).toBeTruthy());
-    expect(screen.getByTestId("checkout-method-PIX")).toBeTruthy();
-
-    // Choosing card auto-raises the order through the HOST port…
-    fireEvent.click(screen.getByTestId("checkout-method-CARD"));
-    await waitFor(() => expect(createOrder).toHaveBeenCalledTimes(1));
-    expect(createOrder.mock.calls[0]?.[0]).toMatchObject({ method: "CARD", saveProfile: true });
-
-    // …and the card form renders, again through the default slots.
-    await waitFor(() => expect(screen.getByTestId("card-number")).toBeTruthy());
-    expect(screen.getByTestId("card-holder")).toBeTruthy();
-    expect(screen.getByTestId("card-pay")).toBeTruthy();
-  });
-
-  it("shows the empty-cart state for a cart with nothing to pay", () => {
-    render(
-      <CheckoutFlow
-        cart={{ empty: true, totalLabel: "R$ 0,00", totalItems: 0 }}
-        createOrder={vi.fn()}
-        onExitToMenu={vi.fn()}
-      />,
-    );
-
-    expect(screen.getByTestId("checkout-empty")).toBeTruthy();
-  });
-});