如何使用赛普拉斯输入具有相同名称的多个输入实例
how to type in multiple input instances with same name using cypress
我必须使用 cypress 对 angularjs 应用程序进行端到端测试。
我有两个相同输入元素的实例。它们具有相同的 ng-model、class 和名称。我们已经获得了由应用程序动态生成的唯一 ID,每次加载页面或在不同机器上测试时,该 ID 都不会相同。
作为下面的示例,有两个同名的输入元素,但我需要在两个输入元素上显示相同的文本。当我使用以下命令时,柏树抱怨有两个同名的实例。如何在两个具有相同名称的输入元素上键入相同的文本“Hello world”?
cy.get('input[name=description]').type('Hello World')
一种尝试方法(可能不是最佳方法)是
cy.get('input[name=description]').then(els => {
[...els].forEach(el => cy.wrap(el).type('Hello World'));
});
一些笔记,
Cypress 有一个 first()
命令,所以你可以做
cy.get('input[name=description]').first().type('Hello World');
但是我没有命令 second()
.
[...els]
将 Cypress 数组转换为普通数组,因此您可以 forEach()
.
更新 - 使用 eq()
命令
如果这看起来太笨拙,请将以下自定义命令添加到 \cypress\support\command.js
Cypress.Commands.add('nth', { prevSubject: 'element' }, (els, index) => {
return cy.wrap([...els][index])
})
根据 Jennifer Shehane 的评论,使用
可以更简单地做到这一点
cy.get('input[name=description]').eq(0).type('Hello World');
cy.get('input[name=description]').eq(1).type('Hello World');
您可以选择输入的任何唯一标识符。它可以是 id,占位符等
我必须使用 cypress 对 angularjs 应用程序进行端到端测试。
我有两个相同输入元素的实例。它们具有相同的 ng-model、class 和名称。我们已经获得了由应用程序动态生成的唯一 ID,每次加载页面或在不同机器上测试时,该 ID 都不会相同。
作为下面的示例,有两个同名的输入元素,但我需要在两个输入元素上显示相同的文本。当我使用以下命令时,柏树抱怨有两个同名的实例。如何在两个具有相同名称的输入元素上键入相同的文本“Hello world”?
cy.get('input[name=description]').type('Hello World')
一种尝试方法(可能不是最佳方法)是
cy.get('input[name=description]').then(els => {
[...els].forEach(el => cy.wrap(el).type('Hello World'));
});
一些笔记,
Cypress 有一个
first()
命令,所以你可以做
cy.get('input[name=description]').first().type('Hello World');
但是我没有命令second()
.[...els]
将 Cypress 数组转换为普通数组,因此您可以forEach()
.
更新 - 使用 eq()
命令
如果这看起来太笨拙,请将以下自定义命令添加到 \cypress\support\command.js
Cypress.Commands.add('nth', { prevSubject: 'element' }, (els, index) => {
return cy.wrap([...els][index])
})
根据 Jennifer Shehane 的评论,使用
可以更简单地做到这一点cy.get('input[name=description]').eq(0).type('Hello World');
cy.get('input[name=description]').eq(1).type('Hello World');
您可以选择输入的任何唯一标识符。它可以是 id,占位符等