Axe DevTools for Web 用 WebDriverJS API リファレンス

This page is not available in the language you requested. You have been redirected to the English version of the page.

Link to this page copied to clipboard

@axe-devtools/webdriverjs パッケージの API リファレンス

Not for use with personal data

コンストラクタ

標準構成では、Axe DevTools のコンストラクタに渡す必要がある唯一の引数は WebDriverJS インスタンスです。元々含まれているものとは異なる axe-core バージョンやカスタムルールセットを使用する場合は、これらのオプションをコンストラクタに渡すことができます。

note

非標準のaxe-coreバージョンを選択してへの呼び出しも含みます。カスタムルールセットを使用することはできません。

Axe DevTools WebDriverJS コンストラクタ:

AxeDevToolsBuilder(driver:WebDriver, String:ruleset|Object:axe (optional))

Selenium WebDriverのインスタンスを最初の引数として渡す必要があります。2番目のオプションの引数は、ルールセットIDまたはaxeオブジェクトのいずれかです。2番目の引数を提供しない場合、@axe-devtools/script-builderカスタムルール設定ファイルを設定する必要があり、設定しないとコンストラクターが例外をスローします。

以下の例は、コンストラクタの使用方法を示しています:

// instantiate with the Section 508 rule set
const builder = new AxeDevToolsBuilder(driver, '508');

// or with a specific axe instance
const axe = require('../axe-core-2.3.0');
const builder = new AxeDevToolsBuilder(driver, axe);

カスタムルール

Axe DevTools for Webでカスタムルールを使用する方法については、CLI ガイドのカスタムルールセット生成および統合に関するガイドを参照してください。

分析

analyze()メソッドは分析を実行し、アクセシビリティスキャンの結果を返します。

analyze(): Promise<axe.AxeResults>

指定されたクライアントでデフォルトの設定を使用して分析を実行します。Promiseが返され、axe-coreによって返されるアクセシビリティの結果セットと共に解決されます。

analyzeUniversal

analyzeUniversal()メソッドは分析を実行し、Axe Universal Formatで結果を返します。既存のanalyze()メソッドは変更されません。

analyzeUniversal(): Promise<UniversalExport>

チェーンオプション

Axe DevTools のスキャンの対象範囲を設定するために2つのオプションがあります。特定の CSS スコープを含めるか除外するかを選択できます。コンストラクタ上で下記のチェーンメソッドを使用することでこれが可能です。

含める

new AxeDevToolsBuilder(driver).include('<CSS-Selector>');

分析に含める要素のリストにCSSセレクターを追加します。include()に渡されたスコープ外の要素はスキャンされません。

除外する

new AxeDevToolsBuilder(driver).exclude('<CSS-Selector>');

分析から除外する要素のリストにCSSセレクターを追加します。exclude()に渡されたスコープ外の要素のみがスキャンされます。

これらのメソッドは、以下のようにスキャン範囲をさらに絞り込むためにチェーンできます。

new AxeDevToolsBuilder(driver).include('<CSS-Selector>').exclude('<Inner-CSS-Selector>');

この例では、<CSS-Selector>内のすべての要素がスキャンされますが、<Inner-CSS-Selector>内の要素は除外されます。

ルール設定

ルール設定メソッドは標準のルール設定を上書きします。これらのメソッドを追加で呼び出すと、以前の呼び出しが上書きされます。

withRules

withRules()メソッドは指定されたルールIDのルールにのみ分析を制限します。単一のルールIDの文字列または複数のルールIDの配列を受け取ります。

これらの例では、単一のルールIDとルールIDの配列を使用するwithRulesが示されています：

//with a single rule ID
AxeDevToolsBuilder(driver).withRules('html-lang');

//with an array of rule IDs
AxeDevToolsBuilder(driver).withRules(['html-lang', 'image-alt']);

withTags

