2015-05-26 12:25:39 -04:00
|
|
|
import {Inject, Injectable} from 'angular2/di';
|
2015-06-24 16:46:39 -04:00
|
|
|
import {isPresent} from 'angular2/src/facade/lang';
|
2015-05-06 13:49:42 -04:00
|
|
|
import {MapWrapper, ListWrapper, List, Map} from 'angular2/src/facade/collection';
|
|
|
|
import {PromiseWrapper, Promise} from 'angular2/src/facade/async';
|
|
|
|
import {DOM} from 'angular2/src/dom/dom_adapter';
|
|
|
|
|
|
|
|
import {DomRenderer, DOCUMENT_TOKEN} from 'angular2/src/render/dom/dom_renderer';
|
|
|
|
import {DefaultDomCompiler} from 'angular2/src/render/dom/compiler/compiler';
|
2015-05-26 12:25:39 -04:00
|
|
|
import {
|
2015-06-24 16:46:39 -04:00
|
|
|
RenderViewWithFragments,
|
|
|
|
RenderFragmentRef,
|
2015-05-26 12:25:39 -04:00
|
|
|
RenderViewRef,
|
|
|
|
ProtoViewDto,
|
|
|
|
ViewDefinition,
|
2015-06-24 16:46:39 -04:00
|
|
|
RenderEventDispatcher,
|
2015-06-23 14:21:56 -04:00
|
|
|
DirectiveMetadata,
|
2015-06-24 16:46:39 -04:00
|
|
|
RenderElementRef,
|
|
|
|
RenderProtoViewMergeMapping,
|
|
|
|
RenderProtoViewRef
|
2015-05-26 12:25:39 -04:00
|
|
|
} from 'angular2/src/render/api';
|
2015-05-06 13:49:42 -04:00
|
|
|
import {resolveInternalDomView} from 'angular2/src/render/dom/view/view';
|
2015-06-24 16:46:39 -04:00
|
|
|
import {resolveInternalDomFragment} from 'angular2/src/render/dom/view/fragment';
|
2015-05-06 13:49:42 -04:00
|
|
|
import {el, dispatchEvent} from 'angular2/test_lib';
|
|
|
|
|
2015-06-24 16:46:39 -04:00
|
|
|
export class TestRootView {
|
2015-05-26 12:25:39 -04:00
|
|
|
viewRef: RenderViewRef;
|
2015-06-24 16:46:39 -04:00
|
|
|
fragments: RenderFragmentRef[];
|
|
|
|
hostElement: Element;
|
2015-05-26 12:25:39 -04:00
|
|
|
events: List<List<any>>;
|
2015-05-06 13:49:42 -04:00
|
|
|
|
2015-06-24 16:46:39 -04:00
|
|
|
constructor(viewWithFragments: RenderViewWithFragments) {
|
|
|
|
this.viewRef = viewWithFragments.viewRef;
|
|
|
|
this.fragments = viewWithFragments.fragmentRefs;
|
|
|
|
this.hostElement = <Element>resolveInternalDomFragment(this.fragments[0])[0];
|
2015-05-06 13:49:42 -04:00
|
|
|
this.events = [];
|
|
|
|
}
|
|
|
|
}
|
|
|
|
|
2015-06-24 16:46:39 -04:00
|
|
|
export class TestRenderElementRef implements RenderElementRef {
|
|
|
|
constructor(public renderView: RenderViewRef, public renderBoundElementIndex: number) {}
|
|
|
|
}
|
|
|
|
|
2015-06-23 14:21:56 -04:00
|
|
|
export function elRef(renderView: RenderViewRef, boundElementIndex: number) {
|
|
|
|
return new TestRenderElementRef(renderView, boundElementIndex);
|
|
|
|
}
|
|
|
|
|
2015-06-24 16:46:39 -04:00
|
|
|
export function rootNodes(view: RenderViewRef) {}
|
2015-05-06 13:49:42 -04:00
|
|
|
|
2015-06-24 16:46:39 -04:00
|
|
|
class LoggingEventDispatcher implements RenderEventDispatcher {
|
2015-05-26 12:25:39 -04:00
|
|
|
log: List<List<any>>;
|
2015-05-06 13:49:42 -04:00
|
|
|
|
2015-05-26 12:25:39 -04:00
|
|
|
constructor(log: List<List<any>>) { this.log = log; }
|
2015-05-06 13:49:42 -04:00
|
|
|
|
2015-06-24 16:46:39 -04:00
|
|
|
dispatchRenderEvent(elementIndex: number, eventName: string, locals: Map<string, any>) {
|
2015-06-17 14:17:21 -04:00
|
|
|
this.log.push([elementIndex, eventName, locals]);
|
2015-05-06 13:49:42 -04:00
|
|
|
return true;
|
|
|
|
}
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
|
|
@Injectable()
|
|
|
|
export class DomTestbed {
|
2015-05-26 12:25:39 -04:00
|
|
|
renderer: DomRenderer;
|
|
|
|
compiler: DefaultDomCompiler;
|
2015-05-06 13:49:42 -04:00
|
|
|
rootEl;
|
|
|
|
|
2015-05-26 12:25:39 -04:00
|
|
|
constructor(renderer: DomRenderer, compiler: DefaultDomCompiler,
|
|
|
|
@Inject(DOCUMENT_TOKEN) document) {
|
2015-05-06 13:49:42 -04:00
|
|
|
this.renderer = renderer;
|
|
|
|
this.compiler = compiler;
|
2015-07-10 19:09:18 -04:00
|
|
|
this.rootEl = el('<div id="root" class="rootElem"></div>');
|
2015-05-06 13:49:42 -04:00
|
|
|
var oldRoots = DOM.querySelectorAll(document, '#root');
|
2015-05-26 12:25:39 -04:00
|
|
|
for (var i = 0; i < oldRoots.length; i++) {
|
2015-05-06 13:49:42 -04:00
|
|
|
DOM.remove(oldRoots[i]);
|
|
|
|
}
|
|
|
|
DOM.appendChild(DOM.querySelector(document, 'body'), this.rootEl);
|
|
|
|
}
|
|
|
|
|
2015-06-24 16:46:39 -04:00
|
|
|
compile(host: DirectiveMetadata, componentViews: ViewDefinition[]): Promise<ProtoViewDto[]> {
|
|
|
|
var promises = [this.compiler.compileHost(host)];
|
|
|
|
componentViews.forEach(view => promises.push(this.compiler.compile(view)));
|
|
|
|
return PromiseWrapper.all(promises);
|
2015-05-06 13:49:42 -04:00
|
|
|
}
|
|
|
|
|
2015-07-20 12:59:44 -04:00
|
|
|
merge(protoViews: List<ProtoViewDto | RenderProtoViewRef>): Promise<RenderProtoViewMergeMapping> {
|
2015-06-24 16:46:39 -04:00
|
|
|
return this.compiler.mergeProtoViewsRecursively(collectMergeRenderProtoViewsRecurse(
|
|
|
|
<ProtoViewDto>protoViews[0], ListWrapper.slice(protoViews, 1)));
|
2015-05-06 13:49:42 -04:00
|
|
|
}
|
|
|
|
|
2015-06-24 16:46:39 -04:00
|
|
|
compileAndMerge(host: DirectiveMetadata,
|
2015-07-20 12:59:44 -04:00
|
|
|
componentViews: ViewDefinition[]): Promise<RenderProtoViewMergeMapping> {
|
2015-06-24 16:46:39 -04:00
|
|
|
return this.compile(host, componentViews).then(protoViewDtos => this.merge(protoViewDtos));
|
2015-05-06 13:49:42 -04:00
|
|
|
}
|
|
|
|
|
2015-06-24 16:46:39 -04:00
|
|
|
_createTestView(viewWithFragments: RenderViewWithFragments) {
|
|
|
|
var testView = new TestRootView(viewWithFragments);
|
|
|
|
this.renderer.setEventDispatcher(viewWithFragments.viewRef,
|
|
|
|
new LoggingEventDispatcher(testView.events));
|
|
|
|
return testView;
|
2015-05-06 13:49:42 -04:00
|
|
|
}
|
|
|
|
|
2015-06-24 16:46:39 -04:00
|
|
|
createView(protoView: RenderProtoViewMergeMapping): TestRootView {
|
|
|
|
var viewWithFragments = this.renderer.createView(protoView.mergedProtoViewRef, 0);
|
|
|
|
this.renderer.hydrateView(viewWithFragments.viewRef);
|
|
|
|
return this._createTestView(viewWithFragments);
|
2015-05-06 13:49:42 -04:00
|
|
|
}
|
|
|
|
|
2015-06-24 16:46:39 -04:00
|
|
|
triggerEvent(elementRef: RenderElementRef, eventName: string) {
|
|
|
|
var element = resolveInternalDomView(elementRef.renderView)
|
|
|
|
.boundElements[elementRef.renderBoundElementIndex];
|
2015-05-06 13:49:42 -04:00
|
|
|
dispatchEvent(element, eventName);
|
|
|
|
}
|
|
|
|
}
|
2015-06-24 16:46:39 -04:00
|
|
|
|
|
|
|
function collectMergeRenderProtoViewsRecurse(current: ProtoViewDto,
|
|
|
|
components: List<ProtoViewDto | RenderProtoViewRef>):
|
|
|
|
List<RenderProtoViewRef | List<any>> {
|
|
|
|
var result = [current.render];
|
|
|
|
current.elementBinders.forEach((elementBinder) => {
|
|
|
|
if (isPresent(elementBinder.nestedProtoView)) {
|
|
|
|
result.push(collectMergeRenderProtoViewsRecurse(elementBinder.nestedProtoView, components));
|
|
|
|
} else if (elementBinder.directives.length > 0) {
|
|
|
|
if (components.length > 0) {
|
|
|
|
var comp = components.shift();
|
|
|
|
if (comp instanceof ProtoViewDto) {
|
|
|
|
result.push(collectMergeRenderProtoViewsRecurse(comp, components));
|
|
|
|
} else {
|
|
|
|
result.push(comp);
|
|
|
|
}
|
|
|
|
} else {
|
|
|
|
result.push(null);
|
|
|
|
}
|
|
|
|
}
|
|
|
|
});
|
|
|
|
return result;
|
|
|
|
}
|