Watcherパッケージの概要
Watcherパッケージはテストスイートに統合され、アクセシビリティエラーをテストします
Watcherは、アクセシビリティテストを追加するためにテストスイートに統合するコードコンポーネントです。
Watcherのドキュメンテーション概要
ドキュメントの Watcher セクションの情報は次のとおりです:
- この記事、 概要では、Watcherパッケージ( axe Watcherとも呼ばれる)の説明があります。ここで、パッケージに関する情報や他のリソースへのリンクを見つけることができます。
- システム要件 では、Watcherを使用するために必要なソフトウェアのバージョンを概説します。
- 以下の 手順 の記事では、サポートされているテストフレームワークとWatcherの統合手順をステップバイステップで説明し、サポートされている言語の例のコードスニペットを含んでいます。この情報は、axe Developer Hubサイトでプロジェクトを作成するときに見ることができます。
- 以下のドキュメントは APIリファレンス では、Watcherパッケージがサポートしている言語に提供するAPIを詳細に記述しています。
Watcherとは何ですか?
Watcherパッケージを使用すると、既存のテストスイートにアクセシビリティテストを簡単に統合できます。利用可能なパッケージは次のとおりです:
- JavaScriptおよびTypeScript開発者向けの npmjs.com で入手可能なNode.jsパッケージ
- Maven Centralで入手可能なJavaパッケージ。
エンドツーエンドのテストスイートに統合されたWatcherパッケージは次のことを行います:
- Watcherがあなたのテストスイートに最低限のコード変更でアクセシビリティ検証を追加します。このためにWatcherが ラッピング してあなたのテストフレームワークの重要なメソッドや関数呼び出しを包みます。
- テストスイートを実行するときにウェブページを自動的に解析し、DOMに変更が検出されるとページを再解析します(各変更は別々の ページ状態と見なされます)—シングルページウェブアプリやログインページ、その他の動的コンテンツを含む複雑なサイトに最適です。
- Gitコミットとアクセシビリティ結果をリンクして、各コミットのアクセシビリティを評価し、プロジェクトの全体的なアクセシビリティの進捗状況を監視できます。
- 各ページ状態とGitコミットに関連付けられたアクセシビリティ結果をaxe Developer Hubに送信し、結果が追跡、 重複排除され、提示されます。
インストール
テストフレームワーク用の 手順 を参照して、Watcherパッケージのインストール情報を確認してください。
システム要件
Watcherのシステム要件については、 システム要件を参照してください。
axe Developer Hubサイトは広範なブラウザサポートを提供していますが、 テスト用Chrome と Chromium は Watcher パッケージによってサポートされています。このため、Cypress の デフォルトの", "context": "strong text Electron ブラウザを Watcher でのテストに使用することはできません。
API リファレンス
Watcher パッケージが提供する API のリファレンスについては、 API リファレンス", "context": "link textをご覧ください。
リリースノート
Watcher パッケージの変更についての情報は、 Watcher リリースノート", "context": "link textをご覧ください。
サンプルリポジトリ
GitHub の サンプルリポジトリ", "context": "link textでコードを試すことができます。これには、以下のための JavaScript と TypeScript のサンプルが含まれています:
- Cypress", "context": "link text
- Playwright-Test", "context": "link text
- Playwright", "context": "link text
- Puppeteer", "context": "link text
- WebdriverIO", "context": "link text
- WebdriverIO テストランナー", "context": "link text
- WebDriverJS", "context": "link text
Java Selenium のためのサンプルも含まれています:
テストスイートを変更するための手順
ドキュメントの手順セクションには、Watcher パッケージを含めるためのテストスイートの変更手順が含まれています。
これらは、axe Developer Hub で新しいプロジェクトを作成する際に表示される手順と同じです。
次のセクションには、各テストフレームワークの手順へのリンクが含まれています:
JavaScript の手順
- Cypress", "context": "link text
- Cypress コンポーネント", "context": "link text
- Playwright", "context": "link text
- Playwright テスト", "context": "link text
- Puppeteer", "context": "link text
- WebdriverIO", "context": "link text
- WebdriverIO テストランナー", "context": "link text
- WebDriverJS", "context": "link text
TypeScript の手順
- Cypress", "context": "link text
- Cypress コンポーネント", "context": "link text
- Playwright", "context": "link text
- Playwright テスト", "context": "link text
- Puppeteer", "context": "link text
- WebdriverIO", "context": "link text
- WebdriverIO テストランナー", "context": "link text
- WebDriverJS", "context": "link text
