Question

我有一个Angular应用程序，其中有一个像这样的容器：

<div id="my-container" [data-version]="version$ | async">

我已经为赛普拉斯测试专门添加了data-version属性，因此我会知道我需要进行测试的某些细微差别。

但是，我很难找到正确的方法来获取该价值。这是我尝试过的：

首先，我们将上面的行样式A和不带括号的版本B称为该版本：

<div id="my-container" data-version="version$ | async">

然后我尝试了3种Cypress：

cy.get('#my-container')
  .its('data-version') // Flavor 1
  .then((version) => {
    console.log(version);
  }

cy.get('#my-container')
  .should('have.attr', 'data-version') // Flavor 2
  .then((version) => {
    console.log(version);
  }

cy.get('#my-container')
  .invoke('attr', 'data-version') // Flavor 3
  .then((version) => {
    console.log(version);
  }

结果：

1A：赛普拉斯不愿接受
2A：赛普拉斯不屑一顾
3A：赛普拉斯不屑一顾
1B：赛普拉斯找不到属性
2B：赛普拉斯找到了文字'version $ |异步
2C：赛普拉斯找到了文字'version $ |异步

问题：有没有办法从赛普拉斯检索Angular属性？

Answer 1

Flavor B 是不可行的，表达式不会被求值，您只需绑定字符串即可。

您应使用以下语法：

[attr.data-version]="version$ | async"

已记录here

从赛普拉斯访问DOM元素的Angular属性

1 个答案: