return html.then(html => {
     var tplEl = DOM.createTemplate(html);
     // Replace $baseUrl with the base url for the template
     if (isPresent(templateAbsUrl) && templateAbsUrl.indexOf("/") >= 0) {
         let baseUrl = templateAbsUrl.substring(0, templateAbsUrl.lastIndexOf("/"));
         this._substituteBaseUrl(DOM.content(tplEl), baseUrl);
     }
     let styleEls = DOM.querySelectorAll(DOM.content(tplEl), 'STYLE');
     let unresolvedStyles = [];
     for (let i = 0; i < styleEls.length; i++) {
         var styleEl = styleEls[i];
         unresolvedStyles.push(DOM.getText(styleEl));
         DOM.remove(styleEl);
     }
     let syncStyles = [];
     let asyncStyles = [];
     // Inline the style tags from the html
     for (let i = 0; i < styleEls.length; i++) {
         let styleEl = styleEls[i];
         let resolvedStyled = this._resolveAndInlineCssText(DOM.getText(styleEl), templateAbsUrl);
         if (isPromise(resolvedStyled)) {
             asyncStyles.push(resolvedStyled);
         }
         else {
             syncStyles.push(resolvedStyled);
         }
     }
     if (asyncStyles.length === 0) {
         return PromiseWrapper.resolve(new TemplateAndStyles(DOM.getInnerHTML(tplEl), syncStyles));
     }
     else {
         return PromiseWrapper.all(asyncStyles)
             .then(loadedStyles => new TemplateAndStyles(DOM.getInnerHTML(tplEl), syncStyles.concat(loadedStyles)));
     }
 });
 ViewSplitter.prototype.processElement = function (parent, current, control) {
     var attrs = current.attrs();
     var templateBindings = attrs.get('template');
     var hasTemplateBinding = lang_1.isPresent(templateBindings);
     // look for template shortcuts such as *ng-if="condition" and treat them as template="if
     // condition"
     collection_1.MapWrapper.forEach(attrs, function (attrValue, attrName) {
         if (lang_1.StringWrapper.startsWith(attrName, '*')) {
             var key = lang_1.StringWrapper.substring(attrName, 1); // remove the star
             if (hasTemplateBinding) {
                 // 2nd template binding detected
                 throw new lang_1.BaseException("Only one template directive per element is allowed: " +
                     (templateBindings + " and " + key + " cannot be used simultaneously ") +
                     ("in " + current.elementDescription));
             }
             else {
                 templateBindings = (attrValue.length == 0) ? key : key + ' ' + attrValue;
                 hasTemplateBinding = true;
             }
         }
     });
     if (lang_1.isPresent(parent)) {
         if (dom_adapter_1.DOM.isTemplateElement(current.element)) {
             if (!current.isViewRoot) {
                 var viewRoot = new compile_element_1.CompileElement(dom_adapter_1.DOM.createTemplate(''));
                 viewRoot.inheritedProtoView = current.bindElement().bindNestedProtoView(viewRoot.element);
                 // viewRoot doesn't appear in the original template, so we associate
                 // the current element description to get a more meaningful message in case of error
                 viewRoot.elementDescription = current.elementDescription;
                 viewRoot.isViewRoot = true;
                 this._moveChildNodes(dom_adapter_1.DOM.content(current.element), dom_adapter_1.DOM.content(viewRoot.element));
                 control.addChild(viewRoot);
             }
         }
         if (hasTemplateBinding) {
             var anchor = new compile_element_1.CompileElement(dom_adapter_1.DOM.createTemplate(''));
             anchor.inheritedProtoView = current.inheritedProtoView;
             anchor.inheritedElementBinder = current.inheritedElementBinder;
             anchor.distanceToInheritedBinder = current.distanceToInheritedBinder;
             // newParent doesn't appear in the original template, so we associate
             // the current element description to get a more meaningful message in case of error
             anchor.elementDescription = current.elementDescription;
             var viewRoot = new compile_element_1.CompileElement(dom_adapter_1.DOM.createTemplate(''));
             viewRoot.inheritedProtoView = anchor.bindElement().bindNestedProtoView(viewRoot.element);
             // viewRoot doesn't appear in the original template, so we associate
             // the current element description to get a more meaningful message in case of error
             viewRoot.elementDescription = current.elementDescription;
             viewRoot.isViewRoot = true;
             current.inheritedProtoView = viewRoot.inheritedProtoView;
             current.inheritedElementBinder = null;
             current.distanceToInheritedBinder = 0;
             this._parseTemplateBindings(templateBindings, anchor);
             dom_adapter_1.DOM.insertBefore(current.element, anchor.element);
             control.addParent(anchor);
             dom_adapter_1.DOM.appendChild(dom_adapter_1.DOM.content(viewRoot.element), current.element);
             control.addParent(viewRoot);
         }
     }
 };
 processElement(parent, current, control) {
     var attrs = current.attrs();
     var templateBindings = attrs.get('template');
     var hasTemplateBinding = isPresent(templateBindings);
     // look for template shortcuts such as *ng-if="condition" and treat them as template="if
     // condition"
     MapWrapper.forEach(attrs, (attrValue, attrName) => {
         if (StringWrapper.startsWith(attrName, '*')) {
             var key = StringWrapper.substring(attrName, 1); // remove the star
             if (hasTemplateBinding) {
                 // 2nd template binding detected
                 throw new BaseException(`Only one template directive per element is allowed: ` +
                     `${templateBindings} and ${key} cannot be used simultaneously ` +
                     `in ${current.elementDescription}`);
             }
             else {
                 templateBindings = (attrValue.length == 0) ? key : key + ' ' + attrValue;
                 hasTemplateBinding = true;
             }
         }
     });
     if (isPresent(parent)) {
         if (DOM.isTemplateElement(current.element)) {
             if (!current.isViewRoot) {
                 var viewRoot = new CompileElement(DOM.createTemplate(''));
                 viewRoot.inheritedProtoView = current.bindElement().bindNestedProtoView(viewRoot.element);
                 // viewRoot doesn't appear in the original template, so we associate
                 // the current element description to get a more meaningful message in case of error
                 viewRoot.elementDescription = current.elementDescription;
                 viewRoot.isViewRoot = true;
                 this._moveChildNodes(DOM.content(current.element), DOM.content(viewRoot.element));
                 control.addChild(viewRoot);
             }
         }
         if (hasTemplateBinding) {
             var anchor = new CompileElement(DOM.createTemplate(''));
             anchor.inheritedProtoView = current.inheritedProtoView;
             anchor.inheritedElementBinder = current.inheritedElementBinder;
             anchor.distanceToInheritedBinder = current.distanceToInheritedBinder;
             // newParent doesn't appear in the original template, so we associate
             // the current element description to get a more meaningful message in case of error
             anchor.elementDescription = current.elementDescription;
             var viewRoot = new CompileElement(DOM.createTemplate(''));
             viewRoot.inheritedProtoView = anchor.bindElement().bindNestedProtoView(viewRoot.element);
             // viewRoot doesn't appear in the original template, so we associate
             // the current element description to get a more meaningful message in case of error
             viewRoot.elementDescription = current.elementDescription;
             viewRoot.isViewRoot = true;
             current.inheritedProtoView = viewRoot.inheritedProtoView;
             current.inheritedElementBinder = null;
             current.distanceToInheritedBinder = 0;
             this._parseTemplateBindings(templateBindings, anchor);
             DOM.insertBefore(current.element, anchor.element);
             control.addParent(anchor);
             DOM.appendChild(DOM.content(viewRoot.element), current.element);
             control.addParent(viewRoot);
         }
     }
 }
