Enabled support for both material2 e2e testing but also demo-app and e2e app.

Author: TheLarkInn

addon/ng2/commands/serve.ts

@@ -45,7 +45,7 @@ module.exports = Command.extend({
     { name: 'live-reload-base-url', type: String,                          aliases: ['lrbu'],  description: 'Defaults to baseURL' },
     { name: 'live-reload-port',     type: Number,                          aliases: ['lrp'],   description: '(Defaults to port number within [49152...65535])' },
     { name: 'live-reload-live-css', type: Boolean, default: true,                              description: 'Whether to live reload CSS (default true)' },
-    { name: 'environment',          type: String,  default: 'development', aliases: ['e', { 'dev': 'development' }, { 'prod': 'production' }] },
+    { name: 'environment',          type: String,  default: 'development', aliases: ['e', { 'dev': 'development' }, { 'mat': 'material'},  { 'prod': 'production' }] },
     { name: 'output-path',          type: 'Path',  default: 'dist/',       aliases: ['op', 'out'] },
     { name: 'ssl',                  type: Boolean, default: false },
     { name: 'ssl-key',              type: String,  default: 'ssl/server.key' },

addon/ng2/models/webpack-build-development.ts

@@ -1,5 +1,5 @@
 import { webpackCommonConfig } from '../models';
-import { webpackMaterialConfig } from './webpack-build-material2';
+import { webpackMaterialConfig, webpackMaterialE2EConfig } from './webpack-build-material2';
 import { ngAppResolve } from './webpack-build-utils';
 
 const webpackMerge = require('webpack-merge');
@@ -31,4 +31,5 @@ const devConfigPartial = {
 export const webpackDevConfig = webpackMerge(webpackCommonConfig, devConfigPartial);
 
 export const webpackDevMaterialConfig = webpackMerge(webpackMaterialConfig, devConfigPartial);
-});
+
+export const webpackDevMaterialE2EConfig = webpackMerge(webpackMaterialE2EConfig, devConfigPartial);

addon/ng2/models/webpack-build-material2.ts

@@ -131,3 +131,92 @@ export const webpackMaterialConfig = {
     setImmediate: false
   }
 };
+
+export const webpackMaterialE2EConfig = {
+  devtool: 'inline-source-map',
+  resolve: {
+    extensions: ['', '.webpack.js', '.web.js', '.ts', '.tsx', '.js', '.css', '.scss'],
+    root: ngAppResolve('./'),
+    alias: aliasMap
+  },
+  sassLoader: {
+    includePaths: [
+        // This allows for automatic resolving of @import's for sass for variables.
+        ngAppResolve('./src/core/style')
+    ]
+  },
+  debug: true,
+  context: path.resolve(__dirname, './'),
+  entry: {
+    main: [ngAppResolve('./src/e2e-app/main.ts')],
+    vendor: ngAppResolve('./src/e2e-app/vendor.ts')
+  },
+  output: {
+    path: './dist',
+    filename: '[name].bundle.js'
+  },
+  module: {
+    preLoaders: [
+      {
+        test: /\.js$/,
+        loader: 'source-map-loader',
+        exclude: [
+          ngAppResolve('node_modules/rxjs'),
+          ngAppResolve('node_modules/@angular'),
+        ]
+      }
+    ],
+    ts: {
+      configFileName: ngAppResolve('./src/e2e-app/tsconfig.json')
+    },
+    loaders: [
+      {
+        test: /\.ts$/,
+        loaders: [
+          'ts-loader', 'angular2-template-loader'
+        ],
+        exclude: [/\.(spec|e2e)\.ts$/]
+      },
+      { test: /\.json$/, loader: 'json-loader'},
+      { test: /\.css$/,  loaders: ['raw-loader', 'postcss-loader'] },
+      { test: /\.styl$/, loaders: ['raw-loader', 'postcss-loader', 'stylus-loader'] },
+      { test: /\.less$/, loaders: ['raw-loader', 'postcss-loader', 'less-loader'] },
+      { test: /\.s?css$/, loaders: ['raw-loader', 'postcss-loader', 'sass-loader'] },
+      { test: /\.(jpg|png)$/, loader: 'url-loader?limit=128000'},
+      { test: /\.html$/, loader: 'raw-loader' }
+    ]
+  },
+  plugins: [
+    // new DebugWebpackPlugin({
+    //   // Defaults to ['webpack:*'] which can be VERY noisy, so try to be specific
+    //   // scope: [
+    //   //   'webpack:compiler:*', // include compiler logs
+    //   //   'webpack:plugin:ExamplePlugin' // include a specific plugin's logs
+    //   // ],
+
+    //   // // Inspect the arguments passed to an event
+    //   // // These are triggered on emits
+    //   // listeners: {
+    //   //   'webpack:compiler:run': function(compiler) {
+    //   //     // Read some data out of the compiler
+    //   //   }
+    //   // },
+    //   // Defaults to the compiler's setting
+    //   debug: true
+    // }),
+    new webpack.optimize.CommonsChunkPlugin({name: 'vendor'}),
+    new ForkCheckerPlugin(),
+    new HtmlWebpackPlugin({
+      template: ngAppResolve('./src/e2e-app/index.html'),
+      chunksSortMode: 'dependency'
+    }),
+  ],
+  node: {
+    global: 'window',
+    crypto: 'empty',
+    module: false,
+    clearImmediate: false,
+    setImmediate: false
+  }
+};
+

