refactor(compiler): Drop support for the deprecated <template>. Use <ng-template> instead (#22783)

BREAKING CHANGE:

The `<template>` tag was deprecated in Angular v4 to avoid collisions (i.e. when
using Web Components).

This commit removes support for `<template>`. `<ng-template>` should be used
instead.

BEFORE:

    <!-- html template -->
    <template>some template content</template>

    # tsconfig.json
    {
      # ...
      "angularCompilerOptions": {
        # ...
        # This option is no more supported and will have no effect
        "enableLegacyTemplate": [true|false]
      }
    }

AFTER:

    <!-- html template -->
    <ng-template>some template content</ng-template>

PR Close #22783

packages/compiler/src/aot/compiler_factory.ts

@@ -70,7 +70,6 @@ export function createAotCompiler(
   const config = new CompilerConfig({
     defaultEncapsulation: ViewEncapsulation.Emulated,
     useJit: false,
-    enableLegacyTemplate: options.enableLegacyTemplate === true,
     missingTranslation: options.missingTranslation,
     preserveWhitespaces: options.preserveWhitespaces,
     strictInjectionParameters: options.strictInjectionParameters,

packages/compiler/src/aot/compiler_options.ts

@@ -13,7 +13,6 @@ export interface AotCompilerOptions {
   i18nFormat?: string;
   translations?: string;
   missingTranslation?: MissingTranslationStrategy;
-  enableLegacyTemplate?: boolean;
   enableSummariesForJit?: boolean;
   preserveWhitespaces?: boolean;
   fullTemplateTypeCheck?: boolean;

packages/compiler/src/config.ts

@@ -14,9 +14,6 @@ import {noUndefined} from './util';
 
 export class CompilerConfig {
   public defaultEncapsulation: ViewEncapsulation|null;
-  // Whether to support the `<template>` tag and the `template` attribute to define angular
-  // templates. They have been deprecated in 4.x, `<ng-template>` should be used instead.
-  public enableLegacyTemplate: boolean;
   public useJit: boolean;
   public jitDevMode: boolean;
   public missingTranslation: MissingTranslationStrategy|null;
@@ -25,13 +22,11 @@ export class CompilerConfig {
 
   constructor(
       {defaultEncapsulation = ViewEncapsulation.Emulated, useJit = true, jitDevMode = false,
-       missingTranslation = null, enableLegacyTemplate, preserveWhitespaces,
-       strictInjectionParameters}: {
+       missingTranslation = null, preserveWhitespaces, strictInjectionParameters}: {
         defaultEncapsulation?: ViewEncapsulation,
         useJit?: boolean,
         jitDevMode?: boolean,
         missingTranslation?: MissingTranslationStrategy,
-        enableLegacyTemplate?: boolean,
         preserveWhitespaces?: boolean,
         strictInjectionParameters?: boolean,
       } = {}) {
@@ -39,7 +34,6 @@ export class CompilerConfig {
     this.useJit = !!useJit;
     this.jitDevMode = !!jitDevMode;
     this.missingTranslation = missingTranslation;
-    this.enableLegacyTemplate = enableLegacyTemplate === true;
     this.preserveWhitespaces = preserveWhitespacesDefault(noUndefined(preserveWhitespaces));
     this.strictInjectionParameters = strictInjectionParameters === true;
   }

packages/compiler/src/ml_parser/tags.ts

@@ -71,7 +71,6 @@ export function mergeNsAndName(prefix: string, localName: string): string {
 // This list is not exhaustive to keep the compiler footprint low.
 // The `{` / `ƫ` syntax should be used when the named character reference does not
 // exist.
-
 export const NAMED_ENTITIES: {[k: string]: string} = {
   'Aacute': '\u00C1',
   'aacute': '\u00E1',

packages/compiler/src/template_parser/template_parser.ts

@@ -55,20 +55,11 @@ const IDENT_PROPERTY_IDX = 9;
 // Group 10 = identifier inside ()
 const IDENT_EVENT_IDX = 10;
 
-// deprecated in 4.x
-const TEMPLATE_ELEMENT = 'template';
-// deprecated in 4.x
-const TEMPLATE_ATTR = 'template';
 const TEMPLATE_ATTR_PREFIX = '*';
 const CLASS_ATTR = 'class';
 
 const TEXT_CSS_SELECTOR = CssSelector.parse('*')[0];
 
-const TEMPLATE_ELEMENT_DEPRECATION_WARNING =
-    'The <template> element is deprecated. Use <ng-template> instead';
-const TEMPLATE_ATTR_DEPRECATION_WARNING =
-    'The template attribute is deprecated. Use an ng-template element instead.';
-
 let warningCounts: {[warning: string]: number} = {};
 
 function warnOnlyOnce(warnings: string[]): (warning: ParseError) => boolean {
@@ -109,10 +100,7 @@ export class TemplateParser {
       preserveWhitespaces: boolean): {template: TemplateAst[], pipes: CompilePipeSummary[]} {
     const result = this.tryParse(
         component, template, directives, pipes, schemas, templateUrl, preserveWhitespaces);
-    const warnings =
-        result.errors !.filter(error => error.level === ParseErrorLevel.WARNING)
-            .filter(warnOnlyOnce(
-                [TEMPLATE_ATTR_DEPRECATION_WARNING, TEMPLATE_ELEMENT_DEPRECATION_WARNING]));
+    const warnings = result.errors !.filter(error => error.level === ParseErrorLevel.WARNING);
 
     const errors = result.errors !.filter(error => error.level === ParseErrorLevel.ERROR);
 
@@ -295,9 +283,7 @@ class TemplateParseVisitor implements html.Visitor {
 
     let hasInlineTemplates = false;
     const attrs: AttrAst[] = [];
-    const isTemplateElement = isTemplate(
-        element, this.config.enableLegacyTemplate,
-        (m: string, span: ParseSourceSpan) => this._reportError(m, span, ParseErrorLevel.WARNING));
+    const isTemplateElement = isNgTemplate(element.name);
 
     element.attrs.forEach(attr => {
       const hasBinding = this._parseAttr(
@@ -306,13 +292,9 @@ class TemplateParseVisitor implements html.Visitor {
 
       let templateBindingsSource: string|undefined;
       let prefixToken: string|undefined;
-      let normalizedName = this._normalizeAttributeName(attr.name);
+      const normalizedName = this._normalizeAttributeName(attr.name);
 
-      if (this.config.enableLegacyTemplate && normalizedName == TEMPLATE_ATTR) {
-        this._reportError(
-            TEMPLATE_ATTR_DEPRECATION_WARNING, attr.sourceSpan, ParseErrorLevel.WARNING);
-        templateBindingsSource = attr.value;
-      } else if (normalizedName.startsWith(TEMPLATE_ATTR_PREFIX)) {
+      if (normalizedName.startsWith(TEMPLATE_ATTR_PREFIX)) {
         templateBindingsSource = attr.value;
         prefixToken = normalizedName.substring(TEMPLATE_ATTR_PREFIX.length) + ':';
       }
@@ -321,7 +303,7 @@ class TemplateParseVisitor implements html.Visitor {
       if (hasTemplateBinding) {
         if (hasInlineTemplates) {
           this._reportError(
-              `Can't have multiple template bindings on one element. Use only one attribute named 'template' or prefixed with *`,
+              `Can't have multiple template bindings on one element. Use only one attribute prefixed with *`,
               attr.sourceSpan);
         }
         hasInlineTemplates = true;
@@ -400,7 +382,7 @@ class TemplateParseVisitor implements html.Visitor {
 
     if (hasInlineTemplates) {
       const templateQueryStartIndex = this.contentQueryStartId;
-      const templateSelector = createElementCssSelector(TEMPLATE_ELEMENT, templateMatchableAttrs);
+      const templateSelector = createElementCssSelector('ng-template', templateMatchableAttrs);
       const {directives: templateDirectiveMetas} =
           this._parseDirectives(this.selectorMatcher, templateSelector);
       const templateBoundDirectivePropNames = new Set<string>();
@@ -908,20 +890,4 @@ function isEmptyExpression(ast: AST): boolean {
     ast = ast.ast;
   }
   return ast instanceof EmptyExpr;
-}
-
-// `template` is deprecated in 4.x
-function isTemplate(
-    el: html.Element, enableLegacyTemplate: boolean,
-    reportDeprecation: (m: string, span: ParseSourceSpan) => void): boolean {
-  if (isNgTemplate(el.name)) return true;
-  const tagNoNs = splitNsName(el.name)[1];
-  // `<template>` is HTML and case insensitive
-  if (tagNoNs.toLowerCase() === TEMPLATE_ELEMENT) {
-    if (enableLegacyTemplate && tagNoNs.toLowerCase() === TEMPLATE_ELEMENT) {
-      reportDeprecation(TEMPLATE_ELEMENT_DEPRECATION_WARNING, el.sourceSpan !);
-      return true;
-    }
-  }
-  return false;
-}
+}