前回は、PowerShellからMicrosoft Edgeで表示したWebページの入力フィールドに文字列を入力するサンプルを取り上げた。比較的わかりやすいサンプルだったと思う。今回は、PowerShellからチェックボックスをクリックする方法を紹介しよう。
→連載「PowerShell Core入門 - 基本コマンドの使い方」の過去回はこちらを参照。
チェックボックスやラジオボックスをPowerShellからクリックする
今回はサンプルページとして「Checkout example · Bootstrap v5.0」を使用する。
このサンプルページは、下の方に次のようなチェックボックスとラジオボックスがある。
このチェックボックスやラジオボックスをPowerShellからクリックしてみよう。
XPathを調べる
前回説明したように、操作を行うには対象となる要素を取得する必要がある。そしてそれにはXPathを使う方法が汎用的だ。Microsoft Edgeの開発者モード(メニュー:「その他のツール」→「開発者ツール」または「Ctrl」+「Shift」+「I」)を開いて、チェックボックスおよびラジオボックスの要素(input)のXPathを調べておく。
それぞれのXPathは次のようになっている。
要素 | XPath |
---|---|
Shipping address is the same as my billing address | //∗[@id="same-address"] |
Save this information for next time | //∗[@id="save-info"] |
Credit card | //∗[@id="credit"] |
Debit card | //∗[@id="debit"] |
PayPal | //∗[@id="paypal"] |
ではPowerShellから操作していこう。
PowerShellからクリックを行う
まず、PowerShell経由でMicrosoft Edgeを操作するためのMicrosoft Edge WebDriverを起動する(このスクリプトは付録として本稿の末尾に掲載している)。
PS C:\Users\daichi> webdriver_edge_start.ps1
Microsoft Edge WebDriverを起動します。
Microsoft Edge WebDriverの起動処理完了。
PS C:\Users\daichi>
Set-SeUrlコマンドレットでサンプルページ「Checkout example · Bootstrap v5.0」を開く。
PS C:\Users\daichi> Set-SeUrl -Url https://getbootstrap.jp/docs/5.0/examples/checkout/
PS C:\Users\daichi>
すると、次のような感じで指定されたWebページが表示される。
次にGet-SeElementコマンドレットで対象となるチェックボックス(input要素)を取得して、クリックを行う。クリックは「Invoke-SeClick -Element $Element -Action Click」のようにInvoke-SeClickコマンドレットで実行する。
PS C:\Users\daichi> $Element = Get-SeElement -By XPath -Value '//*[@id="same-address"]'
PS C:\Users\daichi> Invoke-SeClick -Element $Element -Action Click
PS C:\Users\daichi>
次のようにチェックボックスが選択された状態になる。
ここでもう一度Invoke-SeClickコマンドレットを実行すると、チェックボックスの選択が解除された状態になる。
PS C:\Users\daichi> Invoke-SeClick -Element $Element -Action Click
PS C:\Users\daichi>
ユーザーがマウスを使ってチェックボックスをクリックするのと同じ操作が、PowerShell経由で実行できていることがお分かりいただけただろう。
とりあえずさらにもう1回実行して、チェックボックスを選択した状態にしておく。
PS C:\Users\daichi> Invoke-SeClick -Element $Element -Action Click
PS C:\Users\daichi>
もう一つのチェックボックスを取得して、同じようにクリックを行う。
PS C:\Users\daichi> $Element = Get-SeElement -By XPath -Value '//*[@id="save-info"]'
PS C:\Users\daichi> Invoke-SeClick -Element $Element -Action Click
PS C:\Users\daichi>
次のようにこちらのチェックボックスもクリックされた状態になる。
今度はラジオボックスをクリックしてみよう。このサンプルではラジオボックスの1つ目は最初から選択されているので、2つ目のラジオボックスを取得してクリックしてみる。
PS C:\Users\daichi> $Element = Get-SeElement -By XPath -Value '//*[@id="debit"]'
PS C:\Users\daichi> Invoke-SeClick -Element $Element -Action Click
PS C:\Users\daichi>
次のように、選択されたラジオボックスが1つ目から2つ目に移動することがわかる。
同じように今度は3つ目のラジオボックスを取得してクリックする。
PS C:\Users\daichi> $Element = Get-SeElement -By XPath -Value '//*[@id="paypal"]'
PS C:\Users\daichi> Invoke-SeClick -Element $Element -Action Click
PS C:\Users\daichi>
次のように3つ目のラジオボックスが選択された状態になる。
操作が終わったら終了用のスクリプトを呼び出して、Microsoft EdgeとWebDriverを終了する。
PS C:\Users\daichi> webdriver_edge_stop.ps1
動作しているMicrosoft Edge WebDriverを終了します。
NPM(K) PM(M) WS(M) CPU(s) Id SI ProcessName
------ ----- ----- ------ -- -- -----------
23 8.29 23.89 0.03 20512 5 msedgedriver
動作しているMicrosoft Edge WebDriverの終了処理完了。
PS C:\Users\daichi>
終了用のスクリプトも付録として末尾に掲載しておくので、参考にしてもらえればと思う。