src/third_party/trace-viewer/src/ui/overlay_test.js

   1 // Copyright (c) 2013 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 'use strict';
   6
   7 base.require('ui.overlay');
   8 base.require('ui.dom_helpers');
   9
  10 base.unittest.testSuite('ui.overlay', function() {
  11   function addShowButtonForDialog(dlg) {
  12     var btn = document.createElement('button');
  13     btn.textContent = 'Launch Overlay';
  14     btn.addEventListener('click', function(e) {
  15       dlg.visible = true;
  16       e.stopPropagation();
  17     });
  18
  19     this.addHTMLOutput(btn);
  20   }
  21
  22   function makeButton(title) {
  23     var btn = document.createElement('button');
  24     btn.textContent = title;
  25     return btn;
  26   }
  27
  28   function makeCloseButton(dlg) {
  29     var btn = makeButton('close');
  30     btn.addEventListener('click', function(e) {
  31       dlg.onClose_(e);
  32     });
  33     return btn;
  34   }
  35
  36   test('instantiate', function() {
  37     var dlg = new ui.Overlay();
  38     dlg.classList.add('example-overlay');
  39     dlg.title = 'ExampleOverlay';
  40     dlg.innerHTML = 'hello';
  41     dlg.leftButtons.appendChild(makeButton('i am a button'));
  42     dlg.leftButtons.appendChild(makeCloseButton(dlg));
  43     dlg.rightButtons.appendChild(ui.createSpan({textContent: 'i am a span'}));
  44     addShowButtonForDialog.call(this, dlg);
  45   });
  46
  47   test('instantiate_noButtons', function() {
  48     var dlg = new ui.Overlay();
  49     dlg.classList.add('example-overlay');
  50     dlg.title = 'ExampleOverlay';
  51     dlg.innerHTML = 'hello';
  52     addShowButtonForDialog.call(this, dlg);
  53   });
  54
  55   test('instantiate_disableUserClose', function() {
  56     var dlg = new ui.Overlay();
  57     dlg.classList.add('example-overlay');
  58     dlg.userCanClose = false;
  59     dlg.title = 'Unclosable';
  60     dlg.innerHTML = 'This has no close X button.';
  61     dlg.leftButtons.appendChild(makeCloseButton(dlg));
  62     addShowButtonForDialog.call(this, dlg);
  63   });
  64
  65   test('instantiateTall', function() {
  66     var dlg = new ui.Overlay();
  67     dlg.title = 'TallContent';
  68     var contentEl = document.createElement('div');
  69     contentEl.style.overflowY = 'auto';
  70     dlg.appendChild(contentEl);
  71
  72     for (var i = 0; i < 1000; i++) {
  73       var el = document.createElement('div');
  74       el.textContent = 'line ' + i;
  75       contentEl.appendChild(el);
  76     }
  77
  78
  79     dlg.leftButtons.appendChild(makeButton('i am a button'));
  80     addShowButtonForDialog.call(this, dlg);
  81   });
  82
  83   test('instantiateTallWithManyDirectChildren', function() {
  84     var dlg = new ui.Overlay();
  85     dlg.title = 'TallContent';
  86     for (var i = 0; i < 100; i++) {
  87       var el = document.createElement('div');
  88       el.style.webkitFlex = '1 0 auto';
  89       el.textContent = 'line ' + i;
  90       dlg.appendChild(el);
  91     }
  92
  93     dlg.leftButtons.appendChild(makeButton('i am a button'));
  94     addShowButtonForDialog.call(this, dlg);
  95   });
  96
  97   test('closeclickEvent', function() {
  98     var dlg = new ui.Overlay();
  99     dlg.title = 'Test closeclick event';
 100     var closeBtn = makeCloseButton(dlg);
 101     dlg.leftButtons.appendChild(closeBtn);
 102
 103     var closeClicked = false;
 104     dlg.addEventListener('closeclick', function() {
 105       closeClicked = true;
 106     });
 107
 108     return new Promise(function(resolver) {
 109       function pressClose() {
 110         closeBtn.click();
 111         if (closeClicked)
 112           resolver.resolve();
 113         else
 114           resolver.reject(new Error('closeclick event is not dispatched'));
 115       }
 116       dlg.visible = true;
 117       setTimeout(pressClose, 60);
 118     });
 119   });
 120 });