WebdriverIO email and OTP testing
Use MailSlurp in WebdriverIO tests to create inboxes, wait for verification emails, and extract OTP codes.
MailSlurp works well with WebdriverIO when WebdriverIO drives the app and the MailSlurp JavaScript SDK handles inbox creation and message retrieval. That lets you test real email OTP, magic-link, reset-password, and notification flows inside the same suite.
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 WebdriverIO OTP flow
import { MailSlurp } from "mailslurp-client";
const mailslurp = new MailSlurp({ apiKey: process.env.API_KEY });
describe("sign up flow", () => {
it("verifies an email OTP", async () => {
const inbox = await mailslurp.createInbox();
await browser.url("https://your-app.example/sign-up");
await $('input[name="email"]').setValue(inbox.emailAddress);
await $('input[name="password"]').setValue("correct horse battery staple");
await $('button[type="submit"]').click();
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 $('input[name="verificationCode"]').setValue(match.matches[1]);
await $('button[type="submit"]').click();
await expect($('[data-test="dashboard"]')).toBeDisplayed();
});
});