fix(renderer): apply host element encapsulation also if the parent component is not encapsulated.
Closes #5240
This commit is contained in:
parent
a3e6406b38
commit
344776f864
|
@ -225,19 +225,28 @@ class RenderViewBuilder<N> implements RenderCommandVisitor {
|
||||||
componentTemplate: RenderComponentTemplate): N {
|
componentTemplate: RenderComponentTemplate): N {
|
||||||
var el: N = context.consumeInplaceElement();
|
var el: N = context.consumeInplaceElement();
|
||||||
var attrNameAndValues = cmd.attrNameAndValues;
|
var attrNameAndValues = cmd.attrNameAndValues;
|
||||||
if (this.template.encapsulation === ViewEncapsulation.Emulated) {
|
var templateEmulatedEncapsulation = this.template.encapsulation === ViewEncapsulation.Emulated;
|
||||||
|
var componentEmulatedEncapsulation =
|
||||||
|
isPresent(componentTemplate) &&
|
||||||
|
componentTemplate.encapsulation === ViewEncapsulation.Emulated;
|
||||||
|
var newAttrLength = attrNameAndValues.length + (templateEmulatedEncapsulation ? 2 : 0) +
|
||||||
|
(componentEmulatedEncapsulation ? 2 : 0);
|
||||||
|
if (newAttrLength > attrNameAndValues.length) {
|
||||||
// Note: Need to clone attrNameAndValues to make it writable!
|
// Note: Need to clone attrNameAndValues to make it writable!
|
||||||
if (isPresent(componentTemplate)) {
|
var newAttrNameAndValues = ListWrapper.createFixedSize(newAttrLength);
|
||||||
attrNameAndValues = attrNameAndValues.concat([
|
var attrIndex;
|
||||||
_shimContentAttribute(this.template.shortId),
|
for (attrIndex = 0; attrIndex < attrNameAndValues.length; attrIndex++) {
|
||||||
'',
|
newAttrNameAndValues[attrIndex] = attrNameAndValues[attrIndex];
|
||||||
_shimHostAttribute(componentTemplate.shortId),
|
|
||||||
''
|
|
||||||
]);
|
|
||||||
} else {
|
|
||||||
attrNameAndValues =
|
|
||||||
attrNameAndValues.concat([_shimContentAttribute(this.template.shortId), '']);
|
|
||||||
}
|
}
|
||||||
|
if (templateEmulatedEncapsulation) {
|
||||||
|
newAttrNameAndValues[attrIndex++] = _shimContentAttribute(this.template.shortId);
|
||||||
|
newAttrNameAndValues[attrIndex++] = '';
|
||||||
|
}
|
||||||
|
if (componentEmulatedEncapsulation) {
|
||||||
|
newAttrNameAndValues[attrIndex++] = _shimHostAttribute(componentTemplate.shortId);
|
||||||
|
newAttrNameAndValues[attrIndex++] = '';
|
||||||
|
}
|
||||||
|
attrNameAndValues = newAttrNameAndValues;
|
||||||
}
|
}
|
||||||
if (isPresent(el)) {
|
if (isPresent(el)) {
|
||||||
context.factory.mergeElement(el, attrNameAndValues);
|
context.factory.mergeElement(el, attrNameAndValues);
|
||||||
|
|
|
@ -611,11 +611,11 @@ export function main() {
|
||||||
'innerComp', 'innerid', ViewEncapsulation.Emulated,
|
'innerComp', 'innerid', ViewEncapsulation.Emulated,
|
||||||
[beginElement('div', [], [], false, null), endElement()], []));
|
[beginElement('div', [], [], false, null), endElement()], []));
|
||||||
var view = createRenderView(
|
var view = createRenderView(
|
||||||
encapsulatedTpl, [beginComponent('my-comp', [], [], null, '0'), endComponent()],
|
defaultCmpTpl, [beginComponent('my-comp', [], [], null, '0'), endComponent()],
|
||||||
null, nodeFactory);
|
null, nodeFactory);
|
||||||
expect(stringifyFragment(view.fragments[0].nodes))
|
expect(stringifyFragment(view.fragments[0].nodes))
|
||||||
.toEqual(
|
.toEqual(
|
||||||
'<my-comp _ngcontent-shortid="" _nghost-innerid=""><div _ngcontent-innerid=""></div></my-comp>');
|
'<my-comp _nghost-innerid=""><div _ngcontent-innerid=""></div></my-comp>');
|
||||||
});
|
});
|
||||||
});
|
});
|
||||||
});
|
});
|
||||||
|
|
Loading…
Reference in New Issue