fix(core): do not clear element content when using shadow dom (#24861)

PR Close #24861
This commit is contained in:
Rob Wormald
2018-07-11 15:57:27 -07:00
committed by Misko Hevery
parent 1f59f2f04d
commit 6e828bba88
6 changed files with 185 additions and 8 deletions

View File

@ -268,7 +268,7 @@ export abstract class Renderer2 {
* @param selectorOrNode The DOM element.
* @returns The root element.
*/
abstract selectRootElement(selectorOrNode: string|any): any;
abstract selectRootElement(selectorOrNode: string|any, preserveContent?: boolean): any;
/**
* Implement this callback to get the parent of a given node
* in the host element's DOM.

View File

@ -6,6 +6,7 @@
* found in the LICENSE file at https://angular.io/license
*/
import {ViewEncapsulation} from '../metadata/view';
import {RendererType2} from '../render/api';
import {SecurityContext} from '../sanitization/security';
@ -163,7 +164,11 @@ export function createElement(view: ViewData, renderHost: any, def: NodeDef): El
renderer.appendChild(parentEl, el);
}
} else {
el = renderer.selectRootElement(rootSelectorOrNode);
// when using native Shadow DOM, do not clear the root element contents to allow slot projection
const preserveContent =
(!!elDef.componentRendererType &&
elDef.componentRendererType.encapsulation === ViewEncapsulation.ShadowDom);
el = renderer.selectRootElement(rootSelectorOrNode, preserveContent);
}
if (elDef.attrs) {
for (let i = 0; i < elDef.attrs.length; i++) {

View File

@ -773,9 +773,9 @@ export class DebugRenderer2 implements Renderer2 {
this.delegate.removeChild(parent, oldChild);
}
selectRootElement(selectorOrNode: string|any): any {
const el = this.delegate.selectRootElement(selectorOrNode);
const debugCtx = this.debugContext;
selectRootElement(selectorOrNode: string|any, preserveContent?: boolean): any {
const el = this.delegate.selectRootElement(selectorOrNode, preserveContent);
const debugCtx = getCurrentDebugContext();
if (debugCtx) {
indexDebugNode(new DebugElement(el, null, debugCtx));
}