fix(ivy): avoid creating self-closing i18n instructions in case we have styling instructions (#27330)
The problem was caused by the self-closing i18n instruction that was generated in case we have styling instructions defined for a component. As a result, that caused problems at runtime. This update adds extra check to avoid creating self-closing i18n instructions (create i18nStart and i18nEnd instructions instead) when styling instructions are present. PR Close #27330
This commit is contained in:
parent
a088b8c203
commit
973ebdc0ea
|
@ -1146,6 +1146,39 @@ describe('i18n support in the view compiler', () => {
|
|||
|
||||
verify(input, output);
|
||||
});
|
||||
|
||||
it('should not be generated in case we have styling instructions', () => {
|
||||
const input = `
|
||||
<span i18n class="myClass">Text #1</span>
|
||||
<span i18n style="padding: 10px;">Text #2</span>
|
||||
`;
|
||||
|
||||
const output = String.raw `
|
||||
const $_c0$ = ["myClass", 1, "myClass", true];
|
||||
const $MSG_EXTERNAL_5295701706185791735$ = goog.getMsg("Text #1");
|
||||
const $_c1$ = ["padding", 1, "padding", "10px"];
|
||||
const $MSG_EXTERNAL_4722270221386399294$ = goog.getMsg("Text #2");
|
||||
…
|
||||
consts: 4,
|
||||
vars: 0,
|
||||
template: function MyComponent_Template(rf, ctx) {
|
||||
if (rf & 1) {
|
||||
$r3$.ɵelementStart(0, "span");
|
||||
$r3$.ɵi18nStart(1, $MSG_EXTERNAL_5295701706185791735$);
|
||||
$r3$.ɵelementStyling($_c0$);
|
||||
$r3$.ɵi18nEnd();
|
||||
$r3$.ɵelementEnd();
|
||||
$r3$.ɵelementStart(2, "span");
|
||||
$r3$.ɵi18nStart(3, $MSG_EXTERNAL_4722270221386399294$);
|
||||
$r3$.ɵelementStyling(null, $_c1$);
|
||||
$r3$.ɵi18nEnd();
|
||||
$r3$.ɵelementEnd();
|
||||
}
|
||||
}
|
||||
`;
|
||||
|
||||
verify(input, output);
|
||||
});
|
||||
});
|
||||
|
||||
describe('ng-container and ng-template', () => {
|
||||
|
|
|
@ -535,8 +535,8 @@ export class TemplateDefinitionBuilder implements t.Visitor<void>, LocalResolver
|
|||
const createSelfClosingInstruction = !stylingBuilder.hasBindingsOrInitialValues &&
|
||||
!isNgContainer && element.outputs.length === 0 && i18nAttrs.length === 0 && !hasChildren();
|
||||
|
||||
const createSelfClosingI18nInstruction =
|
||||
!createSelfClosingInstruction && hasTextChildrenOnly(element.children);
|
||||
const createSelfClosingI18nInstruction = !createSelfClosingInstruction &&
|
||||
!stylingBuilder.hasBindingsOrInitialValues && hasTextChildrenOnly(element.children);
|
||||
|
||||
if (createSelfClosingInstruction) {
|
||||
this.creationInstruction(element.sourceSpan, R3.element, trimTrailingNulls(parameters));
|
||||
|
|
Loading…
Reference in New Issue