Reputation: 395
I am building this automation that goes to a specific website, logs in, clicks on the button to create a new request and then it has to select options from a few "drop-down menus". It all works fine until then. The problem, at least to my understanding of the code, is that the drop-down menus are not of a select type. Therefore, when I tried to use puppeteer.select(), it did not work. I can't get it to click on the drop-down menu nor select any of the options. What makes it even more challenging is that the options I will select will vary every time, and I'd need a way to identify each option in the drop-down and maybe label them so they get picked depending on the parameters.
Here's the code of one of the "drop-down" menus.
<div class="jss131">
<div class="jss132 jss135 jss119 jss104" aria-pressed="false" tabindex="0" role="button" aria-haspopup="true" id="select-company">
<span>​</span>
</div>
<input name="companyAndRegN" type="hidden" value="">
<svg class="jss138 jss137" focusable="false" viewBox="0 0 24 24" aria-hidden="true" role="presentation"><path d="M7 10l5 5 5-5z">
</path>
</svg>
</div>
Then, when we click on the box, it loads all the options:
<ul class="jss280 jss281" role="listbox">
<li class="jss1 jss287 jss290 jss295 jss296 jss284 jss285" tabindex="0" role="option" data-value="[object Object]" style="border-left: 1px solid rgb(171, 171, 171); padding-left: 5px; height: 4px;">
"Company A"
" - "
"AB123456789"
<span class="jss229">
</span>
</li>
.
. All other options...
.
</ul>
I have tried page.select(), I have tried xpath... nothing works.
It has text boxes, that are blocked until we select an option from this first dropdown, in case that's relevant.
Thank you in advance!
Upvotes: 3
Views: 871
Reputation: 149
hey I crossed over this problem by doing this
await page.$eval("#drop_down_selector", (el) => (el.value = "Targeted_value"));
Upvotes: 3