2015-04-16 18:38:28 -04:00
|
|
|
import {
|
|
|
|
AsyncTestCompleter,
|
|
|
|
beforeEach,
|
|
|
|
ddescribe,
|
|
|
|
xdescribe,
|
|
|
|
describe,
|
|
|
|
el,
|
|
|
|
dispatchEvent,
|
|
|
|
expect,
|
|
|
|
iit,
|
|
|
|
inject,
|
|
|
|
beforeEachBindings,
|
|
|
|
it,
|
|
|
|
xit,
|
2015-05-26 12:25:39 -04:00
|
|
|
SpyObject,
|
|
|
|
proxy
|
2015-04-16 18:38:28 -04:00
|
|
|
} from 'angular2/test_lib';
|
2015-06-02 13:15:16 -04:00
|
|
|
import {isBlank} from 'angular2/src/facade/lang';
|
2015-06-18 18:44:44 -04:00
|
|
|
import {ListWrapper} from 'angular2/src/facade/collection';
|
2015-04-16 18:38:28 -04:00
|
|
|
|
2015-05-06 14:22:28 -04:00
|
|
|
import {DomProtoView} from 'angular2/src/render/dom/view/proto_view';
|
2015-04-16 18:38:28 -04:00
|
|
|
import {ElementBinder} from 'angular2/src/render/dom/view/element_binder';
|
2015-05-06 14:22:28 -04:00
|
|
|
import {DomView} from 'angular2/src/render/dom/view/view';
|
2015-06-02 13:15:16 -04:00
|
|
|
import {DomElement} from 'angular2/src/render/dom/view/element';
|
2015-04-16 18:38:28 -04:00
|
|
|
import {DOM} from 'angular2/src/dom/dom_adapter';
|
|
|
|
|
|
|
|
export function main() {
|
2015-05-06 14:22:28 -04:00
|
|
|
describe('DomView', () => {
|
2015-04-16 18:38:28 -04:00
|
|
|
function createProtoView(binders = null) {
|
|
|
|
if (isBlank(binders)) {
|
|
|
|
binders = [];
|
|
|
|
}
|
|
|
|
var rootEl = el('<div></div>');
|
2015-06-18 16:15:11 -04:00
|
|
|
return new DomProtoView({
|
|
|
|
element: rootEl,
|
|
|
|
elementBinders: binders,
|
|
|
|
transitiveContentTagCount: 0,
|
|
|
|
boundTextNodeCount: 0
|
|
|
|
});
|
2015-04-16 18:38:28 -04:00
|
|
|
}
|
|
|
|
|
2015-05-26 12:25:39 -04:00
|
|
|
function createView(pv = null, boundElementCount = 0) {
|
2015-04-16 18:38:28 -04:00
|
|
|
if (isBlank(pv)) {
|
2015-06-18 18:44:44 -04:00
|
|
|
pv = createProtoView(ListWrapper.createFixedSize(boundElementCount));
|
2015-04-16 18:38:28 -04:00
|
|
|
}
|
|
|
|
var root = el('<div><div></div></div>');
|
|
|
|
var boundElements = [];
|
2015-05-26 12:25:39 -04:00
|
|
|
for (var i = 0; i < boundElementCount; i++) {
|
2015-06-17 14:17:21 -04:00
|
|
|
boundElements.push(new DomElement(pv.elementBinders[i], el('<span></span'), null));
|
2015-04-16 18:38:28 -04:00
|
|
|
}
|
2015-06-02 13:15:16 -04:00
|
|
|
return new DomView(pv, [DOM.childNodes(root)[0]], [], boundElements);
|
2015-04-16 18:38:28 -04:00
|
|
|
}
|
|
|
|
|
2015-06-12 10:50:45 -04:00
|
|
|
function createElementBinder(parentIndex: number = 0, distanceToParent: number = 1) {
|
|
|
|
return new ElementBinder(
|
|
|
|
{parentIndex: parentIndex, distanceToParent: distanceToParent, textNodeIndices: []});
|
2015-06-10 18:54:10 -04:00
|
|
|
}
|
|
|
|
|
2015-06-02 13:15:16 -04:00
|
|
|
describe('getDirectParentElement', () => {
|
2015-04-16 18:38:28 -04:00
|
|
|
|
2015-06-02 13:15:16 -04:00
|
|
|
it('should return the DomElement of the direct parent', () => {
|
2015-06-12 10:50:45 -04:00
|
|
|
var pv = createProtoView([createElementBinder(), createElementBinder(0, 1)]);
|
2015-04-16 18:38:28 -04:00
|
|
|
var view = createView(pv, 2);
|
2015-06-02 13:15:16 -04:00
|
|
|
expect(view.getDirectParentElement(1)).toBe(view.boundElements[0]);
|
2015-04-16 18:38:28 -04:00
|
|
|
});
|
|
|
|
|
|
|
|
it('should return null if the direct parent is not bound', () => {
|
2015-06-12 10:50:45 -04:00
|
|
|
var pv = createProtoView(
|
|
|
|
[createElementBinder(), createElementBinder(), createElementBinder(0, 2)]);
|
2015-04-16 18:38:28 -04:00
|
|
|
var view = createView(pv, 3);
|
2015-06-02 13:15:16 -04:00
|
|
|
expect(view.getDirectParentElement(2)).toBe(null);
|
2015-04-16 18:38:28 -04:00
|
|
|
});
|
|
|
|
|
|
|
|
});
|
|
|
|
|
2015-06-18 18:44:44 -04:00
|
|
|
describe('setElementProperty', () => {
|
|
|
|
var el, view;
|
|
|
|
beforeEach(() => {
|
|
|
|
view = createView(null, 1);
|
|
|
|
el = view.boundElements[0].element;
|
|
|
|
});
|
|
|
|
|
|
|
|
it('should update the property value', () => {
|
|
|
|
view.setElementProperty(0, 'title', 'Hello');
|
|
|
|
expect(el.title).toEqual('Hello');
|
|
|
|
});
|
|
|
|
|
|
|
|
});
|
|
|
|
|
|
|
|
describe('setElementAttribute', () => {
|
|
|
|
var el, view;
|
|
|
|
beforeEach(() => {
|
|
|
|
view = createView(null, 1);
|
|
|
|
el = view.boundElements[0].element;
|
|
|
|
});
|
|
|
|
|
|
|
|
it('should update and remove an attribute', () => {
|
|
|
|
view.setElementAttribute(0, 'role', 'button');
|
|
|
|
expect(DOM.getAttribute(el, 'role')).toEqual('button');
|
|
|
|
view.setElementAttribute(0, 'role', null);
|
|
|
|
expect(DOM.getAttribute(el, 'role')).toEqual(null);
|
|
|
|
});
|
|
|
|
|
|
|
|
it('should de-normalize attribute names', () => {
|
|
|
|
view.setElementAttribute(0, 'ariaLabel', 'fancy button');
|
|
|
|
expect(DOM.getAttribute(el, 'aria-label')).toEqual('fancy button');
|
|
|
|
});
|
|
|
|
});
|
|
|
|
|
|
|
|
describe('setElementClass', () => {
|
|
|
|
var el, view;
|
|
|
|
beforeEach(() => {
|
|
|
|
view = createView(null, 1);
|
|
|
|
el = view.boundElements[0].element;
|
|
|
|
});
|
|
|
|
|
|
|
|
it('should set and remove a class', () => {
|
|
|
|
view.setElementClass(0, 'active', true);
|
|
|
|
expect(DOM.hasClass(el, 'active')).toEqual(true);
|
|
|
|
|
|
|
|
view.setElementClass(0, 'active', false);
|
|
|
|
expect(DOM.hasClass(el, 'active')).toEqual(false);
|
|
|
|
});
|
|
|
|
|
|
|
|
it('should de-normalize class names', () => {
|
|
|
|
view.setElementClass(0, 'veryActive', true);
|
|
|
|
expect(DOM.hasClass(el, 'very-active')).toEqual(true);
|
|
|
|
|
|
|
|
view.setElementClass(0, 'veryActive', false);
|
|
|
|
expect(DOM.hasClass(el, 'very-active')).toEqual(false);
|
|
|
|
});
|
|
|
|
});
|
|
|
|
|
|
|
|
describe('setElementStyle', () => {
|
|
|
|
var el, view;
|
|
|
|
beforeEach(() => {
|
|
|
|
view = createView(null, 1);
|
|
|
|
el = view.boundElements[0].element;
|
|
|
|
});
|
|
|
|
|
|
|
|
it('should set and remove styles', () => {
|
|
|
|
view.setElementStyle(0, 'width', '40px');
|
|
|
|
expect(DOM.getStyle(el, 'width')).toEqual('40px');
|
|
|
|
|
|
|
|
view.setElementStyle(0, 'width', null);
|
|
|
|
expect(DOM.getStyle(el, 'width')).toEqual('');
|
|
|
|
});
|
|
|
|
|
|
|
|
it('should de-normalize style names', () => {
|
|
|
|
view.setElementStyle(0, 'textAlign', 'right');
|
|
|
|
expect(DOM.getStyle(el, 'text-align')).toEqual('right');
|
|
|
|
view.setElementStyle(0, 'textAlign', null);
|
|
|
|
expect(DOM.getStyle(el, 'text-align')).toEqual('');
|
|
|
|
});
|
|
|
|
|
|
|
|
});
|
|
|
|
|
2015-04-16 18:38:28 -04:00
|
|
|
});
|
|
|
|
}
|