diff --git a/modules/@angular/compiler-cli/integrationtest/src/entry_components.ts b/modules/@angular/compiler-cli/integrationtest/src/entry_components.ts index f969dd25d2941f..463ba825545460 100644 --- a/modules/@angular/compiler-cli/integrationtest/src/entry_components.ts +++ b/modules/@angular/compiler-cli/integrationtest/src/entry_components.ts @@ -10,7 +10,11 @@ import {ANALYZE_FOR_ENTRY_COMPONENTS, Component, ComponentFactoryResolver, Injec import {BasicComp} from './basic'; -@Component({selector: 'cmp-entryComponents', template: '', entryComponents: [BasicComp]}) +@Component({ + selector: 'cmp-entryComponents', + template: '

Welcome

', + entryComponents: [BasicComp] +}) export class CompWithEntryComponents { constructor(public cfr: ComponentFactoryResolver) {} } diff --git a/modules/@angular/compiler-cli/integrationtest/test/i18n_spec.ts b/modules/@angular/compiler-cli/integrationtest/test/i18n_spec.ts index 019b354ce9c03a..92fdc3199e6281 100644 --- a/modules/@angular/compiler-cli/integrationtest/test/i18n_spec.ts +++ b/modules/@angular/compiler-cli/integrationtest/test/i18n_spec.ts @@ -34,9 +34,10 @@ const EXPECTED_XMB = ` ]> - translate me - Welcome - other-3rdP-component + src/basic.ts:1translate me + src/basic.ts:5src/entry_components.ts:1Welcome + node_modules/third_party/other_comp.d.ts:1,2other-3rdP-component +multi-lines `; @@ -47,16 +48,33 @@ const EXPECTED_XLIFF = ` translate me + + src/basic.ts + 1 + desc meaning Welcome + + src/basic.ts + 5 + + + src/entry_components.ts + 1 + - - other-3rdP-component + + other-3rdP-component +multi-lines + + node_modules/third_party/other_comp.d.ts + 1 + diff --git a/modules/@angular/compiler-cli/integrationtest/test/ng_module_spec.ts b/modules/@angular/compiler-cli/integrationtest/test/ng_module_spec.ts index 812fc6b9ad49ca..c66b9657ca5073 100644 --- a/modules/@angular/compiler-cli/integrationtest/test/ng_module_spec.ts +++ b/modules/@angular/compiler-cli/integrationtest/test/ng_module_spec.ts @@ -49,7 +49,8 @@ describe('NgModule', () => { const fixture = createComponent(ComponentUsingThirdParty); const thirdPComps = fixture.nativeElement.children; expect(thirdPComps[0].children[0].children[0].data).toEqual('3rdP-component'); - expect(thirdPComps[1].children[0].children[0].data).toEqual('other-3rdP-component'); + expect(thirdPComps[1].children[0].children[0].data).toEqual(`other-3rdP-component +multi-lines`); }); // https://github.com/angular/angular/issues/12428 diff --git a/modules/@angular/compiler-cli/integrationtest/third_party_src/other_comp.ts b/modules/@angular/compiler-cli/integrationtest/third_party_src/other_comp.ts index 553e08ba45a3fd..130baabd8f564e 100644 --- a/modules/@angular/compiler-cli/integrationtest/third_party_src/other_comp.ts +++ b/modules/@angular/compiler-cli/integrationtest/third_party_src/other_comp.ts @@ -10,7 +10,8 @@ import {Component} from '@angular/core'; @Component({ selector: 'another-third-party-comp', - template: '
other-3rdP-component
', + template: `
other-3rdP-component +multi-lines
`, }) export class AnotherThirdpartyComponent { -} \ No newline at end of file +} diff --git a/modules/@angular/compiler-cli/src/extractor.ts b/modules/@angular/compiler-cli/src/extractor.ts index 1ff09b6416c435..aa3d333c02177f 100644 --- a/modules/@angular/compiler-cli/src/extractor.ts +++ b/modules/@angular/compiler-cli/src/extractor.ts @@ -59,8 +59,9 @@ export class Extractor { default: serializer = new compiler.Xliff(); } - - return bundle.write(serializer); + return bundle.write( + serializer, + (sourcePath: string) => sourcePath.replace(path.join(this.options.basePath, '/'), '')); } getExtension(formatName: string): string { diff --git a/modules/@angular/compiler/src/i18n/i18n_ast.ts b/modules/@angular/compiler/src/i18n/i18n_ast.ts index 1e94ea416f7d55..cf43e4a31b1641 100644 --- a/modules/@angular/compiler/src/i18n/i18n_ast.ts +++ b/modules/@angular/compiler/src/i18n/i18n_ast.ts @@ -9,6 +9,8 @@ import {ParseSourceSpan} from '../parse_util'; export class Message { + sources: MessageSpan[]; + /** * @param nodes message AST * @param placeholders maps placeholder names to static content @@ -20,7 +22,29 @@ export class Message { constructor( public nodes: Node[], public placeholders: {[phName: string]: string}, public placeholderToMessage: {[phName: string]: Message}, public meaning: string, - public description: string, public id: string) {} + public description: string, public id: string) { + if (nodes.length) { + this.sources = [{ + filePath: nodes[0].sourceSpan.start.file.url, + // adding 1 to make the index 1 based + startLine: nodes[0].sourceSpan.start.line + 1, + startCol: nodes[0].sourceSpan.start.col, + endLine: nodes[nodes.length - 1].sourceSpan.end.line + 1, + endCol: nodes[0].sourceSpan.start.col + }]; + } else { + this.sources = []; + } + } +} + +export interface MessageSpan { + filePath: string; + // line indexes are 1 based + startLine: number; + startCol: number; + endLine: number; + endCol: number; } export interface Node { @@ -131,4 +155,4 @@ export class RecurseVisitor implements Visitor { visitPlaceholder(ph: Placeholder, context?: any): any{}; visitIcuPlaceholder(ph: IcuPlaceholder, context?: any): any{}; -} \ No newline at end of file +} diff --git a/modules/@angular/compiler/src/i18n/message_bundle.ts b/modules/@angular/compiler/src/i18n/message_bundle.ts index 7b42b4fa213a4f..d5579219216bac 100644 --- a/modules/@angular/compiler/src/i18n/message_bundle.ts +++ b/modules/@angular/compiler/src/i18n/message_bundle.ts @@ -47,7 +47,7 @@ export class MessageBundle { // The public (serialized) format might be different, see the `write` method. getMessages(): i18n.Message[] { return this._messages; } - write(serializer: Serializer): string { + write(serializer: Serializer, filterSources?: (path: string) => string): string { const messages: {[id: string]: i18n.Message} = {}; const mapperVisitor = new MapPlaceholderNames(); @@ -56,6 +56,8 @@ export class MessageBundle { const id = serializer.digest(message); if (!messages.hasOwnProperty(id)) { messages[id] = message; + } else { + messages[id].sources.push(...message.sources); } }); @@ -64,11 +66,24 @@ export class MessageBundle { const mapper = serializer.createNameMapper(messages[id]); const src = messages[id]; const nodes = mapper ? mapperVisitor.convert(src.nodes, mapper) : src.nodes; - return new i18n.Message(nodes, {}, {}, src.meaning, src.description, id); + let transformedMessage = new i18n.Message(nodes, {}, {}, src.meaning, src.description, id); + transformedMessage.sources = src.sources; + if (filterSources) { + transformedMessage.sources.forEach( + (source: i18n.MessageSpan) => source.filePath = filterSources(source.filePath)); + } + return transformedMessage; }); return serializer.write(msgList, this._locale); } + + // filter the message source paths relative to another path + filterMessageSourcePaths(sources: i18n.MessageSpan[], filter: string) { + sources.forEach( + (source: i18n.MessageSpan) => { source.filePath = source.filePath.replace(filter, ''); }); + return sources; + } } // Transform an i18n AST by renaming the placeholder nodes with the given mapper diff --git a/modules/@angular/compiler/src/i18n/serializers/xliff.ts b/modules/@angular/compiler/src/i18n/serializers/xliff.ts index dd9549409c069b..ce4932602734ba 100644 --- a/modules/@angular/compiler/src/i18n/serializers/xliff.ts +++ b/modules/@angular/compiler/src/i18n/serializers/xliff.ts @@ -25,6 +25,8 @@ const _FILE_TAG = 'file'; const _SOURCE_TAG = 'source'; const _TARGET_TAG = 'target'; const _UNIT_TAG = 'trans-unit'; +const _CONTEXT_GROUP_TAG = 'context-group'; +const _CONTEXT_TAG = 'context'; // http://docs.oasis-open.org/xliff/v1.2/os/xliff-core.html // http://docs.oasis-open.org/xliff/v1.2/xliff-profile-html/xliff-profile-html-1.2.html @@ -34,10 +36,24 @@ export class Xliff extends Serializer { const transUnits: xml.Node[] = []; messages.forEach(message => { + let contextTags: xml.Node[] = []; + message.sources.forEach((source: i18n.MessageSpan) => { + let contextGroupTag = new xml.Tag(_CONTEXT_GROUP_TAG, {purpose: 'location'}); + contextGroupTag.children.push( + new xml.CR(10), + new xml.Tag( + _CONTEXT_TAG, {'context-type': 'sourcefile'}, [new xml.Text(source.filePath)]), + new xml.CR(10), new xml.Tag( + _CONTEXT_TAG, {'context-type': 'linenumber'}, + [new xml.Text(`${source.startLine}`)]), + new xml.CR(8)); + contextTags.push(new xml.CR(8), contextGroupTag); + }); + const transUnit = new xml.Tag(_UNIT_TAG, {id: message.id, datatype: 'html'}); transUnit.children.push( new xml.CR(8), new xml.Tag(_SOURCE_TAG, {}, visitor.serialize(message.nodes)), - new xml.CR(8), new xml.Tag(_TARGET_TAG)); + new xml.CR(8), new xml.Tag(_TARGET_TAG), ...contextTags); if (message.description) { transUnit.children.push( diff --git a/modules/@angular/compiler/src/i18n/serializers/xmb.ts b/modules/@angular/compiler/src/i18n/serializers/xmb.ts index 9110b27221dc94..93d08757ad9df8 100644 --- a/modules/@angular/compiler/src/i18n/serializers/xmb.ts +++ b/modules/@angular/compiler/src/i18n/serializers/xmb.ts @@ -16,6 +16,7 @@ const _MESSAGES_TAG = 'messagebundle'; const _MESSAGE_TAG = 'msg'; const _PLACEHOLDER_TAG = 'ph'; const _EXEMPLE_TAG = 'ex'; +const _SOURCE_TAG = 'source'; const _DOCTYPE = ` @@ -54,8 +55,16 @@ export class Xmb extends Serializer { attrs['meaning'] = message.meaning; } + let sourceTags: xml.Tag[] = []; + message.sources.forEach((source: i18n.MessageSpan) => { + sourceTags.push(new xml.Tag( + _SOURCE_TAG, {}, + [new xml.Text(`${source.filePath}:${source.startLine}${source.endLine !== source.startLine ? ',' + source.endLine : ''}`)])); + }); + rootNode.children.push( - new xml.CR(2), new xml.Tag(_MESSAGE_TAG, attrs, visitor.serialize(message.nodes))); + new xml.CR(2), + new xml.Tag(_MESSAGE_TAG, attrs, [...sourceTags, ...visitor.serialize(message.nodes)])); }); rootNode.children.push(new xml.CR()); diff --git a/modules/@angular/compiler/test/i18n/digest_spec.ts b/modules/@angular/compiler/test/i18n/digest_spec.ts index 7297f6cc76130d..532430d64f9846 100644 --- a/modules/@angular/compiler/test/i18n/digest_spec.ts +++ b/modules/@angular/compiler/test/i18n/digest_spec.ts @@ -19,6 +19,7 @@ export function main(): void { placeholderToMessage: {}, meaning: '', description: '', + sources: [], })).toEqual('i'); }); }); diff --git a/modules/@angular/compiler/test/i18n/integration_spec.ts b/modules/@angular/compiler/test/i18n/integration_spec.ts index b7a36dd3714831..43e7a32de4474e 100644 --- a/modules/@angular/compiler/test/i18n/integration_spec.ts +++ b/modules/@angular/compiler/test/i18n/integration_spec.ts @@ -39,7 +39,7 @@ export function main() { it('should extract from templates', () => { const catalog = new MessageBundle(new HtmlParser, [], {}); const serializer = new Xmb(); - catalog.updateFromTemplate(HTML, '', DEFAULT_INTERPOLATION_CONFIG); + catalog.updateFromTemplate(HTML, 'file.ts', DEFAULT_INTERPOLATION_CONFIG); expect(catalog.write(serializer)).toContain(XMB); }); @@ -168,32 +168,32 @@ const XTB = ` MAP_NAME `; -const XMB = ` i18n attribute on tags - nested - nested - <i>with placeholders</i> - on not translatable node - on translatable node - {VAR_PLURAL, plural, =0 {zero} =1 {one} =2 {two} other {<b>many</b>} } - +const XMB = ` file.ts:3i18n attribute on tags + file.ts:5nested + file.ts:7nested + file.ts:9file.ts:10<i>with placeholders</i> + file.ts:13on not translatable node + file.ts:14on translatable node + file.ts:19file.ts:36{VAR_PLURAL, plural, =0 {zero} =1 {one} =2 {two} other {<b>many</b>} } + file.ts:21,23file.ts:24,26 ICU - {VAR_SELECT, select, m {male} f {female} } - INTERPOLATION - sex = INTERPOLATION - CUSTOM_NAME - in a translatable section - + file.ts:22file.ts:25{VAR_SELECT, select, m {male} f {female} } + file.ts:28INTERPOLATION + file.ts:29sex = INTERPOLATION + file.ts:30CUSTOM_NAME + file.ts:35file.ts:53in a translatable section + file.ts:33,37 <h1>Markers in html comments</h1> <div></div> <div>ICU</div> - it <b>should</b> work - with an explicit ID - {VAR_PLURAL, plural, =0 {zero} =1 {one} =2 {two} other {<b>many</b>} } - {VAR_PLURAL, plural, =0 {Found no results} =1 {Found one result} other {Found INTERPOLATION results} } - foo<a>bar</a> - MAP_NAME`; + file.ts:39it <b>should</b> work + file.ts:41with an explicit ID + file.ts:42{VAR_PLURAL, plural, =0 {zero} =1 {one} =2 {two} other {<b>many</b>} } + file.ts:45,51{VAR_PLURAL, plural, =0 {Found no results} =1 {Found one result} other {Found INTERPOLATION results} } + file.ts:53foo<a>bar</a> + file.ts:55MAP_NAME`; const HTML = `
diff --git a/modules/@angular/compiler/test/i18n/serializers/xliff_spec.ts b/modules/@angular/compiler/test/i18n/serializers/xliff_spec.ts index e8a81b66117ac3..334ebaf6368703 100644 --- a/modules/@angular/compiler/test/i18n/serializers/xliff_spec.ts +++ b/modules/@angular/compiler/test/i18n/serializers/xliff_spec.ts @@ -18,6 +18,7 @@ const HTML = `

not translatable

translatable element with placeholders {{ interpolation}}

foo

+

foo

foo

foo


@@ -30,30 +31,58 @@ const WRITE_XLIFF = ` translatable attribute + + file.ts + 2 + translatable element with placeholders + + file.ts + 3 + foo + + file.ts + 4 + + + file.ts + 5 + d m foo + + file.ts + 6 + d m foo + + file.ts + 7 + + + file.ts + 8 + ph names @@ -68,35 +97,63 @@ const LOAD_XLIFF = ` translatable attribute etubirtta elbatalsnart + + file.ts + 1 + translatable element with placeholders footnemele elbatalsnart sredlohecalp htiw + + file.ts + 2 + foo oof + + file.ts + 3 + d m foo toto + + file.ts + 4 + d m foo tata + + file.ts + 5 + + + file.ts + 6 + ph names + + file.ts + 6 + ph names @@ -109,7 +166,7 @@ export function main(): void { function toXliff(html: string, locale: string | null = null): string { const catalog = new MessageBundle(new HtmlParser, [], {}, locale); - catalog.updateFromTemplate(html, '', DEFAULT_INTERPOLATION_CONFIG); + catalog.updateFromTemplate(html, 'file.ts', DEFAULT_INTERPOLATION_CONFIG); return catalog.write(serializer); } diff --git a/modules/@angular/compiler/test/i18n/serializers/xmb_spec.ts b/modules/@angular/compiler/test/i18n/serializers/xmb_spec.ts index cb8c535fd52c6d..58084111b4adb9 100644 --- a/modules/@angular/compiler/test/i18n/serializers/xmb_spec.ts +++ b/modules/@angular/compiler/test/i18n/serializers/xmb_spec.ts @@ -21,7 +21,9 @@ export function main(): void {

foo

foo

{ count, plural, =0 { { sex, select, other {

deeply nested

}} }}

-

{ count, plural, =0 { { sex, select, other {

deeply nested

}} }}

`; +

{ count, plural, =0 { { sex, select, other {

deeply nested

}} }}

+

multi +lines

`; const XMB = ` ]> - translatable element <b>with placeholders</b> INTERPOLATION - {VAR_PLURAL, plural, =0 {<p>test</p>} } - foo - foo - foo - {VAR_PLURAL, plural, =0 {{VAR_SELECT, select, other {<p>deeply nested</p>} } } } - {VAR_PLURAL, plural, =0 {{VAR_SELECT, select, other {<p>deeply nested</p>} } } } + file.ts:3translatable element <b>with placeholders</b> INTERPOLATION + file.ts:4{VAR_PLURAL, plural, =0 {<p>test</p>} } + file.ts:5foo + file.ts:6foo + file.ts:7foo + file.ts:8{VAR_PLURAL, plural, =0 {{VAR_SELECT, select, other {<p>deeply nested</p>} } } } + file.ts:9{VAR_PLURAL, plural, =0 {{VAR_SELECT, select, other {<p>deeply nested</p>} } } } + file.ts:10,11multi +lines `; it('should write a valid xmb file', () => { - expect(toXmb(HTML)).toEqual(XMB); + expect(toXmb(HTML, 'file.ts')).toEqual(XMB); // the locale is not specified in the xmb file - expect(toXmb(HTML, 'fr')).toEqual(XMB); + expect(toXmb(HTML, 'file.ts', 'fr')).toEqual(XMB); }); it('should throw when trying to load an xmb file', () => { @@ -71,11 +75,11 @@ export function main(): void { }); } -function toXmb(html: string, locale: string | null = null): string { +function toXmb(html: string, url: string, locale: string | null = null): string { const catalog = new MessageBundle(new HtmlParser, [], {}, locale); const serializer = new Xmb(); - catalog.updateFromTemplate(html, '', DEFAULT_INTERPOLATION_CONFIG); + catalog.updateFromTemplate(html, url, DEFAULT_INTERPOLATION_CONFIG); return catalog.write(serializer); } diff --git a/modules/@angular/compiler/test/i18n/translation_bundle_spec.ts b/modules/@angular/compiler/test/i18n/translation_bundle_spec.ts index 2d6dccd973c2ce..81a1648d0a08e7 100644 --- a/modules/@angular/compiler/test/i18n/translation_bundle_spec.ts +++ b/modules/@angular/compiler/test/i18n/translation_bundle_spec.ts @@ -17,8 +17,9 @@ import {_extractMessages} from './i18n_parser_spec'; export function main(): void { describe('TranslationBundle', () => { const file = new ParseSourceFile('content', 'url'); - const location = new ParseLocation(file, 0, 0, 0); - const span = new ParseSourceSpan(location, null); + const startLocation = new ParseLocation(file, 0, 0, 0); + const endLocation = new ParseLocation(file, 0, 0, 7); + const span = new ParseSourceSpan(startLocation, endLocation); const srcNode = new i18n.Text('src', span); it('should translate a plain message', () => {