Configure frontend tests (#1293)

While working on #1288 I configured frontend tests. I'm going in a different direction with that, though it seems worth keeping the test configuration. I added tests for one of the helper methods.

.travis.yml

@@ -16,7 +16,8 @@ before_script:
 
 script:
   - npm run lint
-  - npm run test:js
+  - npm run test:js:server
+  - if node_modules/.bin/check-node-version --node '< 8.0' > /dev/null; then echo "Skipping frontend tests."; else npm run test:js:frontend; fi
   - if node_modules/.bin/check-node-version --node '< 8.0' > /dev/null; then echo "Skipping build."; else BASE_URL=/ npm run build; fi
 
 jobs:

frontend/lib/static-badge-uri.spec.js

@@ -0,0 +1,17 @@
+import { test, given } from 'sazerac';
+import { encodeField, default as staticBadgeUri } from './static-badge-uri';
+
+describe('Static badge URI generator', function() {
+  test(encodeField, () => {
+    given('foo').expect('foo');
+    given('').expect('');
+    given('happy go lucky').expect('happy%20go%20lucky');
+    given('do-right').expect('do--right');
+    given('it_is_a_snake').expect('it__is__a__snake');
+  });
+
+  test(staticBadgeUri, () => {
+    given('http://img.example.com', 'foo', 'bar', 'blue', { style: 'plastic'})
+      .expect('http://img.example.com/badge/foo-bar-blue.svg?style=plastic');
+  });
+});

package.json

@@ -47,12 +47,13 @@
     "coverage:report:reopen": "opn coverage/lcov-report/index.html",
     "coverage:report:open": "npm run coverage:report && npm run coverage:report:reopen",
     "lint": "eslint '**/*.js'",
-    "test:js": "mocha '*.spec.js' 'lib/**/*.spec.js'",
+    "test:js:frontend": "mocha --require babel-polyfill --require babel-register 'frontend/**/*.spec.js'",
+    "test:js:server": "mocha '*.spec.js' 'lib/**/*.spec.js'",
     "test:services": "mocha --delay service-tests/runner/cli.js",
     "test:services:pr:prepare": "node service-tests/runner/pull-request-services-cli.js > pull-request-services.log",
     "test:services:pr:run": "mocha --delay service-tests/runner/cli.js --stdin < pull-request-services.log",
     "test:services:pr": "npm run test:services:pr:prepare && npm run test:services:pr:run",
-    "test": "npm run lint && npm run test:js",
+    "test": "npm run lint && npm run test:js:frontend && npm run test:js:server",
     "frontend-depcheck": "check-node-version --node '>= 8.0'",
     "server-depcheck": "check-node-version --node '>= 6.0 < 9.0'",
     "postinstall": "npm run server-depcheck",
@@ -81,6 +82,8 @@
   "devDependencies": {
     "@mapbox/react-click-to-select": "^2.0.1",
     "babel-eslint": "^8.0.2",
+    "babel-polyfill": "^6.26.0",
+    "babel-preset-env": "^1.6.1",
     "check-node-version": "^3.1.0",
     "child-process-promise": "^2.2.1",
     "classnames": "^2.2.5",
@@ -130,5 +133,14 @@
   "engines": {
     "node": "8.x",
     "npm": "5.x"
+  },
+  "babel": {
+    "presets": [
+      "next/babel",
+      "env"
+    ],
+    "plugins": [
+      "transform-class-properties"
+    ]
   }
 }