相关疑难解决方法(0)

如果您使用的是材料形式,请在Angular中使用cypress进行选择

我有一个看起来像这样的表格:

<form class="col s12" materialize [formGroup]="newUserForm">
...
    <div class="row">
    <div class="input-field col m4 s12">
        <select formControlName="genderBound" materialize="material_select" id="gender" name="test">
            <option value="" disabled selected name="chooseGender">Choose gender</option>
            <option *ngFor="let gender of genders">{{gender}}</option>
        </select>
        <label for="gender">Gender</label>
    </div>
...
Run Code Online (Sandbox Code Playgroud)

当我尝试使用cypress选择下拉菜单时,它告诉我它不可见。当我遵循赛普拉斯提供的解释性URL时,它建议我{force: true}在单击内使用。这允许我的测试通过,但实际上似乎从未选择过这些项目。

我还遵循此处提供的解决方案,并在实际选项上实现了jQuery单击(请注意,我的select和option标记不是md-select和md-option标记)

cypress目录中的sample.spec.js:

...
it('signs up a new user', () =>{
    cy.get('button[id=new-account-button]').click();
    cy.get('input[id=affiliation]').type(affiliation);
    cy.get('input[id=password]').type(pass);
    cy.get('input[id=userName]').type(name);
    cy.get('input[id=email]').type(email);

    //Now the options
    cy.get('[name="chooseGender"]').click({force: true});
    cy.get('option').contains("Female").then(option =>{
      cy.wrap(option).contains("Female");
      option[0].click();
    });
...
Run Code Online (Sandbox Code Playgroud)

我想有两件事我不太了解:

  1. 为什么没有真正选择一个选项?
  2. 尽管如此,为什么测试仍通过?

我在下面提供了我的确切问题的回购协议:

git clone https://github.com/Atticus29/dataJitsu.git
cd dataJitsu
git checkout cypress-SO
Run Code Online (Sandbox Code Playgroud)

在/ …

angular-material angular cypress

4
推荐指数
2
解决办法
2388
查看次数

标签 统计

angular ×1

angular-material ×1

cypress ×1