cargdev/angular
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

fix(compiler): i18n - trim whitespace from i18n custom ids (#34154)

Browse Source 
Fixes #34147

PR Close #34154
This commit is contained in:
Pete Bacon Darwin 2019-12-03 08:36:56 +00:00 committed by Miško Hevery
parent f16f6a290b
commit f6a6f26e0f
3 changed files with 51 additions and 39 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

2
packages/compiler/src/i18n/extractor_merger.ts
View File

@ -516,5 +516,5 @@ function _parseMessageMeta(i18n?: string): {meaning: string, description: string
[meaningAndDesc.slice(0, descIndex), meaningAndDesc.slice(descIndex + 1)] : [meaningAndDesc.slice(0, descIndex), meaningAndDesc.slice(descIndex + 1)] :
['', meaningAndDesc]; ['', meaningAndDesc];
return {meaning, description, id}; return {meaning, description, id: id.trim()};
} }

6
packages/compiler/test/i18n/extractor_merger_spec.ts
View File

@ -51,6 +51,12 @@ import {serializeNodes as serializeHtmlNodes} from '../ml_parser/util/util';
]); ]);
}); });
it('should trim whitespace from custom ids (but not meanings)', () => {
expect(extract('<div i18n="\n m1|d1@@i1\n ">test</div>')).toEqual([
[['test'], '\n m1', 'd1', 'i1'],
]);
});
it('should extract from attributes without meaning and with id', () => { it('should extract from attributes without meaning and with id', () => {
expect( expect(
extract( extract(

82
packages/compiler/test/i18n/i18n_parser_spec.ts
View File

@ -18,7 +18,7 @@ import {DEFAULT_INTERPOLATION_CONFIG} from '@angular/compiler/src/ml_parser/inte
describe('elements', () => { describe('elements', () => {
it('should extract from elements', () => { it('should extract from elements', () => {
expect(_humanizeMessages('<div i18n="m|d">text</div>')).toEqual([ expect(_humanizeMessages('<div i18n="m|d">text</div>')).toEqual([
[['text'], 'm', 'd'], [['text'], 'm', 'd', ''],
]); ]);
}); });
@ -29,7 +29,7 @@ import {DEFAULT_INTERPOLATION_CONFIG} from '@angular/compiler/src/ml_parser/inte
'text', 'text',
'<ph tag name="START_TAG_SPAN"><ph tag name="START_BOLD_TEXT">nested</ph name="CLOSE_BOLD_TEXT"></ph name="CLOSE_TAG_SPAN">' '<ph tag name="START_TAG_SPAN"><ph tag name="START_BOLD_TEXT">nested</ph name="CLOSE_BOLD_TEXT"></ph name="CLOSE_TAG_SPAN">'
], ],
'm', 'd' 'm', 'd', ''
], ],
]); ]);
}); });
@ -46,16 +46,22 @@ import {DEFAULT_INTERPOLATION_CONFIG} from '@angular/compiler/src/ml_parser/inte
[ [
'<ph tag name="START_PARAGRAPH"><ph tag name="LINE_BREAK"/></ph name="CLOSE_PARAGRAPH">' '<ph tag name="START_PARAGRAPH"><ph tag name="LINE_BREAK"/></ph name="CLOSE_PARAGRAPH">'
], ],
'm', 'd' 'm', 'd', ''
], ],
]); ]);
}); });
it('should trim whitespace from custom ids (but not meanings)', () => {
expect(_humanizeMessages('<div i18n="\n m|d@@id\n ">text</div>')).toEqual([
[['text'], '\n m', 'd', 'id'],
]);
});
}); });
describe('attributes', () => { describe('attributes', () => {
it('should extract from attributes outside of translatable section', () => { it('should extract from attributes outside of translatable section', () => {
expect(_humanizeMessages('<div i18n-title="m|d" title="msg"></div>')).toEqual([ expect(_humanizeMessages('<div i18n-title="m|d" title="msg"></div>')).toEqual([
[['msg'], 'm', 'd'], [['msg'], 'm', 'd', ''],
]); ]);
}); });
@ -66,9 +72,9 @@ import {DEFAULT_INTERPOLATION_CONFIG} from '@angular/compiler/src/ml_parser/inte
[ [
'<ph tag name="START_PARAGRAPH"><ph tag name="START_BOLD_TEXT"></ph name="CLOSE_BOLD_TEXT"></ph name="CLOSE_PARAGRAPH">' '<ph tag name="START_PARAGRAPH"><ph tag name="START_BOLD_TEXT"></ph name="CLOSE_BOLD_TEXT"></ph name="CLOSE_PARAGRAPH">'
], ],
'', '' '', '', ''
], ],
[['msg'], 'm', 'd'], [['msg'], 'm', 'd', ''],
]); ]);
}); });
@ -76,12 +82,12 @@ import {DEFAULT_INTERPOLATION_CONFIG} from '@angular/compiler/src/ml_parser/inte
expect(_humanizeMessages( expect(_humanizeMessages(
'<!-- i18n --><p><b i18n-title="m|d" title="msg"></b></p><!-- /i18n -->')) '<!-- i18n --><p><b i18n-title="m|d" title="msg"></b></p><!-- /i18n -->'))
.toEqual([ .toEqual([
[['msg'], 'm', 'd'], [['msg'], 'm', 'd', ''],
[ [
[ [
'<ph tag name="START_PARAGRAPH"><ph tag name="START_BOLD_TEXT"></ph name="CLOSE_BOLD_TEXT"></ph name="CLOSE_PARAGRAPH">' '<ph tag name="START_PARAGRAPH"><ph tag name="START_BOLD_TEXT"></ph name="CLOSE_BOLD_TEXT"></ph name="CLOSE_PARAGRAPH">'
], ],
'', '' '', '', ''
], ],
]); ]);
}); });
@ -91,12 +97,12 @@ import {DEFAULT_INTERPOLATION_CONFIG} from '@angular/compiler/src/ml_parser/inte
_humanizeMessages( _humanizeMessages(
'<!-- i18n -->{count, plural, =0 {<p><b i18n-title="m|d" title="msg"></b></p>}}<!-- /i18n -->')) '<!-- i18n -->{count, plural, =0 {<p><b i18n-title="m|d" title="msg"></b></p>}}<!-- /i18n -->'))
.toEqual([ .toEqual([
[['msg'], 'm', 'd'], [['msg'], 'm', 'd', ''],
[ [
[ [
'{count, plural, =0 {[<ph tag name="START_PARAGRAPH"><ph tag name="START_BOLD_TEXT"></ph name="CLOSE_BOLD_TEXT"></ph name="CLOSE_PARAGRAPH">]}}' '{count, plural, =0 {[<ph tag name="START_PARAGRAPH"><ph tag name="START_BOLD_TEXT"></ph name="CLOSE_BOLD_TEXT"></ph name="CLOSE_PARAGRAPH">]}}'
], ],
'', '' '', '', ''
], ],
]); ]);
}); });
@ -105,7 +111,7 @@ import {DEFAULT_INTERPOLATION_CONFIG} from '@angular/compiler/src/ml_parser/inte
expect( expect(
_humanizeMessages('{count, plural, =0 {<p><b i18n-title="m|d" title="msg"></b></p>}}')) _humanizeMessages('{count, plural, =0 {<p><b i18n-title="m|d" title="msg"></b></p>}}'))
.toEqual([ .toEqual([
[['msg'], 'm', 'd'], [['msg'], 'm', 'd', ''],
]); ]);
}); });
@ -116,20 +122,20 @@ import {DEFAULT_INTERPOLATION_CONFIG} from '@angular/compiler/src/ml_parser/inte
describe('interpolation', () => { describe('interpolation', () => {
it('should replace interpolation with placeholder', () => { it('should replace interpolation with placeholder', () => {
expect(_humanizeMessages('<div i18n="m|d">before{{ exp }}after</div>')).toEqual([ expect(_humanizeMessages('<div i18n="m|d">before{{ exp }}after</div>')).toEqual([
[['[before, <ph name="INTERPOLATION"> exp </ph>, after]'], 'm', 'd'], [['[before, <ph name="INTERPOLATION"> exp </ph>, after]'], 'm', 'd', ''],
]); ]);
}); });
it('should support named interpolation', () => { it('should support named interpolation', () => {
expect(_humanizeMessages('<div i18n="m|d">before{{ exp //i18n(ph="teSt") }}after</div>')) expect(_humanizeMessages('<div i18n="m|d">before{{ exp //i18n(ph="teSt") }}after</div>'))
.toEqual([ .toEqual([
[['[before, <ph name="TEST"> exp //i18n(ph="teSt") </ph>, after]'], 'm', 'd'], [['[before, <ph name="TEST"> exp //i18n(ph="teSt") </ph>, after]'], 'm', 'd', ''],
]); ]);
expect( expect(
_humanizeMessages('<div i18n=\'m|d\'>before{{ exp //i18n(ph=\'teSt\') }}after</div>')) _humanizeMessages('<div i18n=\'m|d\'>before{{ exp //i18n(ph=\'teSt\') }}after</div>'))
.toEqual([ .toEqual([
[[`[before, <ph name="TEST"> exp //i18n(ph='teSt') </ph>, after]`], 'm', 'd'], [[`[before, <ph name="TEST"> exp //i18n(ph='teSt') </ph>, after]`], 'm', 'd', ''],
]); ]);
}); });
}); });
@ -140,9 +146,9 @@ import {DEFAULT_INTERPOLATION_CONFIG} from '@angular/compiler/src/ml_parser/inte
<!-- i18n: desc2 -->message2<!-- /i18n --> <!-- i18n: desc2 -->message2<!-- /i18n -->
<!-- i18n -->message3<!-- /i18n -->`)) <!-- i18n -->message3<!-- /i18n -->`))
.toEqual([ .toEqual([
[['message1'], 'meaning1', 'desc1'], [['message1'], 'meaning1', 'desc1', ''],
[['message2'], '', 'desc2'], [['message2'], '', 'desc2', ''],
[['message3'], '', ''], [['message3'], '', '', ''],
]); ]);
}); });
@ -153,7 +159,7 @@ import {DEFAULT_INTERPOLATION_CONFIG} from '@angular/compiler/src/ml_parser/inte
'text', 'text',
'<ph tag name="START_PARAGRAPH">html, <ph tag name="START_BOLD_TEXT">nested</ph name="CLOSE_BOLD_TEXT"></ph name="CLOSE_PARAGRAPH">' '<ph tag name="START_PARAGRAPH">html, <ph tag name="START_BOLD_TEXT">nested</ph name="CLOSE_BOLD_TEXT"></ph name="CLOSE_PARAGRAPH">'
], ],
'', '' '', '', ''
], ],
]); ]);
}); });
@ -162,36 +168,36 @@ import {DEFAULT_INTERPOLATION_CONFIG} from '@angular/compiler/src/ml_parser/inte
describe('ICU messages', () => { describe('ICU messages', () => {
it('should extract as ICU when single child of an element', () => { it('should extract as ICU when single child of an element', () => {
expect(_humanizeMessages('<div i18n="m|d">{count, plural, =0 {zero}}</div>')).toEqual([ expect(_humanizeMessages('<div i18n="m|d">{count, plural, =0 {zero}}</div>')).toEqual([
[['{count, plural, =0 {[zero]}}'], 'm', 'd'], [['{count, plural, =0 {[zero]}}'], 'm', 'd', ''],
]); ]);
}); });
it('should extract as ICU + ph when not single child of an element', () => { it('should extract as ICU + ph when not single child of an element', () => {
expect(_humanizeMessages('<div i18n="m|d">b{count, plural, =0 {zero}}a</div>')).toEqual([ expect(_humanizeMessages('<div i18n="m|d">b{count, plural, =0 {zero}}a</div>')).toEqual([
[['b', '<ph icu name="ICU">{count, plural, =0 {[zero]}}</ph>', 'a'], 'm', 'd'], [['b', '<ph icu name="ICU">{count, plural, =0 {[zero]}}</ph>', 'a'], 'm', 'd', ''],
[['{count, plural, =0 {[zero]}}'], '', ''], [['{count, plural, =0 {[zero]}}'], '', '', ''],
]); ]);
}); });
it('should extract as ICU + ph when wrapped in whitespace in an element', () => { it('should extract as ICU + ph when wrapped in whitespace in an element', () => {
expect(_humanizeMessages('<div i18n="m|d"> {count, plural, =0 {zero}} </div>')).toEqual([ expect(_humanizeMessages('<div i18n="m|d"> {count, plural, =0 {zero}} </div>')).toEqual([
[[' ', '<ph icu name="ICU">{count, plural, =0 {[zero]}}</ph>', ' '], 'm', 'd'], [[' ', '<ph icu name="ICU">{count, plural, =0 {[zero]}}</ph>', ' '], 'm', 'd', ''],
[['{count, plural, =0 {[zero]}}'], '', ''], [['{count, plural, =0 {[zero]}}'], '', '', ''],
]); ]);
}); });
it('should extract as ICU when single child of a block', () => { it('should extract as ICU when single child of a block', () => {
expect(_humanizeMessages('<!-- i18n:m|d -->{count, plural, =0 {zero}}<!-- /i18n -->')) expect(_humanizeMessages('<!-- i18n:m|d -->{count, plural, =0 {zero}}<!-- /i18n -->'))
.toEqual([ .toEqual([
[['{count, plural, =0 {[zero]}}'], 'm', 'd'], [['{count, plural, =0 {[zero]}}'], 'm', 'd', ''],
]); ]);
}); });
it('should extract as ICU + ph when not single child of a block', () => { it('should extract as ICU + ph when not single child of a block', () => {
expect(_humanizeMessages('<!-- i18n:m|d -->b{count, plural, =0 {zero}}a<!-- /i18n -->')) expect(_humanizeMessages('<!-- i18n:m|d -->b{count, plural, =0 {zero}}a<!-- /i18n -->'))
.toEqual([ .toEqual([
[['{count, plural, =0 {[zero]}}'], '', ''], [['{count, plural, =0 {[zero]}}'], '', '', ''],
[['b', '<ph icu name="ICU">{count, plural, =0 {[zero]}}</ph>', 'a'], 'm', 'd'], [['b', '<ph icu name="ICU">{count, plural, =0 {[zero]}}</ph>', 'a'], 'm', 'd', ''],
]); ]);
}); });
@ -204,9 +210,9 @@ import {DEFAULT_INTERPOLATION_CONFIG} from '@angular/compiler/src/ml_parser/inte
'b', '<ph icu name="ICU">{count, plural, =0 {[{sex, select, male {[m]}}]}}</ph>', 'b', '<ph icu name="ICU">{count, plural, =0 {[{sex, select, male {[m]}}]}}</ph>',
'a' 'a'
], ],
'm', 'd' 'm', 'd', ''
], ],
[['{count, plural, =0 {[{sex, select, male {[m]}}]}}'], '', ''], [['{count, plural, =0 {[{sex, select, male {[m]}}]}}'], '', '', ''],
]); ]);
}); });
}); });
@ -214,7 +220,7 @@ import {DEFAULT_INTERPOLATION_CONFIG} from '@angular/compiler/src/ml_parser/inte
describe('implicit elements', () => { describe('implicit elements', () => {
it('should extract from implicit elements', () => { it('should extract from implicit elements', () => {
expect(_humanizeMessages('<b>bold</b><i>italic</i>', ['b'])).toEqual([ expect(_humanizeMessages('<b>bold</b><i>italic</i>', ['b'])).toEqual([
[['bold'], '', ''], [['bold'], '', '', ''],
]); ]);
}); });
}); });
@ -224,7 +230,7 @@ import {DEFAULT_INTERPOLATION_CONFIG} from '@angular/compiler/src/ml_parser/inte
expect(_humanizeMessages( expect(_humanizeMessages(
'<b title="bb">bold</b><i title="ii">italic</i>', [], {'b': ['title']})) '<b title="bb">bold</b><i title="ii">italic</i>', [], {'b': ['title']}))
.toEqual([ .toEqual([
[['bb'], '', ''], [['bb'], '', '', ''],
]); ]);
}); });
}); });
@ -239,7 +245,7 @@ import {DEFAULT_INTERPOLATION_CONFIG} from '@angular/compiler/src/ml_parser/inte
'<ph tag name="START_PARAGRAPH">two</ph name="CLOSE_PARAGRAPH">', '<ph tag name="START_PARAGRAPH">two</ph name="CLOSE_PARAGRAPH">',
'<ph tag name="START_PARAGRAPH_1">three</ph name="CLOSE_PARAGRAPH">', '<ph tag name="START_PARAGRAPH_1">three</ph name="CLOSE_PARAGRAPH">',
], ],
'm', 'd' 'm', 'd', ''
], ],
]); ]);
@ -256,7 +262,7 @@ import {DEFAULT_INTERPOLATION_CONFIG} from '@angular/compiler/src/ml_parser/inte
[ [
'[<ph name="INTERPOLATION"> a </ph>, <ph name="INTERPOLATION"> a </ph>, <ph name="INTERPOLATION_1"> b </ph>]' '[<ph name="INTERPOLATION"> a </ph>, <ph name="INTERPOLATION"> a </ph>, <ph name="INTERPOLATION_1"> b </ph>]'
], ],
'm', 'd' 'm', 'd', ''
], ],
]); ]);
@ -276,11 +282,11 @@ import {DEFAULT_INTERPOLATION_CONFIG} from '@angular/compiler/src/ml_parser/inte
'<ph icu name="ICU">{count, plural, =0 {[0]}}</ph>', '<ph icu name="ICU">{count, plural, =0 {[0]}}</ph>',
'<ph icu name="ICU_1">{count, plural, =1 {[1]}}</ph>', '<ph icu name="ICU_1">{count, plural, =1 {[1]}}</ph>',
], ],
'm', 'd' 'm', 'd', ''
], ],
[['{count, plural, =0 {[0]}}'], '', ''], [['{count, plural, =0 {[0]}}'], '', '', ''],
[['{count, plural, =0 {[0]}}'], '', ''], [['{count, plural, =0 {[0]}}'], '', '', ''],
[['{count, plural, =1 {[1]}}'], '', ''], [['{count, plural, =1 {[1]}}'], '', '', ''],
]); ]);
expect(_humanizePlaceholders(html)).toEqual([ expect(_humanizePlaceholders(html)).toEqual([
@ -304,11 +310,11 @@ import {DEFAULT_INTERPOLATION_CONFIG} from '@angular/compiler/src/ml_parser/inte
export function _humanizeMessages( export function _humanizeMessages(
html: string, implicitTags: string[] = [], html: string, implicitTags: string[] = [],
implicitAttrs: {[k: string]: string[]} = {}): [string[], string, string][] { implicitAttrs: {[k: string]: string[]} = {}): [string[], string, string, string][] {
// clang-format off // clang-format off
// https://github.com/angular/clang-format/issues/35 // https://github.com/angular/clang-format/issues/35
return _extractMessages(html, implicitTags, implicitAttrs).map( return _extractMessages(html, implicitTags, implicitAttrs).map(
message => [serializeNodes(message.nodes), message.meaning, message.description, ]) as [string[], string, string][]; message => [serializeNodes(message.nodes), message.meaning, message.description, message.id]) as [string[], string, string, string][];
// clang-format on // clang-format on
} }