SpiderBasic

This is observable by running the TabBarMobile example, for me in Microsoft Edge.
On first load I see the text of all three tabs above all the buttons. Only when I change tabs does it normalize and go back to only one tab's contents showing.
Even if I use SetMobileAttribute(0, 1) for example to forcefully change the tab, this behavior stays the same.

Perhaps it's limited to screen readers?

Quin wrote: Thu Sep 26, 2024 8:14 am Perhaps it's limited to screen readers?

I think so... the example shows correct for me in Chrome and Edge browsers

Just confirmed that it also happens with Narrator, so I have easier steps to reproduce now.
1. Load up the TabBarMobile example.
2. Start Narrator with control+windows+enter (windows).
3. Up/down arrow through the page content.
Next on my list to try is VoiceOver on the Mac, although don't be offended if VO on Mac hates it, VO on Mac hates anything more complicated than static HTML it feels like...

It's created hidden, so I don't know why Narrator is picking these for reading, not sure we could fix it.

After investigation, the template is added to a div with the "display:none" class, so it should be ignored by the screen reader. It's probably a screen reader issue here.

Hi Fred,
No, that's not a screen reader issue. Screen readers pay no attention to your CSS. They do, however, pay attention to ARIA. More usefully for this case, aria-hidden. Could you perhaps use that?

According to this https://stackoverflow.com/questions/311 ... s#31107263 we should use hidden instaed of display:none. I will give it a try for the next beta

Hi Fred,
Was this change implemented in 3.02 beta 2? If so, I unfortunately still face the issue in Firefox.

I just uploaded a new package for Windows with this fix, could you try ?

Hi Fred,
Sadly this doesn't seem to have fixed it, I still see the content of all three tabs when arrowing up and down with both NVDA and Narrator in Firefox

could you look in the 'hidden' tag is properly set ?