Using an external Ethereal email inbox and Sendgrid to test emails
Read the blog post "Full Testing of HTML Emails using SendGrid and Ethereal Accounts"
Note: if you are using an SMTP server directly to send emails, take a look at cypress-email-example repository where we spawn our own SMTP server right from the Cypress during tests.
This application uses Sendgrid to send emails, thus you need to configure an account and expose it via environment variables
SENDGRID_HOST=smtp.sendgrid.net
SENDGRID_PORT=465
SENDGRID_USER=
SENDGRID_PASSWORD=
# the same as verified sender
SENDGRID_FROM=
The above variables are only needed for the npm start process, as Cypress creates its own temporary email Ethereal email inbox.
$ npm install
$ npm start
# from another terminal
$ npx cypress open
# click the spec.jsNext JS application showing the confirm page, emailing a confirmation code and storing it in the database. The API hook pages/api/register.js uses src/emailer.js to send the email using the SMTP config from the environment variables.
Once the user gets the email, they enter the confirmation code that is checked against the database by pages/api/confirm.js.
The temporary email account is created by cypress/plugins/email-account.js code called from the cypress/plugins/index.js. The cypress/integration/spec.js does the full end-to-end test:
- opens the application page
- enters the temporary email address
- checks the temporary email address to get the last email
- loads the HTML email in the Test Runner
- grabs the confirmation code and clicks the confirm button
- enters the extracted confirmation code
- verifies the page shows "Success"
The start of the test
The second part of the test
