cypress - 为什么 Cypress.io 使用字符串断言类型选择器，有哪些替代方案？

Question

我需要一个 e2e 测试工具，在我尝试过的工具中，我认为 Cypress.io 似乎是最好的。

我不明白的是为什么他们在 should() 子句中使用像这样的字符串选择器(我需要我们的测试人员尽可能轻松，而且我不认为容易出错的字符串是正确的选择) :

cy.get('.trigger-input-range')
  .invoke('val', 25)
  .trigger('change')
  .get('input[type=range]').siblings('p')
  .should('have.text', '25')

我已经能够成功地使用这样的东西:

cy.get('.trigger-input-range')
  .invoke('val', 25)
  .trigger('change')
  .get('input[type=range]').siblings('p')
  .should((e) => {
    expect(e).to.have.text('25')
  });

这至少给了我一些安全性，IDE 提供了一些选项，如“have.text”、“have.value”(我计划使用 Typescript 进行这些测试，所以欢迎任何可能有帮助的建议。这有一些副作用？如果没有，我不明白它们使用那些字符串选择器。

还有其他选择吗？我可以以某种方式修改 Cypress 以获得这样的东西吗？

cy.get('.trigger-input-range')
  .invoke('val', 25)
  .trigger('change')
  .get('input[type=range]').siblings('p')
  .shouldHaveText('25')
  .shouldHaveValue('25');

Answer 1

.should('have.text', '25');

类似于:

.should(elem => {
    expect(elem).to.have.text('25');
});

它们只是做同一件事的两种方式。较短的一个是使用 Chai assertion 的内联方式。从较长的一个开始，但会产生相同的结果。

如果您想要像 .shouldHaveText('25') 这样的命令，您应该可以通过创建自己的 custom command 来获取它。 :

Cypress.Commands.add('shouldHaveText', {
  prevSubject: true
}, (subject, expectedText) => {
    // Wrap the subject and use .should() to take advantage of automatic retries
    cy.wrap(subject).should((elem) => {
        expect(elem).to.have.text(expectedText);
    });
});

用法:

cy.get('.someClass').shouldHaveText('25');