在 Cypress 中获取原生 HTML 元素

Question

如何从赛普拉斯查询中获取底层原生 HTMLElement（或 Element 或 Node...）？

const el = cy.get('.foo').children().first()
//    ^ this is of type Cypress.Chainable<JQuery<HTMLElement>>

我想访问 el 中的原生 HTMLElement 实例。
我试过el[0]，但结果是any。

Answer 1

在 cypress 中，first() 是一个将链接到 .get() 并重试整个选择直到超时的命令。这就是为什么你不能真正从中获取原生元素的原因。

但是，您可以产生命令，并通过向其传递函数来访问 .then() 中的元素。

例如，来自Cypress documentation on this EXACT question：

cy.get('.foo').then(($el) => {
  const el = $el.get(0) //native DOM element
})