refactor(view): provide ViewContainers dynamically on any element

This commit is contained in:
Tobias Bosch
2015-04-16 15:38:28 -07:00
parent eac5c88893
commit f830cfca12
26 changed files with 467 additions and 210 deletions

View File

@ -47,7 +47,7 @@ export function main() {
it('should attach the view nodes as child of the host element', () => {
var host = el('<div><span>original content</span></div>');
var nodes = el('<div>view</div>');
var view = new RenderView(null, [nodes], [], [], [], []);
var view = new RenderView(null, [nodes], [], [], []);
strategy.attachTemplate(host, view);
var firstChild = DOM.firstChild(host);

View File

@ -42,7 +42,7 @@ export function main() {
it('should attach the view nodes as child of the host element', () => {
var host = el('<div><span>original content</span></div>');
var nodes = el('<div>view</div>');
var view = new RenderView(null, [nodes], [], [], [], []);
var view = new RenderView(null, [nodes], [], [], []);
strategy.attachTemplate(host, view);
var firstChild = DOM.firstChild(host);

View File

@ -10,24 +10,30 @@ import {ViewContainer} from 'angular2/src/render/dom/view/view_container';
@proxy
@IMPLEMENTS(RenderView)
class FakeView {
boundElements;
contentTags;
viewContainers;
constructor(containers = null) {
this.boundElements = [];
this.contentTags = [];
this.viewContainers = [];
if (isPresent(containers)) {
ListWrapper.forEach(containers, (c) => {
var boundElement = null;
var contentTag = null;
var vc = null;
if (c instanceof FakeContentTag) {
ListWrapper.push(this.contentTags, c);
} else {
ListWrapper.push(this.contentTags, null);
contentTag = c;
boundElement = c.contentStartElement;
}
if (c instanceof FakeViewContainer) {
ListWrapper.push(this.viewContainers, c);
} else {
ListWrapper.push(this.viewContainers, null);
vc = c;
boundElement = c.templateElement;
}
ListWrapper.push(this.contentTags, contentTag);
ListWrapper.push(this.viewContainers, vc);
ListWrapper.push(this.boundElements, boundElement);
});
}
}
@ -40,9 +46,9 @@ class FakeView {
@proxy
@IMPLEMENTS(ViewContainer)
class FakeViewContainer {
templateElement;
_nodes;
_contentTagContainers;
templateElement;
constructor(templateEl, nodes = null, views = null) {
this.templateElement = templateEl;

View File

@ -35,7 +35,7 @@ export function main() {
it('should attach the view nodes to the shadow root', () => {
var host = el('<div><span>original content</span></div>');
var nodes = el('<div>view</div>');
var view = new RenderView(null, [nodes], [], [], [], []);
var view = new RenderView(null, [nodes], [], [], []);
strategy.attachTemplate(host, view);
var shadowRoot = DOM.getShadowRoot(host);

View File

@ -70,12 +70,12 @@ export function main() {
function createEmptyView() {
var root = el('<div><div></div></div>');
return new RenderView(createProtoView(), [DOM.childNodes(root)[0]],
[], [], [], []);
[], [], []);
}
function createHostView(pv, shadowDomView) {
var view = new RenderView(pv, [el('<div></div>')],
[], [el('<div></div>')], [], []);
[], [el('<div></div>')], [null]);
viewFactory.setComponentView(view, 0, shadowDomView);
return view;
}

View File

@ -0,0 +1,109 @@
import {
AsyncTestCompleter,
beforeEach,
ddescribe,
xdescribe,
describe,
el,
dispatchEvent,
expect,
iit,
inject,
beforeEachBindings,
it,
xit,
SpyObject, proxy
} from 'angular2/test_lib';
import {IMPLEMENTS, isBlank} from 'angular2/src/facade/lang';
import {ListWrapper} from 'angular2/src/facade/collection';
import {RenderProtoView} from 'angular2/src/render/dom/view/proto_view';
import {ElementBinder} from 'angular2/src/render/dom/view/element_binder';
import {RenderView} from 'angular2/src/render/dom/view/view';
import {ViewContainer} from 'angular2/src/render/dom/view/view_container';
import {LightDom} from 'angular2/src/render/dom/shadow_dom/light_dom';
import {DOM} from 'angular2/src/dom/dom_adapter';
export function main() {
describe('RenderView', () => {
function createProtoView(binders = null) {
if (isBlank(binders)) {
binders = [];
}
var rootEl = el('<div></div>');
return new RenderProtoView({
element: rootEl,
elementBinders: binders
});
}
function createView(pv=null, boundElementCount=0) {
if (isBlank(pv)) {
pv = createProtoView();
}
var root = el('<div><div></div></div>');
var boundElements = [];
for (var i=0; i<boundElementCount; i++) {
ListWrapper.push(boundElements, el('<span></span'));
}
return new RenderView(pv, [DOM.childNodes(root)[0]],
[], boundElements, []);
}
describe('getDirectParentLightDom', () => {
it('should return the LightDom of the direct parent', () => {
var pv = createProtoView(
[new ElementBinder(), new ElementBinder({
parentIndex: 0,
distanceToParent: 1
})]
);
var view = createView(pv, 2);
view.lightDoms[0] = new SpyLightDom();
view.lightDoms[1] = new SpyLightDom();
expect(view.getDirectParentLightDom(1)).toBe(view.lightDoms[0]);
});
it('should return null if the direct parent is not bound', () => {
var pv = createProtoView(
[new ElementBinder(), new ElementBinder(), new ElementBinder({
parentIndex: 0,
distanceToParent: 2
})]
);
var view = createView(pv, 3);
view.lightDoms[0] = new SpyLightDom();
view.lightDoms[1] = new SpyLightDom();
view.lightDoms[2] = new SpyLightDom();
expect(view.getDirectParentLightDom(2)).toBe(null);
});
});
describe('getOrCreateViewContainer', () => {
it('should create a new container', () => {
var pv = createProtoView([new ElementBinder()]);
var view = createView(pv, 1);
expect(view.getOrCreateViewContainer(0) instanceof ViewContainer).toBe(true);
});
it('should return an existing container', () => {
var pv = createProtoView([new ElementBinder()]);
var view = createView(pv, 1);
var vc = view.getOrCreateViewContainer(0);
expect(view.getOrCreateViewContainer(0)).toBe(vc);
});
});
});
}
@proxy
@IMPLEMENTS(LightDom)
class SpyLightDom extends SpyObject {
constructor(){super(LightDom);}
noSuchMethod(m){return super.noSuchMethod(m)}
}