Bug 1390815 - Fix console launchpad. r=bgrins,Honza,jdescottes

This updates devtools-launchpad to 0.0.96, and thus
makes the console launchpad uses Webpack 3.
Because of this version bump, the console launchpad
config needed some adjustments to keep working:
- Replace loaders with rules
- Pass the babelExclude property in the option argument for launchpad config
- Change the name of the svg filter to exclude
- Add a workaround "raw!" required-files (remove the "raw!" prefix in a loader).

An alias needed to be added as well for devtools/shim/locales.

MozReview-Commit-ID: 3cWXYw6gNc7

--HG--
extra : rebase_source : 5c651ca9e2b1d3061450965046222e3d1a7a5065

devtools/client/webconsole/package.json

@@ -16,8 +16,8 @@
     "babel-register": "^6.24.0",
     "cross-env": "^3.1.3",
     "devtools-config": "0.0.12",
-    "devtools-launchpad": "0.0.67",
-    "devtools-modules": "0.0.28",
+    "devtools-launchpad": "0.0.96",
+    "devtools-modules": "0.0.31",
     "enzyme": "^2.4.1",
     "expect": "^1.16.0",
     "file-loader": "^0.10.1",

devtools/client/webconsole/webpack.config.js

@@ -20,11 +20,30 @@ let webpackConfig = {
   },
 
   module: {
-    loaders: [
+    rules: [
       {
         test: /\.(png|svg)$/,
         loader: "file-loader?name=[path][name].[ext]",
       },
+      {
+        /*
+         * The version of webpack used in the launchpad seems to have trouble
+         * with the require("raw!${file}") that we use for the properties
+         * file in l10.js.
+         * This loader goes through the whole code and remove the "raw!" prefix
+         * so the raw-loader declared in devtools-launchpad config can load
+         * those files.
+         */
+        test: /\.js/,
+        loader: "rewrite-raw",
+      },
+    ]
+  },
+
+  resolveLoader: {
+    modules: [
+      path.resolve("./node_modules"),
+      path.resolve("./webpack"),
     ]
   },
 
@@ -61,6 +80,7 @@ webpackConfig.resolve = {
     "devtools/client/locales": path.join(__dirname, "../../client/locales/en-US"),
     "toolkit/locales": path.join(__dirname, "../../../toolkit/locales/en-US"),
     "devtools/shared/locales": path.join(__dirname, "../../shared/locales/en-US"),
+    "devtools/shim/locales": path.join(__dirname, "../../shared/locales/en-US"),
     "devtools/shared/plural-form": path.join(__dirname, "../../shared/plural-form"),
     "devtools/shared/l10n": path.join(__dirname, "../../shared/l10n"),
     "devtools/shared/system": path.join(projectPath, "system-stub"),
@@ -116,19 +136,18 @@ const mappings = [
 webpackConfig.plugins = mappings.map(([regex, res]) =>
   new NormalModuleReplacementPlugin(regex, res));
 
-// Exclude to transpile all scripts in devtools/ but not for this folder
 const basePath = path.join(__dirname, "../../").replace(/\\/g, "\\\\");
 const baseName = path.basename(__dirname);
-webpackConfig.babelExcludes = new RegExp(`^${basePath}(.(?!${baseName}))*$`);
 
-let config = toolboxConfig(webpackConfig, getConfig());
+let config = toolboxConfig(webpackConfig, getConfig(), {
+  // Exclude to transpile all scripts in devtools/ but not for this folder
+  babelExcludes: new RegExp(`^${basePath}(.(?!${baseName}))*$`)
+});
 
 // Remove loaders from devtools-launchpad's webpack.config.js
 // * For svg-inline loader:
-//   Webconsole uses file loader to bundle image assets instead of svg-inline loader
-// * For raw loader:
-//   devtools/shared/l10n has preloaded raw loader in require.context
-config.module.loaders = config.module.loaders
-  .filter((loader) => !["svg-inline", "raw"].includes(loader.loader));
+//   Webconsole uses file loader to bundle image assets instead of svg-inline-loader
+config.module.rules = config.module.rules
+  .filter((rule) => !["svg-inline-loader"].includes(rule.loader));
 
 module.exports = config;

devtools/client/webconsole/webpack/rewrite-raw.js

@@ -0,0 +1,12 @@
+/* This Source Code Form is subject to the terms of the Mozilla Public
+ * License, v. 2.0. If a copy of the MPL was not distributed with this
+ * file, You can obtain one at http://mozilla.org/MPL/2.0/. */
+
+// Remove the "raw!" prefix used in some require which confuses webpack.
+
+"use strict";
+
+module.exports = function (content) {
+  this.cacheable && this.cacheable();
+  return content.replace(/raw\!/g, "");
+};