赛普拉斯 - 如何使用文本字段中的值获取元素答案

【问题标题】：Cypress - How to get element using value in the text field赛普拉斯 - 如何使用文本字段中的值获取元素
【发布时间】：2020-07-20 22:41:30
【问题描述】：

我的应用程序中有几个 text_area_field 只能通过使用其中的值来区分。如何使用 value 获取特定元素？

例如：

<div data-component="options">
    <input data-component="text_area">Value 1</input>  
    <input data-component="text_area">Value 2</input>  
    <input data-component="text_area">Value 3</input>  
    <input data-component="text_area">Value 4</input>

我试过了 cy.get('[data-component="options"] [data-component="text_area"]').contains('Value 3').clear().type('Edited 3')。但它给出了错误：重试超时：应在元素内找到内容：“值 3”：但从未找到

任何帮助将不胜感激。

【问题讨论】：

已更新。它保留 jsu 作为参考

标签： automation cypress

【解决方案1】：

检查div 是否允许输入。如果是，请尝试以下代码，看看是否有效：

cy.get('[data-component="options"] [data-component="text_area"]').each(($div, i) => {
            const valueText = Cypress.$($div).text();
            console.log(valueText);
            if(valueText === "Value 3") {
              cy.wrap($div).clear().type("Edited 3");
            }
        })

您也可以尝试使用eq()，但如果选择器中有更多选项的更改，它可能会失败。

cy.get('[data-component="options"] > div').eq(2).then(($div)=>{
     cy.wrap($div).contains("Value 3").clear().type("Edited 3");
 })

你也可以试试这个：

cy.get('[data-component="options"] > div').contains("Value 3").clear().type("Edited 3");

【讨论】：

【解决方案2】：

我认为这会起作用。试试这个代码：

cy.get('[data-component="options"] > div').invoke('show').eq(2).then(($div)=>{
 cy.wrap($div).contains("Value 3").clear().type("Edited 3");
 })

【讨论】：