build: run offline_compiler_test using bazel (#28191)

PR Close #28191

packages/compiler-cli/integrationtest/BUILD.bazel

@@ -0,0 +1,59 @@
+package(default_visibility = ["//visibility:public"])
+
+load("@build_bazel_rules_nodejs//:defs.bzl", "nodejs_test")
+load("//tools:defaults.bzl", "nodejs_binary")
+
+nodejs_binary(
+    name = "ngc_bin",
+    data = [
+        "//packages/compiler-cli",
+        "@ngdeps//chokidar",
+        "@ngdeps//reflect-metadata",
+    ],
+    entry_point = "angular/packages/compiler-cli/src/main.js",
+)
+
+nodejs_binary(
+    name = "ng_xi18n",
+    data = [
+        "//packages/compiler-cli",
+        "@ngdeps//chokidar",
+        "@ngdeps//reflect-metadata",
+    ],
+    entry_point = "angular/packages/compiler-cli/src/extract_i18n.js",
+)
+
+nodejs_test(
+    name = "integrationtest",
+    data = [
+        ":ngc_bin",
+        ":ng_xi18n",
+        "@nodejs//:node",
+        "@ngdeps//domino",
+        "@ngdeps//chokidar",
+        "@ngdeps//source-map-support",
+        "@ngdeps//shelljs",
+        "@ngdeps//typescript",
+        "@ngdeps//reflect-metadata",
+        "@ngdeps//rxjs",
+        "@ngdeps//tslib",
+        "@ngdeps//jasmine/bin:jasmine",
+        "@ngdeps//zone.js",
+        "@ngdeps//xhr2",
+        "@ngdeps//@types/node",
+        "@ngdeps//@types/jasmine",
+        "//packages/animations:npm_package",
+        "//packages/common:npm_package",
+        "//packages/compiler:npm_package",
+        "//packages/compiler-cli:npm_package",
+        "//packages/core:npm_package",
+        "//packages/forms:npm_package",
+        "//packages/http:npm_package",
+        "//packages/platform-browser:npm_package",
+        "//packages/platform-browser-dynamic:npm_package",
+        "//packages/platform-server:npm_package",
+        "//packages/router:npm_package",
+    ] + glob(["**/*"]),
+    entry_point = "angular/packages/compiler-cli/integrationtest/test.js",
+    tags = ["no-ivy-aot"],
+)

packages/compiler-cli/integrationtest/flat_module/tsconfig-build.json

@@ -1,26 +1,21 @@
 {
   "angularCompilerOptions": {
-    // For TypeScript 1.8, we have to lay out generated files
-    // in the same source directory with your code.
-    "genDir": "ng",
     "flatModuleId": "flat_module",
     "flatModuleOutFile": "index.js",
     "skipTemplateCodegen": true
   },
 
   "compilerOptions": {
-    "target": "es5",
-    "experimentalDecorators": true,
-    "noImplicitAny": true,
-    "moduleResolution": "node",
-    "rootDir": "",
-    "declaration": true,
-    "lib": ["es6", "dom"],
     "baseUrl": ".",
+    "declaration": true,
+    "experimentalDecorators": true,
+    "lib": ["es6", "dom"],
+    "moduleResolution": "node",
+    "noImplicitAny": true,
     "outDir": "../node_modules/flat_module",
-     // Prevent scanning up the directory tree for types
-    "typeRoots": ["node_modules/@types"]
+    "rootDir": "",
+    "target": "es5"
  },
 
  "files": ["public-api.ts"]
-}
+}

packages/compiler-cli/integrationtest/ngtools_src/tsconfig-build.json

