When using Tab List and Tab Content blocks together, Cwicly adds a ‘aria-controls’ attribute to each button. However, the attribute does not have a value set. This, I suspect, presents an accessibility problem because the cause (the button) and the effect (the content being revealed/hidden action) are not associated clearly.
The functionality is, I assume, controlled by the ordering of the respective button and content blocks rather than via their ID. Adding the content block ID to the aria-controls attribute of the associated button, I think, would resolve the accessibility issue. It may also need aria-labeledby to be added to the tab panel to give further feedback to the user.
Forgive me if I have misunderstood the accessibility approach. I’m not an expert in this area, but I have tested it using VoiceOver on Brave and there does seem to be a disconnect between the button and the panel.
- WordPress version: 6.3.1
- Cwicly Plugin version: 1.3
Thanks so much for the report.
There is provision for this in the Cwicly tabs logic but it looks like there is a bug or two currently preventing it from applying. The content block IDs should be forced and the aria-controls applied on page load.
I have added it to the bug tracker.
Thank you, I thought it looked broken rather than poorly designed
@Louis Thanks for sorted this so quickly, the IDs seem to be connected to the aria-controls now
Do you deem is not necessary to use aria-labeledby on this element?
We’ve reached out to a competent source to make sure that the
aria-labelledby attribute for tabpanel should always link to the tab element that controls the panel.
aria-labelledby should be filled in by the user.
I’ll leave this in confirmed bugs until this segment is sorted.
Yes, my understanding would also be that the panel (Tab Contents) should have a aria-labelledby set to the corresponding tab. It doesn’t currently have this - even after the update - hence I asked the question!
We don’t want to force a behavior that might not be correct in all circumstances. Once we have confirmed this, it will be updated.
Thanks for this report again.
We have fixed the final issue in 184.108.40.206.
Please let us know if you still experience trouble after updating.