人形：テキストのある要素をクリックしてください

Question

テキスト付きの要素をクリックする方法はありますか（APIでは見つかりませんでしたか）例えば

私はhtmlの持っている：

<div class="elements"> 
    <button>Button text</button> 
    <a href=#>Href text</a> 
    <div>Div text</div> 
</div> 

をなど、私は、（.elements内側のボタンをクリックしてください）テキストがラップされている要素をクリックします：

Page.click('Button text', '.elements') 

任意のソリューション？

Answer 1

最初のことと簡単な方法は、ボタンにIDを追加して、正しいボタンをクリックすることです。

let my_button = await page.$eval(".elements > button", btn => btn.textContent); 

if(my_button == "Button text") { 
    await page.click(".elements > button"); 
} 

同じクラス「.elements」でより多くのdiv要素が存在しない場合はちょうど別のを使用し、その場合には、チェック：

この場合、私は人形遣いと条件の二つの機能を使用します。特定のセレクター。私はクリーナーソリューションがあると確信しているだけでなく、私は人形を使用して新しいです。

Answer 2

クリックするとテキストを指定する必要はありません。アクションpage.click（）はセレクタを検索し、その中央をクリックします。そのクラスでアクセスできない場合は、開発者ツールの要素を右クリックし、[コピー]> [コピーセレクタ]を選択してください。

await page.click('.elements'); 

は十分なはずです。この場合

。それでも問題が解決しない場合は、「ボタン」オプションを追加してください。それはまれに私を助け：

await page.click('.elements', {button: 'left'}); 

Answer 3

それはpage.$$(selector)とフィルタの特性innerTextを使用することは可能だが、それは道に沿って非常に多くの約束とはかなりトリッキーです。

私は現在の安定した（2018年1月）を使用して考えることができる最も単純なアプローチ0.13.0を解放するには、page.$$evalを使用することです：

await page.$$eval("a", as => as.find(a => a.innerText.includes("Some text")).click()); 

next releaseは、XPathのサポートが追加されますと、それははるかに簡単になります。

const linkHandler = (await page.$x("//a[contains(text(), 'Some text')]"))[0]; 
await linkHandler.click()