ウェブブラウザを自動操作する際には、WebDriverやChrome DevTools Protocol (CDP) などのAPIが広く利用されています。 これらのAPIを基盤に構築された様々なブラウザ自動操作フレームワークが、テスト自動化の分野で重要な役割を果たしています。 例えば、SeleniumやPlaywrightといったフレームワークを利用して、テストの自動化に取り組まれている方もいらっしゃると思います。 私もテスト自動化フレームワークの便利さを享受する一方で、フレームワークを介さずにブラウザを自動操作する方法についての興味がわいてきました。 そこで、この記事ではWebDriverやCDPが提供するAPIを直接利用してブラウザを操作する方法を基礎から探求してみることにしました。 これにより、私たちが普段利用しているフレームワークの背後にある原理を理解し、より深い知見を得ることを目

ウェブアプリケーションの開発においてE2Eテストの自動化は身近なトピックです。SeleniumやPuppetter、PlaywrightやAppiumなどがブラウザ・ネイティブアプリの自動操作のOSSとしてよく挙げられます。しかし、それらの裏側はご存知でしょうか？ 本トークではこれらのツールの背後…

私は普段SeleniumでGUIの自動テストをもにょもにょと書いているのですが、assertThatを使っていると期待値と実際の値が異なったときに、そこでテストケースの実行が止まってしまうので困るときがあります。 たとえば画面上の項目が２０くらいあって、全部を期待結果と比較したいとき。期待値と異なる部分は全部一度に知りたいのですが、assertThatを使うとFailした時点で止まってしまい、その先にあるFailが見つけられません。 そんなときは、ErrorCollectorを使いましょう。 ErrorCollector org.junit.rules.ErrorCollectorクラスを使うと、アサーションが失敗した場合でもテストの実行を継続することができます。 サンプルを用意しました。 package Example.example; import static org.hamcres

Web技術の標準を策定するWorld Wide Web Consortium（W3C）のBrowser Testing and Toolsワーキンググループは、「WebDriver」が6月5日付けで勧告に到達したことを発表しました。 WebDriverは、Webブラウザを外部から操作することを可能にし、Webアプリケーションのテストなどの自動化を実現する技術です。 主要なWebブラウザにはすでにこのWebDriverの機能が用意されています。Seleniumに代表されるWebブラウザ自動化ライブラリを利用することで、WebDriverを用いてWebアプリケーションのUIテストなどを自動化することが可能です。 SeleniumからW3Cへ もともとWebブラウザには外部から操作を行うAPIなどはなく、WebページやWebアプリケーションをWebブラウザで表示した際に画面が正常に表示されている

Google Chromeでページ全体のスクリーンショットを撮影できない Selenium WebDriverではスクリーンショットを撮影する際、ブラウザによって挙動が異なります。 具体的に、Firefoxではページ全体が撮影される一方で、Google Chromeではウィンドウ内の視認できる範囲のみ撮影されます。 このことは公式ドキュメントにも記述されており、ブラウザの仕様に引っ張られている様子。 上記の問題を解決するのがJava製Selenium WebDriverスクリーンショットユーティリティ「aShot」です。 この記事では「aShot」の使い方を簡単に紹介します。 WebDriverスクリーンショットユーティリティ「aShot」 WebDriver Screenshot utility. Take screenshots, crop, prettify, compare htt

こんにちは、フロントエンドエンジニアのいなばです。 8月より自社開発チームに異動となり、最近はLIGブログの改善に勤しんでいます。 Webサイトも長く運用されるとどうしてもCSSが負債になってしまいがちですね。 負債返却のために安心してコードを綺麗にしていきたいのですが、修正が思わぬ場所で影響を起こしてしまってCSSが壊れていてもなかなか気づきづらいものです。 今回は、目視での確認漏れを少し楽にするべく、WebdriverIOを使ってスクリーンショットを撮るサンプルを作ってみました。(検証してないのでWindowsをお使いの方は動かなかったらごめんなさい。) WebdriverIOの導入 事前にNode.jsのインストールとJava7（jdk7）以上がインストール（確認方法はこちら）されている必要があります。 リポジトリのクローン後、npmの依存モジュールのインストールが済めば、Webdr