withTags()メソッドは、提供されたタグに関連付けられたルールにのみ分析を制限します。以下に示されるように、単一のタグまたは複数のタグを受け取ります：

//with a single tag
AxeDevToolsBuilder(driver).withTags('wcag2a');

//with an array of tags
AxeDevToolsBuilder(driver).withTags(['wcag2a', 'wcag2aa']);

disableRules

AxeDevToolsBuilder.disableRules(rules: RuleID[]): AxeDevToolsBuilder

disableRules()メソッドは、分析を実行する際に提供されたルールの配列をスキップします。

axe-core オプション

オプション

.options(options: Axe.RunOptions)

optionsメソッドはaxe.runが使用するオプションを指定します。withRulesおよびwithTagsへの呼び出しを含む、他の構成されたオプションを上書きします。詳細については、axe-core API ドキュメントを参照してください。

new AxeDevToolsBuilder(page).options({
  checks: { 'valid-lang': ['orcish'] }
});

構成設定

.configure(config: Axe.Spec)

configureメソッドは、分析前にルールセットを変更するためにaxe設定オブジェクトを注入します。このメソッドへの後続の呼び出しは、axe.configure()を呼び出し、設定オブジェクトを置き換えることによって前のものを無効にします。オブジェクトの構造については、axe-core API ドキュメントを参照してください。

次の例では、新しいaxe-core設定を作成し、それをAxe DevToolsに渡してスキャンに使用します：

const config = {
  checks: [Object],
  rules: [Object]
};
const results = await new AxeDevToolsBuilder(page).configure(config).analyze();

使用サービス

デフォルトでは、使用サービスは無効化され、デフォルトのURLはhttps://usage.deque.comです。

環境変数

これらの環境変数を使用して、使用サービスを構成し、報告されるイベントのプロパティを変更することができます。

名前	タイプ	上書き可能	説明
`AXE_DISTINCT_ID`	文字列	—	ログイン中のユーザーに対して同一であるUUID識別子（再生成されない限り）
`AXE_METRICS_URL`	文字列	—	REST使用エンドポイントのURL
`AXE_TRACK_USAGE`	ブール値	—	使用サービスのレポートを有効にします（デフォルトは`false`です）
`AXE_APPLICATION`	文字列	false	アクセシビリティエラーのチェックに使用されたアプリケーション
`AXE_DEV_INSTANCE`	ブール値	true	このイベントがソフトウェア開発者の行動によるものかを示します。開発またはテスト中に記録されたイベントをマークし、後で削除するのに便利です。
`AXE_DEPARTMENT`	文字列	true	組織内でのユーザーの部署
`AXE_KEYCLOAK_ID`	文字列	false	ユーザーのKeycloak ID
`AXE_LOGGED_IN`	ブール値	false	テスト対象アプリケーションにユーザーがログインしているかどうかを記録します
`AXE_ORGANIZATION`	文字列	true	ユーザーの組織
`AXE_SESSION_ID`	文字列	false	ユーザーのセッションを識別するUUID
`AXE_USER_ID`	文字列	false	特定のユーザーの名前やログインIDなどのアイデンティティ
`AXE_USER_JOB_ROLE`	文字列	false	ユーザーの役割
`AXE_USER_STATUS`	文字列	false	ユーザーに紐づけたいステータス情報

トラッキングの有効化

このメソッドを使用すると、ユーザーはデータを使用サービスに送信することを選択できます。

.enableTracking(state: boolean)

AxeDevToolsBuilder(driver).enableTracking(true)

トラッキングURLの設定

このメソッドを使用すると、使用メトリクスデータが送信される場所を変更できます。

.setTrackingUrl(url: string)

AxeDevToolsBuilder(driver).setTrackingUrl('https://foobar.biz')

識別IDの設定

このメソッドを使用すると、保存または使用される識別IDを変更できます。

.setDistinctId(distinctId: string)

AxeDevToolsBuilder(driver).setDistinctId('foobar')