Fix image output by character

Change-Id: I050e4fe94f3bcb3d9d4d01166a577998e1ec9fc9
Reviewed-on: https://chromium-review.googlesource.com/c/chromium/src/+/1931256
Commit-Queue: David Tseng <dtseng@chromium.org>
Reviewed-by: Nektarios Paisios <nektar@chromium.org>
Cr-Commit-Position: refs/heads/master@{#718907}

chrome/browser/resources/chromeos/accessibility/chromevox/background/editing.js

@@ -408,6 +408,19 @@ AutomationRichEditableText.prototype = {
       // Intra-line changes.
 
       if (cur.hasTextSelection()) {
+        if (!prev.hasTextSelection() && cur.hasCollapsedSelection() &&
+            cur.startOffset > prev.startOffset) {
+          // EditableTextBase cannot handle this state transition (moving
+          // forward from rich text to a caret in plain text). Fall back to
+          // simply reading the character to the right of the caret. We achieve
+          // this by updating the indices first, then sending the new change.
+
+          // These members come from EditableTextBase.
+          this.start = cur.endOffset > 0 ? cur.endOffset - 1 : 0;
+          this.end = this.start;
+        }
+        // Delegate to EditableTextBase (via |changed|), which handles plain
+        // text state output.
         var text = cur.text;
         if (text == '\n') {
           text = '';
@@ -424,6 +437,10 @@ AutomationRichEditableText.prototype = {
       }
       this.brailleCurrentRichLine_();
 
+      // Be careful to update state in EditableTextBase since we don't
+      // explicitly call through to it here.
+      this.updateIntraLineState_(cur);
+
       // Finally, queue up any text markers/styles at bounds.
       var container = cur.startContainer_;
       if (!container) {

chrome/browser/resources/chromeos/accessibility/chromevox/background/editing_test.js

@@ -629,9 +629,17 @@ TEST_F('ChromeVoxEditingTest', 'RichTextImageByCharacter', function() {
     </p>
     <button id="go">Go</button>
     <script>
+      var dir = 'forward';
+      var moveCount = 0;
       document.getElementById('go').addEventListener('click', function() {
+        moveCount++;
+        if (moveCount == 9) {
+          dir = 'backward';
+        }
+
         var sel = getSelection();
-        sel.modify('move', 'forward', 'character');
+
+        sel.modify('move', dir, 'character');
       }, true);
     </script>
   `,
@@ -643,41 +651,42 @@ TEST_F('ChromeVoxEditingTest', 'RichTextImageByCharacter', function() {
         this.listenOnce(input, 'focus', function() {
           var lineText = 'dog is a cat test mled';
           var lineOnCatText = 'dog is a cat img test mled';
-          mockFeedback
-              // This is initial output from focusing the contenteditable (which
-              // has no role).
-              .expectSpeech('dog', 'Image', ' is a ', 'cat', 'Image', ' test')
-              .expectBraille('dog img is a cat img test')
-              .clearPendingOutput()
-              .call(moveByChar)
-              // This is actually wrong; should say space.
-              .expectSpeech('dog')
-              .expectBraille(lineText, {startIndex: 3, endIndex: 3})
-              .call(moveByChar)
-              .expectSpeech('i')
-              .expectBraille(lineText, {startIndex: 4, endIndex: 4})
-              .call(moveByChar)
-              .expectSpeech('s')
-              .expectBraille(lineText, {startIndex: 5, endIndex: 5})
-              .call(moveByChar)
-              .expectSpeech(' ')
-              .expectBraille(lineText, {startIndex: 6, endIndex: 6})
-              .call(moveByChar)
-              .expectSpeech('a')
-              .expectBraille(lineText, {startIndex: 7, endIndex: 7})
-              .call(moveByChar)
-              .expectSpeech(' ')
-              .expectBraille(lineText, {startIndex: 8, endIndex: 8})
-              .clearPendingOutput()
-              .call(moveByChar)
-              .expectSpeech('cat', 'Image')
-              .expectBraille(lineOnCatText, {startIndex: 9, endIndex: 9})
 
-              // Unfortunately, the node offset being wrong here means there's
-              // no output for the next character move. Fix Once node offsets
-              // get fixed in Blink.
+          // This is initial output from focusing the contenteditable (which has
+          // no role).
+          mockFeedback.expectSpeech(
+              'dog', 'Image', ' is a ', 'cat', 'Image', ' test');
+          mockFeedback.expectBraille('dog img is a cat img test');
+
+          var moves = [
+            {speech: [' '], braille: [lineText, {startIndex: 3, endIndex: 3}]},
+            {speech: ['i'], braille: [lineText, {startIndex: 4, endIndex: 4}]},
+            {speech: ['s'], braille: [lineText, {startIndex: 5, endIndex: 5}]},
+            {speech: [' '], braille: [lineText, {startIndex: 6, endIndex: 6}]},
+            {speech: ['a'], braille: [lineText, {startIndex: 7, endIndex: 7}]},
+            {speech: [' '], braille: [lineText, {startIndex: 8, endIndex: 8}]},
+            {
+              speech: ['cat', 'Image'],
+              braille: [lineOnCatText, {startIndex: 9, endIndex: 9}]
+            },
+            {speech: [' '], braille: [lineText, {startIndex: 12, endIndex: 12}]}
+          ];
+
+          for (var item of moves) {
+            mockFeedback.call(moveByChar);
+            mockFeedback.expectSpeech.apply(mockFeedback, item.speech);
+            mockFeedback.expectBraille.apply(mockFeedback, item.braille);
+          }
 
-              .replay();
+          var backMoves = moves.reverse();
+          backMoves.shift();
+          for (var backItem of backMoves) {
+            mockFeedback.call(moveByChar);
+            mockFeedback.expectSpeech.apply(mockFeedback, backItem.speech);
+            mockFeedback.expectBraille.apply(mockFeedback, backItem.braille);
+          }
+
+          mockFeedback.replay();
         });
         input.focus();
       });