feat(compiler): Implement i18n XLIFF 2.0 serializer (#14185)

- Ensure that the result passes OASIS XLIFF 2.0 schema validation
- Use <ph/> for self-closing placeholder tags
- Use <pc></pc> for other placeholder tags
- Check for the correct XLIFF file version
- Add ICU support

fixes #11735

packages/compiler-cli/integrationtest/test/i18n_spec.ts

@@ -63,6 +63,32 @@ const EXPECTED_XLIFF = `<?xml version="1.0" encoding="UTF-8" ?>
 </xliff>
 `;
 
+const EXPECTED_XLIFF2 = `<?xml version="1.0" encoding="UTF-8" ?>
+<xliff version="2.0" xmlns="urn:oasis:names:tc:xliff:document:2.0" srcLang="en">
+  <file original="ng.template" id="ngi18n">
+    <unit id="8136548302122759730">
+      <notes>
+        <note category="description">desc</note>
+        <note category="meaning">meaning</note>
+      </notes>
+      <segment>
+        <source>translate me</source>
+      </segment>
+    </unit>
+    <unit id="3492007542396725315">
+      <segment>
+        <source>Welcome</source>
+      </segment>
+    </unit>
+    <unit id="3772663375917578720">
+      <segment>
+        <source>other-3rdP-component</source>
+      </segment>
+    </unit>
+  </file>
+</xliff>
+`;
+
 describe('template i18n extraction output', () => {
   const outDir = '';
   const genDir = 'out';
@@ -81,6 +107,13 @@ describe('template i18n extraction output', () => {
     expect(xlf).toEqual(EXPECTED_XLIFF);
   });
 
+  it('should extract i18n messages as xliff version 2.0', () => {
+    const xlfOutput = path.join(outDir, 'messages.xliff2.xlf');
+    expect(fs.existsSync(xlfOutput)).toBeTruthy();
+    const xlf = fs.readFileSync(xlfOutput, {encoding: 'utf-8'});
+    expect(xlf).toEqual(EXPECTED_XLIFF2);
+  });
+
   it('should not emit js', () => {
     const genOutput = path.join(genDir, '');
     expect(fs.existsSync(genOutput)).toBeFalsy();

packages/compiler-cli/src/extractor.ts

@@ -34,7 +34,7 @@ export class Extractor {
     const promiseBundle = this.extractBundle();
 
     return promiseBundle.then(bundle => {
-      const content = this.serialize(bundle, ext);
+      const content = this.serialize(bundle, formatName);
       const dstFile = outFile || `messages.${ext}`;
       const dstPath = path.join(this.options.genDir, dstFile);
       this.host.writeFile(dstPath, content, false);
@@ -48,14 +48,20 @@ export class Extractor {
     return this.ngExtractor.extract(files);
   }
 
-  serialize(bundle: compiler.MessageBundle, ext: string): string {
+  serialize(bundle: compiler.MessageBundle, formatName: string): string {
+    const format = formatName.toLowerCase();
     let serializer: compiler.Serializer;
 
-    switch (ext) {
+    switch (format) {
       case 'xmb':
         serializer = new compiler.Xmb();
         break;
+      case 'xliff2':
+      case 'xlf2':
+        serializer = new compiler.Xliff2();
+        break;
       case 'xlf':
+      case 'xliff':
       default:
         serializer = new compiler.Xliff();
     }
@@ -66,10 +72,18 @@ export class Extractor {
   getExtension(formatName: string): string {
     const format = (formatName || 'xlf').toLowerCase();
 
-    if (format === 'xmb') return 'xmb';
-    if (format === 'xlf' || format === 'xlif' || format === 'xliff') return 'xlf';
+    switch (format) {
+      case 'xmb':
+        return 'xmb';
+      case 'xlf':
+      case 'xlif':
+      case 'xliff':
+      case 'xlf2':
+      case 'xliff2':
+        return 'xlf';
+    }
 
-    throw new Error('Unsupported format "${formatName}"');
+    throw new Error(`Unsupported format "${formatName}"`);
   }
 
   static create(