{ "schemaVersion": "pack-artifacts/v0", "artifact": "training", "stage": "final", "attemptId": "attempt-job-01M381XCB1AZR8F868BPMGKA52-7108bd34-b05a-4051-8327-eab88df9e8b0", "body": { "source": "catalog/training.yaml", "facilitationGuide": { "overview": "解答表と参加者の finding を突き合わせ、1 finding あたり6軸のルーブリック\n(観測・再現性/ユーザー影響/原因と影響範囲/根拠・検証手段/修正/基準マッピング)で\n採点する。WCAG 番号の一致は1点に抑え、原因の特定と影響範囲の把握、修正の妥当性を\n重視する(docs/a11y-training-design-v0.3.1.md §8.3)。\n", "timeboxMinutes": 60, "steps": [ { "title": "観測・再現性の確認", "description": "finding に書かれた操作手順で症状が再現できるかを解答表の再現手順と\n突き合わせて確認する(ルーブリック①)。\n" }, { "title": "ユーザー影響の確認", "description": "申請・承認タスクで誰が何をできなくなるかを finding が説明できているかを\n確認する(ルーブリック②)。\n" }, { "title": "原因と影響範囲の確認", "description": "instance か component 実装かを特定し、他画面への伝播を finding が\n捉えられているかを確認する(ルーブリック③)。\n" }, { "title": "根拠・検証手段の確認", "description": "検証環境・手順・支援技術・期待/実際の証拠が十分かを確認する\n(ルーブリック④)。\n" }, { "title": "修正方針の確認", "description": "症状への ARIA 追加ではなく原因を直す修正になっているか、他 instance への\nregression が考慮されているかを確認する(ルーブリック⑤)。\n" }, { "title": "基準マッピングの確認", "description": "WCAG 等への対応づけが妥当かを確認する。ただし配点は1点に留め、\n③⑤の評価を優先する(ルーブリック⑥)。\n" } ] }, "familyPoints": [ { "family": "keyboard-focus", "discussionPoints": [ "dialog-no-focus-return: キャンセルで閉じた後のフォーカス想定(spec 5.5)は\n明記されているが、確定で閉じた後の挙動は仕様未定義であり、fault として\n成立するのはキャンセル経路のみである(catalog/faults.yaml notes)。\n", "error-summary-not-focused: spec 6章への違反ではあるが WCAG の特定達成基準の\n失敗と断定できない指摘であり、ルーブリック⑥(基準マッピング)の配点が\n1点に留まる理由の実演になる(catalog/faults.yaml notes)。\n", "outline-none-global: composed gate の toBeFocused によるプログラム的観測は\ndialog-no-focus-return の欠陥を塞がないが、フォーカスインジケーターが\n消えていることで参加者の目視発見が難しくなる、gate と人間の観測の\nズレがある(catalog/faults.yaml notes)。\n" ], "commonMisreadings": [ "outline-none-global を「各ボタンにフォーカススタイルがない」と部品ごとの\n指摘に分解してしまい、リセット CSS 1 箇所という原因に集約できない。\n", "dialog-no-focus-return を確定(承認・取り下げ)で閉じた経路でも指摘する。\n確定後のフォーカス先は spec 未定義なので、その指摘は fault ではない。\n", "error-summary-not-focused に無理に WCAG 番号(2.4.3 や 3.3.1)を当てて\nしまう。spec 違反として番号なしで書くのが正しい。\n", "dialog-background-operable を「aria-modal がない」という属性の欠落だけで\n指摘し、実際に Tab で背後へ到達できるという観測を伴わない。\n" ] }, { "family": "name-label", "discussionPoints": [ "rowmenu-trigger-no-name: コンポーネント自体(MenuButton)は正しく実装されており、\n承認一覧側の呼び出しで label prop を渡し忘れたという利用側の問題である。\n同じ部品でも申請一覧側は問題がない、という instance 単位の fault である\n(catalog/faults.yaml notes)。\n", "datatable-row-checkbox-no-name: rowmenu-trigger-no-name と症状(名前がない)は同じだが、\n原因は部品(DataTable)側にある。修正先が利用側か部品側かで影響範囲が変わることを、\nrowmenu と対比して整理する。\n", "login-email-autocomplete-missing: 名前(label)も関連付けも正しいのに、入力目的\n(autocomplete)だけが欠けている。「名前がある = 1.3.5 を満たす」ではないこと、\n自動検査(axe autocomplete-valid)は欠落を検出しないことを確認する。\n", "submit-button-name-mismatch: 名前は「ある」が可視ラベルと一致しない型。\nrowmenu-trigger-no-name(名前が無い)/ amount-label-not-associated(関連付けが無い)\nと並べ、自動検査(button-name)が通っても 2.5.3 は満たさないことを確認する。\n", "amount-error-no-suggestion: 関連付け(field-errors-not-associated)やフォーカス\n(error-summary-not-focused)は正しいのに、文言の内容だけが欠陥。3.3.1(存在と場所)と\n3.3.3(直し方)を分けて評価できているか、spec 6 章の文言仕様を根拠に指摘できているかを見る。\n", "error-messages-generic: 関連付け(field-errors-not-associated)もフォーカス\n(error-summary-not-focused)も正しく、自動検査にも出ない。文言を読んで初めて\n分かる欠陥を、受講者が読み上げ確認や目視で拾えているかを見る。\n" ], "commonMisreadings": [ "rowmenu-trigger-no-name を MenuButton コンポーネントの欠陥として報告する。\n申請一覧では正しく動いているため、承認一覧側の呼び出しの問題と\n切り分けられていない。\n", "amount-label-not-associated の修正として aria-label を入力要素に足す。\n可視ラベルが既にあるので for/id の関連付けが原因への修正であり、\naria-label 追加は二重管理を生む。\n", "field-errors-not-associated を「エラーメッセージが表示されない」と\n誤読する。視覚的には表示されており、フィールドとの関連付けの欠落が問題。\n", "datatable-row-checkbox-no-name を承認待ち一覧の実装(利用側)の問題として報告する。\nDataTable の行チェックボックスの設計欠陥であり、選択列を使う画面すべてに伝播する。\n", "login-email-autocomplete-missing の修正として autocomplete=\"email\" を提案する。\nログイン ID の欄は username トークンが正しく(clean base と同じ)、email は\n連絡先メールアドレス欄用。\n", "submit-button-name-mismatch を「aria-label があるので名前は問題ない」で終える。\n音声操作の利用者は可視ラベルを発話するため、accessible name が可視ラベルを\n含まないと操作できない(2.5.3)。\n", "可視ラベルを短縮しただけの名前(例: 「申請を送信」に対する「送信」)は基準の\n文言には反するが障壁としては薄く、争いになりやすい。submit-button-name-mismatch\nはそれを避け、可視ラベルと共通する語を持たない値(「確定」)にしてある。\n", "amount-error-no-suggestion を 3.3.1(エラーの特定)として報告する。要約とフィールド\n直下でエラーの存在と場所は特定できており、欠けているのは修正方法の提案(3.3.3)。\n", "error-messages-generic を 3.3.3(修正方法の提案)として報告する。3.3.3 は\n「エラーの内容は分かるが直し方が示されない」場合。ここでは何が誤りか自体が\n示されていないので 3.3.1 を当てる。\n" ] }, { "family": "state-announcement", "discussionPoints": [ "combobox-async-status-silent: fault はコンポーネント型単位で仕込まれているが、\n実際に症状が現れるのは非同期モードのインスタンス(request.payee)のみであり、\n「型に当てても全インスタンスで観測できるとは限らない」(catalog/faults.yaml notes)。\n", "notification-no-live-region: 視覚的には表示されるが読み上げられず、\n申請受付・承認完了・エラー通知のすべてに影響する blast-radius 最大級の\nfault である(catalog/faults.yaml notes)。\n" ], "commonMisreadings": [ "notification-no-live-region と notification-auto-dismiss を\n「通知の問題」として 1 件にまとめてしまう。前者は読み上げられない\n(実装の欠陥)、後者は消えてしまう(設計判断の欠陥)で原因も修正責任も異なる。\n", "成功通知の自動消去をトーストの標準挙動とみなして欠陥として報告しない。\nspec 5.7 は成功・エラーとも until-dismissed(閉じるまで残る)を明示しており、\n「消えるのが普通」という思い込みで見逃されやすい。\n", "combobox-async-status-silent を全 Combobox の問題として報告する。\n症状が出るのは非同期モードのインスタンス(取引先)のみで、影響範囲の\n特定が不正確になる。\n", "datatable-sort-state-missing を「矢印アイコンに代替テキストがない」\n(1.1.1)として指摘する。列ヘッダーの状態(aria-sort)の欠落として\n捉えるのが正しい。\n", "修正方針が「aria-live を足す」で止まり、コンテナを常設して内容更新で\n通知する、という実装上の要点に触れない。\n" ] }, { "family": "visual-presentation", "discussionPoints": [ "secondary-text-low-contrast: デザインシステムのカラートークン1箇所の不足が\n全画面の補足テキストに波及する。axe で大量の違反箇所が検出されるが、\n原因はトークン1つに集約できるという原因集約の視点を確認する\n(catalog/faults.yaml notes)。\n", "rowaction-icons-undersized: 2.5.8 は「24×24 未満」だけでは失敗にならない。\n両方が小さい場合は中心どうしが 24px 以上離れているかで判定する。寸法と間隔の\n両方を測っているか、同じ行の三点リーダーが適合していること(= 部品ではなく\nこの画面の CSS が原因)に気づけているかを見る。\n", "request-input-border-low-contrast: 文字のコントラストは合格で axe も違反を出さない。\n自動チェックの結果だけで「コントラストは問題なし」と判断せず、部品の境界(1.4.11)を\n目で確かめているかを見る。エラー時の赤枠は見えるので、「エラーが出ていない状態」で\n確かめたかどうかも論点になる。\n" ], "commonMisreadings": [ "secondary-text-low-contrast を axe の出力どおり数十件の個別違反として\n列挙し、トークン 1 つに集約できない。修正方針も画面ごとの色指定に\nなりがちで、取り残しが出る。\n", "status-color-only は「ドットに aria-label が付いているから 1.1.1 は\n問題ない」で終える。実際のドットには既に role=img + aria-label が\n付いており(1.1.1 は満たしている)、それでも色覚特性のある晴眼者には\n伝わらないため 1.4.1 の失敗は解消していない。ステータス列を復元し、\nテキストで表示する必要がある。\n", "rowaction-icons-undersized を「アイコンボタンは小さいものだから仕方ない」と\n見逃す、あるいは逆に「24px 未満」だけを根拠にして間隔の例外を検討しない。\nどちらも基準の適用としては不完全。\n", "request-input-border-low-contrast を 1.4.3(文字のコントラスト)として報告する。\n文字は十分なコントラストがあり、足りないのは入力欄の境界(非テキスト、1.4.11)。\n" ] } ] } }