ThousandEyes Transaction Tests use case: logging into an email account

[oatroshc]

Welcome to a series of articles about Transaction Tests in ThousandEyes!

ThousandEyes is a powerful SaaS platform that gives a digital picture of enterprise infrastructure, formed by test views, alerts, dashboards, and other components.

What is a Transaction Test? 

ThousandEyes transaction tests are scripted synthetic user interactions with web-based applications such as online shopping or video streaming. Transaction Tests can traverse multiple pages and user actions, giving you increased visibility and insight into your network. Read more about Transaction Test use cases here.

The goal of this article is to walk you through setting up a ThousandEyes Transaction Test to log into an email account (in this case, a Gmail account). In a future article we'll discuss setting up 2-factor authentication to this process, but for now we'll start with the basics!

What are the steps? High level overview

1. Create a Gmail account or use an existing one.
2. Run the Integrated Development Environment (IDE) recorder to generate a script on how to log into the Gmail account.
3. Create a new Transaction Test and input the JS code from step 2.
4. Add credentials into the Credential Repository and validate.

Detailed overview

1. Create a Gmail account or use an existing one.

If you need help creating a gmail account, you can review that process here.

Note: For the Transaction Test in this article, I am using the Gmail account thousandeyestest11@gmail.com with the password ******1.

2. Create a JS script using the IDE recorder.

In order to get the Transaction Test to automate a login, we need to provide the instructions in a code format. Luckily, ThousandEyes has a powerful tool for creating Transaction Test code: the ThousandEyes Recorder. It provides an integrated development environment (IDE) for creating, validating, and enhancing transaction test scripts based on your browser actions. You can read about the ThousandEyes Recorder in detail here.

We'll use the IDE recorder to generate a script, telling it to 'translate' the process of logging into the Gmail account into JS code. Below is a short video (33 seconds) on how to make this very simple:

Once complete we'll have a JS code snippet, which we can use in our Transaction Test:

We will use this code in a moment, but remember do not close the IDE recorder yet, otherwise the code will be lost and you'll need to repeat this step.

Step 3: Create a new Transaction Test.

Log into your ThousandEyes account, expand Cloud & Enterprise Agents, choose Test Settings, and click Add New Test:

Next, define the settings for the test, enter the code, and click 'Save':

An example screenshot of the Test Settings page, with numeric indicators of the sections involved

A close-up of the Transaction Script field, with our IDE-generated JS code

Layer [1]: Web 

Test Type [2]: Transaction 

Test Name [3]: test11 

URL [4]: gmail.com 

Agents [5]: select the Cloud or Enterprise agent(s) the test will use to run

Transaction Script [6]: Copy and paste the JS code from the IDE recorder into this section. Note: Do not forget to clear out any code that is in this section before pasting your JS code!

Step 4. Adding to the Credential Repository.

Now that the Test settings have been saved, we need to 'tell' the script where it can find a valid password for the account.

Without doing so, in our example, the code is now using the unknown password under 'pass_1706114533356' -

To achieve this, we need to add a new record to the credential repository that the test will use as a password:

Open the 'Credential Repository' [7] tab

Click Add New [8]

Give the credential a nickname [9]

Add the password (in our example case this is '******1') [10]

Save it by clicking 'Add New Credential' [11]:

Once saved, the new test11 credential should sit in the Credential Repo list:

 

You can see the credential nickname and password exist in the repository now

Now we just need to enable the credential in order for the test to be able to run it:

Return to the Transaction Script from step 3 and update the password name to the credential nickname:(remember, in our example it was initially 'unknown pass_1706114533356', we updated it to be our nickname 'test11')

And that's it! Now when run, the Transaction Test will log into the Gmail account. You can check your results here (on a snapshot page):

If you have any issues getting a Transaction Test set up - open a chat with ThousandEyes Customer Support, we'll be happy to help! Here is an article on getting in touch with us in only a few seconds.Reference to useful ThousandEyes resources:

• Main web page: thousandeyes.com
• Official documentation portal: docs.thousandeyes.com
• Application page: app.thousandeyes.com
• Transaction Tests: https://docs.thousandeyes.com/product-documentation/browser-synthetics/transaction-tests
• Full code from the Transaction Script [6] running in my lab:

import { By, Key } from 'selenium-webdriver';

import { driver, test, credentials } from 'thousandeyes';

runScript();

async function runScript() {

await configureDriver();

const settings = test.getSettings();

// Load page

await driver.get(settings.url);

await typeText('thousandeyestest11', By.id(`identifierId`));

// Click on 'Next'

await click(By.css(`[data-idom-class="nCP5yc AjY5Oe DuMIQc LQeN7 qIypjc TrZEUc lw1w4b"] > .VfPpkd-vQzf8d`));

await typeText(credentials.get('test11'), By.name(`Passwd`));

await driver.takeScreenshot();

// Click on 'Next'

await click(By.css(`[data-idom-class="nCP5yc AjY5Oe DuMIQc LQeN7 qIypjc TrZEUc lw1w4b"] > .VfPpkd-vQzf8d`));

await driver.sleep(10000);

await driver.takeScreenshot();

}

async function configureDriver() {

await driver.manage().setTimeouts({

implicit: 7 * 1000 // If an element is not found, reattempt for this many milliseconds

});

}

async function typeText(value, selector) {

await simulateHumanDelay();

const element = await driver.findElement(selector);

await element.clear();

await element.sendKeys(value);

}

async function simulateHumanDelay() {

await driver.sleep(550);

}

async function click(selector) {

await simulateHumanDelay();

const configuredTimeouts = await driver.manage().getTimeouts();

const clickAttemptEndTime = Date.now() + configuredTimeouts.implicit;

await reattemptUntil(attemptToClick, clickAttemptEndTime);

async function attemptToClick() {

await driver.findElement(selector).

click();

}

}

async function reattemptUntil(attemptActionFn, attemptEndTime) {

const TIME_BETWEEN_ATTEMPTS = 100;

let numberOfAttempts = 0;

let attemptError;

while (Date.now() < attemptEndTime || numberOfAttempts === 0) {

try {

numberOfAttempts += 1;

await attemptActionFn();

}

catch (error) {

attemptError = error;

await driver.sleep(TIME_BETWEEN_ATTEMPTS);

continue; // Attempt failed, reattempt

}

attemptError = null;

break; // Attempt succeeded, stop attempting

}

const wasAttemptSuccessful = !attemptError;

if (!wasAttemptSuccessful) {

throw attemptError;

}

}

[metodijus]

excellent KB ! Thank you