Cypress: How to select a value from list in dynamic text box also can't find locator for the value since it's disappearing?

Question

I have a textbox and typing "something" and I need to select that from below list, but I am unable to find a locator to select. When I tried to inspect on listed values, the list is disappearing. So I tried using directly inside type('something{enter}'), this is working manually and surprisingly not working in automation.

Can someone advice how to select this? My textbox and html is below

Answer 1

You can easily view the element with some basic debugging skills - in your test, open the dropdown, then issue command

cy.contains('Sysongkhan, Phonepasith`)
  .then($els => {
    console.log($els)  // debug to dev console
  })

Take a look at the console and observe the element structure for the best selector features (classes, ids, etc).

Maybe you just need to click after the code above if that text is unique.