Use readText instead of readTexts.

It looks like concatenating separate feedback messages into a single
string and passing it to readText makes the screen reader read out the
feedback in its entirety more reliably than using readTexts to pass a
collection of separate feedback messages.

drag_and_drop_v2/public/js/drag_and_drop.js

@@ -249,7 +249,7 @@ function DragAndDropTemplates(configuration) {
             h('div.feedback', {attributes: {'role': 'group', 'aria-label': gettext('Feedback')}}, [
                 h(
                     "div.feedback-content",
-                    { attributes: { 'aria-live': 'polite' } },
+                    {attributes: {'aria-live': 'polite', 'aria-atomic': 'true', 'aria-relevant': 'all'}},
                     [
                         h('h3.title1', { style: { display: feedback_display } }, gettext('Feedback')),
                         h('div.messages', { style: { display: feedback_display } }, feedback_messages),
@@ -412,7 +412,7 @@ function DragAndDropTemplates(configuration) {
                     "tabindex": "-1",
                     'aria-live': 'polite',
                     'aria-atomic': 'true',
-                    'aria-relevant': 'additions',
+                    'aria-relevant': 'all',
                 }
             },
             [
@@ -930,7 +930,7 @@ function DragAndDropBlock(runtime, element, configuration) {
 
     // Uses edX JS accessibility tools to read feedback messages when present.
     var readScreenReaderMessages = function() {
-        if (window.SR && window.SR.readTexts) {
+        if (window.SR && window.SR.readText && window.SR.clear) {
             var pluckMessages = function(feedback_items) {
                 return feedback_items.map(function(item) {
                     return item.message;
@@ -957,7 +957,8 @@ function DragAndDropBlock(runtime, element, configuration) {
                 }
             }
 
-            SR.readTexts(messages);
+            SR.clear();
+            SR.readText(messages.join('\n'));
         }
     };
 

tests/integration/test_base.py

@@ -163,9 +163,9 @@ class BaseIntegrationTest(SeleniumBaseTest):
         focused_element = self.browser.switch_to.active_element
         self.assertTrue(element != focused_element, 'expected element to not have focus')
 
-    def _patch_sr_read_texts(self):
+    def _patch_sr_read_text(self):
         """
-        Creates a mock SR.readTexts function that stores submitted texts into a global variable
+        Creates a mock SR.readText function that stores submitted text into a global variable
         for later inspection.
         Returns a getter function that returns stored SR texts.
         """
@@ -173,8 +173,9 @@ class BaseIntegrationTest(SeleniumBaseTest):
             """
             window.SR = {
                 received_texts: [],
-                readTexts: function(texts) {
-                    window.SR.received_texts.push(texts);
+                clear: function() {},
+                readText: function(text) {
+                    window.SR.received_texts.push(text);
                 }
             };
             """

tests/integration/test_interaction.py

@@ -56,7 +56,7 @@ class ParameterizedTestsMixin(object):
         if feedback is None:
             feedback = self.feedback
 
-        get_sr_texts = self._patch_sr_read_texts()
+        get_sr_texts = self._patch_sr_read_text()
         popup = self._get_popup()
         feedback_popup_content = self._get_popup_content()
 
@@ -79,7 +79,7 @@ class ParameterizedTestsMixin(object):
             else:
                 overall_feedback = feedback['intro']
             expected_sr_texts.append(overall_feedback)
-            self.assertEqual(get_sr_texts()[-1], expected_sr_texts)
+            self.assertEqual(get_sr_texts()[-1], '\n'.join(expected_sr_texts))
             if action_key:
                 # Next TAB keypress should move focus to "Go to Beginning button"
                 self._test_next_tab_goes_to_go_to_beginning_button()
@@ -90,7 +90,7 @@ class ParameterizedTestsMixin(object):
         if feedback is None:
             feedback = self.feedback
 
-        get_sr_texts = self._patch_sr_read_texts()
+        get_sr_texts = self._patch_sr_read_text()
         popup = self._get_popup()
         feedback_popup_content = self._get_popup_content()
 
@@ -105,7 +105,7 @@ class ParameterizedTestsMixin(object):
             feedback_popup_html = feedback_popup_content.get_attribute('innerHTML')
             self.assertEqual(feedback_popup_html, '')
             self.assertFalse(popup.is_displayed())
-            self.assertEqual(get_sr_texts()[-1], [feedback['intro']])
+            self.assertEqual(get_sr_texts()[-1], feedback['intro'])
 
     def parameterized_item_negative_feedback_on_bad_move_standard(
             self, items_map, all_zones, scroll_down=100, action_key=None, feedback=None
@@ -113,7 +113,7 @@ class ParameterizedTestsMixin(object):
         if feedback is None:
             feedback = self.feedback
 
-        get_sr_texts = self._patch_sr_read_texts()
+        get_sr_texts = self._patch_sr_read_text()
         popup = self._get_popup()
         feedback_popup_content = self._get_popup_content()
 
@@ -129,7 +129,7 @@ class ParameterizedTestsMixin(object):
                 self.assertTrue(popup.is_displayed())
                 self.assert_reverted_item(definition.item_id)
                 expected_sr_texts = [definition.feedback_negative, feedback['intro']]
-                self.assertEqual(get_sr_texts()[-1], expected_sr_texts)
+                self.assertEqual(get_sr_texts()[-1], '\n'.join(expected_sr_texts))
                 self._test_popup_focus_and_close(popup, action_key)
 
     def parameterized_item_negative_feedback_on_bad_move_assessment(
@@ -138,7 +138,7 @@ class ParameterizedTestsMixin(object):
         if feedback is None:
             feedback = self.feedback
 
-        get_sr_texts = self._patch_sr_read_texts()
+        get_sr_texts = self._patch_sr_read_text()
         popup = self._get_popup()
         feedback_popup_content = self._get_popup_content()
 
@@ -154,7 +154,7 @@ class ParameterizedTestsMixin(object):
                 self.assertEqual(feedback_popup_html, '')
                 self.assertFalse(popup.is_displayed())
                 self.assert_placed_item(definition.item_id, zone_title, assessment_mode=True)
-                self.assertEqual(get_sr_texts()[-1], [feedback['intro']])
+                self.assertEqual(get_sr_texts()[-1], feedback['intro'])
                 self._test_popup_focus_and_close(popup, action_key)
                 if action_key:
                     self._test_next_tab_goes_to_go_to_beginning_button()

tests/integration/test_interaction_assessment.py

@@ -248,19 +248,19 @@ class AssessmentInteractionTest(
         """
         Test updating overall feedback after submitting solution in assessment mode
         """
-        get_sr_texts = self._patch_sr_read_texts()
+        get_sr_texts = self._patch_sr_read_text()
 
         def check_feedback(overall_feedback_lines, per_item_feedback_lines=None):
             # Check that the feedback is correctly displayed in the overall feedback area.
             expected_overall_feedback = "\n".join(["FEEDBACK"] + overall_feedback_lines)
             self.assertEqual(self._get_feedback().text, expected_overall_feedback)
 
-            # Check that the SR.readTexts function was passed correct feedback messages.
+            # Check that the SR.readText function was passed correct feedback messages.
             sr_feedback_lines = overall_feedback_lines
             if per_item_feedback_lines:
                 sr_feedback_lines += ["Some of your answers were not correct.", "Hints:"]
                 sr_feedback_lines += per_item_feedback_lines
-            self.assertEqual(get_sr_texts()[-1], sr_feedback_lines)
+            self.assertEqual(get_sr_texts()[-1], '\n'.join(sr_feedback_lines))
 
         # used keyboard mode to avoid bug/feature with selenium "selecting" everything instead of dragging an element
         self.place_item(0, TOP_ZONE_ID, Keys.RETURN)