WebAIM - Web Accessibility In Mind

E-mail List Archives

Re: Problems with role="tree"

for

From: Jonathan Cohn
Date: May 13, 2018 4:38PM

I probably missed something, but the only role attribute I noticed was role=heading

I did see a "tree" word in the simplified version, but my screen reader when looking at that did not seem to recognize the item as a widget.

And not sure if the question was for me, but I am attempting to learn how to develop NVDA code.

Jonathan Cohn



> On May 11, 2018, at 4:53 PM, Alexander Karelas < <EMAIL REMOVED> > wrote:
>
> Hi,
>
> Pardon me if this is not the right forum to ask technical questions. If
> it is indeed not the place for such questions, please tell me which
> mailing list is better suited for such activity, and I'll go there.
>
> My problems are with the tree on this page, when reading it with NVDA:
> https://forums.baza.gr/readmsg/101
>
> I coded all of the tree, keyboard navigation works fine (arrow keys,
> home, end, Enter (clicks the link), etc)
>
> But when I navigate to the section containing the tree, I get the
> announcement "blabla section tree view"
>
> What I'm not getting is a reading of the treeitem I immediately land on.
>
> I press Enter (or NVDA+Space) to switch NVDA to focus mode, and I do
> change, but NVDA will only play a click sound then, no words.
>
> When I move the focus to other treeitems (with the arrow keys) I get the
> treeitem label read to me, which is great.
>
> That means that when I land on a tree, I need to press Down and Up again
> to hear the label of the current treeitem.
>
> Why is this happening? Is there someone who can help me solve this problem?
>
> This is a problem, because (a) the user doesn't get enough feedback to
> know for sure what's going on, (b) it wastes the user's time, and (c) if
> they land on a tree with only item they can't click "down and up again".
>
> The structure I have is:
>
> <div id="app" role="region" label="τίτλοι θέματος">
> <div id="js-tree" role="tree" tabindex="0" before treeitem gets
> focused, and "-1" afterwards>
> <div role="treeitem" tabindex="0" (on the correct treeitem) and
> "-1" otherwise>
>
> Actually there are more levels of nesting with other divs, but I have
> aria-owns="..." at the right places, so Accessibility-wies it's the same.
>
> Am I doing it right?
>
> Any help appreciated.
>
>
> > > >