Below is a screenshot of a webpage that I am trying to write a Cypress test for.

As you can see, I have managed to write "teladoc" into the input box, but I now need to click the dropdown menu to navigate to a different page.

I am not able to get the ID, etc. of the dropdown menu.

When I try to inspect the dropdown menu, the page reloads and the dropdown disappears.

Does someone know how I can inspect this? I tried through the cypress explorer too, but it reloads in that beforehand too.

CodePudding user response：

Since the locator is not there, You can play around with Keypress. The idea is when you have typed and there is the suggested list, you can first press the down key and then enter key. This might result in flaky tests as you don't know how much time does it take for the suggested item to appear.

cy.get(selector).type('{downarrow}{enter}')

You can also directly use contains. If this works this way the tests won't be flaky. You can play around with the timeout value.

cy.contains('Teladoc Health Inc - United States', {timeout: 5000})
  .should('be.visible')
  .click()

CodePudding user response：

Open the browser console and type this

setTimeout(() => { debugger; }, 5000)