2017-10-06 5 views
1

Ich führe einen automatisierten Zugänglichkeitstest auf meiner Website durch und erhalte einen Fehler für ein Tooltip-Element, das Zurb Foundation's tooltip (v6.2.3) verwendet.Sind dynamisch erzeugte Arien - beschrieben durch noch erreichbare Werte?

Die Frage ist anzumerken, als „Dieses Element hat eine Arie-describedby Attributwert, der eine oder mehrere ungültige IDs enthält.“ Soweit ich sagen kann, die div, dass sie durch beschrieben ist eine gültige ID hat, aber Da es durch JavaScript generiert wird, verursacht das möglicherweise das Problem?

Hier ist, was der Code wie in meinem Editor aussieht:

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

Und machen, ändert Stiftung JavaScript es an:

<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> 

Stiftung JavaScript erzeugt auch am unteren Rand des Dokuments:

<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> 

Hier wird die ID des Tooltips zufällig generiert.

Von ZURB JS Tooltip, wo es ein Plugin ist mit den ID-Namen zu erstellen:

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

Soweit ich das beurteilen kann, ist es eine gültige ID und soll ordnungsgemäß funktionieren. Ich nehme an, wenn mein Testwerkzeug Probleme beim Abholen der ID hat, würde auch assistive Technologie auf ein Problem stoßen.

Meine Frage ist: Würde das OK so gehen wie es ist, oder gibt es wirklich einen Fehler hier, der ein Problem mit unterstützender Technologie verursachen würde?

Ich bin ziemlich neu in der Verwendung von ARIA-Attributen, also Entschuldigung, wenn diese Frage verwirrend oder schlecht formuliert ist. Vielen Dank!

+1

Ich vermute, das Problem ist, dass das Test-Dienstprogramm den JS nicht ausführt. – Barmar

Antwort

0

Meine Frage ist: Würde das OK so gehen wie es ist, oder gibt es wirklich einen Fehler hier, der ein Problem mit unterstützender Technologie verursachen würde?

Ihre aria-describedby wird mit Javascript hinzugefügt, und so ist die div. Screenreader lesen das generierte DOM. Also alles ist in Ordnung.

Es wäre hilfreich gewesen, wenn Sie angegeben hätten, welches Werkzeug Sie verwenden, da der Fehler möglicherweise darin besteht, dass das Tool div aufgrund seines versteckten Status nicht abrufen kann, aber dies ist aus Sicht des Screenreaders kein Problem . Beachten Sie, dass aria-hidden=true keinen Unterschied macht.

+0

Danke! Freut mich zu hören, dass es kein Problem für Bildschirmleser sein sollte. Ich verwende AMP nach Level Access - ich wollte nicht, dass es so aussieht, als würde ich ein bestimmtes Tool unterstützen, aber es macht Sinn, dass es die Frage mit einbeziehen könnte. Danke noch einmal :) –

Verwandte Themen