TestCafe email and OTP testing

MailSlurp fits TestCafe when TestCafe drives the browser and the MailSlurp JavaScript SDK manages inbox state. A common pattern is to create a fresh inbox for the test, submit inbox.emailAddress in the sign-up form, wait for the verification email, extract the code, and type it back into the UI.

Install

npm install --save mailslurp-client

Create an inbox with the JavaScript SDK

// create an inbox
const inbox = await mailslurp.inboxController.createInboxWithDefaults();
expect(inbox.emailAddress).toMatch(/.+@.+/);

Example TestCafe OTP flow

import { MailSlurp } from "mailslurp-client";
import { Selector } from "testcafe";

const mailslurp = new MailSlurp({ apiKey: process.env.API_KEY });

fixture`Sign up`.page`https://your-app.example/sign-up`;

test("completes email OTP verification", async (t) => {
  const inbox = await mailslurp.createInbox();

  await t
    .typeText('input[name="email"]', inbox.emailAddress)
    .typeText('input[name="password"]', "correct horse battery staple")
    .click('button[type="submit"]');

  const email = await mailslurp.waitController.waitForLatestEmail({
    inboxId: inbox.id,
    timeout: 120000,
    unreadOnly: true,
  });

  const match = await mailslurp.emailController.getEmailContentMatch({
    emailId: email.id,
    contentMatchOptions: {
      pattern: "(?:verification code|OTP|code)[:\\s-]*(\\d{6})",
    },
  });

  await t
    .typeText('input[name="verificationCode"]', match.matches[1])
    .click('button[type="submit"]')
    .expect(Selector('[data-test="dashboard"]').exists)
    .ok();
});

Example projects

• MailSlurp TestCafe example

Related docs

• JavaScript SDK
• Wait for methods
• Integration testing guide