Question

<label class="radio inline check">

            <input class="input ng-new ng-valid" name="BookType" required="" type="radio">

            <!---->

            <!---->
            Fiction
</label>

<label class="radio inline check">   

            <input class="input ng-new ng-valid" name="BookType" required="" type="radio">

            <!---->

            <!---->
            NonFiction
</label>

<label class="radio inline check">

            <input class="input ng-new ng-valid" name="BookTypeReal" required="" type="radio">

            <!---->

            <!---->
            Fiction
</label>

<label class="radio inline check">   

            <input class="input ng-new ng-valid" name="BookTypeReal" required="" type="radio">

            <!---->

            <!---->
            Fantasy
</label>

http://www.protractortest.org/#/api?view=ElementArrayFinder.prototype.filter

如果我使用

element.all(locator).filter(filterFn)

返回的文字为空。

如何转到父元素<label>来获取文本？

label[class="radio inline check"]

返回60个元素，其中多个getText将返回相同的文本，因此它不会是唯一的。

input[name="BookType"]

返回两个元素，其中每个元素都是唯一的。

Answer 1

要点击其<input>文字为小说的<label>标记，<input>标记的名称为 BookType ，您可以使用以下xpath：

"//label[@class='radio inline check' and contains(normalize-space(), 'Fiction')]/input[@class='input ng-new ng-valid' and @name='BookType']"

Answer 2

您有两种选择：

如您所述，要获取父元素。为此，您可以使用xpath＆＃39; ancestor，如下所示：

.//*[@name='BookType']/ancestor::label
使用@name='BookType'
将文本作为元素的兄弟
.//*[@name='BookType']/following-sibling::text()[normalize-space()]

Answer 3

在Xpath中，如果您想要输入父项，可以使用//input[name="BookType"]/..

Answer 4

我根据网上的可用细节构建了这个框架。请试一试。

element.all(by.css('.radio inline check')).filter(function(elem){
        return elem.element(by.xpath("//*[text()[contains(.,'Fiction')]]")).getText() 
        }).then(function(filteredElements){
        filteredElements.first().element(by.css('input[name=BookType]')).click();
        });

注意：您可能会遇到一些格式问题。

Answer 5

我使用TypeScript使用以下方法：

import {by, ElementFinder} from 'protractor';

export interface ElementDescriptor {
  tag?: string;
  cssClass?: string;
}

async function matches(element: ElementFinder, parentDescription: ElementDescriptor): Promise<boolean> {
  const promises = [];
  if (parentDescription.tag) {
    promises.push(element.getTagName());
  }
  if (parentDescription.cssClass) {
    promises.push(element.getAttribute('class'));
  }

  let i = 0;
  const results: string[] = await Promise.all(promises);

  return (!parentDescription.tag || results[i++] === parentDescription.tag)
    && (!parentDescription.cssClass || results[i++].split(' ').includes(parentDescription.cssClass));
}

export async function findParent(element: ElementFinder, parentDescription: ElementDescriptor): Promise<ElementFinder> {
  let parent: ElementFinder;
  do {
    parent = element.element(by.xpath('..'));
  } while ((await parent.getTagName()) !== 'html' && !(await matches(parent, parentDescription)));
  return parent;
}

量角器找到父元素

5 个答案: