How to fetch the locator for the dynamic generated dropdown value?

user_14406676 0
Viewed 126

I am writing the cypress test. I can see the developer has used the below script to select the dropdown list. They didnt use the select option for drop down. They used the div for dropdown. So that you dont see the options are not getting displayed in the script

div class=" css-yk16xz-control">
    <div class=" css-g1d714-ValueContainer">
        <input id="react-select-2-input" readonly="" tabindex="0" aria-autocomplete="list" class="css-wmatm6-dummyInput-DummyInput" value=""></div>

I have tried this cy.get(".css-g1d714-ValueContainer").click() in my test and it's getting clicked and it displays the dropdown. Now I have to select anyone value from the drop down. I dont see any options are displaying there when I do inspect in my browser.

By manualy I can select any one value and I click it and then I can see selected value is getting displayed in inspect browser.

<div class=" css-yk16xz-control">
    <div class=" css-g1d714-ValueContainer">
        <div class=" css-1uccc91-singleValue">Start</div>
        <input id="react-select-2-input" readonly="" tabindex="0" aria-autocomplete="list" class="css-wmatm6-dummyInput-DummyInput" value=""></div>

I dont see the 'start' in the beginning itself. So I tried these two code in cypress

Firstone

cy.get(".css-g1d714-ValueContainer").click()
cy.get(" css-1uccc91-singleValue").invoke("Start")

This also didnt work

Secondone

cy.get(".css-g1d714-ValueContainer").next(" css-1uccc91-singleValue","Start")

This also didnt work.

I wanted to know how to write the locator for selecting the dropdown value?

cypress javascript
1 Answers

You can directly use .contains() once the dropdown is in the opened state to select the option. Add {matchCase: false} to disable the check for case sensitivity.

cy.get('.css-g1d714-ValueContainer').trigger("mousedown")
cy.get('.css-g1d714-ValueContainer').trigger("mouseup")
cy.contains('Start', { matchCase: false, timeout: 6000 }).click()
user_45712710
Related