cssSelector - Selenium WebDriverを使用してテキストでネストされた要素を選択してください

Question

テキストに基づいて要素を選択しようとしています。私が抱えている問題は、要素テキストがソースコードに複数回存在することです。私はそれを見つけるためにxpathを使っていましたが（xpathを避けようとしていますが）、それは私が働くことができるすべてです。私はdriver.findElement(By.xpath("//label[contains(text(), 'Complexity of job requires extra charge')]"));を使用していた

<ul id="Dialogs_Dialogs_ctlAcknowledgeMessage_ConditionalDecline_cblMessage" class="cbl centered d2" style="width:511px;"> 
    <li> 
     <input id="Dialogs_Dialogs_ctlAcknowledgeMessage_ConditionalDecline_cblMessage_0" name="ctl00$ctl00$Dialogs$Dialogs$ctlAcknowledgeMessage_ConditionalDecline$cblMessage$0" onclick="CannedCommentSelected(this);" value="Complexity of job requires extra charge" type="checkbox"> 
     <label for="Dialogs_Dialogs_ctlAcknowledgeMessage_ConditionalDecline_cblMessage_0">Complexity of job requires extra charge</label> 
    </li> 
    <li> 
     <input id="Dialogs_Dialogs_ctlAcknowledgeMessage_ConditionalDecline_cblMessage_1" name="ctl00$ctl00$Dialogs$Dialogs$ctlAcknowledgeMessage_ConditionalDecline$cblMessage$1" onclick="CannedCommentSelected(this);" value="Complexity of job requires extra time" type="checkbox"> 
     <label for="Dialogs_Dialogs_ctlAcknowledgeMessage_ConditionalDecline_cblMessage_1">Complexity of job requires extra time</label> 
    </li> 
    <li> 
     <input id="Dialogs_Dialogs_ctlAcknowledgeMessage_ConditionalDecline_cblMessage_2" name="ctl00$ctl00$Dialogs$Dialogs$ctlAcknowledgeMessage_ConditionalDecline$cblMessage$2" onclick="CannedCommentSelected(this);" value="Current workload requires extra time" type="checkbox"> 
     <label for="Dialogs_Dialogs_ctlAcknowledgeMessage_ConditionalDecline_cblMessage_2">Current workload requires extra time</label> 
    </li> 
    <li> 
     <input id="Dialogs_Dialogs_ctlAcknowledgeMessage_ConditionalDecline_cblMessage_3" name="ctl00$ctl00$Dialogs$Dialogs$ctlAcknowledgeMessage_ConditionalDecline$cblMessage$3" onclick="CannedCommentSelected(this);" value="Distance to property requires extra charge" type="checkbox"> 
     <label for="Dialogs_Dialogs_ctlAcknowledgeMessage_ConditionalDecline_cblMessage_3">Distance to property requires extra charge</label> 
    </li> 
</ul> 

が、私は「要素が現在表示されていないので、と相互作用することはできません」を発見するために私を導いたエラー入門：ここ

は、私が不利に働いてるhtmlです「ジョブの複雑さには追加料金が必要です」テキストのラベルが複数あります。

私はdriver.findElement(By.cssSelector("#Dialogs_Dialogs_ctlAcknowledgeMessage_ConditionalDecline_cblMessage > #Dialogs_Dialogs_ctlAcknowledgeMessage_ConditionalDecline_cblMessage_0 > label[text='Complexity of job requires extra charge']"));を試しましたが、要素を見つけようとしました。

私は間違っていますか？

私は確かにうまくいくと確信していたdriver.findElement(By.cssSelector("#Dialogs_Dialogs_ctlAcknowledgeMessage_ConditionalDecline_cblMessage > input[value='Complexity of job requires extra charge']"));を試しましたが、それもまたそれを探し出してタイムアウトします。あなたは以下のようにこれと対話するJavascriptExecutorを使用してみてください。この場合

Answer 1

： -

WebElement el = driver.findElement(By.cssSelector("input[value='Complexity of job requires extra charge']")); 

((JavascriptExecutor) driver).executeScript("arguments[0].click();",el); 

編集： -

List<WebElement> els = driver.findElements(By.cssSelector("input[value='Complexity of job requires extra charge']")); 
for(WebElement el : els) 
{ 
    if(el.isDisplayed() && el.isEnabled()) 
    { 
    el.click(); 
    } 
} 

はそれができます... :)

Answer 2

ホープ

実際に兄弟である入力の子としてラベルを検索しようとしているため、CSSが機能しませんでした。あなたはxpathにIDで親のulを見つけるように指示することもできます。

//ul[@id="Dialogs_Dialogs_ctlAcknowledgeMessage_ConditionalDecline_cblMessage"]/li/label[contains(text(), 'Complexity of job requires extra charge')] 

を、あなたがそのボックスをチェックすることができるように入力を選択する上で、実際に興味があるなら、これを試してみてください。次のXPathは動作するはず

//ul[@id="Dialogs_Dialogs_ctlAcknowledgeMessage_ConditionalDecline_cblMessage"]/li/label[contains(text(), 'Complexity of job requires extra charge')]/preceding-sibling::input 

Answer 3

をあなたはcssSelectorには二つの問題があります。

>は、直接の子に使用されるが、cblMessageとcblMessage_0で終わるIDを持つ要素は、それらの間の他の要素、及びcblMessage_0で終わるIDを持つ要素を有しているとあなたが探している要素は兄弟です。

あなたは

driver.findElement(By.cssSelector("#Dialogs_Dialogs_ctlAcknowledgeMessage_ConditionalDecline_cblMessage_0 ~ label")); 

~は兄弟を表すテキストを持つ要素を見つけるために、このcssSelectorを使用することができます。