验证 cypress 中的单选按钮是否被单击

Question

有人可以帮我检查一下 cypress 中的单选按钮是否被单击。这些单选按钮是引导程序一次，因此单选按钮的类没有变化。

这是单选按钮的完整元素：

> <input _ngcontent-ixv-c132="" type="radio" formcontrolname="gender"
> value="M" class="form-check-input ng-pristine ng-valid ng-touched"
> id="flexRadioM_0" data-testid="g-male-0">

我尝试过这种方法来记录单选按钮状态，但没有成功。

 const cb = document.querySelector('[data-testid="g-female"]');
 cy.log(cb.checked)

以前使用过下面的一个，现在这个不起作用，因为类没有根据单选按钮的单击而更改，

const maleRadioBtn = cy.get('[data-testid="g-male-0"]')
maleRadioBtn.should('have.class', 'mat-radio-button mat-accent mat-radio-checked')

Answer 1

不要存储 Cypress 查询的结果，如果某个操作导致 DOM 更改，它可能会失效。

请参阅分配返回值

反模式：
尝试使用 const、let 或 var 分配命令的返回值。

查询和断言应该像这样链接起来

cy.get('[data-testid="g-female"]').should('be.checked')

或分配给别名，如果查询无效，该别名将重新运行查询。