pleno-vue/tests/e2e/change-customer.spec.ts

import { expect, test } from "@playwright/test";
import { apiPathPattern, mockApi, seedAuthenticatedState } from "./support/network.js";

const actionSetupErrorRegex =
  /Need to install with `app\.use` function|Unhandled error during execution of setup function/i;

test.describe("Orders change customer", () => {
  test("opens the shared assignment modal without i18n setup errors", async ({ page }, testInfo) => {
    test.skip(!/desktop/i.test(testInfo.project.name), "Desktop only");

    const setupErrors: string[] = [];
    page.on("pageerror", (error) => {
      const message = String(error);
      if (actionSetupErrorRegex.test(message)) {
        setupErrors.push(message);
      }
    });
    page.on("console", (message) => {
      if (!["error", "warning"].includes(message.type())) {
        return;
      }

      const text = message.text();
      if (actionSetupErrorRegex.test(text)) {
        setupErrors.push(text);
      }
    });

    await seedAuthenticatedState(page);
    await mockApi(page, {
      authenticated: true,
      permissions: ["superuser", "admin", "user"],
      sessionData: {
        runtime_config: {
          economic: {
            transaction_draft_customer_number: 6001,
          },
        },
      },
    });

    await page.goto("/tests/e2e/harness/change-customer-modal.html");
    await expect(page.getByTestId("change-customer-harness-status")).toHaveText("ready");

    await page.getByTestId("change-customer-harness-open").click();

    const modal = page.getByTestId("draft-order-assign-customer-modal");
    await expect(modal).toBeVisible();
    await expect(page.getByTestId("draft-order-assign-title")).toContainText("Skift kunde");
    await expect(page.getByTestId("draft-order-assign-customer-search")).toBeVisible();
    await expect(page.getByTestId("draft-order-recalculate-prices")).toBeChecked();

    await page.waitForTimeout(250);
    expect(setupErrors).toEqual([]);
  });

  test("uses the same customer assignment flow and submit behavior as the draft assignment modal", async ({
    page,
  }, testInfo) => {
    test.skip(!/desktop/i.test(testInfo.project.name), "Desktop only");

    await seedAuthenticatedState(page);
    await mockApi(page, {
      authenticated: true,
      permissions: ["superuser", "admin", "user"],
      sessionData: {
        runtime_config: {
          economic: {
            transaction_draft_customer_number: 6001,
          },
        },
      },
    });

    await page.route(apiPathPattern("/customers"), async (route) => {
      await route.fulfill({
        status: 200,
        contentType: "application/json",
        body: JSON.stringify({
          success: true,
          data: [
            {
              customerNumber: 12345679,
              name: "(TEST) Pleno Vognmandsforretning",
              city: "Taastrup",
            },
          ],
          meta: {
            pagination: {
              page: 1,
              per_page: 100,
              total: 1,
            },
          },
        }),
      });
    });

    await page.route(apiPathPattern("/collected-invoices"), async (route) => {
      await route.fulfill({
        status: 200,
        contentType: "application/json",
        body: JSON.stringify({
          success: true,
          data: [
            {
              id: 101,
              customer_number: 12345679,
              customer_name: "(TEST) Pleno Vognmandsforretning",
              created_at: "2026-04-21 13:30:00",
              closed_at: null,
              total_net_amount: 1562,
              orders: 2,
            },
          ],
          meta: {
            pagination: {
              page: 1,
              per_page: 100,
              total: 1,
            },
          },
        }),
      });
    });

    await page.goto("/tests/e2e/harness/change-customer-modal.html");
    await expect(page.getByTestId("change-customer-harness-status")).toHaveText("ready");

    await page.getByTestId("change-customer-harness-open").click();

    const modal = page.getByTestId("draft-order-assign-customer-modal");
    await expect(modal).toBeVisible();

    await page.getByTestId("draft-order-assign-customer-search").fill("12345679");
    await page.getByTestId("draft-order-customer-option-12345679").click();
    await expect(page.getByTestId("draft-order-selected-customer")).toContainText("12345679");

    const firstInvoiceCollection = page.locator('[data-testid^="draft-order-invoice-collection-option-"]').first();
    await expect(firstInvoiceCollection).toBeVisible();
    await firstInvoiceCollection.click();

    await page.getByTestId("draft-order-recalculate-prices").evaluate((element) => {
      const checkbox = element as HTMLInputElement;
      checkbox.checked = false;
      checkbox.dispatchEvent(new Event("input", { bubbles: true }));
      checkbox.dispatchEvent(new Event("change", { bubbles: true }));
    });
    await page.getByTestId("draft-order-assign-submit").click();

    await expect(modal).toHaveCount(0);
    await expect(page.getByTestId("change-customer-harness-status")).toHaveText("assigned");

    const assignment = await page.evaluate(
      () => (window as typeof window & { __changeCustomerAssignment?: unknown }).__changeCustomerAssignment
    );
    expect(assignment).toMatchObject({
      customer_id: 12345679,
    });
  });
});