templating: processContent( ) functor which injects a results in a stack overflow.
If using an @processContent decorator on a custom element, and the processContent functor injects a template tag, then returns true, then Aurelia will crash with a stack overflow.
Simple example:
@customElement( "my-widget" )
@processContent( MyWidget.processContent )
export class MyWidget
{
static processContent( compiler: ViewCompiler, resources: ViewResources, node: HTMLElement, instruction: ( BehaviorInstruction & any ) ): Boolean
{
// NOTE: createChildElement is a helper that calls document.createElement then parent.appendChild.
let child: HTMLElement = DOMHelper.createChildElement( "template", node );
let child2: HTMLElement = DOMHelper.createChildElement( "p", child );
child2.appendChild( document.createTextNode( "small message" ) );
return true;
}
I have also tried the alternate way of making the “child node” of the template element a DocumentFragment, because I have noticed that if I specify a template as content to my widget, then it appears with the “node” passed into the processContent functor, like a Document fragment. For example:
<my-widget>
<template replace-part="greeting">
<p>Hello</p>
</template>
</my-widget>
All help greatly appreciated.
About this issue
- Original URL
- State: open
- Created 8 years ago
- Comments: 19 (13 by maintainers)
I’ve released an update to PAL so that we now have
DOM.createTemplateElement()
which will create an element and ensure that the created template is polyfilled correctly. That can be used to safely create template elements on the fly without having to callFEATURE.ensureHTMLTemplateElement
or even know that that exists.@jdanyow Do you have another fix that needs to be contributed elsewhere?
Is this in IE? IE does not build template elements with a content property, which can cause binding to go into an infinite loop.
I had a similar problem with viewCompiler. The workaround is to use (Typescript has to use “as any”)
Note aurelia-pal-browser only publishes createTemplateFromMarkup which takes markup input, but hidden ensureHTMLTemplateElement takes element input