如何使用量角器单击具有几乎相同类的按钮？答案

【问题标题】：How to click at button with almost same class using Protractor?如何使用量角器单击具有几乎相同类的按钮？
【发布时间】：2018-08-10 00:01:11
【问题描述】：

我有几个按钮有两个类：

<button _ngcontent-c39="" class="btn btn-block"></button>
<button _ngcontent-c39="" class="btn btn-block btn-primary"></button>

我需要点击类 "btn btn-block" 的所有按钮，并且不想点击类 "btn btn-block btn-primary" 的按钮。我已经试过了：

element.all(by.css('.btn.btn-block')).click();

但是量角器点击这两个按钮。我已经尝试过使用 className 定位器，但量角器没有找到该元素。

element.all(by.className('.btn.btn-block)).click();

【问题讨论】：

它们的父元素是否不同？您可以将它们作为父母的孩子来引用
不，他们的父母是一样的
我认为 $('button[class="btn btn-block"]') 应该可以工作。但是我没有时间测试它。
它做到了！谢谢。
太棒了！我为你感到高兴。

标签： typescript protractor e2e-testing

【解决方案1】：

我能想到的最简洁的方法是进行正则表达式检查。

element(by.all('.btn-block')).each(function(element)
{
  let tmp = element.getAttribute('class');
  if(/^btn btn-block$/.test(tmp)) element.click();
}

基本上，这将遍历具有.btn-block 类的每个元素，然后检查以确保它具有完全btn btn-block，如果是，则单击该元素。

【讨论】：

【解决方案2】：

只需使用each() 方法并单击每个不包含btn-primary 类的按钮。

var allButtons = element.all(by.css('.btn.btn-block'));
allButtons.each((button) => {
    button.getAttribute('class').then((buttonClass) => {
        if (!buttonClass.includes('btn-primary')) {
            button.click();
        }
    });
})

【讨论】：

由于某种原因，量角器返回此解决方案不可见的元素
应用程序是如何工作的？点击后元素会消失吗？
不，它只是改变它的类。我已经找到了解决方案： element.all('button[class="btn btn-block"]').each(function(element){ element.click(); });

【解决方案3】：

我用过：

element.all('button[class="btn btn-block"]').each(function(element){
element.click();
});

并且工作了。

【讨论】：