337 lines
12 KiB
TypeScript
337 lines
12 KiB
TypeScript
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 event_id = testing_event_id;
|
|
const event_badge_id = 'UIJT-73-63-61'; // Per README test data
|
|
const event_badge_template_id = 'jgfixEpYp1B'; // Per README test data
|
|
|
|
test.describe('Badge Data Integrity & Field Mapping', () => {
|
|
test.beforeEach(async ({ page }) => {
|
|
page.on('pageerror', (err) => console.error(`BROWSER ERROR: ${err.message}`));
|
|
page.on('console', (msg) => {
|
|
if (msg.type() === 'error' || msg.type() === 'warning')
|
|
console.error(`BROWSER [${msg.type().toUpperCase()}]: ${msg.text()}`);
|
|
});
|
|
|
|
await page.addInitScript(
|
|
({ defaults, event_id, account_id }) => {
|
|
const testData = {
|
|
...defaults,
|
|
account_id: account_id,
|
|
manager_access: true,
|
|
administrator_access: true,
|
|
authenticated_access: true,
|
|
edit_mode: true,
|
|
person_id: 'test-person-1',
|
|
user: { id: 'test-person-1' },
|
|
mod: { ...defaults.mod, events: { ...defaults.mod.events, event_id: event_id } }
|
|
};
|
|
window.localStorage.setItem('ae_loc', JSON.stringify(testData));
|
|
},
|
|
{ defaults: ae_app_local_data_defaults, event_id: event_id, account_id: testing_account_id }
|
|
);
|
|
|
|
// Mock V3 API with realistic enriched responses
|
|
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' }] })
|
|
});
|
|
}
|
|
|
|
if (url.includes(`/v3/crud/event/${event_id}`) && method === 'GET') {
|
|
return route.fulfill({
|
|
status: 200,
|
|
contentType: 'application/json',
|
|
body: JSON.stringify({
|
|
data: {
|
|
id: event_id, // Why are both the id and event_id fields being set?
|
|
event_id: event_id, // Why are both the id and event_id fields being set?
|
|
name: 'Badge Integrity Test Event',
|
|
cfg_json: {},
|
|
mod_pres_mgmt_json: {},
|
|
mod_badges_json: {},
|
|
mod_abstracts_json: {},
|
|
mod_exhibits_json: {},
|
|
mod_meetings_json: {}
|
|
}
|
|
})
|
|
});
|
|
}
|
|
|
|
// Badge search — IMPORTANT: search_ae_obj uses FLAT path /v3/crud/event_badge/search
|
|
// NOT nested /v3/crud/event/{id}/event_badge/search — see api_post__crud_search.ts
|
|
if (url.includes('/v3/crud/event_badge/search') && method === 'POST') {
|
|
return route.fulfill({
|
|
status: 200,
|
|
contentType: 'application/json',
|
|
body: JSON.stringify({
|
|
data: [
|
|
{
|
|
id: event_badge_id,
|
|
event_badge_id: event_badge_id,
|
|
// _random fields required by Dexie — without these the object
|
|
// is silently dropped with "Object is missing a valid ID"
|
|
event_badge_id_random: event_badge_id,
|
|
id_random: event_badge_id,
|
|
event_id: event_id,
|
|
event_id_random: event_id,
|
|
event_badge_template_id: event_badge_template_id,
|
|
full_name: 'Jane Smith', // Computed from given_name + family_name
|
|
full_name_override: 'Jane Smith',
|
|
given_name: 'Jane',
|
|
family_name: 'Smith',
|
|
email: 'jane@example.com',
|
|
badge_type_code: 'attendee',
|
|
person_id: 'person-xyz',
|
|
// API enriched fields (simulating joins)
|
|
person_given_name: 'Jane',
|
|
person_family_name: 'Smith',
|
|
person_email: 'jane@example.com',
|
|
event_name: 'Badge Integrity Test Event',
|
|
badge_template_name: 'Standard Template 2026',
|
|
enable: true,
|
|
hide: false,
|
|
priority: 0,
|
|
sort: 0,
|
|
created_on: '2026-02-15T09:00:00Z',
|
|
updated_on: '2026-02-25T14:20:00Z',
|
|
tmp_sort_1: '0_0_0_2026-02-15T09:00:00Z',
|
|
tmp_sort_2: '0_0_0__2026-02-15T09:00:00Z'
|
|
}
|
|
]
|
|
})
|
|
});
|
|
}
|
|
|
|
// Badge template list — uses FLAT path /v3/crud/event_badge_template/?for_obj_id=...
|
|
// NOT nested /v3/crud/event/{id}/event_badge_template/ — see get_ae_obj_li()
|
|
if (url.includes('/v3/crud/event_badge_template/') && url.includes('for_obj_id') && method === 'GET') {
|
|
return route.fulfill({
|
|
status: 200,
|
|
contentType: 'application/json',
|
|
body: JSON.stringify({
|
|
data: [
|
|
{
|
|
id: event_badge_template_id,
|
|
event_badge_template_id: event_badge_template_id,
|
|
event_id: event_id,
|
|
name: 'Standard Template 2026',
|
|
header_path: '/images/header.png',
|
|
logo_path: '/images/logo.png',
|
|
header_row_1: 'Welcome to',
|
|
header_row_2: 'Our Event 2026',
|
|
show_qr_front: true,
|
|
show_qr_back: true,
|
|
wireless_ssid: 'EventWiFi',
|
|
wireless_password: 'Password123',
|
|
ticket_1_text: 'Banquet Access',
|
|
ticket_2_text: 'Workshop Pass',
|
|
ticket_3_text: 'VIP Lounge',
|
|
enable: true,
|
|
hide: false
|
|
}
|
|
]
|
|
})
|
|
});
|
|
}
|
|
|
|
// Badge template GET by ID
|
|
if (url.includes(`/v3/crud/event_badge_template/${event_badge_template_id}`) && method === 'GET') {
|
|
return route.fulfill({
|
|
status: 200,
|
|
contentType: 'application/json',
|
|
body: JSON.stringify({
|
|
data: {
|
|
id: event_badge_template_id,
|
|
event_badge_template_id: event_badge_template_id,
|
|
event_id: event_id,
|
|
name: 'Standard Template 2026',
|
|
header_path: '/images/header.png',
|
|
logo_path: '/images/logo.png',
|
|
header_row_1: 'Welcome to',
|
|
header_row_2: 'Our Event 2026',
|
|
show_qr_front: true,
|
|
show_qr_back: true,
|
|
wireless_ssid: 'EventWiFi',
|
|
wireless_password: 'Password123',
|
|
ticket_1_text: 'Banquet Access',
|
|
ticket_2_text: 'Workshop Pass',
|
|
ticket_3_text: 'VIP Lounge'
|
|
}
|
|
})
|
|
});
|
|
}
|
|
|
|
return route.fulfill({
|
|
status: 200,
|
|
contentType: 'application/json',
|
|
body: JSON.stringify({ data: [] })
|
|
});
|
|
});
|
|
});
|
|
|
|
test('Badge list loads without crashing', async ({ page }) => {
|
|
await page.goto(`/events/${event_id}/badges`);
|
|
|
|
await page.waitForResponse((r) =>
|
|
r.url().includes('event_badge/search') && r.status() === 200
|
|
);
|
|
|
|
// Verify page loads (search interface or content)
|
|
const page_body = await page.textContent('body');
|
|
expect(page_body).toBeTruthy();
|
|
|
|
// Verify enriched data displays somewhere on the page
|
|
await expect(page.locator('text=/Jane Smith|jane@example/i')).toBeVisible({ timeout: 10000 });
|
|
|
|
// Verify no broken field references
|
|
expect(page_body).not.toContain('undefined');
|
|
expect(page_body).not.toContain('NaN undefined');
|
|
expect(page_body).not.toContain('[object Object]');
|
|
});
|
|
|
|
test('Badge template list loads and displays all templates', async ({ page }) => {
|
|
await page.goto(`/events/${event_id}/templates`);
|
|
|
|
await page.waitForResponse((r) =>
|
|
r.url().includes('event_badge_template') && r.status() === 200
|
|
);
|
|
|
|
// Verify template name displays
|
|
await expect(page.locator('text=/Standard Template 2026/i')).toBeVisible({ timeout: 5000 });
|
|
|
|
// Verify action buttons are present
|
|
const edit_btn = page.getByRole('button', { name: /edit/i });
|
|
const delete_btn = page.getByRole('button', { name: /delete/i });
|
|
|
|
await expect(edit_btn.first()).toBeVisible({ timeout: 3000 });
|
|
await expect(delete_btn.first()).toBeVisible({ timeout: 3000 });
|
|
});
|
|
|
|
test('Badge template form fields render correctly', async ({ page }) => {
|
|
await page.goto(`/events/${event_id}/templates`);
|
|
|
|
// Click "Add New Template" button
|
|
const add_btn = page.getByRole('button', { name: /Add New Template/i });
|
|
await add_btn.click();
|
|
|
|
// Verify form modal opens
|
|
const form = page.locator('form, [role="dialog"]');
|
|
await expect(form.first()).toBeVisible({ timeout: 3000 });
|
|
|
|
// Verify key form fields exist
|
|
await expect(page.locator('label:has-text("Name"), input[name="name"], input[placeholder*="name" i]')).toBeVisible({ timeout: 2000 });
|
|
});
|
|
|
|
test('Badge template values persist in form when editing', async ({ page }) => {
|
|
await page.goto(`/events/${event_id}/templates`);
|
|
|
|
await page.waitForResponse((r) =>
|
|
r.url().includes('event_badge_template') && r.status() === 200
|
|
);
|
|
|
|
// Click Edit on first template
|
|
const edit_btn = page.getByRole('button', { name: /edit/i }).first();
|
|
await edit_btn.click();
|
|
|
|
// Wait for form to load template data
|
|
await page.waitForTimeout(1000);
|
|
|
|
// Verify template name field is populated.
|
|
// NOTE: Use getByLabel(), not input[value*=...] — CSS attribute selectors check
|
|
// the HTML attribute, but Svelte bind:value sets the DOM property only.
|
|
const name_input = page.getByLabel('Template Name');
|
|
await expect(name_input).toBeVisible({ timeout: 3000 });
|
|
|
|
const input_value = await name_input.inputValue();
|
|
expect(input_value).not.toBe('');
|
|
expect(input_value).toContain('2026');
|
|
});
|
|
|
|
test('Electron bridge compatibility (graceful degradation in browser)', async ({ page, context }) => {
|
|
// Test that the app doesn't break when window.aetherNative is undefined
|
|
// This simulates browser mode vs Electron native mode
|
|
|
|
await page.addInitScript(() => {
|
|
// Explicitly ensure aetherNative is NOT defined (browser mode)
|
|
(window as any).aetherNative = undefined;
|
|
});
|
|
|
|
await page.goto(`/events/${event_id}/badges`);
|
|
|
|
await page.waitForResponse((r) =>
|
|
r.url().includes('event_badge/search') && r.status() === 200,
|
|
{ timeout: 10000 }
|
|
);
|
|
|
|
// Wait a bit for page to render
|
|
await page.waitForTimeout(2000);
|
|
|
|
// Verify page still loads correctly without Electron bridge
|
|
const body_content = await page.textContent('body');
|
|
expect(body_content).toBeTruthy();
|
|
|
|
// Should not have unhandled errors about missing aetherNative
|
|
expect(body_content).not.toContain('aetherNative is not defined');
|
|
expect(body_content).not.toContain('Cannot read');
|
|
});
|
|
|
|
test('Badge field processor handles missing optional fields', async ({ page }) => {
|
|
// Override mock to return minimal badge data (missing enriched fields)
|
|
await page.route('**/v3/crud/event/*/event_badge/search', async (route) => {
|
|
await route.fulfill({
|
|
status: 200,
|
|
contentType: 'application/json',
|
|
body: JSON.stringify({
|
|
data: [
|
|
{
|
|
id: event_badge_id,
|
|
event_badge_id: event_badge_id,
|
|
// _random fields are required for Dexie to accept the object
|
|
event_badge_id_random: event_badge_id,
|
|
id_random: event_badge_id,
|
|
event_id: event_id,
|
|
event_id_random: event_id,
|
|
full_name_override: 'Minimal Badge',
|
|
enable: true,
|
|
priority: 0,
|
|
sort: 0,
|
|
tmp_sort_1: '0_0_0_1970-01-01T00:00:00Z',
|
|
tmp_sort_2: '0_0_0__1970-01-01T00:00:00Z'
|
|
// Missing intentionally: email, person_id, template_id, enriched fields
|
|
}
|
|
]
|
|
})
|
|
});
|
|
});
|
|
|
|
await page.goto(`/events/${event_id}/badges`);
|
|
|
|
await page.waitForResponse((r) =>
|
|
r.url().includes('event_badge/search') && r.status() === 200,
|
|
{ timeout: 10000 }
|
|
);
|
|
|
|
// Wait for render
|
|
await page.waitForTimeout(1000);
|
|
|
|
// Should still render without crashing
|
|
const body_text = await page.textContent('body');
|
|
|
|
// Should not show "undefined" for missing fields in rendered badge rows.
|
|
// Note: Avoid checking the full body for 'null' — the debug panel footer
|
|
// can contain that string legitimately. Scope to badge list area instead.
|
|
expect(body_text).not.toContain('undefined');
|
|
expect(body_text).not.toContain('NaN undefined');
|
|
expect(body_text).not.toContain('[object Object]');
|
|
});
|
|
});
|