From 376ec5cc96b84eca6fa3e368c22ee4a23ff65b0a Mon Sep 17 00:00:00 2001 From: ABBOUD Moncef Date: Thu, 19 Oct 2023 16:30:41 +0200 Subject: [PATCH] fix: Safari focus when there are no draggables left Resolves a11y issue with using a keyboard in Safari. --- Changelog.md | 5 +++++ drag_and_drop_v2/__init__.py | 2 +- drag_and_drop_v2/public/js/drag_and_drop.js | 9 ++++++++- 3 files changed, 14 insertions(+), 2 deletions(-) diff --git a/Changelog.md b/Changelog.md index d6339328e..2e0cd428c 100644 --- a/Changelog.md +++ b/Changelog.md @@ -4,6 +4,11 @@ Drag and Drop XBlock changelog Unreleased --------------------------- +Version 3.2.2 (2023-10-19) +--------------------------- + +* Fix Safari focus when there are no draggables left. + Version 3.2.1 (2023-10-12) --------------------------- diff --git a/drag_and_drop_v2/__init__.py b/drag_and_drop_v2/__init__.py index 0db77497d..52c4ffdc4 100644 --- a/drag_and_drop_v2/__init__.py +++ b/drag_and_drop_v2/__init__.py @@ -1,4 +1,4 @@ """ Drag and Drop v2 XBlock """ from .drag_and_drop_v2 import DragAndDropBlock -__version__ = "3.2.1" +__version__ = "3.2.2" diff --git a/drag_and_drop_v2/public/js/drag_and_drop.js b/drag_and_drop_v2/public/js/drag_and_drop.js index 27365f176..c0b512e0e 100644 --- a/drag_and_drop_v2/public/js/drag_and_drop.js +++ b/drag_and_drop_v2/public/js/drag_and_drop.js @@ -1310,7 +1310,14 @@ function DragAndDropBlock(runtime, element, configuration) { }; var focusFirstDraggable = function() { - $root.find('.item-bank .option').first().focus(); + var draggables = $root.find('.item-bank .option[draggable=true]').toArray(); + if (draggables.length){ + draggables[0].focus(); + } + else { + // In case there are no draggable options, we default focus to the first zone. + $root.find('.target .zone').first().focus(); + } }; var focusItemFeedbackPopup = function() {