WPTとは
WPT (web-platform-tests)という、ブラウザを作っている人のためのテストスイートがある。これは、ブラウザがどう動くべきかを定義している様々なWeb標準を、各ブラウザが満たしていてるかを確認するためのテストなのだが、Webサイトを作っているWebデベロッパーが新しいWebのAPIをどう使ったらいいかを調べるときにも役立つと思う。
という話を、電車で横に座っていたとある人に話したら「じゃあ、やり方を(日本語で)紹介してくださいよ。」と言われたので、簡単に紹介したい。
手軽に試す
手軽に試したければ、https://w3c-test.org 以下にある目的のテストファイルを開くといい。
例えば、Service Worker Navigation Preloadのテストであれば https://w3c-test.org/service-workers/service-worker/navigation-preload/chunked-encoding.https.html を開くと、色々と実行されて、最終的に下のように表示される。
F12またはCtrl+Shit+IでDevToolsを起動することができるので、ブレークポイントを仕掛けてページをリロードするとステップ実行していきながら挙動を確認することができる。
ローカルで試す
テストファイルを少し変更しながら挙動を試していきたいという場合は、ローカルでサーバを立てればよい。
- まず、https://github.com/w3c/web-platform-tests を手元の環境にcloneする。
-
hostsファイルを書き換える権限がある場合は、WPTのREADMEにかかれている通りに、テスト用のドメインを127.0.0.1に向くようにhostsファイルを書き換える。権限がない、もしくは面倒な場合は、config.default.jsonファイルをconfig.jsonにコピーして、ファイルを開いてcheck_subdomainsとbind_hostnameのtrueをfalseに書き換える。 -
./wpt serveでサーバーを起動。Windowsの場合はpython wpt serve。 - Chromeを
--user-data-dir=適当な空のディレクトリと--ignore-certificate-errorsの引数付きで起動する。(注意：証明書エラーを無視する設定で起動するのでこの環境はテスト以外の目的で使わないこと。) 2.でhostsファイルを書き換えなかった場合は--host-resolver-rules="MAP *.test 127.0.0.1"も追加する。 - https://web-platform.test:8443/ にアクセスし、目的のテストファイルを開く。
ChromiumのLayoutTest
WPTのプロジェクトが始まる前は、ChromiumのWebのテストはレポジトリのthird_party/WebKit/LayoutTests/に置かれていた。徐々にWPTに移行していこうという動きはあるが、一部のテストはまだ移行されずに残っている。ChromiumのLayoutTestを試してみたい場合は、Chromiumのソースをcheckoutし、third_party/WebKit/Tools/Scripts/run-blink-httpdを実行し、http://127.0.0.1:8000 にアクセスすると良い。http以外のディレクトリにあるテストファイルは直接開いて実行できる。(ちなみに、LayoutTestという名前は歴史的な理由で、レイアウト処理以外のテストも含まれている。)
どこにテストがあるか検索したい
WPTは定期的にChromiumのレポジトリのthird_party/WebKit/LayoutTests/external/wpt/と同期されているので、Chromiumのコードサーチ cs.chromium.org でChromiumのLayoutTestとWPTの両方を検索することができる。ここから使いたいAPIで検索すると、目当てのテストを見つけることができる。