how to access dropdown selection in Cypress, get error: element is detached from the DOM

问题

I am trying to select a dropdown item using Cypress. When i use the Cypress's Open Selector Playground, and point at the Web Element, i get cy.get('.Dropdown-placeholder').type('Name')

I get an error:

CypressError
Timed out retrying: cy.type() failed because this element is detached from the DOM.

<div class="Dropdown-placeholder"></div>

Cypress requires elements be attached in the DOM to interact with them.

The previous command that ran was:

  > cy.get()

This DOM element likely became detached somewhere between the previous and current command.

Common situations why this happens:
  - Your JS framework re-rendered asynchronously
  - Your app code reacted to an event firing and removed the element

You typically need to re-query for the element or add 'guards' which delay Cypress from running new commands.Learn more

and when i try to get the CSS Selector for the actual Entry, i get: cy.get(':nth-child(3) > #Question > .Dropdown-root > .Dropdown-control > .Dropdown-placeholder')

when i try cy.get('.Dropdown-placeholder').focus().type('Name') I get Error:

cy.focus() can only be called on a valid focusable element. Your subject is a: <div class="Dropdown-placeholder"></div>

and for: cy.get('.Dropdown-placeholder').click().type('Name') i get error:

CypressError
Timed out retrying: cy.click() failed because this element is detached from the DOM.

<div class="Dropdown-placeholder"></div>

Cypress requires elements be attached in the DOM to interact with them.

The previous command that ran was:

  > cy.get()

This DOM element likely became detached somewhere between the previous and current command.

Common situations why this happens:
  - Your JS framework re-rendered asynchronously
  - Your app code reacted to an event firing and removed the element

You typically need to re-query for the element or add 'guards' which delay Cypress from running new commands.Learn more

And here is the HTML:

<div class="Dropdown-root module-Questions-module-dropDownContainer--2bcD7--"><div class="Dropdown-control" aria-haspopup="listbox"><div class="Dropdown-placeholder is-selected">Name</div><div class="Dropdown-arrow-wrapper"><span class="Dropdown-arrow"></span></div></div></div>

来源：https://stackoverflow.com/questions/62493350/how-to-access-dropdown-selection-in-cypress-get-error-element-is-detached-from