WebAIM - Web Accessibility In Mind

E-mail List Archives

Re: Help troubleshooting some code

for

From: Lucy GRECO
Date: Nov 18, 2020 5:59PM

hello: i was able to here the same results with both aws and nvda. in
firefox. and yes berker i asked already to have the group removed and when
we did so loackaly it made no difference. as ar as the screenreader is
concerned it is one block and if it does not have punctuation it even runs
the words together so if the messages are step one do this
step step 2 move
and step three that is all it will read like this
step one dothisstep 2 then do thatstep three that is the end
no line spacing or other wize
Lucia Greco
Web Accessibility Evangelist
IST - Architecture, Platforms, and Integration
University of California, Berkeley
(510) 289-6008 skype: lucia1-greco
http://webaccess.berkeley.edu
Follow me on twitter @accessaces



On Wed, Nov 18, 2020 at 3:14 PM Birkir R. Gunnarsson <
<EMAIL REMOVED> > wrote:

> I would remove role="group" and aria-label from the div and see if the
> behavior changes. It shouldn't change it in theory but I also think
> this grouping is not necessary and it may be triggering something. Are
> you usre there is no live region on one of the divs further up in the
> document hierarchy?
>
> On 11/18/20, Lucy GRECO < <EMAIL REMOVED> > wrote:
> > Hello:
> >
> > We are working with a vendor and have found a strange behavior in the way
> > something is behaving, and I was hoping someone could help us find out
> why
> > it's doing what it is.
> >
> > This is part of a live chat implementation. In the below sample of code,
> > the text (chat history, in the paragraph tags) is being read out by the
> > screenreader as one large block of text, when it should be showing up as
> > separate lines of text. The text is not contained inside an ARIA live
> > region or alert. This is happening when using arrow navigation and also
> > when reading all from the beginning of the history.
> >
> > Does anyone know what might be going on here?
> >
> > Sample Code
> >
> > <div class="conversation-container" aria-label="chat">
> > <div class="message-block-container">
> > <div class="message-block">
> > <div class="message-container">
> > <div class="message-group" role="group" aria-label="messages from
> > you">
> > <p class="visitor-message">Here is my chat</p>
> > <p class="visitor-message">it is very chatty</p>
> > <p class="visitor-message">isn't it?</p>
> > </div>
> > </div>
> > </div>
> > </div>
> > </div>
> >
> > Thanks,
> > Lucy
> >
> > Lucia Greco
> > Web Accessibility Evangelist
> > IST - Architecture, Platforms, and Integration
> > University of California, Berkeley
> > (510) 289-6008 skype: lucia1-greco
> > http://webaccess.berkeley.edu
> > Follow me on twitter @accessaces
> > > > > > > > > >
>
>
> --
> Work hard. Have fun. Make history.
> > > > >