Rayrun
BlogAsk AIToolsVideosQA WikiDiscord
← Back to Discord Forum

I am trying to check for select dropdown below and can't seem to get it right

Browser AutomationEnd-to-End TestingTest DebuggingPlaywright
hlulani.posted in #help-playwright
Open in Discord
hlulani.
hlulani.

Here are the elements below:

<gender-input>        <label>Gender Preference</label>         <select class="form-select" required="" id="gender" autocomplete="sex">           <option selected="" disabled="" value="">Select a gender preference</option> <option value="male">Male</option> <option value="female">Female</option> <option> value="other">Non-binary/non-conforming</option>         </select> </gender-input>

and here my line for tests to select from dropdown: await page.locator('select#gender.form-select').selectOption({label: 'Male'});

I keep getting "element is not visible - waiting..."

I have exhausted multiple ways to select, including using a click and it did not help

This thread is trying to answer question "How can I select an option from a dropdown menu in my code without getting an 'element is not visible - waiting...' error?"

9 replies
.aleksandaraleksandrov
.aleksandaraleksandrov

await page.locator('option[value="male"]').click(); this should work and I think you can pick with value too

hlulani.
hlulani.
@.aleksandaraleksandrov: Thanks for you response... I have tried this before and did adgian and still get the error: TimeoutError: locator.click: Timeout 20000ms exceeded. =========================== logs =========================== waiting for locator('option[value="male"]') locator resolved to <option value="male">…</option> attempting click action waiting for element to be visible, enabled and stable element is not visible - waiting... ============================================================

Thanks for you response... I have tried this before and did adgian and still get the error: TimeoutError: locator.click: Timeout 20000ms exceeded. =========================== logs =========================== waiting for locator('option[value="male"]') locator resolved to <option value="male">…</option> attempting click action waiting for element to be visible, enabled and stable element is not visible - waiting... ============================================================

.aleksandaraleksandrov
.aleksandaraleksandrov

Ok @hlulani., is this option[value="male"] pointing to the option? you can try with dev tools or while the test is running click on the locator and you should see it in the browser?

fotbee
fotbee

I have same issue with some elements in my app, force:true helps

hlulani.
hlulani.
@.aleksandaraleksandrov: I found the solution, this is how I have it now await page.locator('#gender').selectOption('other');

I found the solution, this is how I have it now await page.locator('#gender').selectOption('other');

hlulani.
hlulani.
@fotbee: Is force:true a good idea though?

Is force:true a good idea though?

.aleksandaraleksandrov
.aleksandaraleksandrov

Only if is needed. If something is covering the element or something of this sort. But always check the selectors via dev tools or the UI mode 🙂

fotbee
fotbee

For me actually it was the only way to do,because parent elements intercepts the click action even if element is not covered

Open in Discord

Related Discord Threads

BlogAsk AIToolsVideosQA WikiDiscord
TwitterGitHubLinkedIn
AboutQuestionsDiscord ForumBrowser ExtensionTagsQA Jobs

Rayrun is a community for QA engineers. I am constantly looking for new ways to add value to people learning Playwright and other browser automation frameworks. If you have feedback, email luc@ray.run.