1×
Become a member
to unlock all features

Level Up!

Access all courses & lessons on egghead today and lock-in your price for life.

Autoplay

    As of react-beautiful-dnd 12.0, lift announcements have changed

    <DragDropContext /> now accepts a liftInstruction prop in favor of aria-roledescription on the drag handle. Read the Github release notes for more info.

    Customize Screen Reader Messages for Drag and Drop with react-beautiful-dnd

    reactReact
    ^16.0.0

    react-beautiful-dnd enables users with visual impairments to perform drag and drop operations using only a keyboard and screen reader. This lesson will show you how you can customise the preset react-beautiful-dnd screen reader messaging to power your own domain-specific messaging as well as internationalisation.

    We will achieve this by using the aria-describedby prop on a drag handle as well as the announce function which is provided to the DragDropContext callback functions