View on GitHub

examples

Email testing and SMS verification examples using MailSlurp and a wide range of frameworks.

Cypress MailSlurp plugin example

How to use MailSlurp with Cypress JS. Loads a demonstration app, signs up with a new email address, receives confirmation code, extracts code and submits. Sees welcome screen.

Documentation

Run tests

API_KEY=your-api-key make test

Example test

/// <reference types="cypress-mailslurp" />

describe("user sign up test with mailslurp plugin", function () {
    //<gen>cypress_plugin_before
    // use cypress-mailslurp plugin to create an email address before test
    before(function () {
        cy.log("Wrap inbox before test")
        return cy.mailslurp()
            .then(mailslurp => mailslurp.createInbox())
            .then(inbox => {
                cy.log(`Inbox id ${inbox.id}`)
                // save inbox id and email address to this (make sure you use function and not arrow syntax)
                cy.wrap(inbox.id).as('inboxId')
                cy.wrap(inbox.emailAddress).as('emailAddress')
            })
    });
    //</gen>
    it("01 - can load the demo application", function () {
        //<gen>cypress_plugin_01
        // get wrapped email address and assert contains a mailslurp email address
        expect(this.emailAddress).to.contain("@mailslurp");
        // visit the demo application
        cy.visit("https://playground.mailslurp.com")
        cy.title().should('contain', 'React App');
        //</gen>
        //<gen>cypress_plugin_02
        cy.then(function () {
            // click sign up and fill out the form
            cy.get("[data-test=sign-in-create-account-link]").click()
            // use the email address and a test password
            cy.get("[name=email]").type(this.emailAddress).trigger('change');
            cy.get("[name=password]").type('test-password').trigger('change');
            // click the submit button
            cy.get("[data-test=sign-up-create-account-button]").click();
            //</gen>
        })
        //<gen>cypress_plugin_03
        cy.then(function () {
            // app will send user an email containing a code, use mailslurp to wait for the latest email
            cy.mailslurp()
                // use inbox id and a timeout of 30 seconds
                .then(mailslurp => mailslurp.waitForLatestEmail(this.inboxId, 30000, true))
                // extract the confirmation code from the email body
                .then(email => /.*verification code is (\d{6}).*/.exec(email.body!!)!![1])
                // fill out the confirmation form and submit
                .then(code => {
                    cy.get("[name=code]").type(code).trigger('change');
                    cy.get("[data-test=confirm-sign-up-confirm-button]").click();
                })
        })
        //</gen>
        //<gen>cypress_plugin_04
        // fill out sign in form
        cy.then( function () {
            // use the email address and a test password
            cy.get("[data-test=username-input]").type(this.emailAddress).trigger('change');
            cy.get("[data-test=sign-in-password-input]").type('test-password').trigger('change');
            // click the submit button
            cy.get("[data-test=sign-in-sign-in-button]").click();
        });
        //</gen>
        //<gen>cypress_plugin_05
        // can see authorized welcome screen
        cy.then(function () {
            // click sign up and fill out the form
            cy.get("h1").should("contain", "Welcome");
        })
        //</gen>
    });
});