Trim whitespace for input type="tel"

This fixes custom text fields of type="tel" that insert whitespace as padding.


Change-Id: I054a1713f5a3bfba8f412e18fc93ecea7155afde
Reviewed-on: https://chromium-review.googlesource.com/1111112
Commit-Queue: David Tseng <dtseng@chromium.org>
Reviewed-by: Dominic Mazzoni <dmazzoni@chromium.org>
Cr-Commit-Position: refs/heads/master@{#569668}

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

@@ -130,8 +130,10 @@ function AutomationEditableText(node) {
     throw Error('Node must have editable state set to true.');
   var start = node.textSelStart;
   var end = node.textSelEnd;
+  var value = this.getProcessedValue_(node) || '';
   cvox.ChromeVoxEditableTextBase.call(
-      this, node.value || '', Math.min(start, end), Math.max(start, end),
+      this, value, Math.min(start, end, value.length),
+      Math.min(Math.max(start, end), value.length),
       node.state[StateType.PROTECTED] /**password*/, cvox.ChromeVox.tts);
   /** @override */
   this.multiline = node.state[StateType.MULTILINE] || false;
@@ -147,10 +149,11 @@ AutomationEditableText.prototype = {
    * @param {string|undefined} eventFrom
    */
   onUpdate: function(eventFrom) {
-    var newValue = this.node_.value || '';
+    var newValue = this.getProcessedValue_(this.node_) || '';
 
     var textChangeEvent = new cvox.TextChangeEvent(
-        newValue, this.node_.textSelStart || 0, this.node_.textSelEnd || 0,
+        newValue, Math.min(this.node_.textSelStart || 0, newValue.length),
+        Math.min(this.node_.textSelEnd || 0, newValue.length),
         true /* triggered by user */);
     this.changed(textChangeEvent);
     this.outputBraille_();
@@ -192,6 +195,16 @@ AutomationEditableText.prototype = {
     range = Range.fromNode(this.node_);
     output.withBraille(range, null, Output.EventType.NAVIGATE);
     output.go();
+  },
+
+  /**
+   * @param {!AutomationNode} node
+   * @return {string|undefined}
+   * @private
+   */
+  getProcessedValue_: function(node) {
+    var value = node.value;
+    return (value && node.inputType == 'tel') ? value['trimEnd']() : value;
   }
 };
 

chrome/browser/resources/chromeos/chromevox/cvox2/background/editing_test.extjs

@@ -896,3 +896,46 @@ TEST_F('EditingTest', 'IsValidLine', function() {
     assertFalse(line.isValidLine());
   })
 });
+
+TEST_F('EditingTest', 'TelTrimsWhitespace', function() {
+  var mockFeedback = this.createMockFeedback();
+  this.runWithLoadedTree(function() {/*!
+    <div id="go"></div>
+    <input id="input" type="tel"></input>
+    <script>
+      var data = [
+        '6               ',
+        '60              ',
+        '601             ',
+        '60              '
+      ];
+      var go = document.getElementById('go');
+      var input = document.getElementById('input');
+      var index = 0;
+      go.addEventListener('click', function() {
+        input.value = data[index];
+        index++;
+        input.selectionStart = index;
+        input.selectionEnd = index;
+      }, true);
+    </script>
+  */}, function(root) {
+    var input = root.find({role: RoleType.TEXT_FIELD});
+    var go = root.find({role: RoleType.GENERIC_CONTAINER});
+    var enterKey = go.doDefault.bind(go);
+    this.listenOnce(input, 'focus', function() {
+      mockFeedback.call(enterKey)
+          .expectSpeech('6')
+          .call(enterKey)
+          .expectSpeech('0')
+          .call(enterKey)
+          .expectSpeech('1')
+
+          // Deletion.
+          .call(enterKey)
+          .expectSpeech('1')
+          .replay();
+    });
+    input.focus();
+  });
+});