src/third_party/trace-viewer/third_party/tvcm/src/tvcm/ui_test.html

   1 <!DOCTYPE html>
   2 <!--
   3 Copyright (c) 2014 The Chromium Authors. All rights reserved.
   4 Use of this source code is governed by a BSD-style license that can be
   5 found in the LICENSE file.
   6 -->
   7 <link rel="import" href="/tvcm/ui.html">
   8 <script>
   9 'use strict';
  10
  11 tvcm.unittest.testSuite(function() {
  12   var TestElement = tvcm.ui.define('div');
  13   TestElement.prototype = {
  14     __proto__: HTMLDivElement.prototype,
  15
  16     decorate: function() {
  17       if (!this.decorateCallCount)
  18         this.decorateCallCount = 0;
  19       this.decorateCallCount++;
  20     }
  21   };
  22
  23   var Base = tvcm.ui.define('div');
  24   Base.prototype = {
  25     __proto__: HTMLDivElement.prototype,
  26     decorate: function() {
  27       this.decoratedAsBase = true;
  28     },
  29     set baseProperty(v) {
  30       this.basePropertySet = v;
  31     }
  32   };
  33
  34   test('decorateOnceViaNew', function() {
  35     var testElement = new TestElement();
  36     assertEquals(1, testElement.decorateCallCount);
  37   });
  38
  39   test('decorateOnceDirectly', function() {
  40     var testElement = document.createElement('div');
  41     tvcm.ui.decorate(testElement, TestElement);
  42     assertEquals(1, testElement.decorateCallCount);
  43   });
  44
  45   test('componentToString', function() {
  46     assertEquals('div', Base.toString());
  47
  48     var Sub = tvcm.ui.define('Sub', Base);
  49     assertEquals('div::sub', Sub.toString());
  50
  51     var SubSub = tvcm.ui.define('Marine', Sub);
  52     assertEquals('div::sub::marine', SubSub.toString());
  53   });
  54
  55   test('basicDefines', function() {
  56     var baseInstance = new Base();
  57     assertTrue(baseInstance instanceof Base);
  58     assertTrue(baseInstance.decoratedAsBase);
  59
  60     assertEquals(baseInstance.constructor, Base);
  61     assertEquals(baseInstance.constructor.toString(), 'div');
  62
  63     baseInstance.basePropertySet = 7;
  64     assertEquals(7, baseInstance.basePropertySet);
  65   });
  66
  67   test('subclassing', function() {
  68     var Sub = tvcm.ui.define('sub', Base);
  69     Sub.prototype = {
  70       __proto__: Base.prototype,
  71       decorate: function() {
  72         this.decoratedAsSub = true;
  73       }
  74     };
  75
  76     var subInstance = new Sub();
  77     assertTrue(subInstance instanceof Sub);
  78     assertTrue(subInstance.decoratedAsSub);
  79
  80     assertTrue(subInstance instanceof Base);
  81     assertFalse(subInstance.decoratedAsBase);
  82
  83     assertEquals(subInstance.constructor, Sub);
  84     assertEquals(subInstance.constructor.toString(), 'div::sub');
  85
  86     subInstance.baseProperty = true;
  87     assertTrue(subInstance.basePropertySet);
  88   });
  89
  90   var NoArgs = tvcm.ui.define('div');
  91   NoArgs.prototype = {
  92     __proto__: HTMLDivElement.prototype,
  93     decorate: function() {
  94       this.noArgsDecorated_ = true;
  95     },
  96     get noArgsDecorated() {
  97       return this.noArgsDecorated_;
  98     }
  99   };
 100
 101   var Args = tvcm.ui.define('args', NoArgs);
 102   Args.prototype = {
 103     __proto__: NoArgs.prototype,
 104     decorate: function(first) {
 105       this.first_ = first;
 106       this.argsDecorated_ = true;
 107     },
 108     get first() {
 109       return this.first_;
 110     },
 111     get argsDecorated() {
 112       return this.argsDecorated_;
 113     }
 114   };
 115
 116   var ArgsChild = tvcm.ui.define('args-child', Args);
 117   ArgsChild.prototype = {
 118     __proto__: Args.prototype,
 119     decorate: function(_, second) {
 120       this.second_ = second;
 121       this.argsChildDecorated_ = true;
 122     },
 123     get second() {
 124       return this.second_;
 125     },
 126     get decorated() {
 127       return this.decorated_;
 128     },
 129     get argsChildDecorated() {
 130       return this.argsChildDecorated_ = true;
 131     }
 132   };
 133
 134   var ArgsDecoratingChild = tvcm.ui.define('args-decorating-child', Args);
 135   ArgsDecoratingChild.prototype = {
 136     __proto__: Args.prototype,
 137     decorate: function(first, second) {
 138       Args.prototype.decorate.call(this, first);
 139       this.second_ = second;
 140       this.argsDecoratingChildDecorated_ = true;
 141     },
 142     get second() {
 143       return this.second_;
 144     },
 145     get decorated() {
 146       return this.decorated_;
 147     },
 148     get argsDecoratingChildDecorated() {
 149       return this.argsChildDecorated_ = true;
 150     }
 151   };
 152
 153   test('decorate_noArguments', function() {
 154     var noArgs;
 155     assertDoesNotThrow(function() {
 156       noArgs = new NoArgs();
 157     });
 158     assertTrue(noArgs.noArgsDecorated);
 159   });
 160
 161   test('decorate_arguments', function() {
 162     var args = new Args('this is first');
 163     assertEquals('this is first', args.first);
 164     assertTrue(args.argsDecorated);
 165     assertFalse(args.noArgsDecorated);
 166   });
 167
 168   test('decorate_subclassArguments', function() {
 169     var argsChild = new ArgsChild('this is first', 'and second');
 170     assertUndefined(argsChild.first);
 171     assertEquals('and second', argsChild.second);
 172
 173     assertTrue(argsChild.argsChildDecorated);
 174     assertFalse(argsChild.argsDecorated);
 175     assertFalse(argsChild.noArgsDecorated);
 176   });
 177
 178   test('decorate_subClassCallsParentDecorate', function() {
 179     var argsDecoratingChild = new ArgsDecoratingChild(
 180         'this is first', 'and second');
 181     assertEquals('this is first', argsDecoratingChild.first);
 182     assertEquals('and second', argsDecoratingChild.second);
 183     assertTrue(argsDecoratingChild.argsDecoratingChildDecorated);
 184     assertTrue(argsDecoratingChild.argsDecorated);
 185     assertFalse(argsDecoratingChild.noArgsDecorated);
 186   });
 187
 188   test('defineWithNamespace', function() {
 189     var svgNS = 'http://www.w3.org/2000/svg';
 190     var cls = tvcm.ui.define('svg', undefined, svgNS);
 191     cls.prototype = {
 192       __proto__: HTMLUnknownElement.prototype,
 193
 194       decorate: function() {
 195         this.setAttribute('width', 200);
 196         this.setAttribute('height', 200);
 197         this.setAttribute('viewPort', '0 0 200 200');
 198         var rectEl = document.createElementNS(svgNS, 'rect');
 199         rectEl.setAttribute('x', 10);
 200         rectEl.setAttribute('y', 10);
 201         rectEl.setAttribute('width', 180);
 202         rectEl.setAttribute('height', 180);
 203         this.appendChild(rectEl);
 204       }
 205     };
 206     var el = new cls();
 207     assertEquals('svg', el.tagName);
 208     assertEquals(svgNS, el.namespaceURI);
 209     this.addHTMLOutput(el);
 210   });
 211
 212   test('defineSubclassWithNamespace', function() {
 213     var svgNS = 'http://www.w3.org/2000/svg';
 214     var cls = tvcm.ui.define('svg', undefined, svgNS);
 215     cls.prototype = {
 216       __proto__: HTMLUnknownElement.prototype,
 217
 218       decorate: function() {
 219         this.setAttribute('width', 200);
 220         this.setAttribute('height', 200);
 221         this.setAttribute('viewPort', '0 0 200 200');
 222         var rectEl = document.createElementNS(svgNS, 'rect');
 223         rectEl.setAttribute('x', 10);
 224         rectEl.setAttribute('y', 10);
 225         rectEl.setAttribute('width', 180);
 226         rectEl.setAttribute('height', 180);
 227         this.appendChild(rectEl);
 228       }
 229     };
 230
 231     var subCls = tvcm.ui.define('sub', cls);
 232     subCls.prototype = {
 233       __proto__: cls.prototype
 234     };
 235     assertEquals('svg::sub', subCls.toString());
 236
 237     var el = new subCls();
 238     this.addHTMLOutput(el);
 239     assertEquals('svg', el.tagName);
 240     assertEquals(svgNS, el.namespaceURI);
 241   });
 242 });
 243 </script>