Skip to content

Commit 497ea4f

Browse files
quickperquickper
committed
0119-01 / SCR2のテストを追加
1 parent 91ed0f9 commit 497ea4f

File tree

4 files changed

+151
-0
lines changed

4 files changed

+151
-0
lines changed

‎WAIC-CODE/WAIC-CODE-0119-01.html‎

Lines changed: 59 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,59 @@
1+
<!DOCTYPE html>
2+
<html lang="ja">
3+
<head>
4+
<meta charset="utf-8">
5+
<title>WAIC-CODE-0119-01</title>
6+
<meta name="copyright" content="This document is licensed under a Creative Commons 4.0">
7+
<link rel="license" href="https://creativecommons.org/licenses/by/4.0/">
8+
<meta name="author" content="ウェブアクセシビリティ基盤委員会（WAIC）">
9+
<script>
10+
function updateImage(imgId, isOver) {
11+
var theImage = document.getElementById(imgId);
12+
13+
if (theImage != null) {
14+
if (isOver) {
15+
theImage.setAttribute('src', './img/WAIC-CODE-0119-01-02.png');
16+
} else {
17+
theImage.setAttribute('src', './img/WAIC-CODE-0119-01-01.png');
18+
}
19+
}
20+
}
21+
</script>
22+
</head>
23+
<body>
24+
<h1>WAIC-CODE-0119-01</h1>
25+
<p>以下のリンクにマウスオーバーするかTabキーでフォーカスし、画像の変化を確認してください</p>
26+
<a
27+
href="#"
28+
onmouseover="updateImage('link1', true);"
29+
onfocus="updateImage('link1', true);"
30+
onmouseout="updateImage('link1', false);"
31+
onblur="updateImage('link1', false);"
32+
>
33+
<img
34+
src="./img/WAIC-CODE-0119-01-01.png"
35+
alt=""
36+
id="link1"
37+
width="16"
38+
height="16"
39+
>
40+
リンク 1
41+
</a>
42+
<a
43+
href="#"
44+
onmouseover="updateImage('link2', true);"
45+
onfocus="updateImage('link2',true);"
46+
onmouseout="updateImage('link2', false);"
47+
onblur="updateImage('link2', false);"
48+
>
49+
<img
50+
src="./img/WAIC-CODE-0119-01-01.png"
51+
alt=""
52+
id="link2"
53+
width="16"
54+
height="16"
55+
>
56+
リンク 2
57+
</a>
58+
</body>
59+
</html>

‎WAIC-CODE/img/WAIC-CODE-0119-01-01.png‎

194 Bytes
Loading

‎WAIC-CODE/img/WAIC-CODE-0119-01-02.png‎

306 Bytes
Loading

‎WAIC-TEST/HTML/WAIC-TEST-0119-01.md‎

Lines changed: 92 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,92 @@
1+
# テスト ID
2+
3+
WAIC-TEST-0119-01
4+
5+
# テストのタイトル
6+
7+
キーボード及びマウスのイベントハンドラを両方とも使用する
8+
9+
# テストの目的
10+
11+
キーボードとマウスの両方のイベントハンドラを使用して、同等の処理を実行できることを確認する
12+
13+
# テストの対象となる達成基準
14+
15+
2.1.1
16+
17+
# 関連する達成方法 (複数)
18+
19+
SCR2
20+
21+
# テストコード (テストファイルへのリンク)
22+
23+
[WAIC-CODE-0119-01](https://waic.github.io/as_test/WAIC-CODE/WAIC-CODE-0119-01.html)
24+
25+
# テストコードのソース (抜粋)
26+
27+
```javascript
28+
function updateImage(imgId, isOver) {
29+
var theImage = document.getElementById(imgId);
30+
31+
if (theImage != null) {
32+
if (isOver) {
33+
theImage.setAttribute('src', './img/WAIC-CODE-0119-01-02.png');
34+
} else {
35+
theImage.setAttribute('src', './img/WAIC-CODE-0119-01-01.png');
36+
}
37+
}
38+
}
39+
```
40+
41+
```html
42+
<a
43+
href="#"
44+
onmouseover="updateImage('link1', true);"
45+
onfocus="updateImage('link1', true);"
46+
onmouseout="updateImage('link1', false);"
47+
onblur="updateImage('link1', false);"
48+
>
49+
<img
50+
src="./img/WAIC-CODE-0119-01-01.png"
51+
alt=""
52+
id="link1"
53+
width="16"
54+
height="16"
55+
>
56+
リンク 1
57+
</a>
58+
<!-- 「リンク 2」も同様 -->
59+
```
60+
61+
# テスト手順 (視覚閲覧環境)
62+
63+
1. ページを表示し、「リンク 1」内に×の画像が表示されていることを確認する
64+
2. キーボードのTabキーを使用して「リンク 1」にフォーカスし、「リンク 1」内の画像を確認する（○の画像に変化する）
65+
3. キーボードのTabキーを使用して「リンク 1」以外の要素にフォーカスし、「リンク 1」内の画像を確認する（×の画像に変化する）
66+
4. マウスカーソルを「リンク 1」の中に移動し、「リンク 1」内の画像を確認する（○の画像に変化する）
67+
5. マウスカーソルを「リンク 1」の外に移動し、「リンク 1」内の画像を確認する（×の画像に変化する）
68+
69+
# 期待される結果 (視覚閲覧環境)
70+
71+
- キーボード操作をしたとき、画像の変化が期待通りであること
72+
- マウス操作をしたとき、画像の変化が期待通りであること
73+
74+
# テスト実施時の注意点 (視覚閲覧環境)
75+
76+
- ブラウザのJavaScriptが有効になっていることを確認すること
77+
78+
# テスト手順 (音声閲覧環境)
79+
80+
なし
81+
82+
# 期待される結果 (音声閲覧環境)
83+
84+
なし
85+
86+
# テスト実施時の注意点 (音声閲覧環境)
87+
88+
なし
89+
90+
# 関連する要素や属性
91+
92+
script 要素, a・buttonなどのフォーカス可能な要素, イベントハンドラー属性

0 commit comments

Comments
 (0)