前回→Selenium WebDriverで実践的テストケースを作成する（Java編） 皆さんこんにちは。 最近は家事もこなす在宅ワーカーとして活動している中野です。 前回に引き続き、今回もseleniumを取り上げます。 「Selenium WebDriver」は複数のスクリプトで実行が可能ですが、 今回はnode.jsを使ってみます。 環境設定 (1)node.jsのインストール https://nodejs.org/en/download/ ローカルのマシンにあわせて、適切なインストーラをダウンロードして下さい。 ターミナルで $ node -v と入力して、バージョンが表示されれば成功です。 (2)selenium webdriverのインストール $ npm -g install selenium-webdriver （macの場合、事前にxcodeをインストールしておく必要があ

Deleted articles cannot be recovered. Draft of this article would be also deleted. Are you sure you want to delete this article?

Selenium-webdriver(JavaScript／Node.js)インストールメモ.md Selenium-webdriverインストールメモ 1. Selenium Server のインストール Homebrew経由 $ brew update $ brew install selenium-server-standalone 手動インストール http://www.seleniumhq.org/download/からダウンロード 任意の場所に移す 2. 各種ドライバのインストール SeleniumServer標準ではFirefoxとSafariに対応済み それ以外(IEとかChrome)にはドライバが必要 http://www.seleniumhq.org/download/からダウンロード Selenium-serverをHomeBrew経由でインストールした場合は/usr

Webアプリケーションを開発する際、みなさんはどのようにテストを行っていますか？　Webアプリケーションは、ユーザーごとに異なるブラウザを使用しており、ユーザー操作も必要となるため、手作業でテストをされている方も多いと思います。また、機能改修やバグフィクス後に、リグレッションテスト（改修により既存機能への影響がないかを確認する回帰テスト）が必要となりますが、時間が取れずしっかりとテストができていない方も多いのではないでしょうか。 本記事では、これらのテストを自動化することのできる「Selenium Webdriver」（セレニウム ウェブドライバー）について紹介します。 入力フォームのバリデーション機能をチェックするデモ 簡単な入力フォームのバリデーション機能をチェックするデモを動画で紹介しましょう。入力値に対して期待するエラー文言が表示されているかのテストを実施しています。Seleniu

前編の「iPhone／Android含むブラウザ自動テストの最終兵器Selenium WebDriverとは」では、Selenium WebDriverの概要とサンプルを動かす上での前提環境と実装方法の概要を説明しました。ここからは、サンプルアプリケーションとテストケースについて説明します。 本稿でのテスト対象とするWebサイトとして、従業員の情報を管理するサンプルWebサイトを用意しました。Webサイトのサンプルは下記のリンクからダウンロードできます。ファイルは通常のwarファイルなので、実行環境のWebサーバに展開すると使用可能になります。 warファイルへのリンク また、サンプルコードのWebサイトをEclipseにプロジェクトとしてインポートする場合は、下記ファイルを使用します。 プロジェクトのzipファイルへのリンク サンプルWebサイトの概要 ダウンロードしたテスト対象のWeb

最近仕事でSeleniumに手を出していて、Selenium2.0以降のAPIを使用している。 ところが、2.0以降についての情報が少なく、こんなことするにはどうすれば？みたいなことを調べると大抵旧バージョンだったりするので、2.xでのコードのサンプルのようなものをメモとして書いてみる。 また職場のブラウザがIE6だったりするので、Selenium IDEはほとんど使ってません。 言語はJavaメインなので、他の言語やブラウザでは使えないかもしれません。 また、旧バージョンのSelenium1.xに触ったことはありません。 導入 ここからダウンロードする。 1.xでは、Selenium-RCと呼ばれていた、各言語のAPIは、WebDriverという名称に変わっているので、 各言語向けのWebDriverをダウンロードして、展開してクラスパスを通せば完了。 ただし、どのWebDriverを使

この記事では、Facebook のあいさつ(Poke)機能への返信を題材に、沢山たまるとウザい嬉しいあいさつを自動で返すスクリプトを書くことで、Selenium2.x の使い方、特に Ajax アプリをテストする方法について学べるようにする。 Ajax がからんだWebアプリケーションのエンドツーエンドの最近のテスト手法についてのまとめにもなっていると思う。 最初の3節ぐらいは「Seleniumとは〜」とか「テストってのはさー」とかゴタクをごたごた書いているので、Seleniumの実際のコード見た方がはえぇよ。って言う人はコードが出てくるまで記事を飛ばすと良い。 こんな記事を気合入れて書いて公開した当日に…FacebookのUIが変わって…作ってたスクリプト動かなくなってしまった…orz。俺が何かやったり買うと事件が起きるんや・・「なにか買うとその直後に安くなったり、新機種がでたりするとい

