OSIT-AE-App-Svelte/tests/event_badge_crud.test.ts

import { test, expect } from '@playwright/test';
import { ae_app_local_data_defaults } from './_helpers/ae_defaults';
import { testing_event_id, testing_account_id } from './_helpers/env';

const test_event_id = testing_event_id; // Why is this here? Just using testing_event_id instead?

test.describe('event_badge_crud (create, find, edit, delete)', () => {
  test.beforeEach(async ({ page }) => {
    page.on('pageerror', (err) => console.error(`BROWSER ERROR: ${err.message}`));
    page.on('console', (msg) => {
      if (msg.type() === 'error' || msg.type() === 'warn')
        console.error(`BROWSER [${msg.type().toUpperCase()}]: ${msg.text()}`);
    });

    // Minimal in-test state for created badge
    let created_badge: any = null;

    await page.route('**/v3/**', async (route) => {
      const req = route.request();
      const url = req.url();
      const method = req.method();

      if (url.includes('site_domain/search')) {
        return route.fulfill({ status: 200, contentType: 'application/json', body: JSON.stringify({ data: [{ id: 'td', site_id: 'ts' }] }) });
      }

      // Minimal event GET payload (include cfg_json and mod_* for bindings)
      if (url.includes(`/v3/crud/event/${test_event_id}`) && method === 'GET') {
        return route.fulfill({
          status: 200,
          contentType: 'application/json',
          body: JSON.stringify({ data: { id: test_event_id, event_id: test_event_id, name: 'Test Event for Badge CRUD', cfg_json: {}, mod_pres_mgmt_json: {}, mod_badges_json: {}, mod_abstracts_json: {}, mod_exhibits_json: {}, mod_meetings_json: {} } })
        });
      }

      // Search/list badges
      if (url.includes(`/v3/crud/event/${test_event_id}/event_badge/search`) && method === 'POST') {
        return route.fulfill({ status: 200, contentType: 'application/json', body: JSON.stringify({ data: created_badge ? [created_badge] : [] }) });
      }

      // Create badge - return created envelope with fixed id
      if (url.includes(`/v3/crud/event/${test_event_id}/event_badge`) && method === 'POST') {
        const post = await req.postData();
        const body = post ? JSON.parse(post) : {};
        created_badge = { ...body, event_badge_id: 'badge-1' };
        return route.fulfill({ status: 201, contentType: 'application/json', body: JSON.stringify({ data: created_badge }) });
      }

      // Update badge
      if (url.match(new RegExp(`/v3/crud/event/${test_event_id}/event_badge/.+`)) && (method === 'PATCH' || method === 'PUT')) {
        const post = await req.postData();
        const body = post ? JSON.parse(post) : {};
        if (created_badge) created_badge = { ...created_badge, ...body };
        return route.fulfill({ status: 200, contentType: 'application/json', body: JSON.stringify({ data: created_badge }) });
      }

      // Delete badge
      if (url.match(new RegExp(`/v3/crud/event/${test_event_id}/event_badge/.+`)) && method === 'DELETE') {
        created_badge = null;
        return route.fulfill({ status: 200, contentType: 'application/json', body: JSON.stringify({ data: true }) });
      }

      return route.fulfill({ status: 200, contentType: 'application/json', body: JSON.stringify({ data: [] }) });
    });

    page.on('dialog', async (dialog) => { await dialog.accept(); });

    await page.addInitScript(({ defaults, event_id, accountId }) => {
      const test_data = { ...defaults, account_id: accountId, manager_access: true, administrator_access: true, edit_mode: true, mod: { ...defaults.mod, events: { ...defaults.mod.events, event_id: event_id } } };
      window.localStorage.setItem('ae_loc', JSON.stringify(test_data));
    }, { defaults: ae_app_local_data_defaults, event_id: test_event_id, accountId: testing_account_id });
  });

  test('create -> find -> edit -> delete badge', async ({ page }) => {
    // Create via Settings modal UI
    await page.goto(`/events/${test_event_id}/settings`);
    const add_btn = page.getByRole('button', { name: 'Add New Badge' });
    await expect(add_btn).toBeVisible();
    await add_btn.click();

    const form = page.locator('form:has-text("Create Badge")');
    await expect(form).toBeVisible();
    await form.locator('label:has-text("Full Name Override") input').fill('CRUD User');
    await form.locator('label:has-text("Email") input').fill('crud@example.com');
    await form.locator('label:has-text("Badge Type") select').selectOption('test');

    // Wait for POST create request and response
    const [create_req, create_resp] = await Promise.all([
      page.waitForRequest((r) => r.url().includes(`/v3/crud/event/${test_event_id}/event_badge`) && r.method() === 'POST'),
      page.waitForResponse((r) => r.url().includes(`/v3/crud/event/${test_event_id}/event_badge`) && (r.status() === 201 || r.status() === 200)),
      page.getByRole('button', { name: 'Create Badge' }).click()
    ]);

    const post_body = create_req.postData();
    const post_json = post_body ? JSON.parse(post_body) : {};
    expect(post_json.email).toBe('crud@example.com');

    const created = await create_resp.json();
    expect(created.data).toBeDefined();
    const badge_id = created.data.event_badge_id || created.data.id || 'badge-1';

    // Find badges via search endpoint (simulate listing page) using in-page fetch
    await page.goto(`/events/${test_event_id}/badges`);
    const search_json = await page.evaluate(async (event_id) => {
      const r = await fetch(`/v3/crud/event/${event_id}/event_badge/search`, { method: 'POST', headers: { 'Content-Type': 'application/json' }, body: JSON.stringify({}) });
      return await r.json();
    }, test_event_id);
    expect(Array.isArray(search_json.data)).toBeTruthy();
    expect(search_json.data.length).toBeGreaterThanOrEqual(1);

    // Edit badge via browser fetch (exercise nested update)
    const edit_resp = await page.evaluate(async (args) => {
      const { event_id, event_badge_id } = args;
      const r = await fetch(`/v3/crud/event/${event_id}/event_badge/${event_badge_id}/`, { method: 'PATCH', headers: { 'Content-Type': 'application/json' }, body: JSON.stringify({ full_name_override: 'Edited User' }) });
      return { status: r.status, json: await r.json() };
    }, { event_id: test_event_id, event_badge_id: badge_id });
    expect(edit_resp.status === 200).toBeTruthy();
    expect(edit_resp.json.data.full_name_override).toBe('Edited User');

    // Delete badge via browser fetch
    const del_resp = await page.evaluate(async (args) => {
      const { event_id, event_badge_id } = args;
      const r = await fetch(`/v3/crud/event/${event_id}/event_badge/${event_badge_id}/`, { method: 'DELETE' });
      return { status: r.status, ok: r.ok };
    }, { event_id: test_event_id, event_badge_id: badge_id });
    expect(del_resp.ok).toBeTruthy();

    // Confirm search returns no items
    const post_delete_json = await page.evaluate(async (event_id) => {
      const r = await fetch(`/v3/crud/event/${event_id}/event_badge/search`, { method: 'POST', headers: { 'Content-Type': 'application/json' }, body: JSON.stringify({}) });
      return await r.json();
    }, test_event_id);
    expect(Array.isArray(post_delete_json.data)).toBeTruthy();
    expect(post_delete_json.data.length).toBe(0);
  });
});