Printing: Hide queue input when protocol is set to "App Socket"

Bug: 1132952
Test: browser_tests --gtest_filter=OSSettingsCupsPrinterPageV3Test.All
Change-Id: Ib32f26778d72f7b9c8ccf85883a2d0a09f335b84
Reviewed-on: https://chromium-review.googlesource.com/c/chromium/src/+/2481662Reviewed-by: Jimmy Gong <jimmyxgong@chromium.org>
Commit-Queue: Michael Checo <michaelcheco@google.com>
Cr-Commit-Position: refs/heads/master@{#818165}

chrome/browser/resources/settings/chromeos/os_printing_page/cups_add_printer_manually_dialog.html

@@ -55,12 +55,14 @@
             </div>
           </div>
         </div>
-        <div class="settings-box two-line">
-          <cr-input id="printerQueueInput" label="$i18n{printerQueue}"
-              value="{{newPrinter.printerQueue}}" maxlength=64
-              on-keypress="onKeypress_">
-          </cr-input>
-        </div>
+        <template is="dom-if" if="[[showPrinterQueue_]]" restamp>
+          <div class="settings-box two-line">
+            <cr-input id="printerQueueInput" label="$i18n{printerQueue}"
+                value="{{newPrinter.printerQueue}}" maxlength=64
+                on-keypress="onKeypress_">
+            </cr-input>
+          </div>
+        </template>
       </div>
       <div slot="dialog-buttons">
         <!-- Left Group -->

chrome/browser/resources/settings/chromeos/os_printing_page/cups_add_printer_manually_dialog.js

@@ -52,6 +52,12 @@ Polymer({
       type: String,
       value: '',
     },
+
+    /** @private */
+    showPrinterQueue_: {
+      type: Boolean,
+      value: true,
+    },
   },
 
   observers: [
@@ -162,6 +168,8 @@ Polymer({
    * @private
    */
   onProtocolChange_(event) {
+    // Queue input should be hidden when protocol is set to "App Socket".
+    this.showPrinterQueue_ = event.target.value !== 'socket';
     this.set('newPrinter.printerProtocol', event.target.value);
   },
 

chrome/test/data/webui/settings/chromeos/cups_printer_page_tests.js

@@ -605,6 +605,27 @@ suite('CupsAddPrinterDialogTests', function() {
           assertFalse(addButton.disabled);
         });
   });
+
+  test('Queue input is hidden when protocol is App Socket', () => {
+    const addDialog = dialog.$$('add-printer-manually-dialog');
+    let printerQueueInput = addDialog.$$('#printerQueueInput');
+    const select = addDialog.shadowRoot.querySelector('select');
+    assertTrue(!!printerQueueInput);
+
+    select.value = 'socket';
+    select.dispatchEvent(new CustomEvent('change'), {'bubbles': true});
+    Polymer.dom.flush();
+
+    printerQueueInput = addDialog.$$('#printerQueueInput');
+    assertFalse(!!printerQueueInput);
+
+    select.value = 'http';
+    select.dispatchEvent(new CustomEvent('change'), {'bubbles': true});
+    Polymer.dom.flush();
+
+    printerQueueInput = addDialog.$$('#printerQueueInput');
+    assertTrue(!!printerQueueInput);
+  });
 });
 
 suite('EditPrinterDialog', function() {