| <!DOCTYPE html> |
| <!-- |
| Copyright (c) 2014 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. |
| --> |
| <link rel="import" href="/base/ui.html"> |
| <script> |
| 'use strict'; |
| |
| tr.b.unittest.testSuite(function() { |
| var TestElement = tr.b.ui.define('div'); |
| TestElement.prototype = { |
| __proto__: HTMLDivElement.prototype, |
| |
| decorate: function() { |
| if (!this.decorateCallCount) |
| this.decorateCallCount = 0; |
| this.decorateCallCount++; |
| } |
| }; |
| |
| var Base = tr.b.ui.define('div'); |
| Base.prototype = { |
| __proto__: HTMLDivElement.prototype, |
| decorate: function() { |
| this.decoratedAsBase = true; |
| }, |
| set baseProperty(v) { |
| this.basePropertySet = v; |
| } |
| }; |
| |
| test('decorateOnceViaNew', function() { |
| var testElement = new TestElement(); |
| assert.equal(testElement.decorateCallCount, 1); |
| }); |
| |
| test('decorateOnceDirectly', function() { |
| var testElement = document.createElement('div'); |
| tr.b.ui.decorate(testElement, TestElement); |
| assert.equal(testElement.decorateCallCount, 1); |
| }); |
| |
| test('componentToString', function() { |
| assert.equal(Base.toString(), 'div'); |
| |
| var Sub = tr.b.ui.define('Sub', Base); |
| assert.equal(Sub.toString(), 'div::sub'); |
| |
| var SubSub = tr.b.ui.define('Marine', Sub); |
| assert.equal(SubSub.toString(), 'div::sub::marine'); |
| }); |
| |
| test('basicDefines', function() { |
| var baseInstance = new Base(); |
| assert.instanceOf(baseInstance, Base); |
| assert.isTrue(baseInstance.decoratedAsBase); |
| |
| assert.equal(baseInstance.constructor, Base); |
| assert.equal(baseInstance.constructor.toString(), 'div'); |
| |
| baseInstance.basePropertySet = 7; |
| assert.equal(baseInstance.basePropertySet, 7); |
| }); |
| |
| test('subclassing', function() { |
| var Sub = tr.b.ui.define('sub', Base); |
| Sub.prototype = { |
| __proto__: Base.prototype, |
| decorate: function() { |
| this.decoratedAsSub = true; |
| } |
| }; |
| |
| var subInstance = new Sub(); |
| assert.instanceOf(subInstance, Sub); |
| assert.isTrue(subInstance.decoratedAsSub); |
| |
| assert.instanceOf(subInstance, Base); |
| assert.isUndefined(subInstance.decoratedAsBase); |
| |
| assert.equal(subInstance.constructor, Sub); |
| assert.equal(subInstance.constructor.toString(), 'div::sub'); |
| |
| subInstance.baseProperty = true; |
| assert.isTrue(subInstance.basePropertySet); |
| }); |
| |
| var NoArgs = tr.b.ui.define('div'); |
| NoArgs.prototype = { |
| __proto__: HTMLDivElement.prototype, |
| decorate: function() { |
| this.noArgsDecorated_ = true; |
| }, |
| get noArgsDecorated() { |
| return this.noArgsDecorated_; |
| } |
| }; |
| |
| var Args = tr.b.ui.define('args', NoArgs); |
| Args.prototype = { |
| __proto__: NoArgs.prototype, |
| decorate: function(first) { |
| this.first_ = first; |
| this.argsDecorated_ = true; |
| }, |
| get first() { |
| return this.first_; |
| }, |
| get argsDecorated() { |
| return this.argsDecorated_; |
| } |
| }; |
| |
| var ArgsChild = tr.b.ui.define('args-child', Args); |
| ArgsChild.prototype = { |
| __proto__: Args.prototype, |
| decorate: function(_, second) { |
| this.second_ = second; |
| this.argsChildDecorated_ = true; |
| }, |
| get second() { |
| return this.second_; |
| }, |
| get decorated() { |
| return this.decorated_; |
| }, |
| get argsChildDecorated() { |
| return this.argsChildDecorated_ = true; |
| } |
| }; |
| |
| var ArgsDecoratingChild = tr.b.ui.define('args-decorating-child', Args); |
| ArgsDecoratingChild.prototype = { |
| __proto__: Args.prototype, |
| decorate: function(first, second) { |
| Args.prototype.decorate.call(this, first); |
| this.second_ = second; |
| this.argsDecoratingChildDecorated_ = true; |
| }, |
| get second() { |
| return this.second_; |
| }, |
| get decorated() { |
| return this.decorated_; |
| }, |
| get argsDecoratingChildDecorated() { |
| return this.argsChildDecorated_ = true; |
| } |
| }; |
| |
| test('decorate_noArguments', function() { |
| var noArgs; |
| assert.doesNotThrow(function() { |
| noArgs = new NoArgs(); |
| }); |
| assert.isTrue(noArgs.noArgsDecorated); |
| }); |
| |
| test('decorate_arguments', function() { |
| var args = new Args('this is first'); |
| assert.equal(args.first, 'this is first'); |
| assert.isTrue(args.argsDecorated); |
| assert.isUndefined(args.noArgsDecorated); |
| }); |
| |
| test('decorate_subclassArguments', function() { |
| var argsChild = new ArgsChild('this is first', 'and second'); |
| assert.isUndefined(argsChild.first); |
| assert.equal(argsChild.second, 'and second'); |
| |
| assert.isTrue(argsChild.argsChildDecorated); |
| assert.isUndefined(argsChild.argsDecorated); |
| assert.isUndefined(argsChild.noArgsDecorated); |
| }); |
| |
| test('decorate_subClassCallsParentDecorate', function() { |
| var argsDecoratingChild = new ArgsDecoratingChild( |
| 'this is first', 'and second'); |
| assert.equal(argsDecoratingChild.first, 'this is first'); |
| assert.equal(argsDecoratingChild.second, 'and second'); |
| assert.isTrue(argsDecoratingChild.argsDecoratingChildDecorated); |
| assert.isTrue(argsDecoratingChild.argsDecorated); |
| assert.isUndefined(argsDecoratingChild.noArgsDecorated); |
| }); |
| |
| test('defineWithNamespace', function() { |
| var svgNS = 'http://www.w3.org/2000/svg'; |
| var cls = tr.b.ui.define('svg', undefined, svgNS); |
| cls.prototype = { |
| __proto__: HTMLUnknownElement.prototype, |
| |
| decorate: function() { |
| this.setAttribute('width', 200); |
| this.setAttribute('height', 200); |
| this.setAttribute('viewPort', '0 0 200 200'); |
| var rectEl = document.createElementNS(svgNS, 'rect'); |
| rectEl.setAttribute('x', 10); |
| rectEl.setAttribute('y', 10); |
| rectEl.setAttribute('width', 180); |
| rectEl.setAttribute('height', 180); |
| this.appendChild(rectEl); |
| } |
| }; |
| var el = new cls(); |
| assert.equal(el.tagName, 'svg'); |
| assert.equal(el.namespaceURI, svgNS); |
| this.addHTMLOutput(el); |
| }); |
| |
| test('defineSubclassWithNamespace', function() { |
| var svgNS = 'http://www.w3.org/2000/svg'; |
| var cls = tr.b.ui.define('svg', undefined, svgNS); |
| cls.prototype = { |
| __proto__: HTMLUnknownElement.prototype, |
| |
| decorate: function() { |
| this.setAttribute('width', 200); |
| this.setAttribute('height', 200); |
| this.setAttribute('viewPort', '0 0 200 200'); |
| var rectEl = document.createElementNS(svgNS, 'rect'); |
| rectEl.setAttribute('x', 10); |
| rectEl.setAttribute('y', 10); |
| rectEl.setAttribute('width', 180); |
| rectEl.setAttribute('height', 180); |
| this.appendChild(rectEl); |
| } |
| }; |
| |
| var subCls = tr.b.ui.define('sub', cls); |
| subCls.prototype = { |
| __proto__: cls.prototype |
| }; |
| assert.equal(subCls.toString(), 'svg::sub'); |
| |
| var el = new subCls(); |
| this.addHTMLOutput(el); |
| assert.equal(el.tagName, 'svg'); |
| assert.equal(el.namespaceURI, svgNS); |
| }); |
| }); |
| </script> |