概要 某ベンダ系アジャイルコミュニティの合宿で Selenium を使ったテストをやってみたので、 復習がてら Windows XP SP3上でタイトルのことをやってみたりする。 テストの内容 ログイン チケット作成 チケット一覧で作成したチケットを確認 ログアウト まで。 構成 redmine <--> firefox(IE) <--> selenium(webdriver) <--> test::unit こんな感じ？ selenium と webdriver のところが怪しい。 なぜ Selenium(WebDriver) なの？ なんで WebDriver なの？という説明が Selenium 2.0 と WebDriver — Selenium 日本語ドキュメント にあった。 Mult-browser testing including improved functionalit

AndroidプログラミングのTOPへ これはWebアプリ開発者にとっても，モバイルアプリ開発者にとっても朗報である。 下図は，「Webアプリ + モバイルアプリの，自動テストツールの技術動向」を表す。 ┌─── Webの自動テスト────┐ ┌モバイルの自動テスト┐ ｜ ｜ ｜ ｜ ｜ Selenium WebDriver ｜ ｜Robotium─→Sirocco ｜ ｜ (2004, (2009, Google)｜ ｜ (2010) (2010) ｜ ｜ ThoughtWorks) ｜ ｜ ｜ ｜ ｜ ｜ ｜ ｜ └────────┐ ｜ ｜ ｜ ｜ ｜ ｜ ｜ ｜ ｜ ｜ ｜ ｜ ｜ ｜ ｜ ｜ ↓ ↓ ｜ ｜ ↓ ｜ ｜ Selenium WebDriver ｜ ｜ NativeDriver ｜ ｜ (＝Selenium 2.0, 2011/07〜) ｜ ｜ (Google, 20

WebアプリケーションのテストにSeleniumを使っていますが、少し前になりますがSelenium 2が正式にリリースされたので試しています。Selenium 2は、WebDriverベースとなりアーキテクチャ的にも大きく変更されています。Selenium RCで使用していたSeleniumServerは不要になっています。JUnitから使用する場合には、 Selenium 2.0 and WebDriver ― Selenium Documentation このドキュメントにあるとおりMavenのdependencyにselenium-javaを追加し、 <dependency> <groupId>org.seleniumhq.selenium</groupId> <artifactId>selenium-java</artifactId> <version>2.5.0</versio

Seleniumとは Seleniumとは、Webアプリケーションのテストを自動化するためのフレームワークです。Seleniumが提供するコマンドやAPIを用いることで、実際にWebブラウザを動かしながらWebアプリケーションの動作を検証することができます。これにより、従来手動で行っていたWebアプリケーションにおける回帰テストの多くを自動化することが可能になります。 Selenium 2（Selenium WebDriver）とは Selenium 2は、先月の8日に正式版がリリースされた、Seleniumプロジェクトの新しいプロダクトです。Selenium 2の最大の特徴は、やはりWebDriverとの統合でしょう。これについては、WebDriverの開発者であるSimon Stewart氏の話も含めた詳しい内容が以下の記事に載っているので、そちらを参照してください。 Selenium

以前から気になっていた Selenium WebDriver を使ってWebアプリの自動テストを試してみたので忘れないうちにメモ。 WebDriverに惹かれたのは以下の理由 ブラウザの操作がJavaで簡単に書ける（学習コストが低い） 記述するコードが簡潔で分かりやすい（コードのメンテナンスがしやすい） JUnitからも実行できる（Jenkinsから実行して自動化したり） ブラウザのスクリーンショットが撮れる（エビデンス作成） 導入準備 ここから Selenium Client Drivers(Java) をダウンロードしてjarにクラスパスを通すだけ。 Mavenを利用する場合、pom.xmlに selenium-java を追加するだけでOKです。 ブラウザ操作の機能のみを利用するだけなら selenium-htmlunit-driver は不要なのでexclusionを指定しておくと