Print Preview Refresh: Add tests

Adding/modifying tests to cover some newly tweaked behaviors and a
recent regression:
(1) Destinations dialog correctly does not close if escape is pressed
while in the search box if there is any text, but does close if there
is no text.
(2) Copies setting correctly stays valid for an empty input, and the
input is reset to the default value if blurred. However, if an invalid
value is explictly entered, the setting does not stay valid or reset
to the default value when cleared.
(3) Number settings sections correctly block 'E' and '+' key events.

(2) is broken into 2 separate tests. The new interactive test for
number-settings-section validates the reset/no reset on blur behavior.
The additions to the SetCopies test verify that the setting value is
correctly set/not set for the various cases.

Bug: None
Change-Id: If7e3461c525c9cf057ac9404d5bf5da5da03e9f2
Reviewed-on: https://chromium-review.googlesource.com/1252339
Commit-Queue: Rebekah Potter <rbpotter@chromium.org>
Reviewed-by: Demetrios Papadopoulos <dpapad@chromium.org>
Cr-Commit-Position: refs/heads/master@{#596302}

chrome/test/data/webui/print_preview/destination_dialog_interactive_test.js

@@ -6,6 +6,7 @@ cr.define('destination_dialog_interactive_test', function() {
   /** @enum {string} */
   const TestNames = {
     FocusSearchBox: 'focus search box',
+    EscapeSearchBox: 'escape search box',
   };
 
   const suiteName = 'DestinationDialogInteractiveTest';
@@ -59,6 +60,56 @@ cr.define('destination_dialog_interactive_test', function() {
       dialog.show();
       return whenFocusDone;
     });
+
+    // Tests that pressing the escape key while the search box is focused
+    // closes the dialog if and only if the query is empty.
+    test(assert(TestNames.EscapeSearchBox), function() {
+      const searchInput = dialog.$.searchBox.getSearchInput();
+      assertTrue(!!searchInput);
+      const whenFocusDone = test_util.eventToPromise('focus', searchInput);
+      destinationStore.startLoadAllDestinations();
+      dialog.show();
+      return whenFocusDone
+          .then(() => {
+            assertTrue(dialog.$.dialog.open);
+
+            // Put something in the search box.
+            const whenSearchChanged =
+                test_util.eventToPromise('search-changed', dialog.$.searchBox);
+            dialog.$.searchBox.setValue('query');
+            return whenSearchChanged;
+          })
+          .then(() => {
+            assertEquals('query', searchInput.value);
+
+            // Simulate escape
+            const whenKeyDown = test_util.eventToPromise('keydown', dialog);
+            MockInteractions.keyDownOn(searchInput, 19, [], 'Escape');
+            return whenKeyDown;
+          })
+          .then(() => {
+            // Dialog should still be open.
+            assertTrue(dialog.$.dialog.open);
+
+            // Clear the search box.
+            const whenSearchChanged =
+                test_util.eventToPromise('search-changed', dialog.$.searchBox);
+            dialog.$.searchBox.setValue('');
+            return whenSearchChanged;
+          })
+          .then(() => {
+            assertEquals('', searchInput.value);
+
+            // Simulate escape
+            const whenKeyDown = test_util.eventToPromise('keydown', dialog);
+            MockInteractions.keyDownOn(searchInput, 19, [], 'Escape');
+            return whenKeyDown;
+          })
+          .then(() => {
+            // Dialog is closed.
+            assertFalse(dialog.$.dialog.open);
+          });
+    });
   });
 
   return {

chrome/test/data/webui/print_preview/number_settings_section_interactive_test.js

+// Copyright 2018 The Chromium Authors. All rights reserved.
+// Use of this source code is governed by a BSD-style license that can be
+// found in the LICENSE file.
+
+cr.define('number_settings_section_interactive_test', function() {
+  /** @enum {string} */
+  const TestNames = {
+    BlurResetsEmptyInput: 'blur resets empty input',
+  };
+
+  const suiteName = 'NumberSettingsSectionInteractiveTest';
+  suite(suiteName, function() {
+    /** @type {?PrintPreviewNumberSettingsSectionElement} */
+    let numberSettings = null;
+
+    /** @override */
+    setup(function() {
+      PolymerTest.clearBody();
+
+      document.body.innerHTML = `
+          <print-preview-number-settings-section id="numberSettings"
+              min-value="1" max-value="100" default-value="50"
+              current-value="10" hint-message="incorrect value entered"
+              input-valid>
+          </print-preview-number-settings-section>`;
+      numberSettings = document.querySelector('#numberSettings');
+    });
+
+    // Verifies that blurring the input will reset it to the default if it is
+    // empty, but not if it contains an invalid value.
+    test(assert(TestNames.BlurResetsEmptyInput), function() {
+      // Initial value is 10.
+      const crInput = numberSettings.getInput();
+      const input = crInput.inputElement;
+      assertEquals('10', input.value);
+
+      // Set something invalid in the input.
+      const whenFocused = test_util.eventToPromise('focus', input);
+      input.focus();
+      print_preview_test_utils.triggerInputEvent(input, '0');
+      return test_util.eventToPromise('input-change', numberSettings)
+          .then(() => {
+            assertEquals('0', input.value);
+            assertTrue(crInput.invalid);
+
+            // Blurring the input does not clear it or clear the error if there
+            // is an explicit invalid value.
+            input.blur();
+            assertEquals('0', input.value);
+            assertTrue(crInput.invalid);
+
+            // Clear the input.
+            input.focus();
+            print_preview_test_utils.triggerInputEvent(input, '');
+            return test_util.eventToPromise('input-change', numberSettings);
+          })
+          .then(() => {
+            assertEquals('', input.value);
+            assertFalse(crInput.invalid);
+
+            // Blurring the input clears it to the default when it is empty.
+            input.blur();
+            assertEquals('50', input.value);
+            assertFalse(crInput.invalid);
+          });
+    });
+  });
+
+  return {
+    suiteName: suiteName,
+    TestNames: TestNames,
+  };
+});

chrome/test/data/webui/print_preview/number_settings_section_test.js

@@ -20,8 +20,8 @@ cr.define('number_settings_section_test', function() {
       document.body.innerHTML = `
         <div id="parentElement">
           <print-preview-number-settings-section id="numberSettings"
-              disabled="false" min-value="1" max-value="100" default-value="50"
-              hint-message="incorrect value entered" input-valid="true">
+              min-value="1" max-value="100" default-value="50"
+              hint-message="incorrect value entered" input-valid>
           </print-preview-number-settings-section>
         </div>`;
       parentElement = document.querySelector('#parentElement');
@@ -44,17 +44,29 @@ cr.define('number_settings_section_test', function() {
         return whenKeyDown;
       };
 
-      return sendKeyDownAndReturnPromise(69, 'e').then(e => {
+      return sendKeyDownAndReturnPromise(69, 'e')
+          .then(e => {
             assertTrue(e.defaultPrevented);
             return sendKeyDownAndReturnPromise(110, '.');
-      }).then(e => {
+          })
+          .then(e => {
             assertTrue(e.defaultPrevented);
             return sendKeyDownAndReturnPromise(109, '-');
-      }).then(e => {
+          })
+          .then(e => {
+            assertTrue(e.defaultPrevented);
+            return sendKeyDownAndReturnPromise(69, 'E');
+          })
+          .then(e => {
+            assertTrue(e.defaultPrevented);
+            return sendKeyDownAndReturnPromise(187, '+');
+          })
+          .then(e => {
             assertTrue(e.defaultPrevented);
             // Try a valid key.
             return sendKeyDownAndReturnPromise(49, '1');
-      }).then(e => {
+          })
+          .then(e => {
             assertFalse(e.defaultPrevented);
           });
     });

chrome/test/data/webui/print_preview/print_preview_interactive_ui_tests.js

@@ -100,6 +100,13 @@ TEST_F(
           destination_dialog_interactive_test.TestNames.FocusSearchBox);
     });
 
+TEST_F(
+    'PrintPreviewDestinationDialogInteractiveTest', 'EscapeSearchBox',
+    function() {
+      this.runMochaTest(
+          destination_dialog_interactive_test.TestNames.EscapeSearchBox);
+    });
+
 PrintPreviewPagesSettingsTest = class extends PrintPreviewInteractiveUITest {
   /** @override */
   get browsePreload() {
@@ -140,3 +147,32 @@ TEST_F('PrintPreviewPagesSettingsTest', 'ClearInput', function() {
 TEST_F('PrintPreviewPagesSettingsTest', 'TabOrder', function() {
   this.runMochaTest(pages_settings_test.TestNames.TabOrder);
 });
+
+PrintPreviewNumberSettingsSectionInteractiveTest =
+    class extends PrintPreviewInteractiveUITest {
+  /** @override */
+  get browsePreload() {
+    return 'chrome://print/new/number_settings_section.html';
+  }
+
+  /** @override */
+  get extraLibraries() {
+    return super.extraLibraries.concat([
+      '../settings/test_util.js',
+      'print_preview_test_utils.js',
+      'number_settings_section_interactive_test.js',
+    ]);
+  }
+
+  /** @override */
+  get suiteName() {
+    return number_settings_section_interactive_test.suiteName;
+  }
+};
+
+TEST_F(
+    'PrintPreviewNumberSettingsSectionInteractiveTest', 'BlurResetsEmptyInput',
+    function() {
+      this.runMochaTest(number_settings_section_interactive_test.TestNames
+                            .BlurResetsEmptyInput);
+    });

chrome/test/data/webui/print_preview/print_preview_test_utils.js

@@ -281,6 +281,16 @@ cr.define('print_preview_test_utils', function() {
     };
   }
 
+  /**
+   * @param {!HTMLInputElement} element
+   * @param {!string} input The value to set for the input element.
+   */
+  function triggerInputEvent(element, input) {
+    element.value = input;
+    element.dispatchEvent(
+        new CustomEvent('input', {composed: true, bubbles: true}));
+  }
+
   return {
     getDefaultInitialSettings: getDefaultInitialSettings,
     getCddTemplate: getCddTemplate,
@@ -293,5 +303,6 @@ cr.define('print_preview_test_utils', function() {
     getMediaSizeCapabilityWithCustomNames:
         getMediaSizeCapabilityWithCustomNames,
     getPdfPrinter: getPdfPrinter,
+    triggerInputEvent: triggerInputEvent,
   };
 });

chrome/test/data/webui/print_preview/settings_section_test.js

@@ -106,16 +106,6 @@ cr.define('settings_sections_tests', function() {
       moreSettingsElement.$.label.click();
     }
 
-    /**
-     * @param {!HTMLInputElement} element
-     * @param {!string} input The value to set for the input element.
-     */
-    function triggerInputEvent(element, input) {
-      element.value = input;
-      element.dispatchEvent(
-          new CustomEvent('input', {composed: true, bubbles: true}));
-    }
-
     test(assert(TestNames.Copies), function() {
       const copiesElement = page.$$('print-preview-copies-settings');
       assertFalse(copiesElement.hidden);
@@ -587,7 +577,7 @@ cr.define('settings_sections_tests', function() {
       // platforms.
       pagesElement.set('optionSelected_', pagesElement.pagesValueEnum_.CUSTOM);
 
-      triggerInputEvent(pagesInput, '1-2');
+      print_preview_test_utils.triggerInputEvent(pagesInput, '1-2');
       return test_util.eventToPromise('input-change', pagesElement)
           .then(function() {
             validateInputState(false, '1-2', true);
@@ -598,7 +588,7 @@ cr.define('settings_sections_tests', function() {
             assertTrue(page.settings.pages.valid);
 
             // Select pages 1 and 3
-            triggerInputEvent(pagesInput, '1, 3');
+            print_preview_test_utils.triggerInputEvent(pagesInput, '1, 3');
             return test_util.eventToPromise('input-change', pagesElement);
           })
           .then(function() {
@@ -612,7 +602,7 @@ cr.define('settings_sections_tests', function() {
             assertTrue(page.settings.pages.valid);
 
             // Enter an out of bounds value.
-            triggerInputEvent(pagesInput, '5');
+            print_preview_test_utils.triggerInputEvent(pagesInput, '5');
             return test_util.eventToPromise('input-change', pagesElement);
           })
           .then(function() {
@@ -635,7 +625,7 @@ cr.define('settings_sections_tests', function() {
       assertEquals(1, page.settings.copies.value);
 
       // Change to 2
-      triggerInputEvent(copiesInput, '2');
+      print_preview_test_utils.triggerInputEvent(copiesInput, '2');
       return test_util.eventToPromise('input-change', copiesElement)
           .then(function() {
             assertEquals(2, page.settings.copies.value);
@@ -650,6 +640,37 @@ cr.define('settings_sections_tests', function() {
             assertFalse(collateInput.checked);
             collateInput.dispatchEvent(new CustomEvent('change'));
             assertFalse(page.settings.collate.value);
+
+            // Set an empty value.
+            print_preview_test_utils.triggerInputEvent(copiesInput, '');
+            return test_util.eventToPromise('input-change', copiesElement);
+          })
+          .then(function() {
+            // Collate should be hidden now, but no update to the backing value
+            // occurs.
+            assertTrue(copiesElement.$$('.checkbox').hidden);
+            assertTrue(page.settings.copies.valid);
+            assertEquals(2, page.settings.copies.value);
+
+            // If the field is blurred, it will be reset to the default by the
+            // number-settings-section. Simulate this ocurring.
+            const numberSettingsSection =
+                copiesElement.$$('print-preview-number-settings-section');
+            numberSettingsSection.$.userValue.value = '1';
+            numberSettingsSection.currentValue = '1';
+            assertTrue(page.settings.copies.valid);
+            assertEquals(1, page.settings.copies.value);
+
+            // Enter an invalid value.
+            print_preview_test_utils.triggerInputEvent(copiesInput, '0');
+            return test_util.eventToPromise('input-change', copiesElement);
+          })
+          .then(function() {
+            // Collate should be hidden. Value is not updated to the invalid
+            // number. Setting is marked invalid.
+            assertTrue(copiesElement.$$('.checkbox').hidden);
+            assertFalse(page.settings.copies.valid);
+            assertEquals(1, page.settings.copies.value);
           });
     });
 
@@ -884,7 +905,7 @@ cr.define('settings_sections_tests', function() {
       validateScalingState('100', true, false, false);
 
       // Change to 105
-      triggerInputEvent(scalingInput, '105');
+      print_preview_test_utils.triggerInputEvent(scalingInput, '105');
       return test_util.eventToPromise('input-change', scalingElement)
           .then(function() {
             validateScalingState('105', true, false, false);
@@ -902,7 +923,7 @@ cr.define('settings_sections_tests', function() {
 
             // Set scaling. Should uncheck fit to page and set the settings for
             // scaling and fit to page.
-            triggerInputEvent(scalingInput, '95');
+            print_preview_test_utils.triggerInputEvent(scalingInput, '95');
             return test_util.eventToPromise('input-change', scalingElement);
           })
           .then(function() {
@@ -910,7 +931,7 @@ cr.define('settings_sections_tests', function() {
 
             // Set scaling to something invalid. Should change setting validity
             // but not value.
-            triggerInputEvent(scalingInput, '5');
+            print_preview_test_utils.triggerInputEvent(scalingInput, '5');
             return test_util.eventToPromise('input-change', scalingElement);
           })
           .then(function() {
@@ -951,7 +972,7 @@ cr.define('settings_sections_tests', function() {
             // change the stored value of scaling or fit to page, to avoid an
             // unnecessary preview regeneration, but should display fit to page
             // as unchecked.
-            triggerInputEvent(scalingInput, '9');
+            print_preview_test_utils.triggerInputEvent(scalingInput, '9');
             return test_util.eventToPromise('input-change', scalingElement);
           })
           .then(function() {
@@ -960,7 +981,7 @@ cr.define('settings_sections_tests', function() {
             // Enter a blank value in the scaling field. This should not
             // change the stored value of scaling or fit to page, to avoid an
             // unnecessary preview regeneration.
-            triggerInputEvent(scalingInput, '');
+            print_preview_test_utils.triggerInputEvent(scalingInput, '');
             return test_util.eventToPromise('input-change', scalingElement);
           })
           .then(function() {
@@ -968,7 +989,7 @@ cr.define('settings_sections_tests', function() {
 
             // Entering something valid unsets fit to page and sets scaling
             // valid to true.
-            triggerInputEvent(scalingInput, '90');
+            print_preview_test_utils.triggerInputEvent(scalingInput, '90');
             return test_util.eventToPromise('input-change', scalingElement);
           })
           .then(function() {

testing/buildbot/filters/webui_polymer2_interactive_ui_tests.filter

@@ -13,7 +13,8 @@ CrSettingsFocusRowBehavior.FocusTest
 CrSettingsSyncPageTest.All
 MaterialBookmarksFocusTest.All
 MaterialHistoryFocusTest.All
-PrintPreviewDestinationDialogInteractiveTest.FocusSearchBox
-PrintPreviewPrintHeaderInteractiveTest.FocusPrintOnReady
+PrintPreviewDestinationDialogInteractiveTest.*
+PrintPreviewNumberSettingsSectionInteractiveTest.BlurResetsEmptyInput
 PrintPreviewPagesSettingsTest.*
+PrintPreviewPrintHeaderInteractiveTest.FocusPrintOnReady
 SettingsUIBrowserTest.All