refactor(view): provide ViewContainers dynamically on any element
This commit is contained in:
@ -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);
|
||||
|
@ -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);
|
||||
|
@ -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;
|
||||
|
@ -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);
|
||||
|
@ -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;
|
||||
}
|
||||
|
109
modules/angular2/test/render/dom/view/view_spec.js
vendored
Normal file
109
modules/angular2/test/render/dom/view/view_spec.js
vendored
Normal 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)}
|
||||
}
|
||||
|
Reference in New Issue
Block a user