function mergeProtoViewsRecursively(templateCloner, protoViewRefs) {
    // clone
    var clonedProtoViews = [];
    var hostViewAndBinderIndices = [];
    cloneProtoViews(templateCloner, protoViewRefs, clonedProtoViews, hostViewAndBinderIndices);
    var mainProtoView = clonedProtoViews[0];
    // modify the DOM
    mergeEmbeddedPvsIntoComponentOrRootPv(clonedProtoViews, hostViewAndBinderIndices);
    var fragments = [];
    var elementsWithNativeShadowRoot = new Set();
    mergeComponents(clonedProtoViews, hostViewAndBinderIndices, fragments, elementsWithNativeShadowRoot);
    // Note: Need to remark parent elements of bound text nodes
    // so that we can find them later via queryBoundElements!
    markBoundTextNodeParentsAsBoundElements(clonedProtoViews);
    // create a new root element with the changed fragments and elements
    var fragmentsRootNodeCount = fragments.map(function (fragment) { return fragment.length; });
    var rootElement = createRootElementFromFragments(fragments);
    var rootNode = dom_adapter_1.DOM.content(rootElement);
    // read out the new element / text node / ElementBinder order
    var mergedBoundElements = util_1.queryBoundElements(rootNode, false);
    var mergedBoundTextIndices = new Map();
    var boundTextNodeMap = indexBoundTextNodes(clonedProtoViews);
    var rootTextNodeIndices = calcRootTextNodeIndices(rootNode, boundTextNodeMap, mergedBoundTextIndices);
    var mergedElementBinders = calcElementBinders(clonedProtoViews, mergedBoundElements, elementsWithNativeShadowRoot, boundTextNodeMap, mergedBoundTextIndices);
    // create element / text index mappings
    var mappedElementIndices = calcMappedElementIndices(clonedProtoViews, mergedBoundElements);
    var mappedTextIndices = calcMappedTextIndices(clonedProtoViews, mergedBoundTextIndices);
    // create result
    var hostElementIndicesByViewIndex = calcHostElementIndicesByViewIndex(clonedProtoViews, hostViewAndBinderIndices);
    var nestedViewCounts = calcNestedViewCounts(hostViewAndBinderIndices);
    var mergedProtoView = proto_view_1.DomProtoView.create(templateCloner, mainProtoView.original.type, rootElement, mainProtoView.original.encapsulation, fragmentsRootNodeCount, rootTextNodeIndices, mergedElementBinders, new Map());
    return new api_1.RenderProtoViewMergeMapping(new proto_view_1.DomProtoViewRef(mergedProtoView), fragmentsRootNodeCount.length, mappedElementIndices, mergedBoundElements.length, mappedTextIndices, hostElementIndicesByViewIndex, nestedViewCounts);
}
Example #5
0
 ViewSplitter.prototype.process = function (parent, current, control) {
     var attrs = current.attrs();
     var templateBindings = collection_1.MapWrapper.get(attrs, 'template');
     var hasTemplateBinding = lang_1.isPresent(templateBindings);
     collection_1.MapWrapper.forEach(attrs, function (attrValue, attrName) {
         if (lang_1.StringWrapper.startsWith(attrName, '*')) {
             var key = lang_1.StringWrapper.substring(attrName, 1);
             if (hasTemplateBinding) {
                 throw new lang_1.BaseException("Only one template directive per element is allowed: " + (templateBindings + " and " + key + " cannot be used simultaneously ") + ("in " + current.elementDescription));
             }
             else {
                 templateBindings = (attrValue.length == 0) ? key : key + ' ' + attrValue;
                 hasTemplateBinding = true;
             }
         }
     });
     if (lang_1.isPresent(parent)) {
         if (dom_adapter_1.DOM.isTemplateElement(current.element)) {
             if (!current.isViewRoot) {
                 var viewRoot = new compile_element_1.CompileElement(dom_adapter_1.DOM.createTemplate(''));
                 viewRoot.inheritedProtoView = current.bindElement().bindNestedProtoView(viewRoot.element);
                 viewRoot.elementDescription = current.elementDescription;
                 viewRoot.isViewRoot = true;
                 this._moveChildNodes(dom_adapter_1.DOM.content(current.element), dom_adapter_1.DOM.content(viewRoot.element));
                 control.addChild(viewRoot);
             }
         }
         if (hasTemplateBinding) {
             var newParent = new compile_element_1.CompileElement(dom_adapter_1.DOM.createTemplate(''));
             newParent.inheritedProtoView = current.inheritedProtoView;
             newParent.inheritedElementBinder = current.inheritedElementBinder;
             newParent.distanceToInheritedBinder = current.distanceToInheritedBinder;
             newParent.elementDescription = current.elementDescription;
             current.inheritedProtoView = newParent.bindElement().bindNestedProtoView(current.element);
             current.inheritedElementBinder = null;
             current.distanceToInheritedBinder = 0;
             current.isViewRoot = true;
             this._parseTemplateBindings(templateBindings, newParent);
             this._addParentElement(current.element, newParent.element);
             control.addParent(newParent);
             dom_adapter_1.DOM.remove(current.element);
         }
     }
 };
