fix(@angular/cli): don't search for lazy routes in Angular 5 ng test

Fix angular#8066

Author: filipesilva

packages/@angular/cli/models/webpack-configs/typescript.ts

@@ -18,7 +18,7 @@ const webpackLoader: string = g['angularCliIsLocal']
   : '@ngtools/webpack';
 
 
-function _createAotPlugin(wco: WebpackConfigOptions, options: any) {
+function _createAotPlugin(wco: WebpackConfigOptions, options: any, useMain = true) {
   const { appConfig, projectRoot, buildOptions } = wco;
   options.compilerOptions = options.compilerOptions || {};
 
@@ -82,7 +82,7 @@ function _createAotPlugin(wco: WebpackConfigOptions, options: any) {
 
   if (AngularCompilerPlugin.isSupported()) {
     const pluginOptions: AngularCompilerPluginOptions = Object.assign({}, {
-      mainPath: path.join(projectRoot, appConfig.root, appConfig.main),
+      mainPath: useMain ? path.join(projectRoot, appConfig.root, appConfig.main) : undefined,
       i18nInFile: buildOptions.i18nFile,
       i18nInFormat: buildOptions.i18nFormat,
       i18nOutFile: buildOptions.i18nOutFile,
@@ -160,23 +160,28 @@ export function getNonAotTestConfig(wco: WebpackConfigOptions) {
   const tsConfigPath = path.resolve(projectRoot, appConfig.root, appConfig.testTsconfig);
   const appTsConfigPath = path.resolve(projectRoot, appConfig.root, appConfig.tsconfig);
 
-  // Force include main and polyfills.
-  // This is needed for AngularCompilerPlugin compatibility with existing projects,
-  // since TS compilation there is stricter and tsconfig.spec.ts doesn't include them.
-  const include = [appConfig.main, appConfig.polyfills, '**/*.spec.ts'];
-  if (appConfig.test) {
-    include.push(appConfig.test);
-  }
+  let pluginOptions: any = { tsConfigPath, skipCodeGeneration: true };
 
-  let pluginOptions: any = { tsConfigPath, skipCodeGeneration: true, include };
+  // The options below only apply to AoTPlugin.
+  if (!AngularCompilerPlugin.isSupported()) {
+    // Force include main and polyfills.
+    // This is needed for AngularCompilerPlugin compatibility with existing projects,
+    // since TS compilation there is stricter and tsconfig.spec.ts doesn't include them.
+    const include = [appConfig.main, appConfig.polyfills, '**/*.spec.ts'];
+    if (appConfig.test) {
+      include.push(appConfig.test);
+    }
 
-  // Fallback to correct module format on projects using a shared tsconfig.
-  if (tsConfigPath === appTsConfigPath) {
-    pluginOptions.compilerOptions = { module: 'commonjs' };
+    pluginOptions.include = include;
+
+    // Fallback to correct module format on projects using a shared tsconfig.
+    if (tsConfigPath === appTsConfigPath) {
+      pluginOptions.compilerOptions = { module: 'commonjs' };
+    }
   }
 
   return {
     module: { rules: [{ test: /\.ts$/, loader: webpackLoader }] },
-    plugins: [ _createAotPlugin(wco, pluginOptions) ]
+    plugins: [ _createAotPlugin(wco, pluginOptions, false) ]
   };
 }

packages/@ngtools/webpack/src/angular_compiler_plugin.ts

@@ -240,20 +240,16 @@ export class AngularCompilerPlugin implements Tapable {
       tsHost: webpackCompilerHost
     }) as CompilerHost & WebpackCompilerHost;
 
-    // Override some files in the FileSystem.
-    if (this._options.hostOverrideFileSystem) {
-      for (const filePath of Object.keys(this._options.hostOverrideFileSystem)) {
-        this._compilerHost.writeFile(filePath,
-          this._options.hostOverrideFileSystem[filePath], false);
-      }
-    }
     // Override some files in the FileSystem with paths from the actual file system.
     if (this._options.hostReplacementPaths) {
       for (const filePath of Object.keys(this._options.hostReplacementPaths)) {
         const replacementFilePath = this._options.hostReplacementPaths[filePath];
         const content = this._compilerHost.readFile(replacementFilePath);
         this._compilerHost.writeFile(filePath, content, false);
       }
+
+      // Reset the file tracker so overriden files are not picked up as changes.
+      this._compilerHost.resetChangedFileTracker();
     }
 
     // Use an identity function as all our paths are absolute already.
@@ -645,9 +641,8 @@ export class AngularCompilerPlugin implements Tapable {
 
   private _makeTransformers() {
 
-    // TODO use compilerhost.denormalize when #8210 is merged.
     const isAppPath = (fileName: string) =>
-      this._rootNames.includes(fileName.replace(/\//g, path.sep));
+      !fileName.endsWith('.ngfactory.ts') && !fileName.endsWith('.ngstyle.ts');
     const isMainPath = (fileName: string) => fileName === this._mainPath;
     const getEntryModule = () => this.entryModule;
     const getLazyRoutes = () => this._lazyRoutes;
@@ -691,17 +686,19 @@ export class AngularCompilerPlugin implements Tapable {
       // Make a new program and load the Angular structure.
       .then(() => this._createOrUpdateProgram())
       .then(() => {
-        // Try to find lazy routes.
-        // We need to run the `listLazyRoutes` the first time because it also navigates libraries
-        // and other things that we might miss using the (faster) findLazyRoutesInAst.
-        // Lazy routes modules will be read with compilerHost and added to the changed files.
-        const changedTsFiles = this._getChangedTsFiles();
-        if (this._ngCompilerSupportsNewApi) {
-          this._processLazyRoutes(this._listLazyRoutesFromProgram());
-        } else if (this._firstRun) {
-          this._processLazyRoutes(this._getLazyRoutesFromNgtools());
-        } else if (changedTsFiles.length > 0) {
-          this._processLazyRoutes(this._findLazyRoutesInAst(changedTsFiles));
+        if (this.entryModule) {
+          // Try to find lazy routes if we have an entry module.
+          // We need to run the `listLazyRoutes` the first time because it also navigates libraries
+          // and other things that we might miss using the (faster) findLazyRoutesInAst.
+          // Lazy routes modules will be read with compilerHost and added to the changed files.
+          const changedTsFiles = this._getChangedTsFiles();
+          if (this._ngCompilerSupportsNewApi) {
+            this._processLazyRoutes(this._listLazyRoutesFromProgram());
+          } else if (this._firstRun) {
+            this._processLazyRoutes(this._getLazyRoutesFromNgtools());
+          } else if (changedTsFiles.length > 0) {
+            this._processLazyRoutes(this._findLazyRoutesInAst(changedTsFiles));
+          }
         }
       })
       .then(() => {

tests/e2e/setup/500-create-project.ts

@@ -52,16 +52,20 @@ export default function() {
     .then(() => updateTsConfig(json => {
       json['compilerOptions']['sourceRoot'] = '/';
     }))
-    .then(() => updateJsonFile('src/tsconfig.spec.json', json => {
+    .then(() => {
       if (argv.nightly) {
         // *************************************************************************************
         // REMOVE THIS WITH UPDATED NG5 SCHEMATICS
         // In ng5 we have to tell users users to update their tsconfig.json.
-        // `src/tsconfig.spec.json` needs to be updated with `"include": [ "**/*.ts" ]`
+        // `src/tsconfig.spec.json` needs to be updated with "polyfills.ts" on `include`.
         // *************************************************************************************
-        json['include'] = ['**/*.ts'];
+        return updateJsonFile('src/tsconfig.spec.json', json => {
+          json['include'] = json['include'].concat('polyfills.ts');
+        })
+        // Ignore error if file doesn't exist.
+        .catch(() => { return; });
       }
-    }))
+    })
     .then(() => git('config', 'user.email', '[email protected]'))
     .then(() => git('config', 'user.name', 'Angular CLI E2e'))
     .then(() => git('config', 'commit.gpgSign', 'false'))

tests/e2e/utils/project.ts

@@ -44,18 +44,18 @@ export function createProject(name: string, ...args: string[]) {
     .then(() => argv['ng2'] ? useNg2() : Promise.resolve())
     .then(() => argv.nightly || argv['ng-sha'] ? useSha() : Promise.resolve())
     .then(() => {
-      // *************************************************************************************
-      // REMOVE THIS WITH UPDATED NG5 SCHEMATICS
-      // In ng5 we have to tell users users to update their tsconfig.json.
-      // `src/tsconfig.spec.json` needs to be updated with `"include": [ "**/*.ts" ]`
-      // *************************************************************************************
-      return updateJsonFile('src/tsconfig.spec.json', json => {
-        if (argv.nightly) {
-          json['include'] = ['**/*.ts'];
-        }
-      })
-      // Ignore error if file doesn't exist.
-      .catch(() => { return; });
+      if (argv.nightly) {
+        // *************************************************************************************
+        // REMOVE THIS WITH UPDATED NG5 SCHEMATICS
+        // In ng5 we have to tell users users to update their tsconfig.json.
+        // `src/tsconfig.spec.json` needs to be updated with "polyfills.ts" on `include`.
+        // *************************************************************************************
+        return updateJsonFile('src/tsconfig.spec.json', json => {
+          json['include'] = json['include'].concat('polyfills.ts');
+        })
+        // Ignore error if file doesn't exist.
+        .catch(() => { return; });
+      }
     })
     .then(() => console.log(`Project ${name} created... Installing npm.`))
     .then(() => silentNpm('install'));