Editor Accessibility Test

This page demonstrates the accessibility fix for the Editor component. Tab through the different editors and a toast will appear showing the accessibility attributes for each editor when it receives focus.

Product Description

This editor has a label with an explicit ID attribute. The screen reader should announce "Product Description" when focusing on this editor.

Customer Feedback

This editor has a label without an ID attribute. The fix should generate an ID and set aria-labelledby to that ID. The screen reader should announce "Customer Feedback" when focusing on this editor.

This editor has no associated label element. The fix should set aria-label="Editor". The screen reader should announce "Editor" when focusing on this editor.

Meeting Notes (Required)

This editor has a complex label with additional elements. The screen reader should announce "Meeting Notes Required" when focusing on this editor.