Example #6
0
      it('should work with top-level template node', () => {
        var rootElement = el('<template><div template>x</div></template>');
        var originalChild = DOM.content(rootElement).childNodes[0];
        var results = createPipeline().process(rootElement);

        expect(results[0].element).toBe(rootElement);
        expect(results[0].isViewRoot).toBe(true);
        expect(results[2].isViewRoot).toBe(true);
        expect(DOM.getOuterHTML(results[0].element)).toEqual('<template><template class="ng-binding"></template></template>');
        expect(results[2].element).toBe(originalChild);
      });
Example #7
0
 constructor({ elementBinders, element, transitiveContentTagCount }) {
     this.element = element;
     this.elementBinders = elementBinders;
     this.transitiveContentTagCount = transitiveContentTagCount;
     this.isTemplateElement = DOM.isTemplateElement(this.element);
     this.rootBindingOffset =
         (isPresent(this.element) && DOM.hasClass(this.element, NG_BINDING_CLASS)) ? 1 : 0;
     this.boundTextNodeCount =
         ListWrapper.reduce(elementBinders, (prevCount, elementBinder) => prevCount + elementBinder.textNodeIndices.length, 0);
     this.rootNodeCount =
         this.isTemplateElement ? DOM.childNodes(DOM.content(this.element)).length : 1;
 }
 function DomProtoView(_a) {
     var elementBinders = _a.elementBinders, element = _a.element, transitiveContentTagCount = _a.transitiveContentTagCount;
     this.element = element;
     this.elementBinders = elementBinders;
     this.transitiveContentTagCount = transitiveContentTagCount;
     this.isTemplateElement = dom_adapter_1.DOM.isTemplateElement(this.element);
     this.rootBindingOffset =
         (lang_1.isPresent(this.element) && dom_adapter_1.DOM.hasClass(this.element, util_1.NG_BINDING_CLASS)) ? 1 : 0;
     this.boundTextNodeCount =
         collection_1.ListWrapper.reduce(elementBinders, function (prevCount, elementBinder) {
             return prevCount + elementBinder.textNodeIndices.length;
         }, 0);
     this.rootNodeCount =
         this.isTemplateElement ? dom_adapter_1.DOM.childNodes(dom_adapter_1.DOM.content(this.element)).length : 1;
 }
