reactjs/react-modal

Focus escapes modal when radio buttons in modal

オープン

#636 opened on 2018/03/29

GitHub で見るコントリビューターガイド
 (8 件のコメント) (11 件のリアクション) (0 人の担当者)JavaScript (828 件のフォーク)batch import
accessibilitybugeasygood first issue

Repository metrics

Stars
 (7,294 個のスター)
PR merge metrics
 (PR metrics pending)

説明

Summary:

When there are radio buttons in a modal, you can escape focus with shift-tab.

Steps to reproduce:

Steps are included in the test case below

Expected behavior:

You should not be able to escape the modal's focus

Link to example of issue:

https://codesandbox.io/s/my9vm34m68

Additional notes:

Not sure if it's related specifically to radio buttons, but that is what is causing the issue for me

コントリビューターガイド

調査方針
モーダルコンポーネントのフォーカストラップロジックを調査します。おそらく 'src/components/Modal.js' または類似のファイルにあります。提供された CodeSandbox (https://codesandbox.io/s/my9vm34m68) は、ラジオボタンが存在する場合に Shift+Tab でフォーカスが逃げる問題を示しています。フォーカス管理コード、特に最初と最後のフォーカス可能な要素の処理方法を確認し、ラジオボタンが適切にフォーカス順序に含まれていることを確認してください。'focus trap' のようなフォーカストラップライブラリの使用、または既存の実装を調整してラジオボタングループのフォーカス動作を処理することを検討してください。
技術スタック
reactjavascript
領域
frontend
Issue 種別
バグ
難度新しい貢献者にとっての実装難度です。1 は非常に小さな変更、5 は専門的な作業です。
2
推定時間経験ある貢献者が調査、実装、テスト、pull request 準備にかけるおおよその時間範囲です。
1-3時間
活動状況Issue が今どれだけ取り組みやすいかを示します。新しい、活発、古い、ブロック中、またはメンテナー入力待ちなどです。
アクティブ
明確さ期待される変更、受け入れ条件、次の手順がどれだけ明確かを示します。
明確
前提条件
React
初心者向け度初回貢献者にどれだけ取り組みやすいかを 1-100 で推定したスコアです。
75