69 lines
2.5 KiB
JavaScript
69 lines
2.5 KiB
JavaScript
import { test, expect } from '@playwright/test'
|
|
|
|
test.describe('Events list page', () => {
|
|
test('events list loads', async ({ page }) => {
|
|
await page.goto('/events')
|
|
await expect(page.locator('h1', { hasText: 'Events' })).toBeVisible()
|
|
})
|
|
|
|
test('filter bar has type filters', async ({ page }) => {
|
|
await page.goto('/events')
|
|
const filterBar = page.locator('.filter-bar')
|
|
await expect(filterBar).toBeVisible()
|
|
|
|
for (const label of ['All', 'Workshops', 'Community', 'Social', 'Showcase']) {
|
|
await expect(filterBar.locator('button', { hasText: label })).toBeVisible()
|
|
}
|
|
})
|
|
|
|
test('past events toggle exists and can be checked', async ({ page }) => {
|
|
await page.goto('/events')
|
|
await page.waitForLoadState('networkidle')
|
|
const toggle = page.locator('.past-toggle')
|
|
await expect(toggle).toBeVisible()
|
|
await expect(toggle).toContainText('Show past events')
|
|
|
|
await toggle.click()
|
|
await expect(toggle).toHaveClass(/active/)
|
|
|
|
// Page should still render without errors after toggling
|
|
await expect(page.locator('h1', { hasText: 'Events' })).toBeVisible()
|
|
})
|
|
|
|
test('clicking a filter button activates it', async ({ page }) => {
|
|
await page.goto('/events')
|
|
await page.waitForLoadState('networkidle')
|
|
// Wait for Vue hydration — the "All" filter should have the active class once reactive
|
|
const allBtn = page.locator('.filter-btn', { hasText: 'All' })
|
|
await expect(allBtn).toHaveClass(/active/, { timeout: 10000 })
|
|
const workshopsBtn = page.locator('.filter-bar button', { hasText: 'Workshops' })
|
|
await workshopsBtn.click()
|
|
await expect(workshopsBtn).toHaveClass(/active/, { timeout: 5000 })
|
|
})
|
|
|
|
test('event links navigate to detail page', async ({ page }) => {
|
|
await page.goto('/events')
|
|
|
|
// Check the past events toggle so we see all events
|
|
await page.locator('.past-toggle').click()
|
|
|
|
const eventLinks = page.locator('.event-row a')
|
|
const count = await eventLinks.count()
|
|
|
|
if (count === 0) {
|
|
// No events in the database — just verify the empty state renders
|
|
await expect(page.locator('.empty', { hasText: 'No events found' })).toBeVisible()
|
|
return
|
|
}
|
|
|
|
// Click the first event link and verify navigation
|
|
const firstLink = eventLinks.first()
|
|
const href = await firstLink.getAttribute('href')
|
|
await firstLink.click()
|
|
await page.waitForURL(/\/events\//)
|
|
|
|
expect(page.url()).toContain('/events/')
|
|
// Detail page should have an h1 with the event title
|
|
await expect(page.locator('h1')).toBeVisible()
|
|
})
|
|
})
|