无法单击复选框输入元素,但可以读取其值

时间:2018-10-17 19:15:06

标签: javascript angularjs selenium selenium-webdriver protractor

在我的量角器中测试该语句

await element(by.model('publishCtrl.isPublishedInAllRegions')) .click();

说“ ElementNotVisibleError:元素不可见”失败

即使我之前添加的用于调试的断言

expect(await element(by.model('publishCtrl.isPublishedInAllRegions')).isPresent())
    .toBeTruthy();

正在工作。为什么会这样呢?另外,如果我不编写此断言,则稍后用于读取复选框值的断言也有效:

expect(await element(by.model('publishCtrl.isPublishedInAllRegions'))
        .getAttribute('value'))
 .toBeTruthy();

复选框定义及其父元素是

<label ng-transclude="" pan-form-option-type="checkbox" class="p6n-checkbox p6n-checkbox-label">
  <input type="checkbox" ng-model="publishCtrl.isPublishedInAllRegions" ng-click="publishCtrl.toggleAllRegionsSelection()" ng-required="!publishCtrl.publishedRegionsCount" class="ng-pristine ng-untouched ng-valid ng-not-empty ng-valid-required" jslog="47386;track:generic_click" aria-invalid="false">
  <span class="p6n-form-label" ng-transclude=""> All regions </span> 
</label>

3 个答案:

答案 0 :(得分:0)

在这里输入标签的高度可能为零,这实际上意味着不可见。但是它存在于DOM中,您可以进行交互。

在这里,我们必须单击包含输入标签的标签,而不是单击输入标签。

您不能单击此by.modal('modalvalue')的protactor js,这反过来将访问css定位器为[ng-model='publishCtrl.isPublishedInAllRegions']的元素。这将返回输入按钮而不是标签

要找到角度唯一的ng-modal值,我们可以这样写xpath,

  await  element(by.xpath("//a[@ng-modal='publishCtrl.isPublishedInAllRegions']/parent::label")).click()

但是我也看到ng-click仅配置为输入标记,它模拟onclick。请尝试以上建议并添加您的评论。

如果不起作用,请通过不使用javascript executor执行javascript直接单击锚点。

var element =element(by.xpath("//a[@ng-modal='publishCtrl.isPublishedInAllRegions']");
browser.executeScript("arguments[0].click()",element);

或直接使用jQuery简单

browser.executeScript("$(\"input[ng-modal='publishCtrl.isPublishedInAllRegions'])\").click()",element);

答案 1 :(得分:0)

点击单选/复选框按钮输入元素的另一种方法是使用javascript执行器。他不在乎元素是否不可点击或处于其他状态。

或者您通常可以单击包裹在输入元素内的标签/跨度元素。

这里是一个例子:

JS点击:

export async function jsClickButton(button: ElementFinder) {

    try {
        return await browser.executeScript('arguments[0].click()', button).then(async() => {
            console.log('Element has been clicked.');
        });
    } catch (error) {
        console.log('Element could not be clicked', error);
    }
}

或按常规点击(在您的情况下)。

await  element(by.xpath('//input[@ng-model=\'publishCtrl.isPublishedInAllRegions\']/following-sibling::span')).click();

答案 2 :(得分:0)

await element(by.css('input[type="checkbox"]')) .click();  

为了断言

  expect(await element(by.css('input[type="checkbox"]')).getAttribute('value').isDisplayed().then((value: boolean) =>{
    expect(value).toBe(true);
    });

希望以上答案对您有所帮助。尝试使用CSS查找元素。建议量角器。