function createRootElementFromFragments(fragments) {
    var rootElement = dom_adapter_1.DOM.createTemplate('');
    var rootNode = dom_adapter_1.DOM.content(rootElement);
    for (var i = 0; i < fragments.length; i++) {
        var fragment = fragments[i];
        if (i >= 1) {
            // Note: We need to seprate fragments by a comment so that sibling
            // text nodes don't get merged when we serialize the DomProtoView into a string
            // and parse it back again.
            dom_adapter_1.DOM.appendChild(rootNode, dom_adapter_1.DOM.createComment('|'));
        }
        fragment.forEach(function (node) { dom_adapter_1.DOM.appendChild(rootNode, node); });
    }
    return rootElement;
}
 _compileView(viewDef, templateAndStyles, protoViewType) {
     if (viewDef.encapsulation === ViewEncapsulation.EMULATED &&
         templateAndStyles.styles.length === 0) {
         viewDef = this._normalizeViewEncapsulationIfThereAreNoStyles(viewDef);
     }
     var pipeline = new CompilePipeline(this._stepFactory.createSteps(viewDef));
     var compiledStyles = pipeline.processStyles(templateAndStyles.styles);
     var compileElements = pipeline.processElements(this._createTemplateElm(templateAndStyles.template), protoViewType, viewDef);
     if (viewDef.encapsulation === ViewEncapsulation.NATIVE) {
         prependAll(DOM.content(compileElements[0].element), compiledStyles.map(style => DOM.createStyleElement(style)));
     }
     else {
         this._sharedStylesHost.addStyles(compiledStyles);
     }
     return PromiseWrapper.resolve(compileElements[0].inheritedProtoView.build(this._schemaRegistry, this._templateCloner));
 }
 fragmentElements.forEach(function (fragmentElement) {
     var fragmentContentElements = dom_adapter_1.DOM.querySelectorAll(dom_adapter_1.DOM.content(fragmentElement), util_1.NG_CONTENT_ELEMENT_NAME);
     for (var i = 0; i < fragmentContentElements.length; i++) {
         contentElements.push(fragmentContentElements[i]);
     }
 });
 DomRenderer.prototype._createView = function (protoView, inplaceElement) {
     var rootElementClone;
     var elementsWithBindingsDynamic;
     var viewRootNodes;
     if (lang_1.isPresent(inplaceElement)) {
         rootElementClone = inplaceElement;
         elementsWithBindingsDynamic = [];
         viewRootNodes = [inplaceElement];
     }
     else if (protoView.isTemplateElement) {
         rootElementClone = dom_adapter_1.DOM.importIntoDoc(dom_adapter_1.DOM.content(protoView.element));
         elementsWithBindingsDynamic =
             dom_adapter_1.DOM.querySelectorAll(rootElementClone, util_1.NG_BINDING_CLASS_SELECTOR);
         var childNode = dom_adapter_1.DOM.firstChild(rootElementClone);
         // TODO(perf): Should be fixed size, since we could pre-compute in in DomProtoView
         viewRootNodes = [];
         // Note: An explicit loop is the fastest way to convert a DOM array into a JS array!
         while (childNode != null) {
             collection_1.ListWrapper.push(viewRootNodes, childNode);
             childNode = dom_adapter_1.DOM.nextSibling(childNode);
         }
     }
     else {
         rootElementClone = dom_adapter_1.DOM.importIntoDoc(protoView.element);
         elementsWithBindingsDynamic = dom_adapter_1.DOM.getElementsByClassName(rootElementClone, util_1.NG_BINDING_CLASS);
         viewRootNodes = [rootElementClone];
     }
     var elementsWithBindings = collection_1.ListWrapper.createFixedSize(elementsWithBindingsDynamic.length);
     for (var binderIdx = 0; binderIdx < elementsWithBindingsDynamic.length; ++binderIdx) {
         elementsWithBindings[binderIdx] = elementsWithBindingsDynamic[binderIdx];
     }
     var binders = protoView.elementBinders;
     var boundTextNodes = [];
     var boundElements = collection_1.ListWrapper.createFixedSize(binders.length);
     var contentTags = collection_1.ListWrapper.createFixedSize(binders.length);
     for (var binderIdx = 0; binderIdx < binders.length; binderIdx++) {
         var binder = binders[binderIdx];
         var element;
         var childNodes;
         if (binderIdx === 0 && protoView.rootBindingOffset === 1) {
             // Note: if the root element was a template,
             // the rootElementClone is a document fragment,
             // which will be empty as soon as the view gets appended
             // to a parent. So we store null in the boundElements array.
             element = protoView.isTemplateElement ? null : rootElementClone;
             childNodes = dom_adapter_1.DOM.childNodes(rootElementClone);
         }
         else {
             element = elementsWithBindings[binderIdx - protoView.rootBindingOffset];
             childNodes = dom_adapter_1.DOM.childNodes(element);
         }
         boundElements[binderIdx] = element;
         // boundTextNodes
         var textNodeIndices = binder.textNodeIndices;
         for (var i = 0; i < textNodeIndices.length; i++) {
             collection_1.ListWrapper.push(boundTextNodes, childNodes[textNodeIndices[i]]);
         }
         // contentTags
         var contentTag = null;
         if (lang_1.isPresent(binder.contentTagSelector)) {
             contentTag = new content_tag_1.Content(element, binder.contentTagSelector);
         }
         contentTags[binderIdx] = contentTag;
     }
     var view = new view_1.DomView(protoView, viewRootNodes, boundTextNodes, boundElements, contentTags);
     for (var binderIdx = 0; binderIdx < binders.length; binderIdx++) {
         var binder = binders[binderIdx];
         var element = boundElements[binderIdx];
         // lightDoms
         var lightDom = null;
         if (lang_1.isPresent(binder.componentId)) {
             lightDom = this._shadowDomStrategy.constructLightDom(view, boundElements[binderIdx]);
         }
         view.lightDoms[binderIdx] = lightDom;
         // init contentTags
         var contentTag = contentTags[binderIdx];
         if (lang_1.isPresent(contentTag)) {
             var destLightDom = view.getDirectParentLightDom(binderIdx);
             contentTag.init(destLightDom);
         }
         // events
         if (lang_1.isPresent(binder.eventLocals) && lang_1.isPresent(binder.localEvents)) {
             for (var i = 0; i < binder.localEvents.length; i++) {
                 this._createEventListener(view, element, binderIdx, binder.localEvents[i].name, binder.eventLocals);
             }
         }
     }
     return view;
 };
