Selenium を使ってブラウザの操作を自動化をはじめてみる！

selenium

Spring Fest 2019 が開催されるということなので先日参加してきたのですが、そこでいろふさんが最近ではSelenium単体で使いやすくなっているという話をしていただき（確かそんな内容だったと思います）ではSelenium単体のAPIでブラウザをいじくりまわしてみようと思ったわけです。

いろふさんの発表資料はアップロードされているので誰でも見ることができます。

参考にしたサイト

私が以前までみていたSeleniumの公式サイトはみずらい印象だったのですが、（あくまでも個人の感想ですが）今は非常に見やすく整備されていました。

Selenium とは？

今までの開発でブラウザテストを自動化するときには基本的にWebDriverIOやNightWatchといったSeleniumのラッパーのフレームワークを使っていました。なので、Selenium単体でどのようなものなのか、これを機会に理解しておこうかと思います。

公式サイトをざっと読んだ感じ一言でSeleniumを表すと、代表的なブラウザのオートメーションを実現する共通のAPIを提供するライブラリ、かなと思いました。SeleniumはW3Cで定義されている WebDriver に準拠する形でブラウザをコントロールするインターフェイスを提供しており、開発者は WebDriver 経由でブラウザを操作することができます。

この WebDriver というのが Selenium では中心的な存在です。画面の要素を見つけたり、クリックしたり、ドラッグしたり、いろいろなことができますがそれらはすべてWebDriverに対する呼び出しで実現します。以下にJavadocへのURLを載せておきます。

Gradle & Kotlin の環境でセットアップしてみる

今回セットアップした環境は以下になります。

  • macOS Catalina 10.15.2
  • Gradle 6.0.1
  • Java 1.8.0_191

JavaでAPIが提供されているということはKotlinでも使用できるはず。というわけで以下の build.gradle.kts でセットアップできました。

ただ、これだけではコードがコンパイルできるようになっただけなので、ブラウザ固有の Driver というものをホストのマシンに配置します。Chromeの場合は以下のサイトから入手することができます。ダウンロードしたら /opt/WebDriver/bin に配置します。（配置する場所は自由です。公式サイトはこのパスに保存する例になっていました。）

Kotlin の公式サイトから特定のcssClassを取得し含まれるテキストを表示してみる

公式サイトの要素の取得についてのドキュメントを読んだらすんなり要素の取得と表示ができました。ちなみに下記のコードではChromeをヘッドレスモードで操作しています。ヘッドレスモードにすることでChromeのウィンドウが現れなくなるので開発やテストがしやすくなります。

 Chromeにはヘッドレスモードの他にも様々なオプションが用意されており、開発環境に応じたカスタマイズが可能です。以下のサイトでオプションがリスト形式でまとめてあります。

というわけで、意外とサクッとブラウザの操作を自動化することができました。他のAPIを使うことでクリックやフォームの入力なども簡単にできそうです。次回以降でそれらについて試していこうかと思います。また、いろふさんの発表にもありましたがDockerを使ったブラウザテストが主流になりつつあるみたいなのでそちらについても調査していきたいなと考えています。