From 3257fcdcee405cd8b8ac60f8c7c01994681f2f4f Mon Sep 17 00:00:00 2001
From: Chuck Jazdzewski <chuckj@google.com>
Date: Thu, 9 Nov 2017 14:06:02 -0800
Subject: [PATCH] fix(compiler): show explanatory text in template errors
 (#20313)

Fixes: #20076

PR Close #20313
---
 packages/compiler-cli/test/ngc_spec.ts | 30 ++++++++++++++++++++++++++
 packages/compiler/src/parse_util.ts    |  5 +++--
 2 files changed, 33 insertions(+), 2 deletions(-)

diff --git a/packages/compiler-cli/test/ngc_spec.ts b/packages/compiler-cli/test/ngc_spec.ts
index 58911fcd67..b142b41bf6 100644
--- a/packages/compiler-cli/test/ngc_spec.ts
+++ b/packages/compiler-cli/test/ngc_spec.ts
@@ -1468,6 +1468,36 @@ describe('ngc transformer command-line', () => {
       expect(messages[0]).toContain(['Tagged template expressions are not supported in metadata']);
     });
 
+    // Regression: #20076
+    it('should report template error messages', () => {
+      write('src/tsconfig.json', `{
+        "extends": "../tsconfig-base.json",
+        "files": ["test-module.ts"]
+      }`);
+      write('src/lib/test.component.ts', `
+        import {Component} from '@angular/core';
+
+        @Component({
+          template: '{{thing.?stuff}}'
+        })
+        export class TestComponent {
+          thing: string;
+        }
+      `);
+      write('src/test-module.ts', `
+        import {NgModule} from '@angular/core';
+        import {TestComponent} from './lib/test.component';
+
+        @NgModule({declarations: [TestComponent]})
+        export class TestModule {}
+      `);
+      const messages: string[] = [];
+      const exitCode =
+          main(['-p', path.join(basePath, 'src/tsconfig.json')], message => messages.push(message));
+      expect(exitCode).toBe(1, 'Compile was expected to fail');
+      expect(messages[0]).toContain('Parser Error: Unexpected token');
+    });
+
     it('should allow using 2 classes with the same name in declarations with noEmitOnError=true',
        () => {
          write('src/tsconfig.json', `{
diff --git a/packages/compiler/src/parse_util.ts b/packages/compiler/src/parse_util.ts
index 536309cf9e..307cb57d4d 100644
--- a/packages/compiler/src/parse_util.ts
+++ b/packages/compiler/src/parse_util.ts
@@ -120,12 +120,13 @@ export class ParseError {
 
   contextualMessage(): string {
     const ctx = this.span.start.getContext(100, 3);
-    return ctx ? ` ("${ctx.before}[${ParseErrorLevel[this.level]} ->]${ctx.after}")` : '';
+    return ctx ? `${this.msg} ("${ctx.before}[${ParseErrorLevel[this.level]} ->]${ctx.after}")` :
+                 this.msg;
   }
 
   toString(): string {
     const details = this.span.details ? `, ${this.span.details}` : '';
-    return `${this.msg}${this.contextualMessage()}: ${this.span.start}${details}`;
+    return `${this.contextualMessage()}: ${this.span.start}${details}`;
   }
 }