@@ -1,24 +1,17 @@
 {
   "angularCompilerOptions": {
-    // For TypeScript 1.8, we have to lay out generated files
-    // in the same source directory with your code.
-    "genDir": ".",
     "debug": true
   },
 
   "compilerOptions": {
-    "target": "es5",
-    "experimentalDecorators": true,
-    "noImplicitAny": true,
-    "moduleResolution": "node",
-    "rootDir": "",
-    "declaration": true,
-    "lib": [
-      "es6",
-      "dom"
-    ],
     "baseUrl": ".",
-    // don't auto-discover @types/fs-extra
+    "declaration": true,
+    "experimentalDecorators": true,
+    "lib": ["es6", "dom"],
+    "moduleResolution": "node",
+    "noImplicitAny": true,
+    "rootDir": "",
+    "target": "es5",
     "types": []
   }
-}
+}

packages/compiler-cli/integrationtest/src/module.ts

@@ -8,7 +8,6 @@
 
 import {ApplicationRef, NgModule, forwardRef} from '@angular/core';
 import {FormsModule} from '@angular/forms';
-import {MATERIAL_SANITY_CHECKS, MdButtonModule} from '@angular/material';
 import {ServerModule} from '@angular/platform-server';
 import {FlatModule} from 'flat_module';
 // Note: don't refer to third_party_src as we want to test that
