如何在值包含時通過html屬性選擇Protractor中的元素

Question

苦苦思索如何選擇沒有標准唯一ID或類的元素。 如何使用Protractor選擇此輸入元素？

注意：我不能使用類ComboBoxInput_Default類，因為此下拉框用於其他幾個頁面元素。 對於至少10個以上的DOM級別，也沒有任何易於識別的父元素。

<div style="display:inline; white-space: nowrap;" id="ctl00_ctl31_g_b56afa08_7869_450c_8871_f6759a89d9b1_ctl00_WPQ3txtFields_ddPositioList_10_Solution_MultiComboSelection" class="ComboBox_Default">
  <input type="text" style="width: 133px; height: 15px;" delimiter=";" class="ComboBoxInput_Default" value="-select-" name="ctl00$ctl31$g_b56afa08_7869_450c_8871_f6759a89d9b1$ctl00$WPQ3txtFields_ddPositioList_10_Solution_MultiComboSelection_Input" id="ctl00_ctl31_g_b56afa08_7869_450c_8871_f6759a89d9b1_ctl00_WPQ3txtFields_ddPositioList_10_Solution_MultiComboSelection_Input" autocomplete="off">    
<div>

使每個輸入不同的唯一標識標記將附加到生成的ID， Solution_MultiComboSelection_Input的末尾。

如果我必須使用jquery獲取此元素，我將使用（不是優選的）contains $( "input[name*='Solution_MultiComboSelection_Input']" ) 。 有沒有類似的方法用Protractor以這種方式定位元素？

Answer 1

當然，使用“contains”或“ends-with”CSS選擇器：

element(by.css("input[id*=Solution_MultiComboSelection_Input]"));
element(by.css("input[id$=Solution_MultiComboSelection_Input]"));

Answer 2

如果這是使用ComboBoxInput_Default作為類的唯一元素，那么您可以使用element選擇它（by.css（'。ComboBoxInput_Default'））

這個頁面有很多選擇器的例子。

Answer 3

很難知道如果沒有看到頁面的其余部分，但我會嘗試...

$('input[value="-select-"].ComboBoxInput_Default);

或者可能

$('div.ComboBoxInput_Default input.ComboBoxInput_Default);

也就是說，最好的解決方案是在代碼中添加一個標識符。 希望這可以幫助！