fix(ng-update): do not throw if typescript version is outdated (#13927)

* Running `ng update` doesn't necessarily mean that the `typescript` version is updated automatically. Therefore we need to avoid using the `isStringLiteralLike` method which has been added in `2.8`. Note that this does not mean that we cannot _compile_ with a higher TypeScript version.. we should just ensure that _at runtime_, imports from `typescript` are working for [email protected]

Author: devversion

src/cdk/schematics/ng-update/tslint/component-walker.ts

@@ -9,6 +9,7 @@
 import {existsSync, readFileSync} from 'fs';
 import {dirname, resolve} from 'path';
 import * as ts from 'typescript';
+import {isStringLiteralLike} from '../typescript/literal';
 import {createComponentFile, ExternalResource} from './component-file';
 import {ExternalFailureWalker} from './external-failure-walker';
 
@@ -60,11 +61,11 @@ export class ComponentWalker extends ExternalFailureWalker {
     for (const property of directiveMetadata.properties as ts.NodeArray<ts.PropertyAssignment>) {
       const propertyName = property.name.getText();
 
-      if (propertyName === 'template' && ts.isStringLiteralLike(property.initializer)) {
+      if (propertyName === 'template' && isStringLiteralLike(property.initializer)) {
         this.visitInlineTemplate(property.initializer);
       }
 
-      if (propertyName === 'templateUrl' && ts.isStringLiteralLike(property.initializer)) {
+      if (propertyName === 'templateUrl' && isStringLiteralLike(property.initializer)) {
         this._reportExternalTemplate(property.initializer);
       }
 
@@ -95,15 +96,15 @@ export class ComponentWalker extends ExternalFailureWalker {
 
   private _reportInlineStyles(expression: ts.ArrayLiteralExpression) {
     expression.elements.forEach(node => {
-      if (ts.isStringLiteralLike(node)) {
+      if (isStringLiteralLike(node)) {
         this.visitInlineStylesheet(node);
       }
     });
   }
 
   private _visitExternalStylesArrayLiteral(expression: ts.ArrayLiteralExpression) {
     expression.elements.forEach(node => {
-      if (ts.isStringLiteralLike(node)) {
+      if (isStringLiteralLike(node)) {
         const stylePath = resolve(dirname(this.getSourceFile().fileName), node.text);
 
         // Check if the external stylesheet file exists before proceeding.

src/cdk/schematics/ng-update/typescript/literal.ts

@@ -6,6 +6,8 @@
  * found in the LICENSE file at https://angular.io/license
  */
 
+import * as ts from 'typescript';
+
 /** Finds all start indices of the given search string in the input string. */
 export function findAllSubstringIndices(input: string, search: string): number[] {
   const result: number[] = [];
@@ -15,3 +17,15 @@ export function findAllSubstringIndices(input: string, search: string): number[]
   }
   return result;
 }
+
+/**
+ * Checks whether the given node is either a string literal or a no-substitution template
+ * literal. Note that we cannot use `ts.isStringLiteralLike()` because if developers update
+ * an outdated project, their TypeScript version is not automatically being updated
+ * and therefore could throw because the function is not available yet.
+ * https://github.com/Microsoft/TypeScript/commit/8518343dc8762475a5e92c9f80b5c5725bd81796
+ */
+export function isStringLiteralLike(node: ts.Node):
+    node is (ts.StringLiteral | ts.NoSubstitutionTemplateLiteral) {
+  return ts.isStringLiteral(node) || ts.isNoSubstitutionTemplateLiteral(node);
+}