angular-cn/packages/localize/test/utils/translations_spec.ts

165 lines
7.3 KiB
TypeScript
Raw Normal View History

feat(ivy): i18n - reorganize entry-points for better reuse (#32488) This is a refactoring that moves the source code around to provide a better platform for adding the compile-time inlining. 1. Move the global side-effect import from the primary entry-point to a secondary entry-point @angular/localize/init. This has two benefits: first it allows the top level entry-point to contain tree-shakable shareable code; second it gives the side-effect import more of an "action" oriented name, which indicates that importing it does something tangible 2. Move all the source code into the top src folder, and import the localize related functions into the localize/init/index.ts entry-point. This allows the different parts of the package to share code without a proliferation of secondary entry-points (i.e. localize/utils). 3. Avoid publicly exporting any utilities at this time - the only public API at this point are the global `$localize` function and the two runtime helpers `loadTranslations()` and `clearTranslations()`. This does not mean that we will not expose additional helpers for 3rd party tooling in the future, but it avoid us preemptively exposing something that we might want to change in the near future. Notes: It is not possible to have the `$localize` code in the same Bazel package as the rest of the code. If we did this, then the bundled `@angular/localize/init` entry-point code contains all of the helper code, even though most of it is not used. Equally it is not possible to have the `$localize` types (i.e. `LocalizeFn` and `TranslateFn`) defined in the `@angular/localize/init` entry-point because these types are needed for the runtime code, which is inside the primary entry-point. Importing them from `@angular/localize/init` would run the side-effect. The solution is to have a Bazel sub-package at `//packages/localize/src/localize` which contains these types and the `$localize` function implementation. The primary `//packages/localize` entry-point imports the types without any side-effect. The secondary `//packages/localize/init` entry-point imports the `$localize` function and attaches it to the global scope as a side-effect, without bringing with it all the other utility functions. BREAKING CHANGES: The entry-points have changed: * To attach the `$localize` function to the global scope import from `@angular/localize/init`. Previously it was `@angular/localize`. * To access the `loadTranslations()` and `clearTranslations()` functions, import from `@angular/localize`. Previously it was `@angular/localize/run_time`. PR Close #32488
2019-08-10 07:51:30 -04:00
/**
* @license
* Copyright Google Inc. All Rights Reserved.
*
* Use of this source code is governed by an MIT-style license that can be
* found in the LICENSE file at https://angular.io/license
*/
import {ParsedTranslation, TargetMessage, TranslationKey, makeTemplateObject, parseTranslation, translate} from '../../src/utils/translations';
describe('utils', () => {
describe('makeTemplateObject', () => {
it('should return an array containing the cooked items', () => {
const template =
makeTemplateObject(['cooked-a', 'cooked-b', 'cooked-c'], ['raw-a', 'raw-b', 'raw-c']);
expect(template).toEqual(['cooked-a', 'cooked-b', 'cooked-c']);
});
it('should return an array that has a raw property containing the raw items', () => {
const template =
makeTemplateObject(['cooked-a', 'cooked-b', 'cooked-c'], ['raw-a', 'raw-b', 'raw-c']);
expect(template.raw).toEqual(['raw-a', 'raw-b', 'raw-c']);
});
});
describe('parseTranslation', () => {
it('should extract the messageParts as a TemplateStringsArray', () => {
const translation = parseTranslation('a{$one}b{$two}c');
expect(translation.messageParts).toEqual(['a', 'b', 'c']);
expect(translation.messageParts.raw).toEqual(['a', 'b', 'c']);
});
it('should extract the messageParts with leading expression as a TemplateStringsArray', () => {
const translation = parseTranslation('{$one}a{$two}b');
expect(translation.messageParts).toEqual(['', 'a', 'b']);
expect(translation.messageParts.raw).toEqual(['', 'a', 'b']);
});
it('should extract the messageParts with trailing expression as a TemplateStringsArray', () => {
const translation = parseTranslation('a{$one}b{$two}');
expect(translation.messageParts).toEqual(['a', 'b', '']);
expect(translation.messageParts.raw).toEqual(['a', 'b', '']);
});
it('should extract the messageParts with escaped characters as a TemplateStringsArray', () => {
const translation = parseTranslation('a{$one}\nb\n{$two}c');
expect(translation.messageParts).toEqual(['a', '\nb\n', 'c']);
// `messageParts.raw` are not actually escaped as they are not generally used by `$localize`.
// See the "escaped placeholders" test below...
expect(translation.messageParts.raw).toEqual(['a', '\nb\n', 'c']);
});
it('should extract the messageParts with escaped placeholders as a TemplateStringsArray',
() => {
const translation = parseTranslation('a{$one}:marker:b{$two}c');
expect(translation.messageParts).toEqual(['a', ':marker:b', 'c']);
// A `messagePart` that starts with a placeholder marker does get escaped in
// `messageParts.raw` as this is used by `$localize`.
expect(translation.messageParts.raw).toEqual(['a', '\\:marker:b', 'c']);
});
it('should extract the placeholder names, in order', () => {
const translation = parseTranslation('a{$one}b{$two}c');
expect(translation.placeholderNames).toEqual(['one', 'two']);
});
it('should handle a translation with no substitutions', () => {
const translation = parseTranslation('abc');
expect(translation.messageParts).toEqual(['abc']);
expect(translation.messageParts.raw).toEqual(['abc']);
expect(translation.placeholderNames).toEqual([]);
});
it('should handle a translation with only substitutions', () => {
const translation = parseTranslation('{$one}{$two}');
expect(translation.messageParts).toEqual(['', '', '']);
expect(translation.messageParts.raw).toEqual(['', '', '']);
expect(translation.placeholderNames).toEqual(['one', 'two']);
});
});
describe('translate', () => {
it('(with identity translations) should render template literals as-is', () => {
const translations = {
'abc': 'abc',
'abc{$ph_1}': 'abc{$ph_1}',
'abc{$ph_1}def': 'abc{$ph_1}def',
'abc{$ph_1}def{$ph_2}': 'abc{$ph_1}def{$ph_2}',
'Hello, {$ph_1}!': 'Hello, {$ph_1}!',
};
expect(doTranslate(translations, parts `abc`)).toEqual(parts `abc`);
expect(doTranslate(translations, parts `abc${1 + 2 + 3}`)).toEqual(parts `abc${1 + 2 + 3}`);
expect(doTranslate(translations, parts `abc${1 + 2 + 3}def`))
.toEqual(parts `abc${1 + 2 + 3}def`);
expect(doTranslate(translations, parts `abc${1 + 2 + 3}def${4 + 5 + 6}`))
.toEqual(parts `abc${1 + 2 + 3}def${4 + 5 + 6}`);
const getName = () => 'World';
expect(doTranslate(translations, parts `Hello, ${getName()}!`))
.toEqual(parts `Hello, ${'World'}!`);
});
it('(with upper-casing translations) should render template literals with messages upper-cased',
() => {
const translations = {
'abc': 'ABC',
'abc{$ph_1}': 'ABC{$ph_1}',
'abc{$ph_1}def': 'ABC{$ph_1}DEF',
'abc{$ph_1}def{$ph_2}': 'ABC{$ph_1}DEF{$ph_2}',
'Hello, {$ph_1}!': 'HELLO, {$ph_1}!',
};
expect(doTranslate(translations, parts `abc`)).toEqual(parts `ABC`);
expect(doTranslate(translations, parts `abc${1 + 2 + 3}`))
.toEqual(parts `ABC${1 + 2 + 3}`);
expect(doTranslate(translations, parts `abc${1 + 2 + 3}def`))
.toEqual(parts `ABC${1 + 2 + 3}DEF`);
expect(doTranslate(translations, parts `abc${1 + 2 + 3}def${4 + 5 + 6}`))
.toEqual(parts `ABC${1 + 2 + 3}DEF${4 + 5 + 6}`);
const getName = () => 'World';
expect(doTranslate(translations, parts `Hello, ${getName()}!`))
.toEqual(parts `HELLO, ${'World'}!`);
});
it('(with translations to reverse expressions) should render template literals with expressions reversed',
() => {
const translations = {
'abc{$ph_1}def{$ph_2} - Hello, {$ph_3}!': 'abc{$ph_3}def{$ph_2} - Hello, {$ph_1}!',
};
const getName = () => 'World';
expect(doTranslate(
translations, parts `abc${1 + 2 + 3}def${4 + 5 + 6} - Hello, ${getName()}!`))
.toEqual(parts `abc${'World'}def${4 + 5 + 6} - Hello, ${1 + 2 + 3}!`);
});
it('(with translations to remove expressions) should render template literals with expressions removed',
() => {
const translations = {
'abc{$ph_1}def{$ph_2} - Hello, {$ph_3}!': 'abc{$ph_1} - Hello, {$ph_3}!',
};
const getName = () => 'World';
expect(doTranslate(
translations, parts `abc${1 + 2 + 3}def${4 + 5 + 6} - Hello, ${getName()}!`))
.toEqual(parts `abc${1 + 2 + 3} - Hello, ${'World'}!`);
});
function parts(messageParts: TemplateStringsArray, ...substitutions: any[]):
[TemplateStringsArray, any[]] {
return [messageParts, substitutions];
}
function parseTranslations(translations: Record<TranslationKey, TargetMessage>):
Record<string, ParsedTranslation> {
const parsedTranslations: Record<string, ParsedTranslation> = {};
Object.keys(translations).forEach(key => {
parsedTranslations[key] = parseTranslation(translations[key]);
});
return parsedTranslations;
}
function doTranslate(
translations: Record<string, string>,
message: [TemplateStringsArray, any[]]): [TemplateStringsArray, readonly any[]] {
return translate(parseTranslations(translations), message[0], message[1]);
}
});
});