diff --git a/.babelrc b/.babelrc
new file mode 100644
index 0000000..6da8f49
--- /dev/null
+++ b/.babelrc
@@ -0,0 +1,6 @@
+{
+  "presets": ["es2015"],
+  "plugins": [
+    "add-module-exports"
+  ]
+}
diff --git a/.gitignore b/.gitignore
index 6edd850..a569b2f 100644
--- a/.gitignore
+++ b/.gitignore
@@ -1,2 +1,3 @@
 /node_modules
 npm-debug.log
+/coverage
diff --git a/.travis.yml b/.travis.yml
new file mode 100644
index 0000000..494f845
--- /dev/null
+++ b/.travis.yml
@@ -0,0 +1,17 @@
+# faster builds on new travis setup not using sudo
+sudo: false
+
+language: node_js
+
+node_js:
+  - "5.8"
+
+before_script:
+  - 'export CHROME_BIN=chromium-browser'
+  - 'export DISPLAY=:99.0'
+  - 'sh -e /etc/init.d/xvfb start'
+  - npm install
+
+cache:
+  directories:
+    - node_modules
diff --git a/README.md b/README.md
index 208ec3a..50665ab 100644
--- a/README.md
+++ b/README.md
@@ -1,3 +1,4 @@
+[![Build Status](https://travis-ci.org/dazorni/medium-editor-autofocus.svg?branch=master)](https://travis-ci.org/dazorni/medium-editor-autofocus)
 # medium-editor-autofocus
 
 Autofocus for the medium editor
@@ -5,3 +6,20 @@ Autofocus for the medium editor
 ## Description
 
 This is an extension for the [medium-editor](https://github.com/yabwe/medium-editor). For better user experience it will autofocus the medium-editor at start.
+
+## Build dist files
+
+Compile the es2015 module
+
+```
+npm run build
+
+// npm run build:dev
+// npm run build:prod
+```
+
+## Run tests
+
+```
+npm run test
+```
diff --git a/demo/autofocus.html b/demo/autofocus.html
index 37d095c..955259a 100644
--- a/demo/autofocus.html
+++ b/demo/autofocus.html
@@ -16,7 +16,7 @@ <h2>Gangsta Ispum</h2>
       </div>
     </div>
     <script src="https://cdn.jsdelivr.net/medium-editor/5.21.0/js/medium-editor.min.js"></script>
-    <script src="../src/autofocus.js"></script>
+    <script src="../dist/medium-editor-autofocus.js"></script>
     <script>
       var editor = new MediumEditor('.editable', {
           extensions: {
diff --git a/dist/medium-editor-autofocus.js b/dist/medium-editor-autofocus.js
new file mode 100644
index 0000000..bedaaba
--- /dev/null
+++ b/dist/medium-editor-autofocus.js
@@ -0,0 +1,80 @@
+(function webpackUniversalModuleDefinition(root, factory) {
+	if(typeof exports === 'object' && typeof module === 'object')
+		module.exports = factory();
+	else if(typeof define === 'function' && define.amd)
+		define([], factory);
+	else if(typeof exports === 'object')
+		exports["MediumEditorAutofocus"] = factory();
+	else
+		root["MediumEditorAutofocus"] = factory();
+})(this, function() {
+return /******/ (function(modules) { // webpackBootstrap
+/******/ 	// The module cache
+/******/ 	var installedModules = {};
+
+/******/ 	// The require function
+/******/ 	function __webpack_require__(moduleId) {
+
+/******/ 		// Check if module is in cache
+/******/ 		if(installedModules[moduleId])
+/******/ 			return installedModules[moduleId].exports;
+
+/******/ 		// Create a new module (and put it into the cache)
+/******/ 		var module = installedModules[moduleId] = {
+/******/ 			exports: {},
+/******/ 			id: moduleId,
+/******/ 			loaded: false
+/******/ 		};
+
+/******/ 		// Execute the module function
+/******/ 		modules[moduleId].call(module.exports, module, module.exports, __webpack_require__);
+
+/******/ 		// Flag the module as loaded
+/******/ 		module.loaded = true;
+
+/******/ 		// Return the exports of the module
+/******/ 		return module.exports;
+/******/ 	}
+
+
+/******/ 	// expose the modules object (__webpack_modules__)
+/******/ 	__webpack_require__.m = modules;
+
+/******/ 	// expose the module cache
+/******/ 	__webpack_require__.c = installedModules;
+
+/******/ 	// __webpack_public_path__
+/******/ 	__webpack_require__.p = "";
+
+/******/ 	// Load entry module and return exports
+/******/ 	return __webpack_require__(0);
+/******/ })
+/************************************************************************/
+/******/ ([
+/* 0 */
+/***/ function(module, exports) {
+
+	'use strict';
+
+	Object.defineProperty(exports, "__esModule", {
+	  value: true
+	});
+	var MediumEditorAutofocus = MediumEditor.Extension.extend({
+	  name: 'autofocus',
+
+	  init: function init() {
+	    if (this.getEditorElements().length < 1) {
+	      return;
+	    }
+
+	    this.getEditorElements()[0].focus();
+	  }
+	});
+
+	exports.default = MediumEditorAutofocus;
+	module.exports = exports['default'];
+
+/***/ }
+/******/ ])
+});
+;
\ No newline at end of file
diff --git a/dist/medium-editor-autofocus.min.js b/dist/medium-editor-autofocus.min.js
new file mode 100644
index 0000000..7ee914b
--- /dev/null
+++ b/dist/medium-editor-autofocus.min.js
@@ -0,0 +1,2 @@
+!function(e,t){"object"==typeof exports&&"object"==typeof module?module.exports=t():"function"==typeof define&&define.amd?define([],t):"object"==typeof exports?exports.MediumEditorAutofocus=t():e.MediumEditorAutofocus=t()}(this,function(){return function(e){function t(n){if(o[n])return o[n].exports;var r=o[n]={exports:{},id:n,loaded:!1};return e[n].call(r.exports,r,r.exports,t),r.loaded=!0,r.exports}var o={};return t.m=e,t.c=o,t.p="",t(0)}([function(e,t){"use strict";Object.defineProperty(t,"__esModule",{value:!0});var o=MediumEditor.Extension.extend({name:"autofocus",init:function(){this.getEditorElements().length<1||this.getEditorElements()[0].focus()}});t["default"]=o,e.exports=t["default"]}])});
+//# sourceMappingURL=medium-editor-autofocus.min.js.map
\ No newline at end of file
diff --git a/dist/medium-editor-autofocus.min.js.map b/dist/medium-editor-autofocus.min.js.map
new file mode 100644
index 0000000..77040ea
--- /dev/null
+++ b/dist/medium-editor-autofocus.min.js.map
@@ -0,0 +1 @@
+{"version":3,"sources":["webpack:///webpack/universalModuleDefinition","webpack:///medium-editor-autofocus.min.js","webpack:///webpack/bootstrap 8cc150c39ba11dd11404","webpack:///./src/Plugin.js"],"names":["root","factory","exports","module","define","amd","this","modules","__webpack_require__","moduleId","installedModules","id","loaded","call","m","c","p","Object","defineProperty","value","MediumEditorAutofocus","MediumEditor","Extension","extend","name","init","getEditorElements","length","focus"],"mappings":"CAAA,SAAAA,EAAAC,GACA,gBAAAC,UAAA,gBAAAC,QACAA,OAAAD,QAAAD,IACA,kBAAAG,gBAAAC,IACAD,UAAAH,GACA,gBAAAC,SACAA,QAAA,sBAAAD,IAEAD,EAAA,sBAAAC,KACCK,KAAA,WACD,MCAgB,UAAUC,GCN1B,QAAAC,GAAAC,GAGA,GAAAC,EAAAD,GACA,MAAAC,GAAAD,GAAAP,OAGA,IAAAC,GAAAO,EAAAD,IACAP,WACAS,GAAAF,EACAG,QAAA,EAUA,OANAL,GAAAE,GAAAI,KAAAV,EAAAD,QAAAC,IAAAD,QAAAM,GAGAL,EAAAS,QAAA,EAGAT,EAAAD,QAvBA,GAAAQ,KAqCA,OATAF,GAAAM,EAAAP,EAGAC,EAAAO,EAAAL,EAGAF,EAAAQ,EAAA,GAGAR,EAAA,KDgBM,SAASL,EAAQD,GAEtB,YAEAe,QAAOC,eAAehB,EAAS,cAC7BiB,OAAO,GE3DV,IAAMC,GAAwBC,aAAaC,UAAUC,QACnDC,KAAM,YAENC,KAH0D,WAIpDnB,KAAKoB,oBAAoBC,OAAS,GAItCrB,KAAKoB,oBAAoB,GAAGE,UFiE/B1B,cE7DckB,EF8DdjB,EAAOD,QAAUA,EAAQ","file":"medium-editor-autofocus.min.js","sourcesContent":["(function webpackUniversalModuleDefinition(root, factory) {\n\tif(typeof exports === 'object' && typeof module === 'object')\n\t\tmodule.exports = factory();\n\telse if(typeof define === 'function' && define.amd)\n\t\tdefine([], factory);\n\telse if(typeof exports === 'object')\n\t\texports[\"MediumEditorAutofocus\"] = factory();\n\telse\n\t\troot[\"MediumEditorAutofocus\"] = factory();\n})(this, function() {\nreturn \n\n\n/** WEBPACK FOOTER **\n ** webpack/universalModuleDefinition\n **/","(function webpackUniversalModuleDefinition(root, factory) {\n\tif(typeof exports === 'object' && typeof module === 'object')\n\t\tmodule.exports = factory();\n\telse if(typeof define === 'function' && define.amd)\n\t\tdefine([], factory);\n\telse if(typeof exports === 'object')\n\t\texports[\"MediumEditorAutofocus\"] = factory();\n\telse\n\t\troot[\"MediumEditorAutofocus\"] = factory();\n})(this, function() {\nreturn /******/ (function(modules) { // webpackBootstrap\n/******/ \t// The module cache\n/******/ \tvar installedModules = {};\n/******/\n/******/ \t// The require function\n/******/ \tfunction __webpack_require__(moduleId) {\n/******/\n/******/ \t\t// Check if module is in cache\n/******/ \t\tif(installedModules[moduleId])\n/******/ \t\t\treturn installedModules[moduleId].exports;\n/******/\n/******/ \t\t// Create a new module (and put it into the cache)\n/******/ \t\tvar module = installedModules[moduleId] = {\n/******/ \t\t\texports: {},\n/******/ \t\t\tid: moduleId,\n/******/ \t\t\tloaded: false\n/******/ \t\t};\n/******/\n/******/ \t\t// Execute the module function\n/******/ \t\tmodules[moduleId].call(module.exports, module, module.exports, __webpack_require__);\n/******/\n/******/ \t\t// Flag the module as loaded\n/******/ \t\tmodule.loaded = true;\n/******/\n/******/ \t\t// Return the exports of the module\n/******/ \t\treturn module.exports;\n/******/ \t}\n/******/\n/******/\n/******/ \t// expose the modules object (__webpack_modules__)\n/******/ \t__webpack_require__.m = modules;\n/******/\n/******/ \t// expose the module cache\n/******/ \t__webpack_require__.c = installedModules;\n/******/\n/******/ \t// __webpack_public_path__\n/******/ \t__webpack_require__.p = \"\";\n/******/\n/******/ \t// Load entry module and return exports\n/******/ \treturn __webpack_require__(0);\n/******/ })\n/************************************************************************/\n/******/ ([\n/* 0 */\n/***/ function(module, exports) {\n\n\t'use strict';\n\t\n\tObject.defineProperty(exports, \"__esModule\", {\n\t  value: true\n\t});\n\tvar MediumEditorAutofocus = MediumEditor.Extension.extend({\n\t  name: 'autofocus',\n\t\n\t  init: function init() {\n\t    if (this.getEditorElements().length < 1) {\n\t      return;\n\t    }\n\t\n\t    this.getEditorElements()[0].focus();\n\t  }\n\t});\n\t\n\texports.default = MediumEditorAutofocus;\n\tmodule.exports = exports['default'];\n\n/***/ }\n/******/ ])\n});\n;\n\n\n/** WEBPACK FOOTER **\n ** medium-editor-autofocus.min.js\n **/"," \t// The module cache\n \tvar installedModules = {};\n\n \t// The require function\n \tfunction __webpack_require__(moduleId) {\n\n \t\t// Check if module is in cache\n \t\tif(installedModules[moduleId])\n \t\t\treturn installedModules[moduleId].exports;\n\n \t\t// Create a new module (and put it into the cache)\n \t\tvar module = installedModules[moduleId] = {\n \t\t\texports: {},\n \t\t\tid: moduleId,\n \t\t\tloaded: false\n \t\t};\n\n \t\t// Execute the module function\n \t\tmodules[moduleId].call(module.exports, module, module.exports, __webpack_require__);\n\n \t\t// Flag the module as loaded\n \t\tmodule.loaded = true;\n\n \t\t// Return the exports of the module\n \t\treturn module.exports;\n \t}\n\n\n \t// expose the modules object (__webpack_modules__)\n \t__webpack_require__.m = modules;\n\n \t// expose the module cache\n \t__webpack_require__.c = installedModules;\n\n \t// __webpack_public_path__\n \t__webpack_require__.p = \"\";\n\n \t// Load entry module and return exports\n \treturn __webpack_require__(0);\n\n\n\n/** WEBPACK FOOTER **\n ** webpack/bootstrap 8cc150c39ba11dd11404\n **/","const MediumEditorAutofocus = MediumEditor.Extension.extend({\n  name: 'autofocus',\n\n  init() {\n    if (this.getEditorElements().length < 1) {\n      return;\n    }\n\n    this.getEditorElements()[0].focus();\n  }\n});\n\nexport default MediumEditorAutofocus;\n\n\n\n/** WEBPACK FOOTER **\n ** ./src/Plugin.js\n **/"],"sourceRoot":""}
\ No newline at end of file
diff --git a/karma.conf.js b/karma.conf.js
new file mode 100644
index 0000000..3e1e4be
--- /dev/null
+++ b/karma.conf.js
@@ -0,0 +1,114 @@
+// Karma configuration
+// Generated on Thu Aug 18 2016 14:36:57 GMT+0200 (CEST)
+var path = require('path');
+
+module.exports = function(config) {
+  config.set({
+
+    // base path that will be used to resolve all patterns (eg. files, exclude)
+    basePath: '',
+
+
+    // frameworks to use
+    // available frameworks: https://npmjs.org/browse/keyword/karma-adapter
+    frameworks: ['jasmine'],
+
+
+    // list of files / patterns to load in the browser
+    files: [
+      'node_modules/medium-editor/dist/js/medium-editor.js',
+      'tests.webpack.js'
+    ],
+
+
+    // list of files to exclude
+    exclude: [
+      '**/*.swp'
+    ],
+
+    // webpack configuration
+		webpack: {
+			cache: true,
+			devtool: 'inline-source-map',
+			module: {
+				preLoaders: [
+					{
+						test: /-test\.js$/,
+						include: /test/,
+						exclude: /(node_modules)/,
+						loader: 'babel',
+						query: {
+								cacheDirectory: true,
+						},
+					},
+				],
+				loaders: [
+					{
+						test: /\.js$/,
+						include: /src/,
+						exclude: /(node_modules)/,
+						loader: 'babel',
+						query: {
+								cacheDirectory: true,
+						},
+					},
+				],
+			},
+		},
+
+    // preprocess matching files before serving them to the browser
+    // available preprocessors: https://npmjs.org/browse/keyword/karma-preprocessor
+    preprocessors: {
+      'tests.webpack.js': ['webpack', 'sourcemap']
+    },
+
+
+    // test results reporter to use
+    // possible values: 'dots', 'progress'
+    // available reporters: https://npmjs.org/browse/keyword/karma-reporter
+    reporters: ['progress', 'coverage'],
+
+
+    // web server port
+    port: 9876,
+
+
+    // enable / disable colors in the output (reporters and logs)
+    colors: true,
+
+
+    // level of logging
+    // possible values: config.LOG_DISABLE || config.LOG_ERROR || config.LOG_WARN || config.LOG_INFO || config.LOG_DEBUG
+    logLevel: config.LOG_INFO,
+
+
+    // enable / disable watching file and executing tests whenever any file changes
+    autoWatch: false,
+
+
+    // start these browsers
+    // available browser launchers: https://npmjs.org/browse/keyword/karma-launcher
+    browsers: ['Chrome'],
+
+		// custom launcher for travis
+		customLaunchers: {
+			Chrome_travis_ci: {
+				base: 'Chrome',
+				flags: ['--no-sandbox']
+			}
+		},
+
+
+    // Continuous Integration mode
+    // if true, Karma captures browsers, runs the tests and exits
+    singleRun: false,
+
+    // Concurrency level
+    // how many browser should be started simultaneous
+    concurrency: Infinity
+  });
+
+  if (process.env.TRAVIS) {
+    config.browsers = ['Chrome_travis_ci'];
+  }
+}
diff --git a/package.json b/package.json
index d7a4e55..1103ccf 100644
--- a/package.json
+++ b/package.json
@@ -1,11 +1,37 @@
 {
   "name": "medium-editor-autofocus",
-  "version": "0.1.3",
+  "version": "0.2.0",
   "description": "Autofocus plugin for medium-editor",
-  "main": "src/autofocus.js",
+  "main": "dist/autofocus.js",
   "license": "GPL-3.0",
+  "scripts": {
+    "build": "npm run build:dev && npm run build:prod",
+    "build:dev": "webpack src/Plugin.js dist/medium-editor-autofocus.js --config ./webpack.config.dev.js --progress --colors",
+    "build:prod": "webpack src/Plugin.js dist/medium-editor-autofocus.min.js --config ./webpack.config.prod.js --progress --colors",
+    "test": "karma start --single-run --not-auto-watch karma.config.js"
+  },
   "dependencies": {},
-  "devDependencies": {},
+  "devDependencies": {
+    "babel-cli": "^6.11.4",
+    "babel-core": "^6.13.2",
+    "babel-loader": "^6.2.5",
+    "babel-plugin-add-module-exports": "^0.2.1",
+    "babel-plugin-transform-es2015-modules-umd": "^6.12.0",
+    "babel-preset-es2015": "^6.13.2",
+    "jasmine-core": "^2.4.1",
+    "karma": "^1.2.0",
+    "karma-chrome-launcher": "^1.0.1",
+    "karma-coverage": "^1.1.1",
+    "karma-jasmine": "^1.0.2",
+    "karma-sourcemap-loader": "^0.3.7",
+    "karma-webpack": "^1.8.0",
+    "loader-utils": "^0.2.15",
+    "medium-editor": "^5.21.1",
+    "webpack": "^1.13.2"
+  },
+  "peerDependencies": {
+    "medium-editor": "^5.21.1"
+  },
   "repository": {
     "type": "git",
     "url": "git+https://github.com/dazorni/medium-editor-autofocus.git"
diff --git a/src/Plugin.js b/src/Plugin.js
new file mode 100644
index 0000000..8856ad0
--- /dev/null
+++ b/src/Plugin.js
@@ -0,0 +1,13 @@
+const MediumEditorAutofocus = MediumEditor.Extension.extend({
+  name: 'autofocus',
+
+  init() {
+    if (this.getEditorElements().length < 1) {
+      return;
+    }
+
+    this.getEditorElements()[0].focus();
+  }
+});
+
+export default MediumEditorAutofocus;
diff --git a/src/autofocus.js b/src/autofocus.js
deleted file mode 100644
index 98e5633..0000000
--- a/src/autofocus.js
+++ /dev/null
@@ -1,28 +0,0 @@
-'use strict';
-
-(function (root, factory) {
-    if (typeof module === 'object') {
-        module.exports = factory;
-    } else if (typeof define === 'function' && define.amd) {
-        define(factory);
-    } else {
-        root.MediumEditorAutofocus = factory;
-    }
-}(this, function (MediumEditor) {
-
-  var MediumEditorAutofocus = MediumEditor.Extension.extend({
-    name: 'autofocus',
-
-    init: function () {
-      if (this.getEditorElements().length < 1) {
-        return;
-      }
-
-      this.getEditorElements()[0].focus();
-    }
-  });
-
-  return MediumEditorAutofocus;
-
-}(typeof require === 'function' ? require('medium-editor') : MediumEditor)));
-
diff --git a/test/Plugin-test.js b/test/Plugin-test.js
new file mode 100644
index 0000000..be2e41a
--- /dev/null
+++ b/test/Plugin-test.js
@@ -0,0 +1,29 @@
+import MediumEditorAutofocus from '../src/Plugin';
+
+describe('Plugin', () => {
+	let container, editor, plugin;
+
+	beforeEach(() => {
+		container = document.createElement('div');
+		container.classList.add('editable');
+		document.body.appendChild(container);
+	});
+
+	afterEach(() => {
+		editor.destroy();
+	});
+
+	it('Simple init should not fail', () => {
+    expect(document.activeElement.classList.contains('editable')).toBe(false);
+
+		plugin = new MediumEditorAutofocus();
+		editor = new MediumEditor('.editable', {
+			extensions: {
+				insert: plugin
+			}
+		 });
+
+    expect(document.activeElement.classList.contains('editable')).toBe(true);
+	});
+});
+
diff --git a/tests.webpack.js b/tests.webpack.js
new file mode 100644
index 0000000..04e653a
--- /dev/null
+++ b/tests.webpack.js
@@ -0,0 +1,5 @@
+var testsContext = require.context('./test', true, /-test\.js$/);
+testsContext.keys().forEach(testsContext);
+
+var srcContext = require.context('./src', true, /^((?!__tests__).)*.js$/);
+srcContext.keys().forEach(srcContext);
diff --git a/webpack.config.base.js b/webpack.config.base.js
new file mode 100644
index 0000000..7722045
--- /dev/null
+++ b/webpack.config.base.js
@@ -0,0 +1,20 @@
+module.exports = {
+    module: {
+        loaders: [{
+            test: /\.js$/,
+            exclude: /(node_modules)/,
+            loader: 'babel'
+        }]
+    },
+    output: {
+        library: 'MediumEditorAutofocus',
+        libraryTarget: 'umd'
+    },
+    resolve: {
+        extensions: [
+            '',
+            '.js'
+        ]
+    }
+};
+
diff --git a/webpack.config.dev.js b/webpack.config.dev.js
new file mode 100644
index 0000000..d9d4fd6
--- /dev/null
+++ b/webpack.config.dev.js
@@ -0,0 +1,14 @@
+var webpack = require('webpack');
+var baseConfig = require('./webpack.config.base.js');
+
+var config = Object.create(baseConfig);
+// config.devtool = 'eval-source-map';
+config.plugins = [
+  new webpack.optimize.OccurenceOrderPlugin(),
+  new webpack.DefinePlugin({
+    'process.env.NODE_ENV': JSON.stringify('development'),
+  })
+];
+
+module.exports = config;
+
diff --git a/webpack.config.prod.js b/webpack.config.prod.js
new file mode 100644
index 0000000..9e559e1
--- /dev/null
+++ b/webpack.config.prod.js
@@ -0,0 +1,17 @@
+var webpack = require('webpack');
+var baseConfig = require('./webpack.config.base.js');
+
+var config = Object.create(baseConfig);
+config.devtool = 'source-map';
+config.plugins = [
+    new webpack.optimize.OccurenceOrderPlugin(),
+    new webpack.DefinePlugin({
+        'process.env.NODE_ENV': JSON.stringify('production'),
+    }),
+    new webpack.optimize.UglifyJsPlugin({
+        compressor: { warnings: false },
+    })
+];
+
+module.exports = config;
+