test(@angular-devkit/build-webpack): build and test with Bazel

Author: filipesilva

packages/angular_devkit/build_webpack/BUILD.bazel

@@ -0,0 +1,128 @@
+# 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
+
+licenses(["notice"])  # MIT
+
+load("@bazel_tools//tools/build_defs/pkg:pkg.bzl", "pkg_tar")
+load("@npm_bazel_jasmine//:index.bzl", "jasmine_node_test")
+load("@npm_bazel_typescript//:index.bzl", "ts_library")
+load("@build_bazel_rules_nodejs//:index.bzl", "pkg_npm")
+load("//tools:ts_json_schema.bzl", "ts_json_schema")
+
+package(default_visibility = ["//visibility:public"])
+
+ts_json_schema(
+    name = "webpack_schema",
+    src = "src/webpack/schema.json",
+)
+
+ts_json_schema(
+    name = "webpack_dev_server_schema",
+    src = "src/webpack-dev-server/schema.json",
+)
+
+ts_library(
+    name = "build_webpack",
+    srcs = glob(
+        include = ["src/**/*.ts"],
+        exclude = [
+            "src/test-utils.ts",
+            "src/**/*_spec.ts",
+        ],
+    ) + [
+        "//packages/angular_devkit/build_webpack:src/webpack/schema.ts",
+        "//packages/angular_devkit/build_webpack:src/webpack-dev-server/schema.ts",
+    ],
+    data = glob(
+        include = [
+            "package.json",
+            "builders.json",
+            "src/webpack/schema.json",
+            "src/webpack-dev-server/schema.json",
+        ],
+    ),
+    devmode_module = "commonjs",
+    devmode_target = "es2018",
+    module_name = "@angular-devkit/build-webpack",
+    module_root = "src/index.d.ts",
+    deps = [
+        "//packages/angular_devkit/architect",
+        "//packages/angular_devkit/core",
+        "@npm//@types/node",
+        "@npm//@types/webpack",
+        "@npm//@types/webpack-dev-server",
+        "@npm//rxjs",
+        "@npm//webpack",
+        "@npm//webpack-dev-server",
+    ],
+)
+
+ts_library(
+    name = "build_webpack_test_lib",
+    testonly = True,
+    srcs = glob(
+        include = [
+            "src/test-utils.ts",
+            "src/**/*_spec.ts",
+        ],
+    ),
+    data = glob(
+        include = [
+            "test/**/*",
+        ],
+    ),
+    devmode_module = "commonjs",
+    devmode_target = "es2018",
+    tsconfig = "//:tsconfig-test.json",
+    deps = [
+        ":build_webpack",
+        "//packages/angular_devkit/architect",
+        "//packages/angular_devkit/architect/node",
+        "//packages/angular_devkit/architect/testing",
+        "//packages/angular_devkit/core",
+        "//packages/angular_devkit/core/node",
+        "//packages/ngtools/webpack",
+        "@npm//@angular/common",
+        "@npm//@angular/compiler",
+        "@npm//@angular/compiler-cli",
+        "@npm//@angular/core",
+        "@npm//@angular/platform-browser",
+        "@npm//@angular/platform-browser-dynamic",
+        "@npm//@types/jasmine",
+        "@npm//@types/node",
+        "@npm//@types/node-fetch",
+        "@npm//node-fetch",
+        "@npm//raw-loader",
+        "@npm//tslib",
+        "@npm//zone.js",
+    ],
+)
+
+jasmine_node_test(
+    name = "build_webpack_test",
+    srcs = [":build_webpack_test_lib"],
+    # Turns off nodejs require patches and turns on the linker, which sets up up node_modules
+    # so that standard node module resolution work.
+    templated_args = ["--nobazel_patch_module_resolver"],
+    deps = [
+        "@npm//jasmine",
+        "@npm//source-map",
+    ],
+)
+
+pkg_npm(
+    name = "npm_package",
+    deps = [
+        ":build_webpack",
+    ],
+)
+
+pkg_tar(
+    name = "npm_package_archive",
+    srcs = [":npm_package"],
+    extension = "tar.gz",
+    strip_prefix = "./npm_package",
+    tags = ["manual"],
+)

packages/angular_devkit/build_webpack/package.json

@@ -14,9 +14,5 @@
   "peerDependencies": {
     "webpack": "^4.6.0",
     "webpack-dev-server": "^3.1.4"
-  },
-  "devDependencies": {
-    "webpack": "4.42.1",
-    "webpack-dev-server": "^3.1.4"
   }
 }

packages/angular_devkit/build_webpack/src/test-utils.ts

@@ -14,8 +14,6 @@ import fetch from 'node-fetch';  // tslint:disable-line:no-implicit-dependencies
 import * as path from 'path';
 import { DevServerBuildOutput } from './index';
 
