Skip to main content
Version: 9.0.0

Key Value Pair

It is important to avoid typos and errors in the value of the field you are filling. Sometimes a dropdown DOM structure looks very confusing, e.g.:

<option value="Tous" title>Tous</option>
<option value="NON SOC" title>B</option>
<option value="SOC ACT" title>A</option>
<option value="Pro" title>C</option>
<option value="SOC" title>D</option>

And imagine in your code you`re using the method:

await pega.dropdownByDataTestId('Type').select('SOC');

(or even worse

await pega.dropdownByDataTestId('Type').select('D');

We are selecting a dropdown value by the value attribute, not by the inner text. Anyway, it is difficult to read and debug this code. That's why we have implemented a Key-Value pair that links wo data items: a key, a unique identifier, and the value, which is either the data that is identified or a pointer to the location of that data.

With the key-value the example above looks like this:

await pega.dropdownByDataTestId('Type').select(CustomerType.activeCustomer().get());

Now it's readable and easy to maintain.

Recommended steps are:

  • to create a namespace containing all possible types of keys-values:

  • to use key or value in your code:

  • describe() returns a key;

  • get() returns a value;

  • getAsNumber() returns the value converted to the number format;

  • getAsBoolean() returns true if the value equal to true;

In the page object method you can pass the Value type of parameter:

async selectSearchType(value: Value)

and to select the key or value accordingly:

await pega.dropdownByDataTestId('searchType').select(value.get());

or

await pega.dropdownByDataTestId('searchType').select(value.describe());