Manual MFA testing slows releases and leaves gaps in coverage. In this tutorial you'll wire up Playwright, Auth0, and MailSlurp to run a complete sign-up–verify–TOTP login flow entirely in code. By the end you'll have a repeatable test that spins up a disposable inbox, captures Auth0's QR secret, generates real TOTP codes on the fly, and asserts a successful login - all ready for your CI pipeline.

What we are testing

We have a demo application written in Vue that relies on the Auth0 SPA SDK for authentication.

The user journey for this app is:

  1. enter email + password
  2. Auth0 enrols the account in an Authenticator TOTP factor
  3. user supplies the six-digit code to finish login.

Our goal is to automate this entire sequence—sign-up, email verification, TOTP enrolment, and subsequent login—using Playwright for browser control and MailSlurp's virtual TOTP devices to generate real codes on demand. A green test means the flow works exactly as a human would experience it, but hands-free in CI.

Setting up

First, add the tools:

Create a free MailSlurp account, generate an API key, and export it so Playwright can reach the service:

That's all you need; the next steps will spin up disposable inboxes, capture Auth0's QR secret, and feed fresh TOTP codes straight into the browser test.

Writing test

Okay, lets start the test. So first we want to load the app and trigger a sign up.

Load the application

In playwright we can load the application like this:

In the browser we'll see the Vue app with a login button in the navbar:

Sign up with email

Next we can perform a user sign-up using a disposable inbox. For this we'll import MailSlurp:

Then create a temporary email account for an isolated test run like this:

Now we can fill the sign-up form using the email address:

This will look like so:

After we click submit we will see a QR and a prompt to add an authenticator to our account.

TOTP means time-based one time password. It is the technology that powers apps like Google Authenticator and is a critical component of the multi-factor authentication common to man modern apps.

Create a virtual authenticator

Once we have been prompted for a TOTP device we can extract the secret pairing code from the QR by clicking "trouble signing in". This will reveal a base32 encoded secret key we can pass to MailSlurp in order to pair a virtual MFA device.

We can copy this secret in Playwright by clicking copy and then using the browser method to extract the highlighted text.

Next we pass that secret to MailSlurp and generate a code with the device:

Submit OTP code

Lastly we can submit the OTP code and verify our user account is authenticated:

After submitting we click the accept button to confirm we are connecting our OTP device:

Next steps

That's how we do it! We just demonstrated how to use test authenticators with MailSlurp and Playwright to test a multi-factor authentication (2FA) sign-up process. For more information see the developer documentation.

All code for this project is available on GitHub