@@ -60,7 +59,6 @@ export {SomeModule as JitSummariesSomeModule} from './jit_summaries';
   imports: [
     ServerModule,
     FormsModule,
-    MdButtonModule,
     ModuleUsingCustomElements,
     SomeLibModule.withProviders(),
     ThirdpartyModule,
@@ -69,9 +67,6 @@ export {SomeModule as JitSummariesSomeModule} from './jit_summaries';
   providers: [
     SomeService,
     {provide: CUSTOM, useValue: forwardRef(() => ({name: 'some name'}))},
-    // disable sanity check for material because it throws an error when used server-side
-    // see https://github.com/angular/material2/issues/6292
-    {provide: MATERIAL_SANITY_CHECKS, useValue: false},
   ],
   entryComponents: [
     AnimateCmp,

packages/compiler-cli/integrationtest/test.js

@@ -0,0 +1,54 @@
+/**
+ * @license
+ * Copyright Google Inc. All Rights Reserved.
+ *
+ * Use of this source code is governed by an MIT-style license that can be
+ * found in the LICENSE file at https://angular.io/license
+ */
+
+const path = require('path');
+const shx = require('shelljs');
+const os = require('os');
+const {runCommand, setupTestDirectory} = require('./test_helpers');
+
+const ngcBin = require.resolve('./ngc_bin');
+const xi18nBin = require.resolve('./ng_xi18n');
+const nodeBin = require.resolve(`nodejs/bin/node${(os.platform() === 'win32' ? '.cmd' : '')}`);
+const jasmineBin = require.resolve('ngdeps/node_modules/jasmine/bin/jasmine.js');
+
+// Prepare the test directory before building the integration test output. This ensures that
+// the test runs in an hermetic way and works on Windows.
+const tmpDir = setupTestDirectory();
+
+// Compile the "flat_module" Angular project using NGC.
+runCommand(ngcBin, ['-p', 'flat_module/tsconfig-build.json']);
+
+// Copy HTML asset files from the "flat_module" package to the NPM output. The "flat_module"
+// has template code generation disabled and therefore needs to have the asset files included
+// next to the JavaScript output.
+shx.cp(
+    path.join(tmpDir, 'flat_module/src/*.html'), path.join(tmpDir, 'node_modules/flat_module/src'));
+
+// Compile the "third_party" Angular project using NGC.
+runCommand(ngcBin, ['-p', 'third_party_src/tsconfig-build.json']);
+
+// Compile the main integration-test Angular project using NGC. Also uses a translated
+// i18n file which will be used to verify the translated templates of components.
+runCommand(ngcBin, [
+  '-p', 'tsconfig-build.json', '--i18nFile=src/messages.fi.xlf', '--locale=fi', '--i18nFormat=xlf'
+]);
+
+// Extract the i18n messages into various formats that will be verified
+// later on by the "i18n_spec" within "test/".
+runCommand(xi18nBin, ['-p', 'tsconfig-xi18n.json', '--i18nFormat=xlf', '--locale=fr']);
+runCommand(
+    xi18nBin, ['-p', 'tsconfig-xi18n.json', '--i18nFormat=xlf2', '--outFile=messages.xliff2.xlf']);
+runCommand(
+    xi18nBin, ['-p', 'tsconfig-xi18n.json', '--i18nFormat=xmb', '--outFile=custom_file.xmb']);
+
+// Run the ngtools tests that verify that the public API provided by the "compiler-cli"
+// is working as expected in real projects.
+runCommand(nodeBin, [path.join(tmpDir, 'test/test_ngtools_api.js')]);
+
+// Run all specs which verify the output from the previously built modules and i18n files.
+runCommand(nodeBin, [jasmineBin, path.join(tmpDir, 'test/all_spec.js')]);

packages/compiler-cli/integrationtest/test_helpers.js

@@ -0,0 +1,164 @@
+/**
+ * @license
+ * Copyright Google Inc. All Rights Reserved.
+ *
+ * Use of this source code is governed by an MIT-style license that can be
+ * found in the LICENSE file at https://angular.io/license
+ */
+
+const child_process = require('child_process');
+const fs = require('fs');
+const path = require('path');
+const shx = require('shelljs');
+
+/** Manifest path that refers to the Bazel package that contains all test sources. */
+const baseManifestPath = 'angular/packages/compiler-cli/integrationtest';
+
+/**
+ * Temporary directory which will be used to build and run the integration tests. Note that
+ * this environment variable is automatically set by Bazel for such test actions.
+ */
+const tmpDir = process.env.TEST_TMPDIR;
+
+/** Fine grained node modules which are required in order to run the integration test. */
+const requiredNodeModules = {
+  '@angular/animations': resolveNpmTreeArtifact('angular/packages/animations/npm_package'),
+  '@angular/common': resolveNpmTreeArtifact('angular/packages/common/npm_package'),
+  '@angular/compiler': resolveNpmTreeArtifact('angular/packages/compiler/npm_package'),
+  '@angular/compiler-cli': resolveNpmTreeArtifact('angular/packages/compiler-cli/npm_package'),
+  '@angular/core': resolveNpmTreeArtifact('angular/packages/core/npm_package'),
+  '@angular/forms': resolveNpmTreeArtifact('angular/packages/forms/npm_package'),
+  '@angular/http': resolveNpmTreeArtifact('angular/packages/http/npm_package'),
+  '@angular/platform-browser':
+      resolveNpmTreeArtifact('angular/packages/platform-browser/npm_package'),
+  '@angular/platform-browser-dynamic':
+      resolveNpmTreeArtifact('angular/packages/platform-browser-dynamic/npm_package'),
+  '@angular/platform-server':
+      resolveNpmTreeArtifact('angular/packages/platform-server/npm_package'),
+  '@angular/router': resolveNpmTreeArtifact('angular/packages/router/npm_package'),
+  '@types/jasmine': resolveNpmTreeArtifact('ngdeps/node_modules/@types/jasmine'),
+  '@types/node': resolveNpmTreeArtifact('ngdeps/node_modules/@types/node'),
+
+  // Transitive dependencies which need to be specified because the Angular NPM packages
+  // depend on these without the Angular NPM packages being part of the Bazel managed deps.
+  // This means that transitive dependencies need to be manually declared as required.
+  'tslib': resolveNpmTreeArtifact('ngdeps/node_modules/tslib'),
+  'domino': resolveNpmTreeArtifact('ngdeps/node_modules/domino'),
+  'xhr2': resolveNpmTreeArtifact('ngdeps/node_modules/xhr2'),
+
+  // Fine grained dependencies which are used by the integration test Angular modules, and
+  // need to be symlinked so that they can be resolved by NodeJS or NGC.
+  'reflect-metadata': resolveNpmTreeArtifact('ngdeps/node_modules/reflect-metadata'),
+  'rxjs': resolveNpmTreeArtifact('ngdeps/node_modules/rxjs'),
+  'source-map-support': resolveNpmTreeArtifact('ngdeps/node_modules/source-map-support'),
+  'typescript': resolveNpmTreeArtifact('ngdeps/node_modules/typescript'),
+  'zone.js': resolveNpmTreeArtifact('ngdeps/node_modules/zone.js'),
+};
+
+/** Sets up the temporary test directory and returns the path to the directory. */
+exports.setupTestDirectory = function() {
+  copySourceFilesToTempDir();
+  symlinkNodeModules();
+  return tmpDir;
+};
+
+/**
+ * Runs a given binary with the specified command line arguments. The working directory for
+ * the spawned process will be the temporary directory.
+ */
+exports.runCommand = function runCommand(binary, args = []) {
+  const ngcProcess = child_process.spawnSync(binary, args, {
+    stdio: 'inherit',
+    cwd: tmpDir,
+    env: {
+      ...process.env,
+      // We need to set the "NODE_PATH" here because the built Angular NPM packages are symlinks
+      // which NodeJS resolves into the output location. This is problematic because the output
+      // location does not have the required dependencies of these NPM packages installed. This
+      // could be fixed by setting the NodeJS "--preserve-symlinks" option, but this would mean
+      // that transitive dependencies of fine-grained dependencies cannot be resolved either.
+      NODE_PATH: path.join(tmpDir, 'node_modules/')
+    }
+  });
+
+  if (ngcProcess.status !== 0) {
+    console.error(`Command ${binary} failed with arguments: "${args.join(' ')}". See error above.`);
+    process.exit(1);
+  }
+};
+
+/**
+ * Symlinks the specified node modules within the temporary directory. This is necessary because
+ * this test is an integration test and we don't want to rely on any path-mapped module resolution.
+ * Additionally, NGC expects types and imported packages to be within the project's root dir.
+ */
+function symlinkNodeModules() {
+  Object.keys(requiredNodeModules).forEach(importName => {
+    const outputPath = path.join(tmpDir, 'node_modules', importName);
+    const moduleDir = requiredNodeModules[importName];
+
+    findFilesWithinDirectory(moduleDir).forEach(filePath => {
+      const outputFilePath = path.join(outputPath, path.relative(moduleDir, filePath));
+
+      shx.mkdir('-p', path.dirname(outputFilePath));
+      fs.symlinkSync(filePath, outputFilePath);
+    });
+  });
+}
+
+/**
+ * Copies all source files for the integration test to a temporary directory. This
+ * is necessary because runfiles resolve on Windows to the original source location,
+ * and we don't want to pollute the workspace sources. This breaks hermeticity.
+ */
+function copySourceFilesToTempDir() {
+  getSourceFilesFromRunfiles().forEach(({realPath, relativeFilePath}) => {
+    const tmpFilePath = path.join(tmpDir, relativeFilePath);
+
+    shx.mkdir('-p', path.dirname(tmpFilePath));
+    shx.cp(realPath, tmpFilePath);
+  });
+}
+
+/**
+ * Gets all source files for the integration test by querying the Bazel runfiles.
+ * In case there is a runfiles manifest (e.g. on Windows), the source files are resolved
+ * through the manifest because on these platforms the runfiles are not symlinked and
+ * cannot be searched within the real filesystem.
+ */
+function getSourceFilesFromRunfiles() {
+  // Path to the Bazel runfiles manifest if present. This file is present if runfiles are
+  // not symlinked into the runfiles directory.
+  const runfilesManifestPath = process.env.RUNFILES_MANIFEST_FILE;
+
+  if (!runfilesManifestPath) {
+    const packageRunfilesDir = path.join(process.env.RUNFILES, baseManifestPath);
+    return findFilesWithinDirectory(packageRunfilesDir).map(filePath => ({
+                                                              realPath: filePath,
+                                                              relativeFilePath: path.relative(
+                                                                  packageRunfilesDir, filePath)
+                                                            }));
+  }
+
+  return fs.readFileSync(runfilesManifestPath, 'utf8')
+      .split('\n')
+      .map(mapping => mapping.split(' '))
+      .filter(([runfilePath]) => runfilePath.startsWith(baseManifestPath))
+      .map(
+          ([runfilePath, realPath]) =>
+              ({realPath, relativeFilePath: path.relative(baseManifestPath, runfilePath)}));
+}
+
+/**
+ * Resolves a NPM package from the Bazel runfiles. We need to resolve the Bazel tree
+ * artifacts using a "resolve file" because the NodeJS module resolution does not allow
+ * resolving to directory paths.
+ */
+function resolveNpmTreeArtifact(manifestPath, resolveFile = 'package.json') {
+  return path.dirname(require.resolve(path.posix.join(manifestPath, resolveFile)));
+}
+
+/** Finds all files within a specified directory. */
+function findFilesWithinDirectory(directoryPath) {
+  return shx.find(directoryPath).filter(filePath => !fs.statSync(filePath).isDirectory());
+}

packages/compiler-cli/integrationtest/third_party_src/tsconfig-build.json

@@ -1,21 +1,17 @@
 {
   "angularCompilerOptions": {
-    // For TypeScript 1.8, we have to lay out generated files
-    // in the same source directory with your code.
     "skipTemplateCodegen": true
   },
 
   "compilerOptions": {
-    "target": "es5",
-    "experimentalDecorators": true,
-    "noImplicitAny": true,
-    "moduleResolution": "node",
-    "rootDir": "",
-    "declaration": true,
-    "lib": ["es6", "dom"],
     "baseUrl": ".",
+    "declaration": true,
+    "experimentalDecorators": true,
+    "lib": ["es6", "dom"],
+    "moduleResolution": "node",
+    "noImplicitAny": true,
     "outDir": "../node_modules/third_party",
-     // Prevent scanning up the directory tree for types
-    "typeRoots": ["node_modules/@types"]
+    "rootDir": "",
+    "target": "es5"
  }
-}
+}

packages/compiler-cli/integrationtest/tsconfig-build.json

@@ -1,40 +1,34 @@
 {
   "angularCompilerOptions": {
-    // For TypeScript 1.8, we have to lay out generated files
-    // in the same source directory with your code.
-    "genDir": ".",
+    "alwaysCompileGeneratedCode": true,
+    "annotationsAs": "static fields",
     "debug": true,
     "enableSummariesForJit": true,
-    "alwaysCompileGeneratedCode": true,
     "i18nFormat": "xlf"
   },
 
   "compilerOptions": {
-    "target": "es5",
-    "experimentalDecorators": true,
-    "noImplicitAny": true,
-    "strictNullChecks": true,
-    "strictPropertyInitialization": true,
-    "skipLibCheck": true,
-    "moduleResolution": "node",
-    "rootDir": "",
-    "declaration": true,
-    "lib": ["es6", "dom"],
     "baseUrl": ".",
-    // Prevent scanning up the directory tree for types
-    "typeRoots": ["node_modules/@types"],
+    "declaration": true,
+    "experimentalDecorators": true,
+    "lib": ["es6", "dom"],
+    "moduleResolution": "node",
+    "noImplicitAny": true,
     "noUnusedLocals": true,
-    "sourceMap": true
+    "rootDir": "",
+    "skipLibCheck": true,
+    "sourceMap": true,
+    "strictNullChecks": true,
+    // compatible with the option. Disabled until the integration test support the strict flag.
+    // TODO(devversion): this has been enabled without the integration test code being
+    "strictPropertyInitialization": false,
+    "target": "es5"
   },
 
   "files": [
     "src/module",
     "src/bootstrap",
     "test/all_spec",
-    "test/test_ngtools_api",
-    "benchmarks/src/tree/ng2/index_aot.ts",
-    "benchmarks/src/tree/ng2_switch/index_aot.ts",
-    "benchmarks/src/largetable/ng2/index_aot.ts",
-    "benchmarks/src/largetable/ng2_switch/index_aot.ts"
+    "test/test_ngtools_api"
   ]
 }

packages/compiler-cli/integrationtest/tsconfig-ngc-build.json

@@ -1,39 +0,0 @@
-{
-  "angularCompilerOptions": {
-    // For TypeScript 1.8, we have to lay out generated files
-    // in the same source directory with your code.
-    "genDir": ".",
-    "debug": true,
-    "enableSummariesForJit": true,
-    "alwaysCompileGeneratedCode": true
-  },
-
-  "compilerOptions": {
-    "target": "es5",
-    "experimentalDecorators": true,
-    "noImplicitAny": true,
-    "strictNullChecks": true,
-    "strictPropertyInitialization": true,
-    "skipLibCheck": true,
-    "moduleResolution": "node",
-    "rootDir": "",
-    "declaration": true,
-    "lib": ["es6", "dom"],
-    "baseUrl": ".",
-    // Prevent scanning up the directory tree for types
-    "typeRoots": ["node_modules/@types"],
-    "noUnusedLocals": true,
-    "sourceMap": true
-  },
-
-  "files": [
-    "src/module",
-    "src/bootstrap",
-    "test/all_spec",
-    "test/test_ngtools_api",
-    "benchmarks/src/tree/ng2/index_aot.ts",
-    "benchmarks/src/tree/ng2_switch/index_aot.ts",
-    "benchmarks/src/largetable/ng2/index_aot.ts",
-    "benchmarks/src/largetable/ng2_switch/index_aot.ts"
-  ]
-}

packages/compiler-cli/integrationtest/tsconfig-xi18n.json

@@ -1,34 +1,26 @@
 {
   "angularCompilerOptions": {
-    // For TypeScript 1.8, we have to lay out generated files
-    // in the same source directory with your code.
-    "genDir": ".",
     "debug": true,
     "enableSummariesForJit": true
   },
 
   "compilerOptions": {
-    "target": "es5",
-    "experimentalDecorators": true,
-    "noImplicitAny": true,
-    "moduleResolution": "node",
-    "outDir": "./out",
-    "rootDir": "",
-    "declaration": true,
-    "lib": ["es6", "dom"],
     "baseUrl": ".",
-    // Prevent scanning up the directory tree for types
-    "typeRoots": ["node_modules/@types"]
+    "declaration": true,
+    "experimentalDecorators": true,
+    "lib": ["es6", "dom"],
+    "moduleResolution": "node",
+    "noImplicitAny": true,
+    "outDir": "./xi18n-out",
+    "rootDir": "",
+    "skipLibCheck": true,
+    "target": "es5"
   },
 
   "files": [
     "src/module",
     "src/bootstrap",
     "test/all_spec",
-    "test/test_ngtools_api",
-    "benchmarks/src/tree/ng2/index_aot.ts",
-    "benchmarks/src/tree/ng2_switch/index_aot.ts",
-    "benchmarks/src/largetable/ng2/index_aot.ts",
-    "benchmarks/src/largetable/ng2_switch/index_aot.ts"
+    "test/test_ngtools_api"
   ]
 }

packages/compiler-cli/integrationtest/webpack.config.js

@@ -1,19 +0,0 @@
-/**
- * @license
- * Copyright Google Inc. All Rights Reserved.
- *
- * Use of this source code is governed by an MIT-style license that can be
- * found in the LICENSE file at https://angular.io/license
- */
-
-module.exports = {
-  target: 'node',
-  entry: './test/all_spec.js',
-  output: {filename: './all_spec.js'},
-  resolve: {extensions: ['.js']},
-  devtool: '#source-map',
-  module: {
-    loaders:
-        [{test: /\.js$/, exclude: /node_modules/, loaders: ['source-map-loader'], enforce: 'pre'}]
-  },
-};