Example #13
0
 .then((el) =>{
   expect(el).toBe(firstEl);
   expect(DOM.content(el)).toHaveText('xhr template');
   async.done();
 });
Example #14
0
  _createView(protoView:ProtoView): View {
    var rootElementClone = protoView.isRootView ? protoView.element : DOM.importIntoDoc(protoView.element);
    var elementsWithBindingsDynamic;
    if (protoView.isTemplateElement) {
      elementsWithBindingsDynamic = DOM.querySelectorAll(DOM.content(rootElementClone), NG_BINDING_CLASS_SELECTOR);
    } else {
      elementsWithBindingsDynamic = DOM.getElementsByClassName(rootElementClone, NG_BINDING_CLASS);
    }

    var elementsWithBindings = ListWrapper.createFixedSize(elementsWithBindingsDynamic.length);
    for (var binderIdx = 0; binderIdx < elementsWithBindingsDynamic.length; ++binderIdx) {
      elementsWithBindings[binderIdx] = elementsWithBindingsDynamic[binderIdx];
    }

    var viewRootNodes;
    if (protoView.isTemplateElement) {
      var childNode = DOM.firstChild(DOM.content(rootElementClone));
      viewRootNodes = []; // TODO(perf): Should be fixed size, since we could pre-compute in in ProtoView
      // Note: An explicit loop is the fastest way to convert a DOM array into a JS array!
      while(childNode != null) {
        ListWrapper.push(viewRootNodes, childNode);
        childNode = DOM.nextSibling(childNode);
      }
    } else {
      viewRootNodes = [rootElementClone];
    }

    var binders = protoView.elementBinders;
    var boundTextNodes = [];
    var boundElements = ListWrapper.createFixedSize(binders.length);
    var viewContainers = ListWrapper.createFixedSize(binders.length);
    var contentTags = ListWrapper.createFixedSize(binders.length);

    for (var binderIdx = 0; binderIdx < binders.length; binderIdx++) {
      var binder = binders[binderIdx];
      var element;
      if (binderIdx === 0 && protoView.rootBindingOffset === 1) {
        element = rootElementClone;
      } else {
        element = elementsWithBindings[binderIdx - protoView.rootBindingOffset];
      }
      boundElements[binderIdx] = element;

      // boundTextNodes
      var childNodes = DOM.childNodes(DOM.templateAwareRoot(element));
      var textNodeIndices = binder.textNodeIndices;
      for (var i = 0; i<textNodeIndices.length; i++) {
        ListWrapper.push(boundTextNodes, childNodes[textNodeIndices[i]]);
      }

      // viewContainers
      var viewContainer = null;
      if (isBlank(binder.componentId) && isPresent(binder.nestedProtoView)) {
        viewContainer = new ViewContainer(this, element);
      }
      viewContainers[binderIdx] = viewContainer;

      // contentTags
      var contentTag = null;
      if (isPresent(binder.contentTagSelector)) {
        contentTag = new Content(element, binder.contentTagSelector);
      }
      contentTags[binderIdx] = contentTag;
    }

    var view = new View(
      protoView, viewRootNodes,
      boundTextNodes, boundElements, viewContainers, contentTags
    );

    for (var binderIdx = 0; binderIdx < binders.length; binderIdx++) {
      var binder = binders[binderIdx];
      var element = boundElements[binderIdx];

      // static child components
      if (isPresent(binder.componentId) && isPresent(binder.nestedProtoView)) {
        var childView = this._createView(binder.nestedProtoView);
        view.setComponentView(this._shadowDomStrategy, binderIdx, childView);
      }

      // events
      if (isPresent(binder.eventLocals)) {
        ListWrapper.forEach(binder.eventNames, (eventName) => {
          this._createEventListener(view, element, binderIdx, eventName, binder.eventLocals);
        });
      }
    }

    if (protoView.isRootView) {
      view.hydrate(null);
    }

    return view;
  }
 DomProtoView.create = function (templateCloner, type, rootElement, viewEncapsulation, fragmentsRootNodeCount, rootTextNodeIndices, elementBinders, hostAttributes) {
     var boundTextNodeCount = rootTextNodeIndices.length;
     for (var i = 0; i < elementBinders.length; i++) {
         boundTextNodeCount += elementBinders[i].textNodeIndices.length;
     }
     var isSingleElementFragment = fragmentsRootNodeCount.length === 1 &&
         fragmentsRootNodeCount[0] === 1 &&
         dom_adapter_1.DOM.isElementNode(dom_adapter_1.DOM.firstChild(dom_adapter_1.DOM.content(rootElement)));
     return new DomProtoView(type, templateCloner.prepareForClone(rootElement), viewEncapsulation, elementBinders, hostAttributes, rootTextNodeIndices, boundTextNodeCount, fragmentsRootNodeCount, isSingleElementFragment);
 };
 DomRenderer.prototype._createView = function (protoView, inplaceElement) {
     var rootElementClone;
     var elementsWithBindingsDynamic;
     var viewRootNodes;
     if (lang_1.isPresent(inplaceElement)) {
         rootElementClone = inplaceElement;
         elementsWithBindingsDynamic = [];
         viewRootNodes = [inplaceElement];
     }
     else if (protoView.isTemplateElement) {
         rootElementClone = dom_adapter_1.DOM.importIntoDoc(dom_adapter_1.DOM.content(protoView.element));
         elementsWithBindingsDynamic =
             dom_adapter_1.DOM.querySelectorAll(rootElementClone, util_1.NG_BINDING_CLASS_SELECTOR);
         viewRootNodes = collection_1.ListWrapper.createFixedSize(protoView.rootNodeCount);
         // Note: An explicit loop is the fastest way to convert a DOM array into a JS array!
         var childNode = dom_adapter_1.DOM.firstChild(rootElementClone);
         for (var i = 0; i < protoView.rootNodeCount; i++, childNode = dom_adapter_1.DOM.nextSibling(childNode)) {
             viewRootNodes[i] = childNode;
         }
     }
     else {
         rootElementClone = dom_adapter_1.DOM.importIntoDoc(protoView.element);
         elementsWithBindingsDynamic = dom_adapter_1.DOM.getElementsByClassName(rootElementClone, util_1.NG_BINDING_CLASS);
         viewRootNodes = [rootElementClone];
     }
     var binders = protoView.elementBinders;
     var boundTextNodes = collection_1.ListWrapper.createFixedSize(protoView.boundTextNodeCount);
     var boundElements = collection_1.ListWrapper.createFixedSize(binders.length);
     var boundTextNodeIdx = 0;
     for (var binderIdx = 0; binderIdx < binders.length; binderIdx++) {
         var binder = binders[binderIdx];
         var element;
         var childNodes;
         if (binderIdx === 0 && protoView.rootBindingOffset === 1) {
             // Note: if the root element was a template,
             // the rootElementClone is a document fragment,
             // which will be empty as soon as the view gets appended
             // to a parent. So we store null in the boundElements array.
             element = protoView.isTemplateElement ? null : rootElementClone;
             childNodes = dom_adapter_1.DOM.childNodes(rootElementClone);
         }
         else {
             element = elementsWithBindingsDynamic[binderIdx - protoView.rootBindingOffset];
             childNodes = dom_adapter_1.DOM.childNodes(element);
         }
         // boundTextNodes
         var textNodeIndices = binder.textNodeIndices;
         for (var i = 0; i < textNodeIndices.length; i++) {
             boundTextNodes[boundTextNodeIdx++] = childNodes[textNodeIndices[i]];
         }
         // contentTags
         var contentTag = null;
         if (lang_1.isPresent(binder.contentTagSelector)) {
             contentTag = new content_tag_1.Content(element, binder.contentTagSelector);
         }
         boundElements[binderIdx] = new element_1.DomElement(binder, element, contentTag);
     }
     var view = new view_1.DomView(protoView, viewRootNodes, boundTextNodes, boundElements);
     for (var binderIdx = 0; binderIdx < binders.length; binderIdx++) {
         var binder = binders[binderIdx];
         var element = boundElements[binderIdx];
         var domEl = element.element;
         // lightDoms
         var lightDom = null;
         // Note: for the root element we can't use the binder.elementIsEmpty
         // information as we don't use the element from the ProtoView
         // but an element from the document.
         if (lang_1.isPresent(binder.componentId) && (!binder.elementIsEmpty || lang_1.isPresent(inplaceElement))) {
             lightDom = this._shadowDomStrategy.constructLightDom(view, domEl);
         }
         element.lightDom = lightDom;
         // init contentTags
         var contentTag = element.contentTag;
         if (lang_1.isPresent(contentTag)) {
             var directParentLightDom = this._directParentLightDom(view, binderIdx);
             contentTag.init(directParentLightDom);
         }
         // events
         if (lang_1.isPresent(binder.eventLocals) && lang_1.isPresent(binder.localEvents)) {
             for (var i = 0; i < binder.localEvents.length; i++) {
                 this._createEventListener(view, domEl, binderIdx, binder.localEvents[i].name, binder.eventLocals);
             }
         }
     }
     return view;
 };
 fragment.forEach(function (node) { return dom_adapter_1.DOM.appendChild(dom_adapter_1.DOM.content(fragmentElement), node); });
Example #18
0
 loader.load(template).then((el) => {
   expect(DOM.content(el)).toHaveText('xhr template');
   async.done();
 });
Example #19
0
export function el(html:string) {
  return DOM.firstChild(DOM.content(DOM.createTemplate(html)));
}
 return fragmentElements.map(function (fragmentElement) { return dom_adapter_1.DOM.childNodesAsList(dom_adapter_1.DOM.content(fragmentElement)); });
function el(html) {
    return dom_adapter_1.DOM.firstChild(dom_adapter_1.DOM.content(dom_adapter_1.DOM.createTemplate(html)));
}
Example #22
0
 it('should load inline templates synchronously', () => {
   var template = new Template({inline: 'inline template'});
   expect(DOM.content(loader.load(template))).toHaveText('inline template');
 });