使用css選擇器獲取兄弟網元素

Question

如何獲得button的引用？這總是我正在尋找的文本的兄弟姐妹。

在量角器測試：

let spanText = 'My text'; 
let spanRef = element(by.css('span[name=' + spanText + ']')); 

HTML：

<div> 
    <span name="My text">My text</span> 
    <button type="button"> 
    Click me! 
    </button> 
</div> 

Answer 1

可以使用adjacent sibling selector (+)：

by.css('span[name=' + spanText + '] + button') 

請注意，您可能需要添加引號包圍spanText因爲它包含一個空間。見valid identifiers

加上引號，並使用template literal語法：

by.css(`span[name="${spanText}"] + button`) 

Answer 2

也許幫助你：

Xpath的：

• //跨度[@名稱= '我的文字']/following-sibling :: button
• // span [contains（text（），'My text'）） ] /以下同胞::按鈕
• // DIV [跨度[@名稱= '我的文字'] /按鈕

CSS：

• 跨度[名稱='我的文本'] +按鈕