E2E: Implement Contact Form Test with Network Mocking

[EJM143]

Description

As a user, I want to be able to submit the contact form so that I can send a message to the site owner.

Constraint: We must NOT send real emails or hit the production API during testing. We must mock the network request using Playwright’s page.route().

Tasks

• Create tests/contact.spec.js.
• Setup page.route() to intercept POST requests to the form endpoint (e.g., **/send-email or the specific Formspree URL).
• Configure the mock to return a 200 OK status and a dummy JSON success response.
• Write test steps to:
  • Fill in Name, Email, and Message inputs.
  • Click Submit.
  • Wait for the success UI state (e.g., “Message Sent” toast or text).

Acceptance Criteria

• The test must PASS without sending a real HTTP request to the external email provider.
• The test must verify that the UI updates to show a success message after the “fake” successful response.
• Form inputs must be filled using accessible locators (e.g., getByLabel).

[taylorpapke]

See SeattleColleges/nsc-events-fullstack#125