167 lines
9.4 KiB
JavaScript
167 lines
9.4 KiB
JavaScript
// Run against a built frontend with PLAYWRIGHT_MODULE pointing to an installed Playwright package.
|
|
// Requests use isolated fixtures; no real account or application data is changed.
|
|
import assert from 'node:assert/strict'
|
|
import { readFile, writeFile } from 'node:fs/promises'
|
|
|
|
const { chromium } = await import(process.env.PLAYWRIGHT_MODULE || 'playwright')
|
|
const base = process.env.EVENTS_FRONTEND_URL || 'http://127.0.0.1:3157'
|
|
const browser = await chromium.launch({ headless: true })
|
|
const page = await browser.newPage({ viewport: { width: 1440, height: 1000 } })
|
|
page.setDefaultTimeout(10000)
|
|
const errors = []
|
|
const writes = []
|
|
const listRequests = []
|
|
const iconCollections = Object.fromEntries(await Promise.all(['heroicons', 'lucide'].map(async prefix => [
|
|
prefix, JSON.parse(await readFile(new URL(`../node_modules/@iconify/json/json/${prefix}.json`, import.meta.url), 'utf8'))
|
|
])))
|
|
let failList = false
|
|
let allowCreate = true
|
|
const project = { id: 42, name: 'Umbau Hafenstraße', projectNumber: 'P-2026-042' }
|
|
const profile = { id: '11111111-1111-4111-8111-111111111111', full_name: 'Anna Beispiel', pinned_on_navigation: [], temp_config: {}, role: { rights: [] } }
|
|
const tenant = { id: 1, name: 'Testbetrieb', extraModules: [], features: {}, locked: 'none' }
|
|
let events = Array.from({ length: 26 }, (_, index) => ({
|
|
id: index + 1, name: index ? `Termin ${index + 1}` : 'Baubesprechung Hafen',
|
|
startDate: `2026-10-${String(index + 1).padStart(2, '0')}T08:00:00.000Z`,
|
|
endDate: index ? null : '2026-10-01T09:30:00.000Z',
|
|
project: index ? null : project, state: index ? 'Final' : 'Entwurf',
|
|
color: '#2563eb', quick: false, archived: false, profiles: null,
|
|
repeatInterval: index ? 'Keine Wiederholung' : 'Wöchentlich'
|
|
}))
|
|
|
|
page.on('pageerror', error => errors.push(error.message))
|
|
await page.addInitScript(() => localStorage.setItem('token', 'fixture-only'))
|
|
await page.route('**/*', async route => {
|
|
const url = new URL(route.request().url())
|
|
if (url.hostname === 'api.iconify.design') {
|
|
const collection = iconCollections[url.pathname.slice(1).replace('.json', '')]
|
|
if (collection) return route.fulfill({ contentType: 'application/json', body: JSON.stringify(collection) })
|
|
}
|
|
if (url.origin !== new URL(base).origin) return route.abort()
|
|
if (url.pathname.startsWith('/api/_nuxt_icon/')) return route.continue()
|
|
if (!url.pathname.startsWith('/api/') && !url.pathname.startsWith('/auth/')) return route.continue()
|
|
let body = []
|
|
if (url.pathname === '/api/me') body = {
|
|
user: { id: profile.id, email: 'anna@example.test', is_admin: false }, profile, tenants: [tenant], activeTenant: 1,
|
|
permissions: ['events', 'projects', ...(allowCreate ? ['events-create'] : [])]
|
|
}
|
|
else if (url.pathname === '/api/tenant') body = tenant
|
|
else if (url.pathname === '/api/tenant/profiles') body = { data: [profile] }
|
|
else if (url.pathname === '/api/resource/projects') body = [project]
|
|
else if (url.pathname === '/api/resource/events/paginated') {
|
|
if (failList) return route.fulfill({ status: 503, contentType: 'application/json', body: '{"error":"Fixture unavailable"}' })
|
|
const search = (url.searchParams.get('search') || '').toLowerCase()
|
|
const state = url.searchParams.get('filter[state]')
|
|
const limit = Number(url.searchParams.get('limit'))
|
|
const currentPage = Number(url.searchParams.get('page'))
|
|
listRequests.push(Object.fromEntries(url.searchParams))
|
|
const matches = events.filter(event => !event.archived && (!state || state === event.state)
|
|
&& [event.name, event.project?.name, event.project?.projectNumber].some(value => String(value || '').toLowerCase().includes(search)))
|
|
matches.sort((a, b) => url.searchParams.get('sort')?.endsWith(':asc')
|
|
? a.startDate.localeCompare(b.startDate) : b.startDate.localeCompare(a.startDate))
|
|
body = { data: matches.slice((currentPage - 1) * limit, currentPage * limit), queryConfig: { total: matches.length } }
|
|
}
|
|
else if (url.pathname === '/api/resource/events' && route.request().method() === 'POST') {
|
|
const payload = route.request().postDataJSON()
|
|
writes.push(payload)
|
|
body = { id: 100, state: 'Final', repeatInterval: 'Keine Wiederholung', ...payload, archived: false }
|
|
events.push({ ...body, project: payload.project === project.id ? project : null })
|
|
}
|
|
else if (/^\/api\/resource\/events\/\d+(\/true)?$/.test(url.pathname)) {
|
|
const event = events.find(item => item.id === Number(url.pathname.split('/')[4]))
|
|
body = { ...event, project: event?.project?.id || null }
|
|
if (route.request().method() === 'PUT') {
|
|
Object.assign(event, route.request().postDataJSON())
|
|
writes.push(route.request().postDataJSON())
|
|
body = event
|
|
}
|
|
}
|
|
await route.fulfill({ contentType: 'application/json', body: JSON.stringify(body) })
|
|
})
|
|
|
|
const searchInput = () => page.getByRole('textbox', { name: 'Termine durchsuchen' })
|
|
const waitForList = () => page.getByRole('table').waitFor()
|
|
|
|
try {
|
|
await page.goto(`${base}/events`, { waitUntil: 'networkidle' })
|
|
await waitForList()
|
|
assert.equal(await page.getByRole('columnheader').count(), 5)
|
|
assert.equal(await page.locator('tbody tr').count(), 25)
|
|
await page.getByRole('button', { name: 'Next Page', exact: true }).click()
|
|
await page.getByRole('link', { name: 'Baubesprechung Hafen', exact: true }).first().waitFor()
|
|
assert.equal(listRequests.at(-1).page, '2')
|
|
await searchInput().fill('P-2026-042')
|
|
await page.getByText('P-2026-042 · Umbau Hafenstraße', { exact: true }).first().waitFor()
|
|
await waitForList()
|
|
assert.equal(listRequests.at(-1).page, '1')
|
|
assert.equal(await page.locator('tbody tr').count(), 1)
|
|
await page.screenshot({ path: '/tmp/fedeo-events-desktop.png', fullPage: true })
|
|
|
|
await page.getByRole('combobox', { name: 'Status filtern' }).click()
|
|
await page.getByRole('option', { name: 'Final', exact: true }).click()
|
|
await page.getByRole('heading', { name: 'Keine passenden Termine' }).waitFor()
|
|
await page.getByRole('button', { name: 'Filter zurücksetzen' }).click()
|
|
await waitForList()
|
|
|
|
await page.getByRole('link', { name: 'Neuer Termin', exact: true }).click()
|
|
await page.getByRole('heading', { name: 'Termin erstellen' }).waitFor()
|
|
await page.getByLabel('Name', { exact: true }).fill('Neu aus Terminübersicht')
|
|
for (let index = 0; index < 2; index++) {
|
|
await page.getByRole('button', { name: 'Datum auswählen', exact: true }).first().click()
|
|
await page.getByRole('button', { name: 'Heute', exact: true }).click()
|
|
await page.keyboard.press('Escape')
|
|
}
|
|
await page.getByLabel('Farbe auswählen', { exact: true }).fill('#f43f5e')
|
|
const projectInputId = await page.locator('label').filter({ hasText: /^Projekt$/ }).getAttribute('for')
|
|
await page.locator(`[id="${projectInputId}"]`).click()
|
|
await page.getByPlaceholder('Suche...', { exact: true }).fill('2026-042')
|
|
await page.getByRole('option', { name: project.name, exact: true }).click()
|
|
await page.getByRole('button', { name: 'Erstellen', exact: true }).click()
|
|
await page.waitForURL(`${base}/events`)
|
|
await searchInput().fill('Neu aus Terminübersicht')
|
|
await page.getByRole('link', { name: 'Neu aus Terminübersicht', exact: true }).first().waitFor()
|
|
assert.equal(writes[0].project, 42)
|
|
assert.equal(writes[0].color, '#f43f5e')
|
|
assert.ok(writes[0].startDate && writes[0].endDate)
|
|
|
|
await page.getByRole('link', { name: 'Neu aus Terminübersicht', exact: true }).first().click()
|
|
await page.getByRole('heading', { name: 'Termin bearbeiten' }).waitFor()
|
|
await page.getByLabel('Name', { exact: true }).fill('Bearbeiteter Termin')
|
|
await page.getByRole('button', { name: 'Speichern', exact: true }).click()
|
|
await page.waitForURL(`${base}/events`)
|
|
await waitForList()
|
|
|
|
await page.setViewportSize({ width: 390, height: 844 })
|
|
await searchInput().fill('P-2026-042')
|
|
await page.getByRole('heading', { name: 'Baubesprechung Hafen' }).waitFor()
|
|
assert.equal(await page.evaluate(() => document.documentElement.scrollWidth > innerWidth), false)
|
|
await page.getByRole('link', { name: 'Neuer Termin', exact: true }).waitFor()
|
|
await page.screenshot({ path: '/tmp/fedeo-events-mobile.png', fullPage: true })
|
|
|
|
await page.setViewportSize({ width: 1440, height: 1000 })
|
|
await page.goto(`${base}/standardEntity/events`, { waitUntil: 'networkidle' })
|
|
await searchInput().waitFor()
|
|
failList = true
|
|
await page.getByRole('button', { name: 'Termine aktualisieren' }).click()
|
|
await page.getByText('Laden fehlgeschlagen', { exact: true }).waitFor()
|
|
failList = false
|
|
await page.getByRole('button', { name: 'Erneut versuchen' }).click()
|
|
await waitForList()
|
|
|
|
events = []
|
|
await page.getByRole('button', { name: 'Termine aktualisieren' }).click()
|
|
await page.getByRole('heading', { name: 'Noch keine Termine' }).waitFor()
|
|
assert.equal(await page.getByRole('link', { name: 'Neuer Termin', exact: true }).count(), 2)
|
|
allowCreate = false
|
|
await page.reload({ waitUntil: 'networkidle' })
|
|
await page.getByRole('heading', { name: 'Noch keine Termine' }).waitFor()
|
|
assert.equal(await page.getByRole('link', { name: 'Neuer Termin', exact: true }).count(), 0)
|
|
assert.deepEqual(errors, [], 'Browser runtime errors')
|
|
console.log('Events browser checks passed: pagination, project-number search, status filter, create and edit with return to list, mobile layout, legacy URL, errors, empty state and create permission.')
|
|
} catch (error) {
|
|
await writeFile('/tmp/fedeo-events-error.html', await page.content())
|
|
await page.screenshot({ path: '/tmp/fedeo-events-error.png', fullPage: true })
|
|
throw error
|
|
} finally {
|
|
await browser.close()
|
|
}
|