[Popup] EdgeでPopupを表示すると、Popupのホスト要素にフォーカスが当たる

文書番号 : 81876     文書種別 : Limit
登録日 : 2016/11/22     最終更新日 : 2017/04/19

対象製品

Wijmo 5

発生環境

Microsoft Edgeのみ発生

詳細

EdgeでPopupを表示すると、Popupのホスト要素にフォーカスが当たってしまいます。
また、その状態でTabキーを押してもPopup内の要素にフォーカスが移動しません。

この現象は制限事項です。
本現象は、以下のようなサンプルでPopupの「header」div要素内にフォーカス可能な子要素がなく、またdiv要素自身にもtabindex属性がないために発生しています。このような場合、Edgeでは、div要素のtabindexに0となり、フォーカスが当たるようになります。

【再現手順】
1. 「ポップアップを表示」ボタンを押下します。
結果:表示されたPopupのホスト要素にフォーカスが当たっています。

2. Tabキーを押下します。
結果:フォーカスが移動しません。

サンプル

回避方法

下記コードのようにPopupの「header」div要素のtabindexを-1に設定します。

◆サンプルコード(HTML)
----------------------------------
<div id="message">
  <div id="header" tabindex="-1">
    タイトル
  </div>
  <input type="text"><br>
  <input type="text"><br>
  <input type="text">
  <div id="footer">
    <button>ボタン</button>
  </div>
</div>
----------------------------------