Cypress如何验证DOM标签中未显示的textarea内容及原因

textarea属于表单控件，它的展示内容存储在**DOM元素的value属性（property）**中，而非HTML标签的文本节点，也不会同步更新到HTML标签的属性（attribute）里。你在元素面板看到的空textarea标签是页面初始的HTML结构，JS赋值或者交互修改的只是DOM元素的value属性，这个改动不会反射到HTML标签结构中，所以你看不到文本写在<textarea>和</textarea>之间，针对文本节点设计的cy.contains、获取text属性的方式自然也无法匹配到内容。

直接使用Cypress内置的表单value断言即可，代码如下：

// 不需要额外点击也可以直接断言value，有点击需求可以在中间加.click()
cy.get('textarea[name="cdFilter"]')
  .should('have.value', 'Name contains Referencia')

如果实际展示的文本带前后括号，将断言内容修改为(Name contains Referencia)即可。

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