-const devkitRoot = (global as any)._DevKitRoot; // tslint:disable-line:no-any
-
 
 describe('Dev Server Builder', () => {
   let testArchitectHost: TestingArchitectHost;
@@ -41,7 +39,9 @@ describe('Dev Server Builder', () => {
   }
 
   beforeEach(async () => {
-    await createArchitect(path.join(devkitRoot, 'tests/angular_devkit/build_webpack/basic-app/'));
+    const ngJsonPath = path.join(__dirname, '../../test/basic-app/angular.json');
+    const workspaceRoot = path.dirname(require.resolve(ngJsonPath));
+    await createArchitect(workspaceRoot);
   });
 
   it('works', async () => {

packages/angular_devkit/build_webpack/src/webpack-dev-server/index_spec_large.ts renamed to packages/angular_devkit/build_webpack/src/webpack-dev-server/index_spec.ts

@@ -9,12 +9,10 @@ import { Architect } from '@angular-devkit/architect';
 import { WorkspaceNodeModulesArchitectHost } from '@angular-devkit/architect/node';
 import { TestingArchitectHost } from '@angular-devkit/architect/testing';
 import { join, normalize, schema, workspaces } from '@angular-devkit/core';
-import { NodeJsSyncHost } from '@angular-devkit/core/node';
+import { NodeJsSyncHost, createConsoleLogger } from '@angular-devkit/core/node';
 import * as path from 'path';
 import { BuildResult } from './index';
 
-const devkitRoot = (global as any)._DevKitRoot; // tslint:disable-line:no-any
-
 
 describe('Webpack Builder basic test', () => {
   let testArchitectHost: TestingArchitectHost;
@@ -38,7 +36,8 @@ describe('Webpack Builder basic test', () => {
   }
 
   describe('basic app', () => {
-    const workspaceRoot = path.join(devkitRoot, 'tests/angular_devkit/build_webpack/basic-app/');
+    const ngJsonPath = path.join(__dirname, '../../test/basic-app/angular.json');
+    const workspaceRoot = path.dirname(require.resolve(ngJsonPath));
     const outputPath = join(normalize(workspaceRoot), 'dist');
 
     beforeEach(async () => {
@@ -72,15 +71,17 @@ describe('Webpack Builder basic test', () => {
   });
 
   describe('Angular app', () => {
-    const workspaceRoot = path.join(devkitRoot, 'tests/angular_devkit/build_webpack/angular-app/');
-    const outputPath = join(normalize(workspaceRoot), 'dist/');
+    jasmine.DEFAULT_TIMEOUT_INTERVAL = 150000;
+    const ngJsonPath = path.join(__dirname, '../../test/angular-app/angular.json');
+    const workspaceRoot = path.dirname(require.resolve(ngJsonPath));
+    const outputPath = join(normalize(workspaceRoot), 'dist');
 
     beforeEach(async () => {
       await createArchitect(workspaceRoot);
     });
 
     it('works', async () => {
-      const run = await architect.scheduleTarget({ project: 'app', target: 'build-webpack' });
+      const run = await architect.scheduleTarget({ project: 'app', target: 'build-webpack' }, {}, {logger: createConsoleLogger()});
       const output = await run.result;
 
       expect(output.success).toBe(true);

packages/angular_devkit/build_webpack/src/webpack/index_spec_large.ts renamed to packages/angular_devkit/build_webpack/src/webpack/index_spec.ts

@@ -13,13 +13,13 @@
       "schematics": {},
       "targets": {
         "build-webpack": {
-          "builder": "../../../../packages/angular_devkit/build_webpack:webpack",
+          "builder": "../../:webpack",
           "options": {
             "webpackConfig": "webpack.config.js"
           }
         },
         "serve-webpack": {
-          "builder": "../../../../packages/angular_devkit/build_webpack:webpack-dev-server",
+          "builder": "../../:webpack-dev-server",
           "options": {
             "webpackConfig": "webpack.config.js"
           }

tests/angular_devkit/build_webpack/angular-app/angular.json renamed to packages/angular_devkit/build_webpack/test/angular-app/angular.json

@@ -8,7 +8,7 @@ const projectRoot = path.resolve(__dirname, './');
 module.exports = {
   mode: 'development',
   resolve: {
-    extensions: ['.ts', '.js']
+    extensions: ['.ts', '.js'],
   },
   entry: {
     main: path.resolve(projectRoot, './src/main.ts'),
@@ -25,11 +25,9 @@ module.exports = {
   ],
   module: {
     rules: [
-      { test: /\.scss$/, loaders: ['raw-loader', 'sass-loader'] },
       { test: /\.css$/, loader: 'raw-loader' },
       { test: /\.html$/, loader: 'raw-loader' },
-      // require.resolve is required only because of the monorepo structure here.
-      { test: /\.ts$/, loader: require.resolve('@ngtools/webpack') }
+      { test: /\.ts$/, loader: '@ngtools/webpack' },
     ]
   },
   devServer: {

tests/angular_devkit/build_webpack/angular-app/src/app/app.component.css renamed to packages/angular_devkit/build_webpack/test/angular-app/src/app/app.component.css

@@ -1,5 +1,5 @@
 {
-  "$schema": "../../../../packages/angular_devkit/core/src/workspace/workspace-schema.json",
+  "$schema": "../../../core/src/workspace/workspace-schema.json",
   "version": 1,
   "newProjectRoot": "./projects",
   "cli": {},
@@ -13,13 +13,13 @@
       "schematics": {},
       "targets": {
         "build": {
-          "builder": "../../../../packages/angular_devkit/build_webpack:webpack",
+          "builder": "../../:webpack",
           "options": {
             "webpackConfig": "webpack.config.js"
           }
         },
         "serve": {
-          "builder": "../../../../packages/angular_devkit/build_webpack:webpack-dev-server",
+          "builder": "../../:webpack-dev-server",
           "options": {
             "webpackConfig": "webpack.config.js"
           }

tests/angular_devkit/build_webpack/angular-app/src/app/app.component.html renamed to packages/angular_devkit/build_webpack/test/angular-app/src/app/app.component.html

@@ -58,6 +58,7 @@
     "node_modules/**/*",
     "packages/_/devkit/**/*files/**/*",
     "packages/schematics/*/*/*files/**/*",
+    "packages/angular_devkit/*/test/**/*",
     "tmp/**/*",
     "scripts/patches/**/*",
     "tests/**/*",