如何检查按钮已禁用类

Question

>我有两个按钮。如果一个按钮禁用了类，则其他按钮没有。现在我想检查如果第一个按钮禁用了类，那么我需要单击第二个按钮，反之亦然。

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

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

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

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();
  }
});

Answer 2

您可以通过查询所有元素来检查元素的长度是否1，如下所示，

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

Answer 3

您可以使用ng-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