In web application testing, ensuring that authentication works correctly is critical for protecting our users. In addition to a strong password, many applications require setting up multi-factor authentication (MFA).
Authenticator apps are a convenient way to generate a TOTP (Time-Based One-Time Password) securely. This article explains how to use Autify to verify that app-based two-factor authentication (2FA) is working correctly.
Prerequisites
The following prerequisites must be met to verify that app-based 2FA is working using Autify:
- The web application being tested must support authentication via TOTP authenticator apps.
- A REST API that acts as an equivalent to the TOTP authenticator app must be available.
- For more information, please reference the Prepare the process for two-factor authentication section.
What will the Test Scenario look like?
The following is an example of a Test Scenario where the user goes through the 2FA process on GitHub.
- Step 5: Perform the first step of authentication with a password.
- Step 6-9: Execute a JS step in a new window(*), obtain and return a TOTP in Step 7.
- Step 10: Enter the TOTP returned in Step 7 into the 2FA form.
- Step 11-12: Proceed with the authentication process and confirm that it is successful
* Executing in the same window may not work depending on the website being tested.
Test Scenario Details Page
Test Result Page
In step 10, you can see that the TOTP obtained in step 7 has been entered.
How to create the Test Scenario
Here is how to create the Test Scenario shown above.
The process can be divided into two stages:
- Preparing the process for two-factor authentication
- Preparing the Test Scenario
Preparing the process for two-factor authentication
- Prepare an API for generating the TOTP. We recommend that you prepare your own environment, but feel free to use the following endpoints hosted by Autify for testing😊
- Sample API code
- Sample API endpoints (please refer to the repository above on how to use it)
https://autify-jsstep-util-apis.herokuapp.com/totp
- Prepare the secret key for generating a TOTP. Typically, this is displayed in the application being tested. Secret keys are often displayed as a QR code that users can scan, but for testing, please obtain a character string.
Taking GitHub as an example, the secret key is displayed when you click the section shown below:
Preparing the Test Scenario
- Create the Test Scenario by recording operations on the web application as usual until just before performing 2FA.
- Use the secret key from step 2 (Prepare the process for two-factor authentication) and request the API to generate a TOTP using a JS Step and return the value (TOTP).
The following is a sample code. "YOUR SECRET CODE" needs to be replaced with your actual secret key.
var secret = "YOUR SECRET CODE"
var url = "https://autify-jsstep-util-apis.herokuapp.com/totp";
var xhr = new XMLHttpRequest();
var otp = null;
xhr.onerror = function() {
  throw new Error("Network Error");
};
xhr.onload = function() {
  otp = xhr.response;
};
xhr.open("POST", url, false);
xhr.setRequestHeader("Content-Type", "application/x-www-form-urlencoded");
xhr.send("key=" + secret);
return otp;
- Set the TOTP returned in the JS step in step 2 as the input value for 2FA.
Now, a dynamically generated TOTP will be entered at each test execution🎉
Notes
- For 2FA specifications on apps/services being tested, please refer to the documentation provided by the app/service.
- You can apply the above method in a Test Scenario that verifies a sign-up process where a different email address and a different secret key are used each time. In this case, you would use a random email address (available in the Email Test feature).
Should you have any questions, please get in touch with our support team.
Further reading