pn-new-crm/tests/e2e/smoke/02-crud-spine.spec.ts

import { test, expect } from '@playwright/test';
import { login, navigateTo, waitForSheet, PORT_SLUG } from './helpers';

const TEST_CLIENT_NAME = `E2E Client ${Date.now()}`;

test.describe('CRUD Spine', () => {
  test.beforeEach(async ({ page }) => {
    await login(page, 'super_admin');
  });

  test('create a new client', async ({ page }) => {
    await navigateTo(page, '/clients');

    // Click "New Client" button (use first() in case of duplicates in empty state)
    await page
      .getByRole('button', { name: /new client/i })
      .first()
      .click();
    await waitForSheet(page);

    const sheet = page.locator('[role="dialog"]');
    await sheet.locator('input[name="fullName"]').fill(TEST_CLIENT_NAME);
    await sheet.locator('input[name="nationality"]').fill('British');
    await sheet.locator('input[name="contacts.0.value"]').fill('e2e@test.com');

    await sheet.getByRole('button', { name: /create client/i }).click();
    await expect(sheet).not.toBeVisible({ timeout: 10_000 });
    await page.waitForTimeout(2000);
  });

  test('new client appears in the list', async ({ page }) => {
    await navigateTo(page, '/clients');

    // Wait for table to load
    await expect(page.locator('table').first()).toBeVisible({ timeout: 15_000 });
    await page.waitForTimeout(2000);

    // The client name should appear somewhere in the table or page
    const hasClient = await page
      .getByText(TEST_CLIENT_NAME)
      .isVisible({ timeout: 5_000 })
      .catch(() => false);
    if (!hasClient) {
      // Maybe the table loaded empty and we need to wait for data
      await page.waitForTimeout(3000);
    }
    await expect(page.getByText(TEST_CLIENT_NAME).first()).toBeVisible({ timeout: 10_000 });
  });

  test('filter and click into client detail', async ({ page }) => {
    await navigateTo(page, '/clients');
    await expect(page.locator('table').first()).toBeVisible({ timeout: 15_000 });
    await page.waitForTimeout(2000);

    // Find the client row and click the link (the name should be a link)
    const clientLink = page.locator('a').filter({ hasText: TEST_CLIENT_NAME }).first();
    const isLink = await clientLink.isVisible({ timeout: 5_000 }).catch(() => false);

    if (isLink) {
      await clientLink.click();
    } else {
      // Try clicking the table cell with the name
      await page.getByText(TEST_CLIENT_NAME).first().click();
    }

    // Should navigate to client detail
    await page.waitForTimeout(3000);
    const url = page.url();
    const isDetailPage = url.includes('/clients/') && !url.endsWith('/clients');
    expect(isDetailPage || url.includes(PORT_SLUG)).toBeTruthy();
  });

  test('archive and restore client', async ({ page }) => {
    await navigateTo(page, '/clients');
    await expect(page.locator('table').first()).toBeVisible({ timeout: 15_000 });
    await page.waitForTimeout(2000);

    // Find the row with our client
    const row = page.locator('table tbody tr').filter({ hasText: TEST_CLIENT_NAME }).first();
    const rowVisible = await row.isVisible({ timeout: 5_000 }).catch(() => false);

    if (rowVisible) {
      // Click the actions menu (usually a "..." or dropdown trigger button)
      const actionsBtn = row.locator('button[aria-haspopup]').or(row.locator('button').last());
      await actionsBtn.click();
      await page.waitForTimeout(500);

      const archiveOption = page.getByRole('menuitem', { name: /archive/i });
      if (await archiveOption.isVisible({ timeout: 2_000 }).catch(() => false)) {
        await archiveOption.click();

        // Wait for confirm dialog
        const confirmDialog = page.locator('[role="alertdialog"], [role="dialog"]').last();
        if (await confirmDialog.isVisible({ timeout: 3_000 }).catch(() => false)) {
          await confirmDialog.getByRole('button', { name: /confirm|archive|yes/i }).click();
        }
        await page.waitForTimeout(2000);

        // Client should disappear from active list
        const stillVisible = await page
          .getByText(TEST_CLIENT_NAME)
          .isVisible({ timeout: 3_000 })
          .catch(() => false);
        if (!stillVisible) {
          console.log('  ✓ Client archived and removed from list');
        }
      }
    }
  });
});