Not yet. I’ll ask the Discourse team how they’re going.
4 Likes
aria-polite isn’t meant to be switched on and off. It signals to a screenreader that it should read a given section out loud if it changes, but it never gets a chance to see a change 'cause they’re toggling it at the same time as everything else. And I’ll say this on the discourse forum where it might do some good tomorrow.
5 Likes
It’s also not really the solution imo. The desired behavior would be for the spoiler blur to behave just like the details folds when expanded. Automatically reading out the revealed text is certainly a convenience, but the bug is really with the text not appearing on the screen reader’s rendering of the page. Sorry if I’m telling you stuff you already know, I just saw a fair amount of discussion on aria-polite and wanted to make sure the issue was known.
2 Likes
In the context of their implementation, what I described should work. When something is unblurred, they’re setting aria-hidden to false. At least in VoiceOver, that’s a sufficient change for something to be read aloud if it’s within something that has aria-live="polite". I didn’t test NVDA or JAWS.
4 Likes
Again, for me the problem seems to be the aria-label on the outer div: NVDA only reads the label and not the content, expanded or no. I recorded a quick video and posted it to the meta.discourse thread so hopefully we’ll see some movement on this.
Maybe I should set up a dev environment and see if I can fix it myself? This is getting ridiculous: it’s been two months. How much text on this forum is in spoiler tags and currently completely inaccessible to at least some screenreader users?
6 Likes
I just used spoilers over the past few days in a another thread I started. I wish I had read this thread first, or I wouldn’t have used them. I have no idea if anything I had to say would actually merit the interest of someone using a screen reader, but you never know.
Just in case, until this matter is resolved I will not be using spoilers in anything I post, even if it happens to irritate a few people. It probably won’t impact anything besides messages I post in the Hints forum, and I don’t know how many of those I’ll even post. But I’ll keep it in mind and monitor progress on this issue, regardless.
Just a side question: Does anyone have an estimate of how many active forum users actually use screen readers? I suspect the ratio of visually impaired users is a lot higher here than the average forum…
2 Likes
Anecdotally, I am aware of at least a half dozen. There are likely many more than that.
2 Likes
Anyone got any ideas of some alternate HTML that would be an improvement? I’m not sure what HTML would help, but if anyone can tell me then I might be able to work out how to patch the forum software. Or we could give a concrete recommendation to the Discourse team.
2 Likes
Ah, the code is very simple, that’s why it’s so frustrating that the devs aren’t responding. The aria-label attribute overrides the spoiled content, so it needs to get removed when the spoiler is revealed. But Ruby on Rails is a mess and I haven’t been able to get Discourse running on WSL to double-check that it works…
In apply-spoiler.js _setSpoilerVisible needs two changes:
function _setSpoilerVisible(element) {
const spoilerVisibleAttributes = {
"data-spoiler-state": "revealed",
"aria-expanded": true,
"aria-label": _I18n.default.t("spoiler.label.hide"), // DELETE THIS LINE
"aria-live": "polite"
};
// Set attributes & classes for when spoiler is visible
element.removeAttribute("aria-label"); // ADD THIS ONE
Object.entries(spoilerVisibleAttributes).forEach(_ref2 => {
let [key, value] = _ref2;
element.setAttribute(key, value);
});
I thought about just submitting a pull request anyway, but given how strongly and repeatedly the Discourse devs have refused to give a shit about accessibility over the years, I didn’t think they’d accept it.
9 Likes
I wouldn’t attribute any malice to the Discourse devs, just lack of knowledge, experience, and time. I’ve submitted PRs before and they’ve always responded promptly, so I have no doubt that if we can identify a good solution they’ll accept it.
I’ve made the changes Josh suggested. Can everyone give it a test?
Example: This text will be blurred
This paragraph is also a spoiler.
6 Likes
They work! Tested on Windows in Chrome and Firefox with NVDA. Tested on iOS in Safari with VoiceOver.
The text appears to be part of the button, so it does mean having to hear the word “button” before every line, but it’s still an improvement!
6 Likes
That would be because it gets the ARIA role of button. Which may not be ideal, but I can’t see an ARIA role that would be more appropriate. And if we didn’t specify an ARIA role I’m not sure if the screen reader would expose that it can be “clicked”?
But we could definitely try some more changes. At the least it probably doesn’t need to say that a revealed spoiler is still a button?
I’ve just noticed another problem with spoilers: it will re-hide if you try to select text within a spoiler!
4 Likes
That’s a weird one. I can select it fine without hiding it if I click outside the line and then sweep the pointer over the spoiler. But if click and release inside the element, even without selecting anything, it re-hides.
2 Likes
I’ve fixed both of these. Does removing the button role actually help?
4 Likes
Selection of spoiler text no longer re-hides the text, if that is what you are asking for. Thank you.
2 Likes
Thank you so much for the work on this. I’m going to be posting more game reviews / thoughts shortly, and was just thinking last night that I might not want to use spoiler text - even though in theory it might be perfect - if it still wasn’t playing nice for screen readers.
5 Likes
@Dannii thanks so much for making those adjustments! Everything seems to be working as intended on my end. For some reason Voiceover has been announcing newly unblurred text twice, but that’s really not a big deal in the grand scheme of things.
3 Likes
It didn’t used to do that? I’d want to fix that if possible…
Does it read twice both inline spoilers and paragraph spoilers? If it only reads one type of spoiler twice that would be a clue as to what’s going on.
I could try reinstating the button role? Not sure that’s the cause though…
Or I could try making all the changes with ARIA atomic set?
2 Likes
Based off the two examples above, it’s doing it for both the in-line and paragraph spoilers. Also to clarify: the text is only repeated during the initial unblurring process—there isn’t any duplication when I go back over something I already revealed.
2 Likes
I’ve changed when the ARIA live: polite is applied. This might stop it reading twice, or it might make it read it when the page is first loaded…
3 Likes