WordPressコアがE2Eテスト導入へ – Capital P

makeブログにE2Eテスト導入のプロポーザルが発表された。これまでWordPressコアはJestによるテストのサンプルコードしか持たなかったが、本格的なE2Eテストの導入に向けて動き出すようだ。採用されるのはGutenbergプロジェクトで生まれたJest+Puppeteerベースの@wordpress/e2e-test-utilsだと思われる。

E2E（エンド・トゥー・エンド）テストとは？

コードのテストには色々あるが、WordPressではPHPUnitによる自動テストが導入されてきた。テストは結構な量に及び、Ajaxでの動作を確認するための結合テストもPHPUnitを拡張する形で大量に書かれている。

このユニットテスト（および結合テスト）は低レベルでのコードの信頼性を高めるのには役立つが、昨今のJSフレームワークゴリゴリの管理画面で発生する問題には対処しづらい。そこで、E2Eテストと呼ばれるシナリオベースの手法が取られ、ブラウザ上での動作を再現して問題が発生したかどうかをチェックすることができる。

E2Eテストの多くはヘッドレスブラウザと呼ばれるブラウザをコマンドライン経由で動かして実際の操作をエミュレートする。

const puppeteer = require('puppeteer');

(async () => {
  const browser = await puppeteer.launch();
  const page = await browser.newPage();
  await page.goto('https://example.com');
  await page.screenshot({path: 'example.png'});

  await browser.close();
})();

上記はPuppeteerのサンプルコードで「ブラウザを開いてページを開き、スクリーンショットを取る」というテストを行っている。WordPressであれば、投稿編集画面で公開時間を未来に設定した場合に公開ボタンは「予約公開」になるか、といったテストが導入されるのだろう。