feat(i18n): add custom placeholder names

Closes #7799

Closes #8057

modules/angular2/test/compiler/expression_parser/parser_spec.ts

@@ -103,6 +103,11 @@ export function main() {
 
       it('should parse grouped expressions', () => { checkAction("(1 + 2) * 3", "1 + 2 * 3"); });
 
+      it('should ignore comments in expressions', () => { checkAction('a //comment', 'a'); });
+
+      it('should retain // in string literals',
+         () => { checkAction(`"http://www.google.com"`, `"http://www.google.com"`); });
+
       it('should parse an empty string', () => { checkAction(''); });
 
       describe("literals", () => {
@@ -269,6 +274,14 @@ export function main() {
       });
 
       it('should parse conditional expression', () => { checkBinding('a < b ? a : b'); });
+
+      it('should ignore comments in bindings', () => { checkBinding('a //comment', 'a'); });
+
+      it('should retain // in string literals',
+         () => { checkBinding(`"http://www.google.com"`, `"http://www.google.com"`); });
+
+      it('should retain // in : microsyntax', () => { checkBinding('one:a//b', 'one:a//b'); });
+
     });
 
     describe('parseTemplateBindings', () => {
@@ -424,6 +437,31 @@ export function main() {
       it('should parse expression with newline characters', () => {
         checkInterpolation(`{{ 'foo' +\n 'bar' +\r 'baz' }}`, `{{ "foo" + "bar" + "baz" }}`);
       });
+
+      describe("comments", () => {
+        it('should ignore comments in interpolation expressions',
+           () => { checkInterpolation('{{a //comment}}', '{{ a }}'); });
+
+        it('should retain // in single quote strings', () => {
+          checkInterpolation(`{{ 'http://www.google.com' }}`, `{{ "http://www.google.com" }}`);
+        });
+
+        it('should retain // in double quote strings', () => {
+          checkInterpolation(`{{ "http://www.google.com" }}`, `{{ "http://www.google.com" }}`);
+        });
+
+        it('should ignore comments after string literals',
+           () => { checkInterpolation(`{{ "a//b" //comment }}`, `{{ "a//b" }}`); });
+
+        it('should retain // in complex strings', () => {
+          checkInterpolation(`{{"//a\'//b\`//c\`//d\'//e" //comment}}`, `{{ "//a\'//b\`//c\`//d\'//e" }}`);
+        });
+
+        it('should retain // in nested, unterminated strings', () => {
+          checkInterpolation(`{{ "a\'b\`" //comment}}`, `{{ "a\'b\`" }}`);
+        });
+      });
+
     });
 
     describe("parseSimpleBinding", () => {

modules/angular2/test/i18n/i18n_html_parser_spec.ts

@@ -76,6 +76,36 @@ export function main() {
           .toEqual([[HtmlElementAst, 'div', 0], [HtmlAttrAst, 'value', '{{b}} or {{a}}']]);
     });
 
+    it('should handle interpolation with custom placeholder names', () => {
+      let translations: {[key: string]: string} = {};
+      translations[id(new Message('<ph name="FIRST"/> and <ph name="SECOND"/>', null, null))] =
+          '<ph name="SECOND"/> or <ph name="FIRST"/>';
+
+      expect(
+          humanizeDom(parse(
+              `<div value='{{a //i18n(ph="FIRST")}} and {{b //i18n(ph="SECOND")}}' i18n-value></div>`,
+              translations)))
+          .toEqual([
+            [HtmlElementAst, 'div', 0],
+            [HtmlAttrAst, 'value', '{{b //i18n(ph="SECOND")}} or {{a //i18n(ph="FIRST")}}']
+          ]);
+    });
+
+    it('should handle interpolation with duplicate placeholder names', () => {
+      let translations: {[key: string]: string} = {};
+      translations[id(new Message('<ph name="FIRST"/> and <ph name="FIRST_1"/>', null, null))] =
+          '<ph name="FIRST_1"/> or <ph name="FIRST"/>';
+
+      expect(
+          humanizeDom(parse(
+              `<div value='{{a //i18n(ph="FIRST")}} and {{b //i18n(ph="FIRST")}}' i18n-value></div>`,
+              translations)))
+          .toEqual([
+            [HtmlElementAst, 'div', 0],
+            [HtmlAttrAst, 'value', '{{b //i18n(ph="FIRST")}} or {{a //i18n(ph="FIRST")}}']
+          ]);
+    });
+
     it("should handle nested html", () => {
       let translations: {[key: string]: string} = {};
       translations[id(new Message('<ph name="e0">a</ph><ph name="e2">b</ph>', null, null))] =
@@ -198,7 +228,7 @@ export function main() {
 
         expect(
             humanizeErrors(parse("<div value='hi {{a}}' i18n-value></div>", translations).errors))
-            .toEqual(["Invalid interpolation index '99'"]);
+            .toEqual(["Invalid interpolation name '99'"]);
       });
 
     });
@@ -207,4 +237,4 @@ export function main() {
 
 function humanizeErrors(errors: ParseError[]): string[] {
   return errors.map(error => error.msg);
-}
+}

modules/angular2/test/i18n/message_extractor_spec.ts

@@ -93,6 +93,47 @@ export function main() {
           .toEqual([new Message('Hi <ph name="0"/> and <ph name="1"/>', null, null)]);
     });
 
+    it('should replace interpolation with named placeholders if provided (text nodes)', () => {
+      let res = extractor.extract(`
+        <div i18n>Hi {{one //i18n(ph="FIRST")}} and {{two //i18n(ph="SECOND")}}</div>`,
+                                  'someurl');
+      expect(res.messages)
+          .toEqual([
+            new Message('<ph name="t0">Hi <ph name="FIRST"/> and <ph name="SECOND"/></ph>', null,
+                        null)
+          ]);
+    });
+
+    it('should replace interpolation with named placeholders if provided (attributes)', () => {
+      let res = extractor.extract(`
+      <div title='Hi {{one //i18n(ph="FIRST")}} and {{two //i18n(ph="SECOND")}}'
+        i18n-title></div>`,
+                                  'someurl');
+      expect(res.messages)
+          .toEqual([new Message('Hi <ph name="FIRST"/> and <ph name="SECOND"/>', null, null)]);
+    });
+
+    it('should match named placeholders with extra spacing', () => {
+      let res = extractor.extract(`
+      <div title='Hi {{one // i18n ( ph = "FIRST" )}} and {{two // i18n ( ph = "SECOND" )}}'
+        i18n-title></div>`,
+                                  'someurl');
+      expect(res.messages)
+          .toEqual([new Message('Hi <ph name="FIRST"/> and <ph name="SECOND"/>', null, null)]);
+    });
+
+    it('should suffix duplicate placeholder names with numbers', () => {
+      let res = extractor.extract(`
+      <div title='Hi {{one //i18n(ph="FIRST")}} and {{two //i18n(ph="FIRST")}} and {{three //i18n(ph="FIRST")}}'
+        i18n-title></div>`,
+                                  'someurl');
+      expect(res.messages)
+          .toEqual([
+            new Message('Hi <ph name="FIRST"/> and <ph name="FIRST_1"/> and <ph name="FIRST_2"/>',
+                        null, null)
+          ]);
+    });
+
     it("should handle html content", () => {
       let res = extractor.extract(
           '<div i18n><div attr="value">zero<div>one</div></div><div>two</div></div>', "someurl");