如何在Cypress/JavaScript中存储元素文本供后续断言使用？

你给出的elementExample().index(1).wrap().as('element1');写法不正确，主要存在两个问题：

1. .index(1)用法错误：该方法的作用是返回当前元素在同级兄弟节点中的索引值（数字类型），如果你的需求是取elementExample()匹配到的元素列表里的第2个元素（索引从0计数），应该用.eq(1)
2. .wrap()用法错误：该方法是用来把普通JS值、DOM元素等非Cypress链式对象包装成Cypress可链式调用的对象，你已经在Cypress命令链上调用，不需要额外加.wrap()，而且这段代码存的是元素本身而非元素的文本内容。

注意：不要混淆.eq(index)和.index()方法，前者是取匹配集合中指定索引的元素，后者是返回当前元素的索引值。

场景1：同一流程内直接使用文本做断言 #

如果存储完文本后马上就要做断言，直接在.then()回调内处理即可，示例代码：

// elementExample()是你封装的元素获取方法
elementExample()
  .eq(1) // 取匹配列表的第2个元素
  .invoke('text') // 调用jQuery的text方法获取元素的文本内容
  .then(originText => {
    // 可以按需去除文本前后的空白字符，避免空格/换行影响断言
    const savedText = originText.trim()
    // 直接对新元素做断言
    你的新元素获取方法().should('contain.text', savedText)
  })

场景2：文本需要跨步骤/跨用例使用 #

如果需要把文本存起来后续多个地方用，可以用cy.wrap()配合别名存储，示例代码：

// 存储文本为别名
elementExample()
  .eq(1)
  .invoke('text')
  .then(text => cy.wrap(text.trim()).as('savedText'))

// 后续任意位置调用别名取值做断言
cy.get('@savedText').then(savedText => {
  新元素获取方法().should('include.text', savedText)
})

补充说明 #

如果你后续需要直接复用该元素而非元素文本，直接写elementExample().eq(1).as('targetElement')即可，不需要加.wrap()，后续通过cy.get('@targetElement')就能直接拿到该元素做操作。

内容的提问来源于stack exchange，提问作者BruceyBandit