How to Effectively Test Email Workflows Using Playwright and Mailinator

When building software, seamless email functionality is crucial, whether it’s for user signups, notifications, or password resets. But ensuring your email workflows function as intended, without spamming your team with test emails or cluttering your inbox, can be a challenge.

That’s where Mailinator comes in—a friendly tool designed to simplify testing email workflows in staging and QA environments.

In this article, we will discuss in detail what exactly is Mailinator, what are its benefits, and how to test Email workflows with Playwright and Mailinator API.

Mailinator is more than just temporary or disposable email addresses. Mailinator allows Developers and QA Testing teams to automatically test their Email and SMS workflows like 2FA verifications, sign-ups, and password resets with trillions of inboxes at your fingertips. Whether you do Manual Testing, use an API, or a framework like Selenium, Cypress, Playwright, or Puppeteer – Mailinator closes the loop on email and SMS workflow testing.

• Testing solutions: Mailinator has tools for people who build and check software. They can use these tools to make sure everything works right. It helps make checking software and systems easier.

• Enterprise-grade security: Mailinator keeps your information safe. You can ensure your details and tests are protected when you use it. It’s nice to know your data is in safe hands.

• API integration: You can connect Mailinator’s tool to your own system. This lets your team use it to check if messages in the system are working right. It makes testing smooth and helps make sure everything does what it should.

Overall, Mailinator’s solution offers a range of features designed to simplify testing and ensure that your workflows are functioning as expected. With robust testing solutions, API integration and enterprise-grade security, Mailinator can help streamline your testing.

Testing email workflows is important for several reasons:

• Ensuring proper functionality: Email workflows are essential in most applications, so they must deliver accurate information at the right time. Testing helps detect issues like delivery failures, incorrect content, or missing messages before they impact users.
• Testing different scenarios: Emails can be triggered by various user actions or system events. Verifying these scenarios ensures the system behaves correctly and consistently across all expected conditions.
• Ensuring compliance: Some email processes must follow data protection or privacy regulations. Testing helps confirm that the system meets these requirements and handles user data safely.
• Improving user experience: Email communication often shapes a user’s perception of the product. Validating workflows ensures users receive timely, relevant information, contributing to a smoother overall experience.

It’s not a good practice to test Email delivery systems by sending them to customers. Instead, the Mailinator platform can be used to test communication workflows and ensure they work correctly

The platform provides a real-time solution for testing 2FA verifications, sign-ups, and password resets, making it an excellent solution for developers and testers.

Mailinator can create an Inbox that doesn’t exist and send messages to that domain, which will appear in the Mailinator feed. The system remains open, allowing anyone to register a domain and point it at Mailinator to test their workflows.

Ensuring the reliability of your application’s login system is crucial for user trust and security. By integrating Playwright with Mailinator, you can automate the testing of login flows that involve One-Time Passwords (OTPs) sent via email or SMS. In this post, we will explore how to get OTP sent via email.

Automated testing of login functionalities helps in:

• Validating that only authorized users can access restricted areas.

• Ensuring OTPs are correctly delivered and processed.

• Reducing manual testing efforts and increasing test coverage.

Initialize a Playwright Project:

npm init playwright@latest

Install Required Packages:

npm install axios

Configure Mailinator API Access:
To use the Mailinator API:
1. Subscribe to a free trial or our Verified Pro plan.
2. Generate your unique API token.
Obtain your Mailinator API token from your Team Settings page and set up the base URL for API requests.

To demonstrate the login feature using an OTP retrieved from email, I’ll be using the page:
https://demos.openotp.com/demo/web-authentication-openotp/?mode=OTP

Before automating the login flow, I first register a new account. After completing the registration process and creating a demo account, I proceed to automate the login function.

The code below describes how we trigger an OTP login, retrieve the OTP from Mailinator using their API, and complete the authentication flow automatically using Playwright.

const { test, expect } = require('@playwright/test');
const axios = require('axios');

test('Login using OTP code via email', async ({ page }) => {
  // Generate a unique inbox name
  const inbox = 'huyentest01';
  const password = "Password@123"

  // Navigate to the login page and initiate login
  await page.goto('https://demos.openotp.com/demo/web-authentication-openotp/?mode=OTP');
  await page.locator("[name='username']").fill(inbox);
  await page.locator("[name='password']").fill(password);
  await page.selectOption("select[name='method']", { label: 'Out-of-band Email Password'});
  await page.selectOption("select[name='domain']", { label: 'Online Demos'});

  await page.click("input[type='submit']");
  // Wait for the OTP email to arrive
  const apiToken = "YOUR_API_TOKEN"; //Replace your api token
  const inboxResponse = await axios.get(`https://api.mailinator.com/api/v2/domains/private/inboxes/${inbox}`, {
    headers: { 'Authorization': apiToken }
  });
  const messages = inboxResponse.data.msgs;
  const otpEmail = messages.find(msg => msg.subject.includes('OpenOTP Login'));
  // Fetch the full message content
  const messageResponse = await axios.get(`https://api.mailinator.com/api/v2/domains/private/messages/${otpEmail.id}`, {
    headers: { 'Authorization': apiToken }
  });
  const otpCodeMatch = messageResponse.data.parts[0].body.match(/\d{6}/);
  const otpCode = otpCodeMatch ? otpCodeMatch[0] : null;
  // Enter the OTP and complete login
  await page.fill('#otp', otpCode);
  await page.click('#login_button');
  // Verify successful login
  await expect(page.getByText('Welcome Huyentest01.')).toBeVisible();
});

The above test script automates the OpenOTP login process by triggering an email-based OTP authentication and retrieving the OTP code through the Mailinator REST API.

After submitting the login form, the script connects to the Mailinator inbox associated with the test account, retrieves the most recent email containing the “OpenOTP Login” subject, and extracts the 6-digit OTP code from the email body.

If the inbox does not contain any email, the script prints a message indicating that no OTP email has arrived. If an OTP email is found, the script fetches the full message content, extracts the OTP code, and proceeds with the login process. If the OTP code is missing or invalid, the script prints an error message.

Finally, the script enters the OTP into the application, verifies that the login is successful, and confirms that the welcome message is displayed.

By integrating Playwright with Mailinator, you can efficiently automate and validate your application’s login processes involving OTPs, enhancing both security and user experience.

Mailinator has been a game changer for QA teams and engineers looking to deliver high-quality testing with its simple yet intuitive application for testing Emails. This powerful tool not only provides manual testing capabilities but can also be automated, resulting in increased efficiency and maintainability of your codebase, leading to even greater quality.