WebAIM - Web Accessibility In Mind

E-mail List Archives

Re: Problems with role="tree"

for

From: Alexander Karelas
Date: May 13, 2018 9:53PM

There are lots of role attributes on that page. Tree is one of them. My
NVDA recognizes it as a tree.

Which screen reader are you using?


On 14/05/2018 01:38 πμ, Jonathan Cohn wrote:
> 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.
>>
>>
>> >> >> >> > > > >