ghostguild-org/e2e/board.spec.js
Jennie Robinson Faber bb0dbfe53e test(e2e): align specs with current page structure
join-flow:
- Form now requires Community Guidelines agreement; tests check the
  checkbox before expecting submit to enable.
- Contribution input is a numeric field with preset chip buttons, not a
  USelect with $0/mo options — fill the input directly.
- Success state lives in SignupFlowOverlay ("Welcome to Ghost Guild!");
  no .success-box exists. Match by heading instead.
- Inline .error-box renders OUTSIDE <form>, so duplicate-email assertion
  uses .signup-flow-overlay .error-box (which is the user-facing error).

member-profile:
- "How you appear to other members" copy was retired; replace with the
  stable "Show in Member Directory" structural label.
- Add waitForLoadState('networkidle') after goto for ClientOnly auth
  hydration so "Edit Profile" reliably appears within timeout.

board:
- Add waitForLoadState('networkidle') after goto so the action-bar's
  "+ New Post" click handler is bound before the test clicks.
- Submit button is named exactly "Post" — disambiguate from "+ New Post"
  buttons with { exact: true }.
- Delete is a two-step in-card confirm (Delete → Confirm), not a native
  browser dialog; drop the page.once('dialog') listener.

admin-board-channels:
- Channel name placeholder is "e.g., coop-formation" (no leading #).
- Slack Channel ID input only appears in the Edit modal (v-if="editingId"),
  not on Create — Slack channel is auto-created server-side. Drop the
  slack ID fill from the Create step.
- Add waitForLoadState('networkidle') before opening the modal.
2026-04-26 18:28:14 +01:00

89 lines
3.7 KiB
JavaScript

import { test, expect } from './helpers/fixtures.js'
test.describe('Board page', () => {
test('page loads for authenticated member', async ({ memberPage }) => {
await memberPage.goto('/board')
await expect(memberPage.getByRole('heading', { name: 'Board' })).toBeVisible({ timeout: 15000 })
await expect(memberPage.getByRole('button', { name: '+ New Post' }).first()).toBeVisible()
})
test('clicking New Post reveals the form', async ({ memberPage }) => {
await memberPage.goto('/board')
await memberPage.waitForLoadState('networkidle')
await expect(memberPage.getByRole('button', { name: '+ New Post' }).first()).toBeVisible({
timeout: 15000,
})
await memberPage.getByRole('button', { name: '+ New Post' }).first().click()
await expect(memberPage.getByRole('heading', { name: 'New post' })).toBeVisible()
await expect(memberPage.locator('#post-title')).toBeVisible()
await expect(memberPage.locator('#post-seeking')).toBeVisible()
})
test('tags drawer toggles open and closed', async ({ memberPage }) => {
await memberPage.goto('/board')
await expect(memberPage.getByRole('heading', { name: 'Board' })).toBeVisible({ timeout: 15000 })
const drawerToggle = memberPage.getByRole('button', { name: /^Tags\.\.\./ })
// Drawer toggle only appears if cooperative tags exist — skip quietly if not
if (!(await drawerToggle.isVisible().catch(() => false))) {
test.skip(true, 'No cooperative tags seeded in this environment')
return
}
await drawerToggle.click()
await expect(memberPage.getByText('Filter:')).toBeVisible()
await drawerToggle.click()
await expect(memberPage.getByText('Filter:')).not.toBeVisible()
})
test('create, edit, and delete own post', async ({ memberPage }) => {
await memberPage.goto('/board')
await memberPage.waitForLoadState('networkidle')
await expect(memberPage.getByRole('button', { name: '+ New Post' }).first()).toBeVisible({
timeout: 15000,
})
const uniqueSuffix = Date.now().toString().slice(-6)
const originalTitle = `E2E test post ${uniqueSuffix}`
const editedTitle = `E2E test post edited ${uniqueSuffix}`
// --- Create ---
await memberPage.getByRole('button', { name: '+ New Post' }).first().click()
await expect(memberPage.getByRole('heading', { name: 'New post' })).toBeVisible()
await memberPage.locator('#post-title').fill(originalTitle)
await memberPage.locator('#post-seeking').fill('Playwright test seeking text')
await memberPage.getByRole('button', { name: 'Post', exact: true }).click()
await expect(memberPage.getByRole('heading', { name: originalTitle })).toBeVisible({
timeout: 10000,
})
// --- Edit ---
// Find the post card containing our title, then click its Edit button
const postCard = memberPage.locator('article.board-post', { hasText: originalTitle })
await postCard.getByRole('button', { name: 'Edit' }).click()
await expect(memberPage.getByRole('heading', { name: 'Edit post' })).toBeVisible()
const titleInput = memberPage.locator('#post-title')
await titleInput.fill(editedTitle)
await memberPage.getByRole('button', { name: 'Save changes' }).click()
await expect(memberPage.getByRole('heading', { name: editedTitle })).toBeVisible({
timeout: 10000,
})
// --- Delete (in-card two-step confirm; not a native dialog) ---
const editedCard = memberPage.locator('article.board-post', { hasText: editedTitle })
await editedCard.getByRole('button', { name: 'Delete' }).click()
await editedCard.getByRole('button', { name: 'Confirm' }).click()
await expect(memberPage.getByRole('heading', { name: editedTitle })).not.toBeVisible({
timeout: 10000,
})
})
})