From f6bcd061162bf01352169439d3e2fa0577179bb0 Mon Sep 17 00:00:00 2001
From: Lucas Wojciechowski <lucas@lucaswoj.com>
Date: Wed, 3 Aug 2016 14:03:40 -0700
Subject: [PATCH] Fix webpack support (#2887)

* Deanonymize worker factory function

There is a known caveat with workerify-webpack which can result in
errors in some webpack environments; the worker function passed to
workerify should not be anonymous.

This one-line change names the function 'MapboxGlWorker' and resolves
the issue.

* Improve webpack example configuration docs

Adds a note about avoiding 'eval'-related devtool settings in webpack
configurations, which can result in errors with workerify-webpack.

* Add webpack build test

* Rename MapboxGlWorker to createWorker

* Further clarify webworkify-webpack caveats
---
 ci.sh                      |  2 +-
 js/source/worker.js        |  2 +-
 package.json               |  9 +++++++--
 test/build/webpack.test.js | 27 +++++++++++++++++++++++++++
 webpack.config.example.js  |  7 ++++++-
 5 files changed, 42 insertions(+), 5 deletions(-)
 create mode 100644 test/build/webpack.test.js

diff --git a/ci.sh b/ci.sh
index c2adabb9482..6da584037c4 100755
--- a/ci.sh
+++ b/ci.sh
@@ -17,7 +17,7 @@ npm run build-min
 npm run build-dev
 
 # run unit tests
-tap --reporter dot --coverage --no-coverage-report test/js/*/*.js
+tap --reporter dot --coverage --no-coverage-report test/js/*/*.js test/build/webpack.test.js
 
 # allow writing core files for render tests
 ulimit -c unlimited -S
diff --git a/js/source/worker.js b/js/source/worker.js
index 5aeebfd3464..841984379d6 100644
--- a/js/source/worker.js
+++ b/js/source/worker.js
@@ -7,7 +7,7 @@ var util = require('../util/util');
 var VectorTileWorkerSource = require('./vector_tile_worker_source');
 var GeoJSONWorkerSource = require('./geojson_worker_source');
 
-module.exports = function(self) {
+module.exports = function createWorker(self) {
     return new Worker(self);
 };
 
diff --git a/package.json b/package.json
index 57fb02f6c59..c6fda13570f 100644
--- a/package.json
+++ b/package.json
@@ -56,8 +56,10 @@
     "handlebars": "4.0.5",
     "highlight.js": "9.3.0",
     "istanbul": "^0.4.2",
+    "json-loader": "^0.5.4",
     "lodash": "^4.13.1",
     "mapbox-gl-test-suite": "mapbox/mapbox-gl-test-suite#df624912cd514b89dc4405b233fc25db85bbb8b7",
+    "memory-fs": "^0.3.0",
     "minifyify": "^7.0.1",
     "nyc": "6.4.0",
     "proxyquire": "^1.7.9",
@@ -67,10 +69,13 @@
     "st": "^1.0.0",
     "tap": "^5.7.0",
     "through": "^2.3.7",
+    "transform-loader": "^0.2.3",
     "unist-util-visit": "1.1.0",
     "vinyl": "1.1.1",
     "vinyl-fs": "2.4.3",
-    "watchify": "^3.2.2"
+    "watchify": "^3.2.2",
+    "webpack": "^1.13.1",
+    "webworkify-webpack": "^1.1.3"
   },
   "browserify": {
     "transform": [
@@ -95,6 +100,6 @@
     "start-docs": "npm run build-min && npm run build-docs && jekyll serve -w",
     "start": "node server.js",
     "test-suite": "node test/render.test.js && node test/query.test.js",
-    "test": "npm run lint && tap --reporter dot test/js/*/*.js"
+    "test": "npm run lint && tap --reporter dot test/js/*/*.js test/build/webpack.test.js"
   }
 }
diff --git a/test/build/webpack.test.js b/test/build/webpack.test.js
new file mode 100644
index 00000000000..6a6d505efc3
--- /dev/null
+++ b/test/build/webpack.test.js
@@ -0,0 +1,27 @@
+'use strict';
+
+var webpack = require("webpack");
+var test = require('tap').test;
+var MemoryFS = require('memory-fs');
+var util = require('../../js/util/util');
+
+test('builds with webpack', function(t) {
+
+    var compiler = webpack(util.extend(require('../../webpack.config.example'), {
+        entry: './js/mapbox-gl.js',
+        output: {
+            path: '/',
+            filename: 'webpack.js'
+        }
+    }));
+
+    compiler.outputFileSystem = new MemoryFS();
+    compiler.run(function(error, stats) {
+        t.error(error);
+        t.notOk(stats.hasErrors());
+        t.notOk(stats.hasWarnings());
+        t.ok(compiler.outputFileSystem.readFileSync('/webpack.js').toString());
+        t.end();
+    });
+
+});
diff --git a/webpack.config.example.js b/webpack.config.example.js
index 04d8b843285..ee11d04f9d8 100644
--- a/webpack.config.example.js
+++ b/webpack.config.example.js
@@ -59,5 +59,10 @@ module.exports = {
             loader: 'transform',
             query: 'brfs'
         }]
-    }
+    },
+
+    // You may use any "devtool" except "eval" and "eval-source-map" due to
+    // a "webworkify-webpack" caveat. 
+    // See https://github.com/borisirota/webworkify-webpack#caveats
+    devtool: 'cheap-source-map'
 }