pleno-vue/tests/e2e/admin-department-notifications.spec.ts

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

type NotificationSmsRow = {
  id: number;
  department: number;
  label: string;
  phone_country_code: number;
  phone: number;
  enabled: boolean;
  created_at: string;
};

const json = (body: unknown, status = 200) => ({
  status,
  contentType: "application/json",
  body: JSON.stringify(body),
});
const pageReadyTimeout = process.env.CI ? 30_000 : 15_000;

const setupNotificationSmsApi = async (page: Page) => {
  let listRequestCount = 0;
  const mutations: Array<{ method: string; body?: Record<string, unknown>; id?: number }> = [];
  let rows: NotificationSmsRow[] = [
    {
      id: 501,
      department: 1,
      label: "Dispatch line",
      phone_country_code: 45,
      phone: 12345678,
      enabled: true,
      created_at: "2026-07-06 12:00:00",
    },
  ];

  await page.route(apiPathPattern("/department/notification/sms"), async (route) => {
    const request = route.request();
    const method = request.method();

    if (method === "GET") {
      listRequestCount += 1;
      await route.fulfill(
        json({
          data: rows,
          meta: {
            pagination: {
              page: 1,
              per_page: 100,
              total: rows.length,
            },
          },
        })
      );
      return;
    }

    if (method === "PUT") {
      const body = request.postDataJSON() as Record<string, unknown>;
      mutations.push({ method, body });
      rows = rows.map((row) =>
        Number(row.id) === Number(body.id)
          ? {
              ...row,
              enabled: body.enabled === true,
            }
          : row
      );

      await route.fulfill(json({ data: { message: "Department notification SMS updated" } }));
      return;
    }

    if (method === "DELETE") {
      const id = Number(new URL(request.url()).searchParams.get("id") || 0);
      mutations.push({ method, id });
      rows = rows.filter((row) => Number(row.id) !== id);

      await route.fulfill(json({ data: { message: "Department notification SMS deleted" } }));
      return;
    }

    await route.fulfill(json({ message: "Unsupported notification SMS method" }, 405));
  });

  return {
    mutations,
    get listRequestCount() {
      return listRequestCount;
    },
  };
};

test("@smoke department notification SMS active toggle and delete refresh the table", async ({ page }) => {
  const notificationErrors: Array<{ status: number; url: string }> = [];
  page.on("response", (response) => {
    if (response.url().includes("/department/notification/sms") && response.status() >= 400) {
      notificationErrors.push({
        status: response.status(),
        url: response.url(),
      });
    }
  });

  await seedAuthenticatedState(page, "admin-department-notifications-token");
  await mockApi(page, {
    authenticated: true,
    permissions: [
      "admin",
      "department_access_1",
      "department_notification_sms_get",
      "department_notification_sms_update",
      "department_notification_sms_delete",
      "department_notification_sms_add",
    ],
  });
  const notificationSmsApi = await setupNotificationSmsApi(page);

  await page.goto("/admin/1/modules/notifications", { waitUntil: "domcontentloaded" });
  await expect.poll(() => notificationSmsApi.listRequestCount, { timeout: pageReadyTimeout }).toBeGreaterThan(0);

  const row = page.locator("tr", { hasText: "Dispatch line" });
  await expect(row).toBeVisible({ timeout: pageReadyTimeout });
  const enabledToggle = page.getByTestId("department-notification-sms-enabled-toggle-501");
  await expect(enabledToggle).toBeChecked();

  const listRequestsBeforeToggle = notificationSmsApi.listRequestCount;
  const updateRequestPromise = page.waitForRequest(
    (request) => request.method() === "PUT" && request.url().includes("/department/notification/sms")
  );
  await enabledToggle.uncheck({ force: true });

  const updateRequest = await updateRequestPromise;
  expect(updateRequest.postDataJSON()).toMatchObject({
    id: 501,
    enabled: false,
  });
  await expect.poll(() => notificationSmsApi.listRequestCount).toBeGreaterThan(listRequestsBeforeToggle);
  await expect(enabledToggle).not.toBeChecked();

  const listRequestsBeforeDelete = notificationSmsApi.listRequestCount;
  await row.locator('button[aria-haspopup="true"]').click();
  const deleteRequestPromise = page.waitForRequest(
    (request) => request.method() === "DELETE" && request.url().includes("/department/notification/sms")
  );
  await page.getByTestId("department-notification-sms-delete-501").click();
  await expect(page.locator(".swal2-popup")).toBeVisible();
  await page.locator(".swal2-confirm").click();

  const deleteRequest = await deleteRequestPromise;
  expect(new URL(deleteRequest.url()).searchParams.get("id")).toBe("501");
  await expect.poll(() => notificationSmsApi.listRequestCount).toBeGreaterThan(listRequestsBeforeDelete);
  await expect(page.locator("tr", { hasText: "Dispatch line" })).toHaveCount(0);
  expect(notificationErrors).toEqual([]);
  expect(notificationSmsApi.mutations).toEqual([
    {
      method: "PUT",
      body: {
        id: 501,
        enabled: false,
      },
    },
    {
      method: "DELETE",
      id: 501,
    },
  ]);
});