Cypress + plop.email
Verify emails in your Cypress E2E tests. Use cy.request() to fetch and assert on email content.
Cypress DocumentationFeatures
Custom Commands
Create reusable cy.getEmail() and cy.waitForEmail() commands.
Chainable API
Fluent assertions that fit Cypress patterns.
Retry Built-in
Leverage Cypress retry-ability for email polling.
Dashboard Integration
Email test results visible in Cypress Dashboard.
Setup
# Install Cypress
npm install cypress --save-dev
# Add to cypress.config.ts
export default defineConfig({
e2e: {
env: {
PLOP_API_KEY: process.env.PLOP_API_KEY,
PLOP_API_URL: 'https://api.plop.email/v1',
},
},
});Custom Command Setup
Add a reusable command for fetching emails.
Custom Command Setuptypescript
// cypress/support/commands.ts
Cypress.Commands.add('getLatestEmail', (toAddress: string) => {
return cy.request({
method: 'GET',
url: `${Cypress.env('PLOP_API_URL')}/messages/latest`,
headers: {
Authorization: `Bearer ${Cypress.env('PLOP_API_KEY')}`,
},
qs: { to: toAddress },
}).its('body');
});
// Usage in test
describe('Email Verification', () => {
it('sends confirmation email', () => {
const testEmail = `test+${Date.now()}@in.plop.email`;
cy.visit('/signup');
cy.get('[name="email"]').type(testEmail);
cy.get('form').submit();
cy.wait(2000);
cy.getLatestEmail(testEmail).then((email) => {
expect(email.subject).to.include('Confirm');
});
});
});Polling for Email Arrival
Retry until email arrives with custom timeout.
Polling for Email Arrivaltypescript
// cypress/support/commands.ts
Cypress.Commands.add('waitForEmail', (toAddress: string, options = {}) => {
const { timeout = 10000, interval = 1000, subject } = options;
const fetchEmail = () => {
return cy.request({
method: 'GET',
url: `${Cypress.env('PLOP_API_URL')}/messages/latest`,
headers: {
Authorization: `Bearer ${Cypress.env('PLOP_API_KEY')}`,
},
qs: { to: toAddress },
failOnStatusCode: false,
});
};
return cy.wrap(null, { timeout }).should(() => {
return fetchEmail().then((response) => {
if (response.status !== 200) {
throw new Error('Email not yet received');
}
if (subject && !response.body.subject.includes(subject)) {
throw new Error('Email subject does not match');
}
return response.body;
});
});
});
// Usage
cy.waitForEmail(testEmail, { subject: 'Reset', timeout: 15000 });Tips
- Define custom commands in cypress/support/commands.ts
- Use cy.intercept() to stub email sending in unit tests
- Add TypeScript types for custom commands in cypress.d.ts
- Run email tests in a separate spec file for better organization
Related Integrations
Related Use Cases
Start testing with Cypress
Add email verification to your Cypress tests in minutes.