如何單擊帶有量角器的單選按鈕？

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