Add karma based testing

.travis.yml

@@ -7,6 +7,9 @@ node_js:
   - "6.1"
 before_script:
   - npm install -g eslint eslint-plugin-react
+  # prepare firefox
+  - export DISPLAY=:99.0
+  - sh -e /etc/init.d/xvfb start
 install:
   - npm install
 script:

karma.conf.js

@@ -0,0 +1,29 @@
+var webpackConfig = require('./webpack.config.js');
+
+// Karma configuration
+module.exports = function(config) {
+  config.set({
+		browsers: [ 'Chrome' ], //run in Chrome
+		frameworks: [ 'mocha' ], //use the mocha test framework
+    // ... normal karma configuration
+    files: [
+      // all files ending in "_test"
+      {pattern: 'test/*_test.js', watched: false},
+      {pattern: 'test/**/*_test.js', watched: false}
+      // each file acts as entry point for the webpack configuration
+    ],
+
+    preprocessors: {
+      // add webpack as preprocessor
+      'test/*_test.js': ['webpack'],
+      'test/**/*_test.js': ['webpack']
+    },
+
+    webpack: webpackConfig,
+    webpackMiddleware: {
+      // webpack-dev-middleware configuration
+      // i. e.
+      stats: 'errors-only'
+    }
+  });
+};

package.json

@@ -6,8 +6,10 @@
   "scripts": {
     "stats": "webpack --config webpack.production.config.js --profile --json > stats.json",
     "build": "webpack --config webpack.production.config.js --progress --profile --colors",
+    "test": "karma start --single-run",
+    "test-watch": "karma start",
     "start": "webpack-dev-server --progress --profile --colors",
-    "lint": "eslint --ext js --ext jsx src"
+    "lint": "eslint --ext js --ext jsx {src,test}"
   },
   "repository": {
     "type": "git",
@@ -68,8 +70,6 @@
     }
   },
   "devDependencies": {
-    "sass-loader": "^4.0.1",
-    "node-sass": "^3.9.2",
     "babel-core": "6.14.0",
     "babel-eslint": "^6.1.2",
     "babel-loader": "6.2.4",
@@ -87,7 +87,11 @@
     "file-loader": "0.9.0",
     "html-webpack-plugin": "^2.22.0",
     "json-loader": "^0.5.4",
+    "karma": "^1.3.0",
+    "karma-webpack": "^1.8.0",
+    "node-sass": "^3.9.2",
     "react-hot-loader": "1.3.0",
+    "sass-loader": "^4.0.1",
     "style-loader": "0.13.1",
     "transform-loader": "^0.2.3",
     "url-loader": "0.5.7",

test/stylestore_test.js

@@ -0,0 +1,16 @@
+import { SettingsStore } from '../src/stylestore.js'
+import assert from 'assert'
+
+describe('SettingsStore', () => {
+  const store = new SettingsStore()
+
+	it('#get should return access token from local storage', () => {
+		window.localStorage.setItem('maputnik:access_token', 'OLD_TOKEN')
+		assert.equal(store.accessToken, 'OLD_TOKEN')
+	})
+
+	it('#set should set access token in local storage', () => {
+		store.accessToken = 'NEW_TOKEN'
+		assert.equal(window.localStorage.getItem('maputnik:access_token'), 'NEW_TOKEN')
+	})
+})

webpack.config.js

@@ -34,6 +34,7 @@ loaders.push({
 });
 
 module.exports = {
+	target: 'web',
 	entry: [
 		`webpack-dev-server/client?http://${HOST}:${PORT}`,
 		`webpack/hot/only-dev-server`,