2017-10-06 9 views
1

サイトで自動アクセシビリティテストを実行していて、Zurb Foundation's tooltip(v6.2.3)を使用しているツールチップ要素でエラーが発生しました。動的に生成されたaria-describedbyの値は引き続きアクセス可能ですか?

問題は「」と表示されます。この要素には、1つ以上の無効IDを含むaria-describedby属性値があります。「私が知る限り、記述されたdivには有効なIDがありますがそれはJavaScriptによって生成されているため、おそらくそれが問題の原因ですか?

は、ここでは、コードは私のエディタで次のようになります。財団のJavaScriptは、文書の下部に生成

<span data-tooltip="77rhf0-tooltip" aria-haspopup="true" class="has-tip" title="" aria-describedby="vd07t8-tooltip" data-yeti-box="vd07t8-tooltip" data-toggle="vd07t8-tooltip" data-resize="vd07t8-tooltip">"tip-bottom"</span> 

<span data-tooltip aria-haspopup="true" class="has-tip" title="I'm on bottom and the default position.">"tip-bottom"</span><br> 

そして上のレンダリング、財団のJavaScriptはそれを変更します

<div class="tooltip" role="tooltip" aria-hidden="true" data-is-active="false" data-is-focus="false" id="vd07t8-tooltip" style="display: none; top: 421.812px; left: 410.766px; opacity: 1;">I'm on bottom and the default position.</div> 

ここで、ツールチップのIDはランダムに生成されます。 ID名を作成するためのプラグインを使用していますzurbのJSツールチップから、

:私の知る限り

var elemId = this.$element.attr('aria-describedby') || Foundation.GetYoDigits(6, 'tooltip'); 

は、それが有効なIDであると正しく動作する必要があります。テストツールでIDを取得できない場合は、支援技術も問題になると思います。

私の質問は次のとおりです。これはそのまま残すか、ここでは支援技術の問題を引き起こす可能性のあるエラーですか?

私はARIA属性を使用することにかなり新しいです。この質問が混乱しているか貧弱な言葉である場合は、謝罪します。ありがとうございました!

+1

私は、テストユーティリティがJSを実行しないという問題があると思われます。 – Barmar

答えて

0

私の質問は次のとおりです。これはそのまま残すか、ここでは支援技術の問題を引き起こすエラーが本当にありますか?

aria-describedbyは、divのようにjavacriptで追加されます。スクリーンリーダーは生成されたDOMを読み込みます。だからすべてが大丈夫です。

このツールは隠された状態のためdivを検索できないというエラーが発生する可能性がありますが、スクリーンリーダーの観点からは問題はありません。 aria-hidden=trueを持っていても違いはありません。

+0

ありがとうございました!それがスクリーンリーダーの問題を引き起こしてはならないと聞いてうれしいです。レベルアクセスでAMPを使用しています - 私は特定のツールを支持していたように見せたくありませんでしたが、それを含めると問題に対処することができます。再度、感謝します :) –

関連する問題