Spoilers and Screenreaders

Following up on the meta thread, it appears that we not only have to upgrade the forum software, but also the spoiler plugin.

On our forum, Hanon wrote this:

The HTML for that looks like this:

<span class="spoiled spoiler-blurred" role="button" tabindex="0
  data-spoiler-state="blurred" aria-expanded="false"
  aria-label="Show hidden content">spoiler</span>

Whereas on meta.discourse.org, keegan posted this:

Testing this will be read

And the HTML for that looks like this:

<div class="spoiled spoiler-blurred" dir="ltr" role="button" tabindex="0"
  data-spoiler-state="blurred" aria-expanded="false"
  aria-label="Show hidden content" aria-live="polite">
    <p aria-hidden="true">Testing this will be read</p>
</div>

We’re clearly not using the same code/version they’re using.

5 Likes