Cypress-Webhooksite

Simple library which adds webhook.site commands into cypress.io

Email e2e testing:

• add import to cypress commands

import '@icokie/cypress-webhooksite'

• add tasks into cypress.config.ts

import {defineConfig} from 'cypress'
import {tasks} from '@icokie/cypress-webhooksite/lib/tasks'

export default defineConfig({
    e2e: {
        setupNodeEvents(on, config) {
            on('task', tasks)
        },
    },
})

• connect types in tsconfig.json

{
  "compilerOptions": {
    "types": ["cypress", "@icokie/cypress-webhooksite"]
  }
}

• use it in your CY test files

describe('Email', () => {
    before(() => {
        // request test email
        cy.getWebHookSiteToken().as('emailRequest')
    })

    it('should receive email after user submits subscribe form', () => {
        cy.visit('http://localhost:5000')

        cy.findByLabelText('Name').should('be.empty').type('Test name')

        cy.get('@emailRequest').then((response) => {
            const { email } = response

            // type email into form
            cy.findByLabelText('Email').should('be.empty').type(email)
        })

        // send email form
        cy.findByRole('button').should('be.enabled').click()

        cy.get('@emailRequest').then((response) => {
            const { uuid } = response

            return cy.getWebHookSiteTokenRequests(uuid, undefined, 30000).then((response) => {
                // get latest email request from email server
                const {data: [latestRequest]} = response

                // check if email contains message which was sent
                cy.wrap(latestRequest.content).should('contain', 'Congratulations you are subscribed :) stay tuned!!!!')

                // delete email when not needed :)
                cy.deleteWebHookSiteToken(uuid)
            });
        })
    })
})

That's it!