javascript - Best practise to wait for a dropdown and selecting a value with Selenium in JS

Question

I have a website written in React (not by me) and I am currently using selenium to select a dropdown and choosing a value from it.

Since is React, I can't just wait for the DOM to be ready (however I do it anyway).

So, I wrote those lines, that actually are working:

• first 3 lines to click on the dropdown
• last 3 to select an element from the dropdown

/** Find dropdown and click on it */
await driver.wait(until.elementLocated(By.css('div#discipline')))
const dropdown = await driver.findElement(By.css('div#discipline'))
await dropdown.click()
        
/** Wait the list, find element to select and click on it */
const dropOpts = await driver.wait(until.elementLocated(By.css('div#menu-discipline > div > ul')))
await driver.wait(until.elementLocated(By.xpath('//li[contains(text(),"Infirmary")]')))
const choice = await dropOpts.findElement(By.xpath('//li[contains(text(),"Infirmary")]'))        
await choice.click()

• first question is about if it is actually correct (it runs but it's not necessarily correct!);
• second question is: is it right for the first element, to FIRST wait for it THEN find it? or should I do the opposite?
• third and most important question: what about the last 3 lines of code? is it right to A) wait for the parent element of the dropdown menu B) wait for the dropdown menu to appear with driver.wait C) find the element i want to select with findElement? Or should I have first to findElement then to wait for it to appear?

I have a bit of confusion about this.

Answer 1

等待大神答复