如何单击带有量角器的单选按钮？

Question

我有一些单选按钮，我必须单击第一个按钮，但是量角器使我返回“元素不可见”。 我是否以错误的方式使用选择器？

I've trying:
element.all(by.css('ui-radiobutton-icon.ui-clickable')).first.click();

和

element.all(by.class('ui-radiobutton-icon.ui-clickable')).first.click();

的HTML

<p-dtradiobutton class="ng-star-inserted">
        <div class="ui-radiobutton ui-widget">
            <div class="ui-helper-hidden-accessible">
                <input type="radio">
            </div>
            <div class="ui-radiobutton-box ui-widget ui-radiobutton-relative ui-state-default">
                <span class="ui-radiobutton-icon ui-clickable"></span>
            </div>
        </div>
    </p-dtradiobutton>

Answer 1

您可以尝试以下吗？

element.all（by.css（'ui-radiobutton-icon.ui-clickable input'））。first.click（）;

Answer 2

您缺少一个“。” 在ui-radiobutton-icon类之前。 尝试这个：

element.all(by.css('.ui-radiobutton-icon.ui-clickable')).first.click();

Answer 3

我看到的一些错误：

1）它是first()而不是first

2） by.class('foo')应该是by.className('foo')

3）虽然不确定，但您可能要单击input元素

通常，在使用定位器时，应将它们链接起来。 尝试从页面的顶部开始，并将其链接到应该选择的元素。 为了实现可重用性，您还可以存储链接的element调用。 通常，如果可能，尝试使用element()而不是element.all() 。

对于单击单选按钮，我建议以下代码：

// start at the very top.
element(by.tagName('p-dtradiobutton'))  
 .element(by.css('.ui-radioButton .ui-helper-hidden-accessible'))
 .element(by.tagName('input')).click();

Answer 4

首先，量角器中没有browser.class这样的东西。 第二件事是您的代码中有2个错误。

代替

 element.all(by.css('ui-radiobutton-icon.ui-clickable')).first.click();

使用此代码

element.all(by.css('.ui-radiobutton-icon.ui-clickable')).first().click();

如果您错误指出元素不可点击或不可见

  var EC = protractor.ExpectedConditions;
  var element=element.all(by.css('.ui-radiobutton-icon.ui-clickable')).first();
  var isClickable = EC.elementToBeClickable(element);
  browser.wait(isClickable, 5000);
  element.click();