如何检查按钮是否已禁用 class？

Question

我有两个按钮。如果一个按钮有 class 禁用比其他没有。现在我想检查第一个按钮是否 class 禁用，而不是我需要单击第二个按钮，反之亦然。

我正在尝试使用以下代码，但每次都返回 true。禁用 class 根据条件动态添加。

if (expect(element(by.css('ul#menu [data-selector="holdInventory"]'))
.getAttribute('class')).toEqual('disabled')) {
    console.log('has class');
} else {
    console.log('has not class');
}

任何帮助将不胜感激。

Answer 1

您可以通过如下查询所有元素来检查长度为 1，

let  elements = fixture.debugElement.queryAll(By.css('ul#menu [data-selector="holdInventory"]');
expect(elements.length).toEqual(1); //////////////

Answer 2

您可以使用 ng-class 来添加 class 动态禁用

<button ng-class="{'disable' : switchDisable == '1'}"> Disable </button>
<button ng-class="{'disable' : switchDisable == '0'}"> Not Disable</button>

这里 switchDisable 是一个范围值，您可以通过单击 $scope.switchDisable = 1 之类的按钮来切换它，或者您可以根据需要使用任何其他表达式。参考：https://docs.angularjs.org/api/ng/directive/ngClass

Answer 3

在量角器中，一切都是承诺。因此，为了执行操作，您需要先解析它，然后验证 class 值。此外，您不能使用 equal，因为一个元素可以与多个 class 相关联，因此您需要改用 includes。

var btn1 = element(by.css('ul#menu [data-selector="holdInventory"]'));
btn1.getAttribute('class')).then(function(cls) {
  if(cls.includes('disabled')) {
    btn1.click();
  } else {
    btn2.click();
  }
});

如何检查按钮是否已禁用 class？

How can I check button has class disabled?

angularjs

jasmine

protractor

testcase