as_test

テスト ID

WAIC-TEST-0052-02

テストのタイトル

エラーフィールドを示すために aria-invalid を使用する

テストの目的

フォーム入力フィールドに対して、JavaScript によって aria-invalid 属性と aria-labelledby 属性が同時に追加された際、スクリーンリーダーがそれらを認識し、通知するるかどうかを確認する。

テストの対象となる達成基準 (複数)

3.3.1

関連する達成方法 (複数)

ARIA21

テストコード (テストファイルへのリンク)

WAIC-CODE-0052-02

テストコードのソース (抜粋)

emailInput.setAttribute('aria-invalid', 'true');
emailInput.setAttribute('aria-describedby', errorId);
emailInput.classList.add('error');

テスト手順と期待される結果 (視覚閲覧環境)

テスト手順

テスト不要

期待される結果

なし

テスト実施時の注意点 (視覚閲覧環境)

なし

テスト手順と期待される結果 (音声閲覧環境)

テスト手順 1

1. テストファイルを開き、入力フィールドに何も入力せずに送信ボタンを押す
2. 入力フィールドにフォーカスを移す

期待される結果 1

入力フィールドにフォーカスを移した際、入力されているデータが適切でない旨がなんらかの手段によって通知される。かつ、「エラー: データが入力されていません」という説明文をなんらかの手段によって知ることができる

テスト手順 2

1. 入力フィールドに”@”を含まない文字列 (たとえば “example.com” ) を入力する
2. 送信ボタンを押す
3. 入力フィールドにフォーカスを移す

期待される結果 2

入力フィールドにフォーカスを移した際、入力されているデータが適切でない旨がなんらかの手段によって通知される。かつ、「エラー: データの形式が正しくありません」という説明文をなんらかの手段によって知ることができる

テスト実施時の注意点 (音声閲覧環境)

「無効なデータ」などと読み上げられる場合がある

関連する要素や属性

input要素、aria-invalid属性、aria-describedby属性