Fix a CSS bug with the emote menu.

Fix Edge not building properly. It was failing to transpile .jsx files.
Add a dev script for the babel build for Edge. It's just as bad as you'd imagine.
Stop using the env preset for babel builds and instead just use the class transform plugin.
Add logging to Module when discovering modules.

changelog.html

@@ -1,3 +1,14 @@
+<div class="list-header">4.0.0-beta2.13<span>@64fec6b80d1f6a60c263</span> <time datetime="2018-04-11">(2018-04-11)</time></div>
+<ul class="chat-menu-content menu-side-padding">
+		<li>Changed: Only use the ES2015 classes transform for the Edge build as their JS engine seems to get everything else correct.</li>
+	<li>Fixed: Some modules failing to be transpiled for the Edge build causing them to not load.</li>
+</ul>
+
+<div class="list-header">4.0.0-beta2.12<span>@850fac83181587018cdb</span> <time datetime="2018-04-11">(2018-04-11)</time></div>
+<ul class="chat-menu-content menu-side-padding">
+	<li>Fixed: The active tab of the FFZ emote menu beeing poorly indicated without dark mode enabled.</li>
+</ul>
+
 <div class="list-header">4.0.0-beta2.11<span>@850fac83181587018cdb</span> <time datetime="2018-04-11">(2018-04-11)</time></div>
 <ul class="chat-menu-content menu-side-padding">
 	<li>Added: Settings for controlling what data the error reporter sends, as well as an option to turn it off and an example of what data is sent.</li>

jsconfig.json

@@ -12,6 +12,7 @@
 		"module": "es6",
 		"baseUrl": ".",
 		"paths": {
+			"root": ["."],
 			"res": ["res"],
 			"styles": ["styles"],
 			"src": ["src"],

package.json

@@ -7,6 +7,8 @@
   "scripts": {
     "start": "webpack-dev-server --config webpack.web.dev.js",
     "eslint": "eslint \"src/**/*.{js,jsx,vue}\"",
+    "dev": "webpack-dev-server --config webpack.web.dev.js",
+    "dev:babel": "webpack-dev-server --config webpack.web.dev.babel.js",
     "build": "webpack --config webpack.web.prod.js --define process.env.NODE_ENV='production'",
     "build:stats": "webpack --config webpack.web.prod.js --define process.env.NODE_ENV='production' --json > stats.json",
     "build:babel": "webpack --config webpack.web.babel.js --define process.env.NODE_ENV='production'",

src/main.js

@@ -100,7 +100,7 @@ class FrankerFaceZ extends Module {
 FrankerFaceZ.Logger = Logger;
 
 const VER = FrankerFaceZ.version_info = {
-	major: 4, minor: 0, revision: 0, extra: '-beta2.11',
+	major: 4, minor: 0, revision: 0, extra: '-beta2.13',
 	build: __webpack_hash__,
 	toString: () =>
 		`${VER.major}.${VER.minor}.${VER.revision}${VER.extra || ''}${DEBUG ? '-dev' : ''}`

src/modules/main_menu/components/changelog.vue

@@ -17,7 +17,7 @@ export default {
 	props: ['item', 'context'],
 
 	mounted() {
-		this.fetch(`${SERVER}/script/changelog.html`, this.$refs.changes);
+		this.fetch(`${SERVER}/script/changelog.html?_=${Date.now()}`, this.$refs.changes);
 	},
 
 	methods: {

src/sites/twitch-twilight/styles/chat.scss

@@ -60,6 +60,11 @@
 
     .emote-picker__tab {
         border-top: 1px solid transparent;
+
+        &.emote-picker__tab--active,
+        &:hover {
+            border-top-color: #6441a4;
+        }
     }
 
     .whispers-thread .emote-picker-and-button & .emote-picker__tab-content {

src/utilities/events.js

@@ -364,6 +364,7 @@ export class HierarchicalEventEmitter extends EventEmitter {
 	listeners(event) { return super.listeners(this.abs_path(event)) }
 
 	emit(event, ...args) { return super.emit(this.abs_path(event), ...args) }
+	emitUnsafe(event, ...args) { return super.emitUnsafe(this.abs_path(event), ...args) }
 	emitAsync(event, ...args) { return super.emitAsync(this.abs_path(event), ...args) }
 
 	events(include_children) {

src/utilities/module.js

@@ -536,6 +536,13 @@ export class Module extends EventEmitter {
 			try {
 				added[name] = this.register(name, module);
 			} catch(err) {
+				log && log.capture(err, {
+					extra: {
+						module: name,
+						path: raw_path
+					}
+				});
+
 				log && log.warn(err, `Skipping ${raw_path}`);
 			}
 		}

webpack.common.js

@@ -12,6 +12,7 @@ module.exports = {
 		alias: {
 			res: path.resolve(__dirname, 'res/'),
 			styles: path.resolve(__dirname, 'styles/'),
+			root: __dirname,
 			src: path.resolve(__dirname, 'src/'),
 			utilities: path.resolve(__dirname, 'src/utilities/')
 		}

webpack.web.babel.js

@@ -13,13 +13,12 @@ const config = module.exports = merge(common, {
 
 	module: {
 		rules: [{
-			test: /\.js$/,
+			test: /\.jsx?$/,
 			exclude: /node_modules/,
 			use: {
 				loader: 'babel-loader',
 				options: {
-					presets: ['env'],
-					plugins: ['transform-runtime']
+					plugins: ['transform-es2015-classes']
 				}
 			}
 		}]

webpack.web.dev.babel.js

@@ -0,0 +1,40 @@
+/* eslint-disable */
+const path = require('path');
+const merge = require('webpack-merge');
+const dev = require('./webpack.web.dev.js');
+
+const UglifyJSPlugin = require('uglifyjs-webpack-plugin');
+
+/* global module */
+
+module.exports = merge(dev, {
+	module: {
+		rules: [{
+			test: /\.jsx?$/,
+			exclude: /node_modules/,
+			use: {
+				loader: 'babel-loader',
+				options: {
+					cacheDirectory: true,
+					plugins: ['transform-es2015-classes']
+				}
+			}
+		}]
+	},
+
+	plugins: [
+		new UglifyJSPlugin({
+			sourceMap: true,
+			uglifyOptions: {
+				compress: {
+					keep_fnames: true,
+					keep_classnames: true
+				},
+				mangle: {
+					keep_classnames: true,
+					keep_fnames: true
+				}
+			}
+		})
+	]
+});