addon/ng2/models/webpack-build-production.ts

@@ -1,6 +1,6 @@
 import * as webpack from 'webpack';
 import {webpackCommonConfig} from '../models/';
-import { webpackMaterialConfig } from './webpack-build-material2';
+import {webpackMaterialConfig, webpackMaterialE2EConfig} from './webpack-build-material2';
 import {ngAppResolve} from '../models/webpack-build-utils';
 
 const webpackMerge = require('webpack-merge'); // used to merge webpack configs
@@ -11,10 +11,7 @@ const CompressionPlugin = require("compression-webpack-plugin");
 
 
 
-
-export const webpackProdMaterialConfig = webpackMerge(webpackCommonConfig, webpackMaterialConfig);
-
-export const webpackProdConfig = webpackMerge(webpackCommonConfig, {
+export const webpackProdConfigPartial = {
   debug: false,
   devtool: 'source-map',
   output: {
@@ -49,7 +46,7 @@ export const webpackProdConfig = webpackMerge(webpackCommonConfig, {
   tslint: {
     emitErrors: true,
     failOnHint: true,
-    resourcePath: ngAppResolve('./src/demo-app')
+    resourcePath: ngAppResolve('./src')
   },
   htmlLoader: {
     minimize: true,
@@ -70,4 +67,13 @@ export const webpackProdConfig = webpackMerge(webpackCommonConfig, {
     clearImmediate: false,
     setImmediate: false
   }
-});
+};
+
+
+export const webpackProdConfig = webpackMerge(webpackCommonConfig, webpackProdConfigPartial);
+
+// @angular-material custom builds demo-app and e2e
+export const webpackProdMaterialConfig = webpackMerge(webpackMaterialConfig, webpackProdConfigPartial);
+export const webpackProdMaterialE2EConfig = webpackMerge(webpackMaterialE2EConfig, webpackProdConfigPartial);
+
+

addon/ng2/models/webpack-build-vendors.ts

@@ -9,7 +9,7 @@ export const webpackVendorDLLConfig = {
         vendor: [ngAppResolve('./src/vendor.ts')]
     },
     output: {
-        path: path.join(__dirname, "dist", "dll"),
+        path: path.resolve(__dirname, '../models/webpack-dll/')
         filename: "dll.[name].js",
         library: "[name]"
     },

addon/ng2/tasks/serve-webpack.ts

@@ -1,4 +1,4 @@
-import {webpackCommonConfig, webpackOutputOptions, webpackDevMaterialConfig, webpackProdMaterialConfig} from '../models/';
+import {webpackCommonConfig, webpackOutputOptions, webpackDevMaterialConfig, webpackProdMaterialConfig, webpackDevMaterialE2EConfig, webpackDevConfig} from '../models/';
 import {ServeTaskOptions} from '../commands/serve';
 
 const path = require('path');
@@ -16,10 +16,20 @@ let lastHash = null;
 
 module.exports = Task.extend({
   run: (commandOptions: ServeTaskOptions) => {
+    let webpackCompiler: any;
+    if (commandOptions.environment === 'material') {
+      webpackDevMaterialConfig.entry.main.unshift(`webpack-dev-server/client?http://localhost:${commandOptions.port}/`);
+      webpackCompiler = webpack(webpackDevMaterialConfig);
 
-    webpackProdMaterialConfig.entry.main.unshift(`webpack-dev-server/client?http://localhost:${commandOptions.port}/`);
+    } else if (commandOptions.environment === 'e2e') {
+      webpackDevMaterialE2EConfig.entry.main.unshift(`webpack-dev-server/client?http://localhost:${commandOptions.port}/`);
+      webpackCompiler = webpack(webpackDevMaterialE2EConfig);
 
-    const webpackCompiler = webpack(webpackProdMaterialConfig);
+    } else {
+      webpackDevConfig.entry.main.unshift(`webpack-dev-server/client?http://localhost:${commandOptions.port}/`);
+      webpackCompiler = webpack(webpackDevConfig);
+
+    }
 
     webpackCompiler.apply(new ProgressPlugin({
       profile: true,