cypress-email-example

Sending emails using nodemailer, receive the using smtp-tester and testing the received email using Cypress.

See cypress/integration/spec.js

Read the blog post Testing HTML Emails using Cypress and watch this video where I explain the entire testing process.

Install and run

$ npm install
$ npm start
# from another terminal
$ npx cypress open
# click the spec.js

The application

The application shows the registration page pages/index.js where the user can fill the email and click the submit button. The page makes an Ajax request to the pages/api/register.js handler which sends an email. The email has the confirmation code the user is expected to enter on the confirmation page pages/confirm.js.

Email server

The emails are sent using nodemailer, see emailer.js. During tests the SMTP server is running inside cypress/plugins/index.js process.

Cypress tests

• cypress/integration/spec.js shows the full plain and HTML email test
• cypress/integration/confirm-spec.js runs E2E tests for the confirmation page in isolation
• cypress/integration/check-email-spec.js is an API test that calls the pages/api/register.js handler and confirms the handler sends an email

The tests run on GitHub Actions, see the .github/workflows/ci.yml workflow. The results are recorded on Cypress Dashboard.