Question

我在tect.html文件中有此表单，我想测试按钮是否被禁用：

<button id="ref_button"....[disabled]="editForm.form.invalid || isSaving" class="btn btn-primary">

当表单数据无效时，我正在使用量角器，黄瓜和Chaidom来测试此按钮是否被禁用，因此我像这样检查其属性禁用：

  JSDOM.fromFile("file.html").then(dom => {
   dom.window.document.getElementById("ref_button").has.attr('disabled').should.be.true;
     
    });
  });

现在测试失败了，因为它总是会发现属性处于禁用状态，无论按钮是否处于禁用状态，数据是否有效。

我在做什么错了？

Answer 1

我认为按钮元素上不存在属性[disabled]（这就是为什么它始终为true）。这是您必须寻找的属性disabled（没有[和]标记。它是绑定语法。

因此，在考虑时，它应该起作用：（没有测试...）

dom.window.document.getElementById("ref_button").should.not.have.attr("disabled");

但是由于按钮确实具有该属性，所以可能始终会输出false。为了使它始终如一地工作，您应该使用disabled属性的值并检查其是否正确。

dom.window.document.getElementById("ref_button").getAttribute("disabled").toBeTruethy().

我实际上不知道chai中是否存在toBeTruethy()，但我的意思是，您应该检查属性的值，而不仅仅是检查属性是否存在。

还有另一件事要提到：

element(by.css("*[id='field_nombre']")).click();
element(by.css("*[id='field_nombre']")).sendKeys('').then(callback);

我猜想click()也是一个异步函数，在上面的示例中，密钥是在click()完成执行之前发送的。我认为这是正确的：

element(by.css("*[id='field_nombre']")).click().then(function() {
  element(by.css("*[id='field_nombre']")).sendKeys('').then(callback);
});

Answer 2

对于angularJs，您应该在HTML中使用指令ng-disabled

来自官方documentation：

因为我们不能使用插值，所以必须使用特殊指令在Disabled属性中。有关更多信息，请参见插值指南信息。

DOM中的hasAttribute无法正常工作

2 个答案: