如何通过多个文本匹配点击一个元素?

How can you click on an element by multiple text matches?

我有一些具有不同领域的卡片。文字看起来像这样。

梗犬

2 岁

姓名雷克斯

位置科罗拉多

我需要通过多条文本匹配一张卡片。所以 element(by.cssContainingText('#age', 'Age 2')) 不是很有帮助,因为我还需要 '#location' 来匹配 'Colorado'.

我试过链接 element.all(by.cssContainingText('#card','Age')).element.all(by.cssContainingText('#location', 'Colorado')) 但它似乎不起作用而且非常混乱。 最终目标是点击第一张匹配的卡片。

我还尝试创建一个与文本匹配的函数。但是,如果在第一次点击后有多个匹配项,它还会尝试点击下一个,我会得到一个陈旧的元素错误。

public clickDogCardByAgeAndLocation(age: string, location: string) {
      common.waitForElement($('dog-card'));
      $$('dog-card').each(element => {
        element.getText().then(text => {
          if (text.includes(age) && text.includes(location)) {
            console.log('CARD SUCCESS');
            element.click();
          }
        });
      });
  }

我相信有更优雅的方法可以做到这一点。 谢谢!

如果您的所有文本都在一个元素上,您可以使用 xpath 查找多个条件,如下所示:

//p[contains(text(),'I am')][contains(text(),'more elegant')][contains(text(),'do this')]

例如,匹配您的最后一行:

如果您的文本跨越多个子元素,您可以 select 通过像这样包装该标识符来显示父卡片:

//div[p[contains(text(),'I am')][contains(text(),'more elegant')][contains(text(),'do this')]]

那是 div,其中 p 包含那些文本条件。

还有xpath修饰符,可以更方便的读懂such and and or:

//p[contains(text(),'I am') and contains(text(),'more elegant')]

您可以在此页面上尝试所有这些:-)

如果您有更复杂的对象,请分享您的 html,我可以提供更定制的帮助。