Print Preview Componentization: Fix copies and scaling bug

Since the InputChanged_ observer was tracking both validity and the
input string, it generated intermediate states in which validity was
true and the setting value was set to an invalid value, as the input
value had not been updated. Fix this issue.

Cq-Include-Trybots: master.tryserver.chromium.linux:closure_compilation
Change-Id: Ibb35e8e825c3d4177d4c99a59dc6dcd5275969a6
Reviewed-on: https://chromium-review.googlesource.com/1072697Reviewed-by: Demetrios Papadopoulos <dpapad@chromium.org>
Commit-Queue: Rebekah Potter <rbpotter@chromium.org>
Cr-Commit-Position: refs/heads/master@{#562007}

chrome/browser/resources/print_preview/new/copies_settings.js

@@ -9,7 +9,10 @@ Polymer({
 
   properties: {
     /** @private {string} */
-    currentValue_: String,
+    currentValue_: {
+      type: String,
+      observer: 'onInputChanged_',
+    },
 
     /** @private {boolean} */
     inputValid_: Boolean,
@@ -17,10 +20,8 @@ Polymer({
     disabled: Boolean,
   },
 
-  observers: [
-    'onInputChanged_(currentValue_, inputValid_)',
-    'onSettingsChanged_(settings.copies.value, settings.collate.value)'
-  ],
+  observers:
+      ['onSettingsChanged_(settings.copies.value, settings.collate.value)'],
 
   /**
    * Updates the input string when the setting has been initialized.
@@ -28,7 +29,8 @@ Polymer({
    */
   onSettingsChanged_: function() {
     const copies = this.getSetting('copies');
-    this.currentValue_ = /** @type {string} */ (copies.value.toString());
+    if (this.inputValid_)
+      this.currentValue_ = /** @type {string} */ (copies.value.toString());
     const collate = this.getSetting('collate');
     this.$.collate.checked = /** @type {boolean} */ (collate.value);
   },

chrome/browser/resources/print_preview/new/number_settings_section.html

@@ -35,7 +35,7 @@
         <span class="input-wrapper">
           <input id="userValue" class="user-value" type="number"
               max="[[maxValue]]" min="[[minValue]]" data-timeout-delay="250"
-              disabled$="[[getDisabled_(inputValid, disabled)]]"
+              disabled$="[[getDisabled_(disabled)]]"
               on-blur="onBlur_" aria-labelled-by="section-title">
           <slot name="opt-inside-content"></slot>
         </span>

chrome/browser/resources/print_preview/new/scaling_settings.js

@@ -30,7 +30,10 @@ Polymer({
     documentInfo: Object,
 
     /** @private {string} */
-    currentValue_: String,
+    currentValue_: {
+      type: String,
+      observer: 'onInputChanged_',
+    },
 
     /** @private {boolean} */
     inputValid_: Boolean,
@@ -51,7 +54,6 @@ Polymer({
   observers: [
     'onFitToPageSettingChange_(settings.fitToPage.value)',
     'onFitToPageScalingSet_(documentInfo.fitToPageScaling)',
-    'onInputChanged_(currentValue_, inputValid_)',
     'onScalingSettingChanged_(settings.scaling.value)',
     'onScalingValidChanged_(settings.scaling.valid)',
   ],