[Epic] Add E2E tests for error and empty states across entity pages

[aasimsyed]

Terms

• I have searched open and closed feature requests
• I agree to follow activist's Code of Conduct

Description

Background

As identified in the E2E coverage audit tracked by #1959, error and empty states are entirely untested across all entity pages. These are Tier 3 quality gaps — the most common real-user failure modes — and their absence means regressions in empty state rendering, form validation errors, and server-side error handling would go undetected in CI.

The current test suite exercises only the happy path: authenticated admin, seed data present, network healthy. No spec asserts what a user sees when:

• An entity has no FAQs, resources, or social links yet (empty state)
• A form is submitted with invalid input (validation error state)
• A network or server error occurs during a mutation (error state)

This Epic tracks the full set of subtasks needed to close this gap across events, organizations, and organization groups.

---

Scope

1. Empty states

Empty states are rendered by the <EmptyState> component and appear when a list has zero items. The permission prop changes the message shown to admins vs non-editors — this branching is also untested.

Pages to cover:

Page	Empty condition
/events/[id]/faq	Event has no FAQ entries
/events/[id]/resources	Event has no resources
/organizations/[id]/faq	Organization has no FAQ entries
/organizations/[id]/resources	Organization has no resources
/organizations/[id]/groups/[id]/faq	Group has no FAQ entries
/organizations/[id]/groups/[id]/resources	Group has no resources
/events	No events match the active filter
/organizations	No organizations match the active filter

Test cases per page:

• Empty state component is visible when the list is empty
• Empty state message is appropriate for the page type
• Empty state shows the correct variant for admins vs non-editors
• Empty state is NOT shown when at least one item exists

---

2. Form validation error states

Currently only successful submissions are tested. Validation errors must be explicitly exercised.

Forms to cover:

Form	Invalid input scenarios
FAQ create/edit modal	Empty question field, empty answer field
Resource create/edit modal	Missing name, missing URL, malformed URL
Social links modal	Malformed URL, missing label
Event create modal (ModalCreateEvent)	Missing title, missing date
Organization create modal (ModalCreateOrganization)	Missing name
Sign-in	Wrong password, non-existent username
Sign-up	Passwords do not match, password too weak

Test cases per form:

• Submitting with required fields empty shows an inline error message
• Error message is associated with the correct field
• The form remains open (does not close on invalid submit)
• Correcting the invalid input and resubmitting succeeds

---

3. Server / network error states

Use Playwright's page.route() to intercept and mock API responses without requiring a broken backend.

Mutations to cover:

Mutation	Error to simulate
Create FAQ entry	500 Internal Server Error
Delete FAQ entry	403 Forbidden
Create resource	500 Internal Server Error
Delete resource	403 Forbidden
Sign-in	401 Unauthorized (wrong credentials)
Sign-in	429 Too Many Requests (rate limiting / lockout)

Test cases per mutation:

• A user-visible error message or toast is shown when the request fails
• The list/form state is not corrupted after a failed mutation
• The user can retry the action after a transient error

---

Implementation notes

Empty state setup: Use page.route() to mock the API response returning an empty list — faster than creating real entities and avoids orphaned test data:

await page.route("**/v1/events/*/faq_entries/", (route) =>
  route.fulfill({ status: 200, body: JSON.stringify({ results: [], count: 0 }) })
);

Validation error testing: Trigger validation by clicking submit with empty required fields. Test the application-level error message, not HTML required attribute enforcement.

Server error testing: Use page.route() to return a 500 or 403 response for the specific mutation endpoint. Assert that an error toast or inline message becomes visible and any optimistic UI update is reverted.

---

Subtask Issues

• Add E2E empty state tests for event FAQ and resource pages
• Add E2E empty state tests for organization FAQ and resource pages
• Add E2E empty state tests for organization group FAQ and resource pages
• Add E2E empty state tests for events and organizations listing pages (no filter results)
• Add E2E form validation error tests for FAQ and resource modals
• Add E2E form validation error tests for entity create modals
• Add E2E server error / rate-limit tests for FAQ and resource mutations
• Add E2E server error tests for sign-in (wrong credentials, rate limiting)

Contribution

Part of the ongoing E2E quality improvement tracked in #1959. Empty state tests are the lowest-friction starting point and can be worked in parallel with the others.