Lists don't print count of current item and total count #40
Description
When using Voice Over for a tablist or a radiogroup each tab or radio item will be announced with the current index and total count of the items. In the case of virtual-screen-reader, this information is not printed. This is a useful test to confirm that when provided a list of radio options in a radiogroup or tabs in a tablist that they are being rendered within the group.
Example HTML
<div role="tablist" aria-orientation="horizontal">
<button
type="button"
role="tab"
aria-selected="true"
aria-controls="tab-:r6::Tab1-panel"
id="tab-:r6::Tab1-trigger"
tabindex="0"
>
Tab1
</button>
<button
type="button"
role="tab"
aria-selected="false"
aria-controls="tab-:r6::Tab2-panel"
id="tab-:r6::Tab2-trigger"
tabindex="-1"
>
Tab2
</button>
</div>
<div role="tabpanel" aria-labelledby="tab-:r6::Tab1-trigger" tabindex="0">
<div>Tab1 Content</div>
</div>Example Test
const { container } = render(<TestComponent />)
console.log(container.innerHTML)
await virtual.start({ container })
while ((await virtual.lastSpokenPhrase() !== 'end of tabpanel, Tab1')) {
await virtual.next()
}
// this expect passes
expect(await virtual.spokenPhraseLog()).toEqual([
"tablist, orientated horizontally",
"tab, Tab1, selected",
"tab, Tab2, not selected",
"end of tablist, orientated horizontally",
"tabpanel, Tab1",
"Tab1 Content",
"end of tabpanel, Tab1"
])
// this expect fails
expect(await virtual.spokenPhraseLog()).toEqual([
"tablist, orientated horizontally",
"tab, Tab1, selected, 1 of 2",
"tab, Tab2, not selected, 1 of 2",
"end of tablist, orientated horizontally",
"tabpanel, Tab1",
"Tab1 Content",
"end of tabpanel, Tab1"
])
await virtual.stop()