Select the Nth option from a list

Selecting the Nth Option from a List

In a Select a value from a list step, the option is selected based on its label, so you cannot use it to select the Nth option.

However, you can achieve the same action by combining "JS Steps for Elements" and the "Select a value from a list" step.

Benefits of Using JS Steps for Elements

Using a regular JS step, it's possible to select the Nth option from a list with a single JS step. However, on this page, we will show you how to combine "JS Steps for Elements" with the "Select a value from a list" step, as using "JS Steps for Elements" has the following advantages:

• Autify AI gets the element, so you don't have to get its CSS selector/XPath.
• Requires less code, since you don't need to write code to get the element.
• Automatically waits for the page to finish loading and for the element to appear.

Record and Edit the Scenario

First, right-click on the target list and select [Autify Recorder] > [Add JS Step]. Next, select the appropriate value from the list and click [Save].

This will create two steps: "Execute JavaScript" (we'll call this step as "JS Step for Element") and "Select ... from List".

Open the JS Step for Element and paste the following code. Autify will get the element, so less code is needed.

// The index of the list starts at 0, so if you want to select the fourth option, specify 3.
const index = 3;

// -- No need to change from here on down --
// Obtains the label with the specified index number.
const label = element.options[index].label;

// The obtained label is returned and made available for use in subsequent steps.
return label;

The section below specifies the index number of the option. Since the index starts at 0, set it to 3 if you want to select the 4th option.

const index = 3;

Next, click the "Select ... from List" step, change the label value to "Other step's result", specify the JS Step for Element, and save. Now it will select the label obtained in the JS Step for Element.

Run the Test

Let's run the test.

Looking at the result, we can confirm that the return value of the JS Step for Element is the expected label value.

The list value is also changed to the returned value.