Skip to content

Commit

Permalink
refactor(compiler): i18n - render all legacy message ids
Browse files Browse the repository at this point in the history 
Now that `@angular/localize` can interpret multiple legacy message ids in the
metablock of a `$localize` tagged template string, this commit adds those
ids to each i18n message extracted from component templates, but only if
the `enableI18nLegacyMessageIdFormat` is not `false`.
  • Loading branch information
@petebacondarwin
petebacondarwin committed Nov 28, 2019
1 parent cad296f commit 8c100d3
Show file tree
Hide file tree
Showing 10 changed files with 59 additions and 113 deletions.
2 changes: 1 addition & 1 deletion packages/compiler-cli/ngcc/src/analysis/decoration_analyzer.ts
View file
Expand Up @@ -88,7 +88,7 @@ export class DecorationAnalyzer {
this.reflectionHost, this.evaluator, this.fullRegistry, this.fullMetaReader,
this.scopeRegistry, this.scopeRegistry, this.isCore, this.resourceManager, this.rootDirs,
/* defaultPreserveWhitespaces */ false,
/* i18nUseExternalIds */ true, /* i18nLegacyMessageIdFormat */ '', this.moduleResolver,
/* i18nUseExternalIds */ true, /* enableI18nLegacyMessageId */ false, this.moduleResolver,
this.cycleAnalyzer, this.refEmitter, NOOP_DEFAULT_IMPORT_RECORDER,
/* annotateForClosureCompiler */ false),
new DirectiveDecoratorHandler(
Expand Down
4 changes: 2 additions & 2 deletions packages/compiler-cli/src/ngtsc/annotations/src/component.ts
View file
Expand Up @@ -52,7 +52,7 @@ export class ComponentDecoratorHandler implements
private scopeReader: ComponentScopeReader, private scopeRegistry: LocalModuleScopeRegistry,
private isCore: boolean, private resourceLoader: ResourceLoader, private rootDirs: string[],
private defaultPreserveWhitespaces: boolean, private i18nUseExternalIds: boolean,
private i18nLegacyMessageIdFormat: string, private moduleResolver: ModuleResolver,
private enableI18nLegacyMessageId: boolean, private moduleResolver: ModuleResolver,
private cycleAnalyzer: CycleAnalyzer, private refEmitter: ReferenceEmitter,
private defaultImportRecorder: DefaultImportRecorder,
private annotateForClosureCompiler: boolean,
Expand Down Expand Up @@ -710,7 +710,7 @@ export class ComponentDecoratorHandler implements
preserveWhitespaces,
interpolationConfig: interpolation,
range: templateRange, escapedString,
i18nLegacyMessageIdFormat: this.i18nLegacyMessageIdFormat, ...options,
enableI18nLegacyMessageId: this.enableI18nLegacyMessageId, ...options,
}),
template: templateStr, templateUrl,
isInline: component.has('template'),
Expand Down
2 changes: 1 addition & 1 deletion packages/compiler-cli/src/ngtsc/annotations/test/component_spec.ts
View file
Expand Up @@ -63,7 +63,7 @@ runInEachFileSystem(() => {
reflectionHost, evaluator, metaRegistry, metaReader, scopeRegistry, scopeRegistry,
/* isCore */ false, new NoopResourceLoader(), /* rootDirs */[''],
/* defaultPreserveWhitespaces */ false, /* i18nUseExternalIds */ true,
/* i18nLegacyMessageIdFormat */ '', moduleResolver, cycleAnalyzer, refEmitter,
/* enableI18nLegacyMessageId */ false, moduleResolver, cycleAnalyzer, refEmitter,
NOOP_DEFAULT_IMPORT_RECORDER, /* annotateForClosureCompiler */ false);
const TestCmp = getDeclaration(program, _('/entry.ts'), 'TestCmp', isNamedClassDeclaration);
const detected = handler.detect(TestCmp, reflectionHost.getDecoratorsOfDeclaration(TestCmp));
Expand Down
11 changes: 3 additions & 8 deletions packages/compiler-cli/src/ngtsc/program.ts
View file
Expand Up @@ -623,9 +623,9 @@ export class NgtscProgram implements api.Program {
this.reflector, evaluator, metaRegistry, this.metaReader !, scopeReader, scopeRegistry,
this.isCore, this.resourceManager, this.rootDirs,
this.options.preserveWhitespaces || false, this.options.i18nUseExternalIds !== false,
this.getI18nLegacyMessageFormat(), this.moduleResolver, this.cycleAnalyzer,
this.refEmitter, this.defaultImportTracker, this.closureCompilerEnabled,
this.incrementalDriver),
this.options.enableI18nLegacyMessageIdFormat !== false, this.moduleResolver,
this.cycleAnalyzer, this.refEmitter, this.defaultImportTracker,
this.closureCompilerEnabled, this.incrementalDriver),
new DirectiveDecoratorHandler(
this.reflector, evaluator, metaRegistry, this.defaultImportTracker, this.isCore,
this.closureCompilerEnabled),
Expand All @@ -646,11 +646,6 @@ export class NgtscProgram implements api.Program {
this.options.compileNonExportedClasses !== false);
}

