Angular Cypress 如何获取具有动态 id 的元素答案

【问题标题】：Angular Cypress how to get elements which has got dynamic idsAngular Cypress 如何获取具有动态 id 的元素
【发布时间】：2021-01-22 16:26:59
【问题描述】：

我对 Cypress 的 E2E 完全陌生。我有一个动态行的表。我想在所有行中移动+选择特定列并复制粘贴一个值。

谁能帮助我如何获得动态元素。在这个例子中，我有 108 行，我想选择每行的第三列。该列必须遵循 id。在本例中，我想将值“否”更改为“是”。

<div class="wj-cell wj-alt wj-wrap editable-cell" tabindex="-1" role="gridcell" aria-required="true" id="catRatingImportManualInputRow105Col3" style="left: 610px; top: 3485px; width: 155px; height: 33px;">
    <button class="wj-btn wj-btn-glyph wj-right wj-elem-dropdown" type="button" tabindex="-1" aria-label="Toggle Dropdown" aria-expanded="false">
        <span class="wj-glyph-down"></span>
    </button>
    No
</div>

谢谢

【问题讨论】：

标签： angular cypress

【解决方案1】：

您可以使用each() 在 cypress 中循环遍历您的表。要访问第三个元素，您可以使用index value。

由于您的 id 是 catRatingImportManualInputRow105Col3 是动态的，所以我们将只使用您的 id 中静态的部分，因此您的 css 选择器应该类似于：div[id*="catRatingImportManualInputRow"]

cy.get('div[id*="catRatingImportManualInputRow"]').each(($ele, index) => {
    if (index == 2)
        //Do something with the third element
        cy.wrap($ele).click().type('Yes')
})

【讨论】：