Angular - 添加 Cypress data-cy 属性

Question

我昨天才开始使用 cypress.io 和 angular，正如文档所说，我正在使用属性 data-cy 专门针对元素

<div data-cy="myelement">Hello</div>

cy.get("[data-cy=myelement]")

问题是 angular 无法识别 data-cy 属性如果我想动态绑定它

<div *ngIf="user$ | async as user" [data-cy]="user.name">Online</div> 

我是否必须创建个人指令才能动态添加该属性？或者有更好的方法吗？

Answer 1

Angular 处理 data- specially 并且您可能会在创建指令时遇到麻烦。

您应该改用属性绑定：

[attr.data-cy]="user.name"