private getI18nLegacyMessageFormat(): string {
return this.options.enableI18nLegacyMessageIdFormat !== false && this.options.i18nInFormat ||
'';
}

private get reflector(): TypeScriptReflectionHost {
if (this._reflector === undefined) {
this._reflector = new TypeScriptReflectionHost(this.tsProgram.getTypeChecker());
Expand Down
108 changes: 27 additions & 81 deletions packages/compiler-cli/test/ngtsc/ngtsc_spec.ts
View file
Expand Up @@ -2454,82 +2454,23 @@ runInEachFileSystem(os => {
expect(jsContents).not.toContain('MSG_EXTERNAL_');
});

it('should render legacy id when `enableI18nLegacyMessageIdFormat` is not false and `i18nInFormat` is set to "xlf"',
() => {
env.tsconfig({i18nInFormat: 'xlf'});
env.write(`test.ts`, `
import {Component} from '@angular/core';
@Component({
selector: 'test',
template: '<div i18n>Some text</div>'
})
class FooCmp {}`);
env.driveMain();
const jsContents = env.getContents('test.js');
expect(jsContents).toContain(':@@5dbba0a3da8dff890e20cf76eb075d58900fbcd3:Some text');
});

it('should render legacy id when `enableI18nLegacyMessageIdFormat` is not false and `i18nInFormat` is set to "xliff"',
() => {
env.tsconfig({i18nInFormat: 'xliff'});
env.write(`test.ts`, `
import {Component} from '@angular/core';
@Component({
selector: 'test',
template: '<div i18n>Some text</div>'
})
class FooCmp {}`);
env.driveMain();
const jsContents = env.getContents('test.js');
expect(jsContents).toContain(':@@5dbba0a3da8dff890e20cf76eb075d58900fbcd3:Some text');
});

it('should render legacy id when `enableI18nLegacyMessageIdFormat` is not false and `i18nInFormat` is set to "xlf2"',
() => {
env.tsconfig({i18nInFormat: 'xlf2'});
env.write(`test.ts`, `
import {Component} from '@angular/core';
@Component({
selector: 'test',
template: '<div i18n>Some text</div>'
})
class FooCmp {}`);
env.driveMain();
const jsContents = env.getContents('test.js');
expect(jsContents).toContain(':@@8321000940098097247:Some text');
});

it('should render legacy id when `enableI18nLegacyMessageIdFormat` is not false and `i18nInFormat` is set to "xliff2"',
() => {
env.tsconfig({i18nInFormat: 'xliff2'});
env.write(`test.ts`, `
import {Component} from '@angular/core';
@Component({
selector: 'test',
template: '<div i18n>Some text</div>'
})
class FooCmp {}`);
env.driveMain();
const jsContents = env.getContents('test.js');
expect(jsContents).toContain(':@@8321000940098097247:Some text');
});

it('should render legacy id when `enableI18nLegacyMessageIdFormat` is not false and `i18nInFormat` is set to "xmb"',
() => {
env.tsconfig({i18nInFormat: 'xmb'});
env.write(`test.ts`, `
it('should render legacy ids when `enableI18nLegacyMessageIdFormat` is not false', () => {
env.tsconfig({});
env.write(`test.ts`, `
import {Component} from '@angular/core';
@Component({
selector: 'test',
template: '<div i18n>Some text</div>'
})
class FooCmp {}`);
env.driveMain();
const jsContents = env.getContents('test.js');
expect(jsContents).toContain(':@@8321000940098097247:Some text');
});
env.driveMain();
const jsContents = env.getContents('test.js');
expect(jsContents)
.toContain(
'":\\u241F5dbba0a3da8dff890e20cf76eb075d58900fbcd3\\u241F8321000940098097247:Some text"');
});

it('should render custom id even if `enableI18nLegacyMessageIdFormat` is not false and `i18nInFormat` is set',
it('should render custom id and legacy ids if `enableI18nLegacyMessageIdFormat` is not false',
() => {
env.tsconfig({i18nFormatIn: 'xlf'});
env.write(`test.ts`, `
Expand All @@ -2541,25 +2482,28 @@ runInEachFileSystem(os => {
class FooCmp {}`);
env.driveMain();
const jsContents = env.getContents('test.js');
expect(jsContents).toContain(':@@custom:Some text');
expect(jsContents)
.toContain(
':@@custom\\u241F5dbba0a3da8dff890e20cf76eb075d58900fbcd3\\u241F8321000940098097247:Some text');
});

it('should not render legacy id when `enableI18nLegacyMessageIdFormat` is set to false', () => {
env.tsconfig({enableI18nLegacyMessageIdFormat: false, i18nInFormat: 'xmb'});
env.write(`test.ts`, `
it('should not render legacy ids when `enableI18nLegacyMessageIdFormat` is set to false',
() => {
env.tsconfig({enableI18nLegacyMessageIdFormat: false, i18nInFormat: 'xmb'});
env.write(`test.ts`, `
import {Component} from '@angular/core';
@Component({
selector: 'test',
template: '<div i18n>Some text</div>'
})
class FooCmp {}`);
env.driveMain();
const jsContents = env.getContents('test.js');
// Note that the colon would only be there if there is an id attached to the string.
expect(jsContents).not.toContain(':Some text');
});
env.driveMain();
const jsContents = env.getContents('test.js');
// Note that the colon would only be there if there is an id attached to the string.
expect(jsContents).not.toContain(':Some text');
});

it('should also render legacy id for ICUs when normal messages are using legacy ids', () => {
it('should also render legacy ids for ICUs when normal messages are using legacy ids', () => {
env.tsconfig({i18nInFormat: 'xliff'});
env.write(`test.ts`, `
import {Component} from '@angular/core';
Expand All @@ -2572,8 +2516,10 @@ runInEachFileSystem(os => {
const jsContents = env.getContents('test.js');
expect(jsContents)
.toContain(
':@@720ba589d043a0497ac721ff972f41db0c919efb:{VAR_PLURAL, plural, 10 {ten} other {other}}');
expect(jsContents).toContain(':@@custom:Some text');
':\\u241F720ba589d043a0497ac721ff972f41db0c919efb\\u241F3221232817843005870:{VAR_PLURAL, plural, 10 {ten} other {other}}');
expect(jsContents)
.toContain(
':@@custom\\u241Fdcb6170595f5d548a3d00937e87d11858f51ad04\\u241F7419139165339437596:Some text');
});

it('@Component\'s `interpolation` should override default interpolation config', () => {
Expand Down
4 changes: 2 additions & 2 deletions packages/compiler/src/i18n/i18n_ast.ts
View file
Expand Up @@ -11,8 +11,8 @@ import {ParseSourceSpan} from '../parse_util';
export class Message {
sources: MessageSpan[];
id: string = this.customId;
/** The id to use if there is no custom id and if `i18nLegacyMessageIdFormat` is not empty */
legacyId?: string = '';
/** The ids to use if there are no custom id and if `i18nLegacyMessageIdFormat` is not empty */
legacyIds: string[] = [];

/**
* @param nodes message AST
Expand Down
14 changes: 11 additions & 3 deletions packages/compiler/src/output/output_ast.ts
View file
Expand Up @@ -509,12 +509,20 @@ export class LocalizedString extends Expression {
* @param messagePart The first part of the tagged string
*/
serializeI18nHead(): {cooked: string, raw: string} {
const MEANING_SEPARATOR = '|';
const ID_SEPARATOR = '@@';
const LEGACY_ID_INDICATOR = '␟';

let metaBlock = this.metaBlock.description || '';
if (this.metaBlock.meaning) {
metaBlock = `${this.metaBlock.meaning}|${metaBlock}`;
metaBlock = `${this.metaBlock.meaning}${MEANING_SEPARATOR}${metaBlock}`;
}
if (this.metaBlock.customId) {
metaBlock = `${metaBlock}${ID_SEPARATOR}${this.metaBlock.customId}`;
}
if (this.metaBlock.customId || this.metaBlock.legacyId) {
metaBlock = `${metaBlock}@@${this.metaBlock.customId || this.metaBlock.legacyId}`;
if (this.metaBlock.legacyIds) {
this.metaBlock.legacyIds.forEach(
legacyId => { metaBlock = `${metaBlock}${LEGACY_ID_INDICATOR}${legacyId}`; });
}
return createCookedRawString(metaBlock, this.messageParts[0]);
}
Expand Down
20 changes: 8 additions & 12 deletions packages/compiler/src/render3/view/i18n/meta.ts
View file
Expand Up @@ -18,7 +18,7 @@ import {I18N_ATTR, I18N_ATTR_PREFIX, hasI18nAttrs, icuFromI18nMessage} from './u
export type I18nMeta = {
id?: string,
customId?: string,
legacyId?: string,
legacyIds?: string[],
description?: string,
meaning?: string
};
Expand Down Expand Up @@ -52,15 +52,15 @@ export class I18nMetaVisitor implements html.Visitor {

constructor(
private interpolationConfig: InterpolationConfig = DEFAULT_INTERPOLATION_CONFIG,
private keepI18nAttrs: boolean = false, private i18nLegacyMessageIdFormat: string = '') {}
private keepI18nAttrs = false, private enableI18nLegacyMessageId = false) {}

private _generateI18nMessage(
nodes: html.Node[], meta: string|i18n.I18nMeta = '',
visitNodeFn?: VisitNodeFn): i18n.Message {
const {meaning, description, customId} = this._parseMetadata(meta);
const message = this._createI18nMessage(nodes, meaning, description, customId, visitNodeFn);
this._setMessageId(message, meta);
this._setLegacyId(message, meta);
this._setLegacyIds(message, meta);
return message;
}

Expand Down Expand Up @@ -171,13 +171,9 @@ export class I18nMetaVisitor implements html.Visitor {
* @param message the message whose legacy id should be set
* @param meta information about the message being processed
*/
private _setLegacyId(message: i18n.Message, meta: string|i18n.I18nMeta): void {
if (this.i18nLegacyMessageIdFormat === 'xlf' || this.i18nLegacyMessageIdFormat === 'xliff') {
message.legacyId = computeDigest(message);
} else if (
this.i18nLegacyMessageIdFormat === 'xlf2' || this.i18nLegacyMessageIdFormat === 'xliff2' ||
this.i18nLegacyMessageIdFormat === 'xmb') {
message.legacyId = computeDecimalDigest(message);
private _setLegacyIds(message: i18n.Message, meta: string|i18n.I18nMeta): void {
if (this.enableI18nLegacyMessageId) {
message.legacyIds = [computeDigest(message), computeDecimalDigest(message)];
} else if (typeof meta !== 'string') {
// This occurs if we are doing the 2nd pass after whitespace removal (see `parseTemplate()` in
// `packages/compiler/src/render3/view/template.ts`).
Expand All @@ -186,7 +182,7 @@ export class I18nMetaVisitor implements html.Visitor {
const previousMessage = meta instanceof i18n.Message ?
meta :
meta instanceof i18n.IcuPlaceholder ? meta.previousMessage : undefined;
message.legacyId = previousMessage && previousMessage.legacyId;
message.legacyIds = previousMessage ? previousMessage.legacyIds : [];
}
}
}
Expand All @@ -195,7 +191,7 @@ export function metaFromI18nMessage(message: i18n.Message, id: string | null = n
return {
id: typeof id === 'string' ? id : message.id || '',
customId: message.customId,
legacyId: message.legacyId,
legacyIds: message.legacyIds,
meaning: message.meaning || '',
description: message.description || ''
};
Expand Down
6 changes: 3 additions & 3 deletions packages/compiler/src/render3/view/template.ts
View file
Expand Up @@ -1955,7 +1955,7 @@ export interface ParseTemplateOptions {
* formatted translation files and will be removed at the same time as ViewEngine support is
* removed.
*/
i18nLegacyMessageIdFormat?: string;
enableI18nLegacyMessageId?: boolean;
}

/**
Expand All @@ -1968,7 +1968,7 @@ export interface ParseTemplateOptions {
export function parseTemplate(
template: string, templateUrl: string, options: ParseTemplateOptions = {}):
{errors?: ParseError[], nodes: t.Node[], styleUrls: string[], styles: string[]} {
const {interpolationConfig, preserveWhitespaces, i18nLegacyMessageIdFormat} = options;
const {interpolationConfig, preserveWhitespaces, enableI18nLegacyMessageId} = options;
const bindingParser = makeBindingParser(interpolationConfig);
const htmlParser = new HtmlParser();
const parseResult = htmlParser.parse(
Expand All @@ -1986,7 +1986,7 @@ export function parseTemplate(
// extraction process (ng xi18n) relies on a raw content to generate
// message ids
const i18nMetaVisitor = new I18nMetaVisitor(
interpolationConfig, /* keepI18nAttrs */ !preserveWhitespaces, i18nLegacyMessageIdFormat);
interpolationConfig, /* keepI18nAttrs */ !preserveWhitespaces, enableI18nLegacyMessageId);
rootNodes = html.visitAll(i18nMetaVisitor, rootNodes);

if (!preserveWhitespaces) {
Expand Down
1 change: 1 addition & 0 deletions packages/compiler/test/i18n/digest_spec.ts
View file
Expand Up @@ -14,6 +14,7 @@ import {computeMsgId, digest, sha1} from '../../src/i18n/digest';
it('must return the ID if it\'s explicit', () => {
expect(digest({
id: 'i',
legacyIds: [],
nodes: [],
placeholders: {},
placeholderToMessage: {},
Expand Down

0 comments on commit 8c100d3

Please sign in to comment.