chrome/test/data/webui/print_preview.js

   1 // Copyright (c) 2012 The Chromium Authors. All rights reserved.
   2 // Use of this source code is governed by a BSD-style license that can be
   3 // found in the LICENSE file.
   4
   5 /**
   6  * Test fixture for print preview WebUI testing.
   7  * @constructor
   8  * @extends {testing.Test}
   9  */
  10 function PrintPreviewWebUITest() {
  11   testing.Test.call(this);
  12   this.nativeLayer_ = null;
  13   this.initialSettings_ = null;
  14   this.localDestinationInfos_ = null;
  15 }
  16
  17 /**
  18  * Index of the "Save as PDF" printer.
  19  * @type {number}
  20  * @const
  21  */
  22 PrintPreviewWebUITest.PDF_INDEX = 0;
  23
  24 /**
  25  * Index of the Foo printer.
  26  * @type {number}
  27  * @const
  28  */
  29 PrintPreviewWebUITest.FOO_INDEX = 1;
  30
  31 /**
  32  * Index of the Bar printer.
  33  * @type {number}
  34  * @const
  35  */
  36 PrintPreviewWebUITest.BAR_INDEX = 2;
  37
  38 PrintPreviewWebUITest.prototype = {
  39   __proto__: testing.Test.prototype,
  40
  41   /**
  42    * Browse to the sample page, cause print preview & call preLoad().
  43    * @type {string}
  44    * @override
  45    */
  46   browsePrintPreload: 'print_preview_hello_world_test.html',
  47
  48   /** @override */
  49   runAccessibilityChecks: true,
  50
  51   /** @override */
  52   accessibilityIssuesAreErrors: true,
  53
  54   /** @override */
  55   isAsync: true,
  56
  57   /**
  58    * Stub out low-level functionality like the NativeLayer and
  59    * CloudPrintInterface.
  60    * @this {PrintPreviewWebUITest}
  61    * @override
  62    */
  63   preLoad: function() {
  64     window.addEventListener('DOMContentLoaded', function() {
  65       function NativeLayerStub() {
  66         cr.EventTarget.call(this);
  67       }
  68       NativeLayerStub.prototype = {
  69         __proto__: cr.EventTarget.prototype,
  70         startGetInitialSettings: function() {},
  71         startGetLocalDestinations: function() {},
  72         startGetPrivetDestinations: function() {},
  73         startGetLocalDestinationCapabilities: function(destinationId) {}
  74       };
  75       var oldNativeLayerEventType = print_preview.NativeLayer.EventType;
  76       var oldDuplexMode = print_preview.NativeLayer.DuplexMode;
  77       print_preview.NativeLayer = NativeLayerStub;
  78       print_preview.NativeLayer.EventType = oldNativeLayerEventType;
  79       print_preview.NativeLayer.DuplexMode = oldDuplexMode;
  80
  81       function CloudPrintInterfaceStub() {
  82         cr.EventTarget.call(this);
  83       }
  84       CloudPrintInterfaceStub.prototype = {
  85         __proto__: cr.EventTarget.prototype,
  86         search: function(isRecent) {}
  87       };
  88       var oldCpInterfaceEventType = cloudprint.CloudPrintInterface.EventType;
  89       cloudprint.CloudPrintInterface = CloudPrintInterfaceStub;
  90       cloudprint.CloudPrintInterface.EventType = oldCpInterfaceEventType;
  91
  92       print_preview.PreviewArea.prototype.checkPluginCompatibility_ =
  93           function() {
  94         return false;
  95       };
  96     }.bind(this));
  97   },
  98
  99   /**
 100    * Dispatch the INITIAL_SETTINGS_SET event. This call is NOT async and will
 101    * happen in the same thread.
 102    */
 103   setInitialSettings: function() {
 104     var initialSettingsSetEvent =
 105         new Event(print_preview.NativeLayer.EventType.INITIAL_SETTINGS_SET);
 106     initialSettingsSetEvent.initialSettings = this.initialSettings_;
 107     this.nativeLayer_.dispatchEvent(initialSettingsSetEvent);
 108   },
 109
 110   /**
 111    * Dispatch the LOCAL_DESTINATIONS_SET event. This call is NOT async and will
 112    * happen in the same thread.
 113    */
 114   setLocalDestinations: function() {
 115     var localDestsSetEvent =
 116         new Event(print_preview.NativeLayer.EventType.LOCAL_DESTINATIONS_SET);
 117     localDestsSetEvent.destinationInfos = this.localDestinationInfos_;
 118     this.nativeLayer_.dispatchEvent(localDestsSetEvent);
 119   },
 120
 121   /**
 122    * Dispatch the CAPABILITIES_SET event. This call is NOT async and will
 123    * happen in the same thread.
 124    * @device - The device whose capabilities should be dispatched.
 125    */
 126   setCapabilities: function(device) {
 127     var capsSetEvent =
 128         new Event(print_preview.NativeLayer.EventType.CAPABILITIES_SET);
 129     capsSetEvent.settingsInfo = device;
 130     this.nativeLayer_.dispatchEvent(capsSetEvent);
 131   },
 132
 133   /**
 134    * Even though animation duration and delay is set to zero, it is necessary to
 135    * wait until the animation has finished.
 136    */
 137   waitForAnimationToEnd: function(elementId) {
 138     // add a listener for the animation end event
 139     document.addEventListener('webkitAnimationEnd', function f(e) {
 140       if (e.target.id == elementId) {
 141         document.removeEventListener(f, 'webkitAnimationEnd');
 142         testDone();
 143       }
 144     });
 145   },
 146
 147   /**
 148    * Expand the 'More Settings' div to expose all options.
 149    */
 150   expandMoreSettings: function() {
 151     var moreSettings = $('more-settings');
 152     checkSectionVisible(moreSettings, true);
 153     moreSettings.click();
 154   },
 155
 156   /**
 157    * Generate a real C++ class; don't typedef.
 158    * @type {?string}
 159    * @override
 160    */
 161   typedefCppFixture: null,
 162
 163   /**
 164    * @this {PrintPreviewWebUITest}
 165    * @override
 166    */
 167   setUp: function() {
 168     Mock4JS.clearMocksToVerify();
 169
 170     this.initialSettings_ = new print_preview.NativeInitialSettings(
 171       false /*isInKioskAutoPrintMode*/,
 172       false /*isInAppKioskMode*/,
 173       false /*hidePrintWithSystemDialogLink*/,
 174       ',' /*thousandsDelimeter*/,
 175       '.' /*decimalDelimeter*/,
 176       1 /*unitType*/,
 177       true /*isDocumentModifiable*/,
 178       'title' /*documentTitle*/,
 179       true /*documentHasSelection*/,
 180       false /*selectionOnly*/,
 181       'FooDevice' /*systemDefaultDestinationId*/,
 182       null /*serializedAppStateStr*/,
 183       false /*documentHasSelection*/);
 184     this.localDestinationInfos_ = [
 185       { printerName: 'FooName', deviceName: 'FooDevice' },
 186       { printerName: 'BarName', deviceName: 'BarDevice' }
 187     ];
 188     this.nativeLayer_ = printPreview.nativeLayer_;
 189
 190     testing.Test.disableAnimationsAndTransitions();
 191   }
 192 };
 193
 194 GEN('#include "chrome/test/data/webui/print_preview.h"');
 195
 196 // Test some basic assumptions about the print preview WebUI.
 197 TEST_F('PrintPreviewWebUITest', 'TestPrinterList', function() {
 198   this.setInitialSettings();
 199   this.setLocalDestinations();
 200
 201   var recentList = $('destination-search').querySelector('.recent-list ul');
 202   var localList = $('destination-search').querySelector('.local-list ul');
 203   assertNotEquals(null, recentList);
 204   assertEquals(1, recentList.childNodes.length);
 205   assertEquals('FooName',
 206                recentList.childNodes.item(0).querySelector(
 207                    '.destination-list-item-name').textContent);
 208
 209   assertNotEquals(null, localList);
 210   assertEquals(3, localList.childNodes.length);
 211   assertEquals('Save as PDF',
 212                localList.childNodes.item(PrintPreviewWebUITest.PDF_INDEX).
 213                    querySelector('.destination-list-item-name').textContent);
 214   assertEquals('FooName',
 215                localList.childNodes.item(PrintPreviewWebUITest.FOO_INDEX).
 216                    querySelector('.destination-list-item-name').textContent);
 217   assertEquals('BarName',
 218                localList.childNodes.item(PrintPreviewWebUITest.BAR_INDEX).
 219                    querySelector('.destination-list-item-name').textContent);
 220
 221   testDone();
 222 });
 223
 224 // Test that the printer list is structured correctly after calling
 225 // addCloudPrinters with an empty list.
 226 TEST_F('PrintPreviewWebUITest', 'TestPrinterListCloudEmpty', function() {
 227   this.setInitialSettings();
 228   this.setLocalDestinations();
 229
 230   var cloudPrintEnableEvent =
 231       new Event(print_preview.NativeLayer.EventType.CLOUD_PRINT_ENABLE);
 232   cloudPrintEnableEvent.baseCloudPrintUrl = 'cloudprint url';
 233   this.nativeLayer_.dispatchEvent(cloudPrintEnableEvent);
 234
 235   var searchDoneEvent =
 236       new Event(cloudprint.CloudPrintInterface.EventType.SEARCH_DONE);
 237   searchDoneEvent.printers = [];
 238   searchDoneEvent.isRecent = true;
 239   searchDoneEvent.email = 'foo@chromium.org';
 240   printPreview.cloudPrintInterface_.dispatchEvent(searchDoneEvent);
 241
 242   var recentList = $('destination-search').querySelector('.recent-list ul');
 243   var localList = $('destination-search').querySelector('.local-list ul');
 244   var cloudList = $('destination-search').querySelector('.cloud-list ul');
 245
 246   assertNotEquals(null, recentList);
 247   assertEquals(1, recentList.childNodes.length);
 248   assertEquals('FooName',
 249                recentList.childNodes.item(0).querySelector(
 250                    '.destination-list-item-name').textContent);
 251
 252   assertNotEquals(null, localList);
 253   assertEquals(3, localList.childNodes.length);
 254   assertEquals('Save as PDF',
 255                localList.childNodes.item(PrintPreviewWebUITest.PDF_INDEX).
 256                    querySelector('.destination-list-item-name').textContent);
 257   assertEquals('FooName',
 258                localList.childNodes.item(PrintPreviewWebUITest.FOO_INDEX).
 259                    querySelector('.destination-list-item-name').textContent);
 260   assertEquals('BarName',
 261                localList.childNodes.item(PrintPreviewWebUITest.BAR_INDEX).
 262                    querySelector('.destination-list-item-name').textContent);
 263
 264   assertNotEquals(null, cloudList);
 265   assertEquals(0, cloudList.childNodes.length);
 266
 267   testDone();
 268 });
 269
 270 /**
 271  * Verify that |section| visibility matches |visible|.
 272  * @param {HTMLDivElement} section The section to check.
 273  * @param {boolean} visible The expected state of visibility.
 274  */
 275 function checkSectionVisible(section, visible) {
 276   assertNotEquals(null, section);
 277   expectEquals(
 278       visible, section.classList.contains('visible'), 'section=' + section.id);
 279 }
 280
 281 function checkElementDisplayed(el, isDisplayed) {
 282   assertNotEquals(null, el);
 283   expectEquals(isDisplayed,
 284                !el.hidden,
 285                'element="' + el.id + '" of class "' + el.classList + '"');
 286 }
 287
 288 function getCddTemplate(printerId) {
 289   return {
 290     printerId: printerId,
 291     capabilities: {
 292       version: '1.0',
 293       printer: {
 294         supported_content_type: [{content_type: 'application/pdf'}],
 295         collate: {},
 296         color: {
 297           option: [
 298             {type: 'STANDARD_COLOR', is_default: true},
 299             {type: 'STANDARD_MONOCHROME'}
 300           ]
 301         },
 302         copies: {},
 303         duplex: {
 304           option: [
 305             {type: 'NO_DUPLEX', is_default: true},
 306             {type: 'LONG_EDGE'},
 307             {type: 'SHORT_EDGE'}
 308           ]
 309         },
 310         page_orientation: {
 311           option: [
 312             {type: 'PORTRAIT', is_default: true},
 313             {type: 'LANDSCAPE'},
 314             {type: 'AUTO'}
 315           ]
 316         },
 317         media_size: {
 318           option: [
 319             { name: 'NA_LETTER',
 320               width_microns: 215900,
 321               height_microns: 279400,
 322               is_default: true
 323             }
 324           ]
 325         }
 326       }
 327     }
 328   };
 329 }
 330
 331 TEST_F('PrintPreviewWebUITest', 'TestPrintPreviewRestoreLocalDestination',
 332     function() {
 333   this.initialSettings_.serializedAppStateStr_ =
 334       '{"version":2,"selectedDestinationId":"ID",' +
 335       '"selectedDestinationOrigin":"local"}';
 336   this.setInitialSettings();
 337
 338   testDone();
 339 });
 340
 341 TEST_F('PrintPreviewWebUITest', 'TestSystemDialogLinkIsHiddenInAppKioskMode',
 342     function() {
 343   if (cr.isChromeOS) {
 344     assertEquals(null, $('system-dialog-link'));
 345   } else {
 346     this.initialSettings_.isInAppKioskMode_ = true;
 347     this.setInitialSettings();
 348
 349     checkElementDisplayed($('system-dialog-link'), false);
 350   }
 351
 352   testDone();
 353 });
 354
 355 // Test that disabled settings hide the disabled sections.
 356 TEST_F('PrintPreviewWebUITest', 'TestSectionsDisabled', function() {
 357   checkSectionVisible($('layout-settings'), false);
 358   checkSectionVisible($('color-settings'), false);
 359   checkSectionVisible($('copies-settings'), false);
 360
 361   this.setInitialSettings();
 362   this.setLocalDestinations();
 363   var device = getCddTemplate("FooDevice");
 364   device.capabilities.printer.color = {
 365     "option": [
 366       {"is_default": true, "type": "STANDARD_COLOR"}
 367     ]
 368   };
 369   delete device.capabilities.printer.copies;
 370   this.setCapabilities(device);
 371
 372   checkSectionVisible($('layout-settings'), true);
 373   checkSectionVisible($('color-settings'), false);
 374   checkSectionVisible($('copies-settings'), false);
 375
 376   this.waitForAnimationToEnd('other-options-collapsible');
 377 });
 378
 379 // When the source is 'PDF' and 'Save as PDF' option is selected, we hide the
 380 // fit to page option.
 381 TEST_F('PrintPreviewWebUITest', 'PrintToPDFSelectedCapabilities', function() {
 382   // Add PDF printer.
 383   this.initialSettings_.isDocumentModifiable_ = false;
 384   this.initialSettings_.systemDefaultDestinationId_ = 'Save as PDF';
 385   this.setInitialSettings();
 386
 387   var device = {
 388     printerId: 'Save as PDF',
 389     capabilities: {
 390       version: '1.0',
 391       printer: {
 392         page_orientation: {
 393           option: [
 394             {type: 'AUTO', is_default: true},
 395             {type: 'PORTRAIT'},
 396             {type: 'LANDSCAPE'}
 397           ]
 398         },
 399         color: {
 400           option: [
 401             {type: 'STANDARD_COLOR', is_default: true}
 402           ]
 403         },
 404         media_size: {
 405           option: [
 406             { name: 'NA_LETTER',
 407               width_microns: 0,
 408               height_microns: 0,
 409               is_default: true
 410             }
 411           ]
 412         }
 413       }
 414     }
 415   };
 416   this.setCapabilities(device);
 417
 418   checkSectionVisible($('other-options-settings'), false);
 419   checkSectionVisible($('media-size-settings'), false);
 420
 421   testDone();
 422 });
 423
 424 // When the source is 'HTML', we always hide the fit to page option and show
 425 // media size option.
 426 TEST_F('PrintPreviewWebUITest', 'SourceIsHTMLCapabilities', function() {
 427   this.setInitialSettings();
 428   this.setLocalDestinations();
 429   this.setCapabilities(getCddTemplate("FooDevice"));
 430
 431   var otherOptions = $('other-options-settings');
 432   var fitToPage = otherOptions.querySelector('.fit-to-page-container');
 433   var mediaSize = $('media-size-settings');
 434
 435   // Check that options are collapsed (section is visible, because duplex is
 436   // available).
 437   checkSectionVisible(otherOptions, true);
 438   checkElementDisplayed(fitToPage, false);
 439   checkSectionVisible(mediaSize, false);
 440
 441   this.expandMoreSettings();
 442
 443   checkElementDisplayed(fitToPage, false);
 444   checkSectionVisible(mediaSize, true);
 445
 446   this.waitForAnimationToEnd('more-settings');
 447 });
 448
 449 // When the source is "PDF", depending on the selected destination printer, we
 450 // show/hide the fit to page option and hide media size selection.
 451 TEST_F('PrintPreviewWebUITest', 'SourceIsPDFCapabilities', function() {
 452   this.initialSettings_.isDocumentModifiable_ = false;
 453   this.setInitialSettings();
 454   this.setLocalDestinations();
 455   this.setCapabilities(getCddTemplate("FooDevice"));
 456
 457   var otherOptions = $('other-options-settings');
 458   checkSectionVisible(otherOptions, true);
 459   checkElementDisplayed(
 460       otherOptions.querySelector('.fit-to-page-container'), true);
 461   expectTrue(
 462       otherOptions.querySelector('.fit-to-page-checkbox').checked);
 463   checkSectionVisible($('media-size-settings'), true);
 464
 465   this.waitForAnimationToEnd('other-options-collapsible');
 466 });
 467
 468 // When the print scaling is disabled for the source "PDF", we show the fit
 469 // to page option but the state is unchecked by default.
 470 TEST_F('PrintPreviewWebUITest', 'PrintScalingDisabledForPlugin', function() {
 471   this.initialSettings_.isDocumentModifiable_ = false;
 472   this.setInitialSettings();
 473   this.setLocalDestinations();
 474   this.setCapabilities(getCddTemplate("FooDevice"));
 475
 476   // Indicate that the PDF does not support scaling by default.
 477   var printPresetOptionsEvent = new Event(
 478       print_preview.NativeLayer.EventType.PRINT_PRESET_OPTIONS);
 479   printPresetOptionsEvent.optionsFromDocument = {disableScaling: true};
 480   this.nativeLayer_.dispatchEvent(printPresetOptionsEvent);
 481
 482   var otherOptions = $('other-options-settings');
 483   checkSectionVisible(otherOptions, true);
 484   checkElementDisplayed(
 485       otherOptions.querySelector('.fit-to-page-container'), true);
 486   expectFalse(
 487       otherOptions.querySelector('.fit-to-page-checkbox').checked);
 488
 489   this.waitForAnimationToEnd('other-options-collapsible');
 490 });
 491
 492 // When the number of copies print preset is set for source 'PDF', we update
 493 // the copies value if capability is supported by printer.
 494 TEST_F('PrintPreviewWebUITest', 'CheckNumCopiesPrintPreset', function() {
 495   this.initialSettings_.isDocumentModifiable_ = false;
 496   this.setInitialSettings();
 497   this.setLocalDestinations();
 498   this.setCapabilities(getCddTemplate("FooDevice"));
 499
 500   // Indicate that the number of copies print preset is set for source PDF.
 501   var printPresetOptions = {
 502     disableScaling: true,
 503     copies: 2
 504   };
 505   var printPresetOptionsEvent = new Event(
 506       print_preview.NativeLayer.EventType.PRINT_PRESET_OPTIONS);
 507   printPresetOptionsEvent.optionsFromDocument = printPresetOptions;
 508   this.nativeLayer_.dispatchEvent(printPresetOptionsEvent);
 509
 510   checkSectionVisible($('copies-settings'), true);
 511   expectEquals(
 512       printPresetOptions.copies,
 513       parseInt($('copies-settings').querySelector('.copies').value));
 514
 515   this.waitForAnimationToEnd('other-options-collapsible');
 516 });
 517
 518 // When the duplex print preset is set for source 'PDF', we update the
 519 // duplex setting if capability is supported by printer.
 520 TEST_F('PrintPreviewWebUITest', 'CheckDuplexPrintPreset', function() {
 521   this.initialSettings_.isDocumentModifiable_ = false;
 522   this.setInitialSettings();
 523   this.setLocalDestinations();
 524   this.setCapabilities(getCddTemplate("FooDevice"));
 525
 526   // Indicate that the duplex print preset is set to "long edge" for source PDF.
 527   var printPresetOptions = {
 528     duplex: 1
 529   };
 530   var printPresetOptionsEvent = new Event(
 531       print_preview.NativeLayer.EventType.PRINT_PRESET_OPTIONS);
 532   printPresetOptionsEvent.optionsFromDocument = printPresetOptions;
 533   this.nativeLayer_.dispatchEvent(printPresetOptionsEvent);
 534
 535   var otherOptions = $('other-options-settings');
 536   checkSectionVisible(otherOptions, true);
 537   checkElementDisplayed(otherOptions.querySelector('.duplex-container'), true);
 538   expectTrue(otherOptions.querySelector('.duplex-checkbox').checked);
 539
 540   this.waitForAnimationToEnd('other-options-collapsible');
 541 });
 542
 543 // Make sure that custom margins controls are properly set up.
 544 TEST_F('PrintPreviewWebUITest', 'CustomMarginsControlsCheck', function() {
 545   this.setInitialSettings();
 546   this.setLocalDestinations();
 547   this.setCapabilities(getCddTemplate("FooDevice"));
 548
 549   printPreview.printTicketStore_.marginsType.updateValue(
 550       print_preview.ticket_items.MarginsType.Value.CUSTOM);
 551
 552   ['left', 'top', 'right', 'bottom'].forEach(function(margin) {
 553     var control = $('preview-area').querySelector('.margin-control-' + margin);
 554     assertNotEquals(null, control);
 555     var input = control.querySelector('.margin-control-textbox');
 556     assertTrue(input.hasAttribute('aria-label'));
 557     assertNotEquals('undefined', input.getAttribute('aria-label'));
 558   });
 559   this.waitForAnimationToEnd('more-settings');
 560 });
 561
 562 // Page layout has zero margins. Hide header and footer option.
 563 TEST_F('PrintPreviewWebUITest', 'PageLayoutHasNoMarginsHideHeaderFooter',
 564     function() {
 565   this.setInitialSettings();
 566   this.setLocalDestinations();
 567   this.setCapabilities(getCddTemplate("FooDevice"));
 568
 569   var otherOptions = $('other-options-settings');
 570   var headerFooter = otherOptions.querySelector('.header-footer-container');
 571
 572   // Check that options are collapsed (section is visible, because duplex is
 573   // available).
 574   checkSectionVisible(otherOptions, true);
 575   checkElementDisplayed(headerFooter, false);
 576
 577   this.expandMoreSettings();
 578
 579   checkElementDisplayed(headerFooter, true);
 580
 581   printPreview.printTicketStore_.marginsType.updateValue(
 582       print_preview.ticket_items.MarginsType.Value.CUSTOM);
 583   printPreview.printTicketStore_.customMargins.updateValue(
 584       new print_preview.Margins(0, 0, 0, 0));
 585
 586   checkElementDisplayed(headerFooter, false);
 587
 588   this.waitForAnimationToEnd('more-settings');
 589 });
 590
 591 // Page layout has half-inch margins. Show header and footer option.
 592 TEST_F('PrintPreviewWebUITest', 'PageLayoutHasMarginsShowHeaderFooter',
 593     function() {
 594   this.setInitialSettings();
 595   this.setLocalDestinations();
 596   this.setCapabilities(getCddTemplate("FooDevice"));
 597
 598   var otherOptions = $('other-options-settings');
 599   var headerFooter = otherOptions.querySelector('.header-footer-container');
 600
 601   // Check that options are collapsed (section is visible, because duplex is
 602   // available).
 603   checkSectionVisible(otherOptions, true);
 604   checkElementDisplayed(headerFooter, false);
 605
 606   this.expandMoreSettings();
 607
 608   checkElementDisplayed(headerFooter, true);
 609
 610   printPreview.printTicketStore_.marginsType.updateValue(
 611       print_preview.ticket_items.MarginsType.Value.CUSTOM);
 612   printPreview.printTicketStore_.customMargins.updateValue(
 613       new print_preview.Margins(36, 36, 36, 36));
 614
 615   checkElementDisplayed(headerFooter, true);
 616
 617   this.waitForAnimationToEnd('more-settings');
 618 });
 619
 620 // Page layout has zero top and bottom margins. Hide header and footer option.
 621 TEST_F('PrintPreviewWebUITest',
 622        'ZeroTopAndBottomMarginsHideHeaderFooter',
 623        function() {
 624   this.setInitialSettings();
 625   this.setLocalDestinations();
 626   this.setCapabilities(getCddTemplate("FooDevice"));
 627
 628   var otherOptions = $('other-options-settings');
 629   var headerFooter = otherOptions.querySelector('.header-footer-container');
 630
 631   // Check that options are collapsed (section is visible, because duplex is
 632   // available).
 633   checkSectionVisible(otherOptions, true);
 634   checkElementDisplayed(headerFooter, false);
 635
 636   this.expandMoreSettings();
 637
 638   checkElementDisplayed(headerFooter, true);
 639
 640   printPreview.printTicketStore_.marginsType.updateValue(
 641       print_preview.ticket_items.MarginsType.Value.CUSTOM);
 642   printPreview.printTicketStore_.customMargins.updateValue(
 643       new print_preview.Margins(0, 36, 0, 36));
 644
 645   checkElementDisplayed(headerFooter, false);
 646
 647   this.waitForAnimationToEnd('more-settings');
 648 });
 649
 650 // Page layout has zero top and half-inch bottom margin. Show header and footer
 651 // option.
 652 TEST_F('PrintPreviewWebUITest',
 653        'ZeroTopAndNonZeroBottomMarginShowHeaderFooter',
 654        function() {
 655   this.setInitialSettings();
 656   this.setLocalDestinations();
 657   this.setCapabilities(getCddTemplate("FooDevice"));
 658
 659   var otherOptions = $('other-options-settings');
 660   var headerFooter = otherOptions.querySelector('.header-footer-container');
 661
 662   // Check that options are collapsed (section is visible, because duplex is
 663   // available).
 664   checkSectionVisible(otherOptions, true);
 665   checkElementDisplayed(headerFooter, false);
 666
 667   this.expandMoreSettings();
 668
 669   checkElementDisplayed(headerFooter, true);
 670
 671   printPreview.printTicketStore_.marginsType.updateValue(
 672       print_preview.ticket_items.MarginsType.Value.CUSTOM);
 673   printPreview.printTicketStore_.customMargins.updateValue(
 674       new print_preview.Margins(0, 36, 36, 36));
 675
 676   checkElementDisplayed(headerFooter, true);
 677
 678   this.waitForAnimationToEnd('more-settings');
 679 });
 680
 681 // Test that the color settings, one option, standard monochrome.
 682 TEST_F('PrintPreviewWebUITest', 'TestColorSettingsMonochrome', function() {
 683   this.setInitialSettings();
 684   this.setLocalDestinations();
 685
 686   // Only one option, standard monochrome.
 687   var device = getCddTemplate("FooDevice");
 688   device.capabilities.printer.color = {
 689     "option": [
 690       {"is_default": true, "type": "STANDARD_MONOCHROME"}
 691     ]
 692   };
 693   this.setCapabilities(device);
 694
 695   checkSectionVisible($('color-settings'), false);
 696
 697   this.waitForAnimationToEnd('more-settings');
 698 });
 699
 700 // Test that the color settings, one option, custom monochrome.
 701 TEST_F('PrintPreviewWebUITest', 'TestColorSettingsCustomMonochrome',
 702     function() {
 703   this.setInitialSettings();
 704   this.setLocalDestinations();
 705
 706   // Only one option, standard monochrome.
 707   var device = getCddTemplate("FooDevice");
 708   device.capabilities.printer.color = {
 709     "option": [
 710       {"is_default": true, "type": "CUSTOM_MONOCHROME", "vendor_id": "42"}
 711     ]
 712   };
 713   this.setCapabilities(device);
 714
 715   checkSectionVisible($('color-settings'), false);
 716
 717   this.waitForAnimationToEnd('more-settings');
 718 });
 719
 720 // Test that the color settings, one option, standard color.
 721 TEST_F('PrintPreviewWebUITest', 'TestColorSettingsColor', function() {
 722   this.setInitialSettings();
 723   this.setLocalDestinations();
 724
 725   var device = getCddTemplate("FooDevice");
 726   device.capabilities.printer.color = {
 727     "option": [
 728       {"is_default": true, "type": "STANDARD_COLOR"}
 729     ]
 730   };
 731   this.setCapabilities(device);
 732
 733   checkSectionVisible($('color-settings'), false);
 734
 735   this.waitForAnimationToEnd('more-settings');
 736 });
 737
 738 // Test that the color settings, one option, custom color.
 739 TEST_F('PrintPreviewWebUITest', 'TestColorSettingsCustomColor', function() {
 740   this.setInitialSettings();
 741   this.setLocalDestinations();
 742
 743   var device = getCddTemplate("FooDevice");
 744   device.capabilities.printer.color = {
 745     "option": [
 746       {"is_default": true, "type": "CUSTOM_COLOR", "vendor_id": "42"}
 747     ]
 748   };
 749   this.setCapabilities(device);
 750
 751   checkSectionVisible($('color-settings'), false);
 752
 753   this.waitForAnimationToEnd('more-settings');
 754 });
 755
 756 // Test that the color settings, two options, both standard, defaults to color.
 757 TEST_F('PrintPreviewWebUITest', 'TestColorSettingsBothStandardDefaultColor',
 758     function() {
 759   this.setInitialSettings();
 760   this.setLocalDestinations();
 761
 762   var device = getCddTemplate("FooDevice");
 763   device.capabilities.printer.color = {
 764     "option": [
 765       {"type": "STANDARD_MONOCHROME"},
 766       {"is_default": true, "type": "STANDARD_COLOR"}
 767     ]
 768   };
 769   this.setCapabilities(device);
 770
 771   checkSectionVisible($('color-settings'), true);
 772   expectEquals(
 773       'color',
 774       $('color-settings').querySelector('.color-settings-select').value);
 775
 776   this.waitForAnimationToEnd('more-settings');
 777 });
 778
 779 // Test that the color settings, two options, both standard, defaults to
 780 // monochrome.
 781 TEST_F('PrintPreviewWebUITest',
 782     'TestColorSettingsBothStandardDefaultMonochrome', function() {
 783   this.setInitialSettings();
 784   this.setLocalDestinations();
 785
 786   var device = getCddTemplate("FooDevice");
 787   device.capabilities.printer.color = {
 788     "option": [
 789       {"is_default": true, "type": "STANDARD_MONOCHROME"},
 790       {"type": "STANDARD_COLOR"}
 791     ]
 792   };
 793   this.setCapabilities(device);
 794
 795   checkSectionVisible($('color-settings'), true);
 796   expectEquals(
 797       'bw', $('color-settings').querySelector('.color-settings-select').value);
 798
 799   this.waitForAnimationToEnd('more-settings');
 800 });
 801
 802 // Test that the color settings, two options, both custom, defaults to color.
 803 TEST_F('PrintPreviewWebUITest',
 804     'TestColorSettingsBothCustomDefaultColor', function() {
 805   this.setInitialSettings();
 806   this.setLocalDestinations();
 807
 808   var device = getCddTemplate("FooDevice");
 809   device.capabilities.printer.color = {
 810     "option": [
 811       {"type": "CUSTOM_MONOCHROME", "vendor_id": "42"},
 812       {"is_default": true, "type": "CUSTOM_COLOR", "vendor_id": "43"}
 813     ]
 814   };
 815   this.setCapabilities(device);
 816
 817   checkSectionVisible($('color-settings'), true);
 818   expectEquals(
 819       'color',
 820       $('color-settings').querySelector('.color-settings-select').value);
 821
 822   this.waitForAnimationToEnd('more-settings');
 823 });
 824
 825 // Test to verify that duplex settings are set according to the printer
 826 // capabilities.
 827 TEST_F('PrintPreviewWebUITest', 'TestDuplexSettingsTrue', function() {
 828   this.setInitialSettings();
 829   this.setLocalDestinations();
 830   this.setCapabilities(getCddTemplate("FooDevice"));
 831
 832   var otherOptions = $('other-options-settings');
 833   checkSectionVisible(otherOptions, true);
 834   expectFalse(otherOptions.querySelector('.duplex-container').hidden);
 835   expectFalse(otherOptions.querySelector('.duplex-checkbox').checked);
 836
 837   this.waitForAnimationToEnd('more-settings');
 838 });
 839
 840 // Test to verify that duplex settings are set according to the printer
 841 // capabilities.
 842 TEST_F('PrintPreviewWebUITest', 'TestDuplexSettingsFalse', function() {
 843   this.setInitialSettings();
 844   this.setLocalDestinations();
 845   var device = getCddTemplate("FooDevice");
 846   delete device.capabilities.printer.duplex;
 847   this.setCapabilities(device);
 848
 849   // Check that it is collapsed.
 850   var otherOptions = $('other-options-settings');
 851   checkSectionVisible(otherOptions, false);
 852
 853   this.expandMoreSettings();
 854
 855   // Now it should be visible.
 856   checkSectionVisible(otherOptions, true);
 857   expectTrue(otherOptions.querySelector('.duplex-container').hidden);
 858
 859   this.waitForAnimationToEnd('more-settings');
 860 });
 861
 862 // Test that changing the selected printer updates the preview.
 863 TEST_F('PrintPreviewWebUITest', 'TestPrinterChangeUpdatesPreview', function() {
 864   this.setInitialSettings();
 865   this.setLocalDestinations();
 866   this.setCapabilities(getCddTemplate("FooDevice"));
 867
 868   var previewGenerator = mock(print_preview.PreviewGenerator);
 869   printPreview.previewArea_.previewGenerator_ = previewGenerator.proxy();
 870   previewGenerator.expects(exactly(6)).requestPreview();
 871
 872   var barDestination;
 873   var destinations = printPreview.destinationStore_.destinations();
 874   for (var destination, i = 0; destination = destinations[i]; i++) {
 875     if (destination.id == 'BarDevice') {
 876       barDestination = destination;
 877       break;
 878     }
 879   }
 880
 881   printPreview.destinationStore_.selectDestination(barDestination);
 882
 883   var device = getCddTemplate("BarDevice");
 884   device.capabilities.printer.color = {
 885     "option": [
 886       {"is_default": true, "type": "STANDARD_MONOCHROME"}
 887     ]
 888   };
 889   this.setCapabilities(device);
 890
 891   this.waitForAnimationToEnd('more-settings');
 892 });
 893
 894 // Test that error message is displayed when plugin doesn't exist.
 895 TEST_F('PrintPreviewWebUITest', 'TestNoPDFPluginErrorMessage', function() {
 896   var previewAreaEl = $('preview-area');
 897
 898   var loadingMessageEl =
 899       previewAreaEl.getElementsByClassName('preview-area-loading-message')[0];
 900   expectEquals(true, loadingMessageEl.hidden);
 901
 902   var previewFailedMessageEl = previewAreaEl.getElementsByClassName(
 903       'preview-area-preview-failed-message')[0];
 904   expectEquals(true, previewFailedMessageEl.hidden);
 905
 906   var printFailedMessageEl =
 907       previewAreaEl.getElementsByClassName('preview-area-print-failed')[0];
 908   expectEquals(true, printFailedMessageEl.hidden);
 909
 910   var customMessageEl =
 911       previewAreaEl.getElementsByClassName('preview-area-custom-message')[0];
 912   expectEquals(false, customMessageEl.hidden);
 913
 914   testDone();
 915 });
 916
 917 // Test custom localized paper names.
 918 TEST_F('PrintPreviewWebUITest', 'TestCustomPaperNames', function() {
 919   this.setInitialSettings();
 920   this.setLocalDestinations();
 921
 922   var customLocalizedMediaName = 'Vendor defined localized media name';
 923   var customMediaName = 'Vendor defined media name';
 924
 925   var device = getCddTemplate("FooDevice");
 926   device.capabilities.printer.media_size = {
 927     option: [
 928       { name: 'CUSTOM',
 929         width_microns: 15900,
 930         height_microns: 79400,
 931         is_default: true,
 932         custom_display_name_localized: [
 933           { locale: navigator.language,
 934             value: customLocalizedMediaName
 935           }
 936         ]
 937       },
 938       { name: 'CUSTOM',
 939         width_microns: 15900,
 940         height_microns: 79400,
 941         custom_display_name: customMediaName
 942       }
 943     ]
 944   };
 945
 946   this.setCapabilities(device);
 947
 948   this.expandMoreSettings();
 949
 950   checkSectionVisible($('media-size-settings'), true);
 951   var mediaSelect = $('media-size-settings').querySelector('.settings-select');
 952   // Check the default media item.
 953   expectEquals(
 954       customLocalizedMediaName,
 955       mediaSelect.options[mediaSelect.selectedIndex].text);
 956   // Check the other media item.
 957   expectEquals(
 958       customMediaName,
 959       mediaSelect.options[mediaSelect.selectedIndex == 0 ? 1 : 0].text);
 960
 961   this.waitForAnimationToEnd('more-settings');
 962 });