Add test job to CircleCI (#1235)

* Do not compile contrib when running screenshotter

* Add test job to CircleCI

* Update config.yml

* Fail if PR exists but running on the forked repo

* Update Screenshotter README.md

* Store artifact at the root

* Add CircleCI badge

* Add `codecov` to CircleCI

* Change build directory to `dist`

.circleci/config.yml

@@ -1,23 +1,31 @@
-defaults: &defaults
+checkout_submodule: &checkout_submodule
+  run:
+    name: Checkout submodule
+    command: |
+        git submodule sync
+        git submodule update --init --recursive
+
+npm_cache_key: &npm_cache_key
+  npm-deps-v1-{{ checksum "package.json" }}
+
+restore_npm_cache: &restore_npm_cache
+  restore_cache:
+    keys:
+      - *npm_cache_key
+      - npm-deps-v1-
+
+npm_install: &npm_install
+  run:
+    name: Install npm dependencies
+    command: npm install
+
+screenshotter: &screenshotter
   steps:
     - checkout
-    - run:
+    - *checkout_submodule
-        name: Checkout submodule
-        command: |
-            git submodule sync
-            git submodule update --init --recursive
 
-    - restore_cache:
+    - *restore_npm_cache
-        keys:
+    - *npm_install
-          - npm-deps-{{ checksum "package.json" }}
-          - npm-deps-
-    - run:
-        name: Install npm dependencies
-        command: npm install
-    - save_cache:
-        key: npm-deps-{{ checksum "package.json" }}
-        paths:
-          - node_modules
 
     - run:
         name: Verify screenshots and generate diffs and new screenshots
@@ -32,20 +40,66 @@ defaults: &defaults
 
 version: 2
 jobs:
+  test:
+    docker:
+      - image: circleci/node:6
+    steps:
+      - run:
+          name: Check whether the build is running on the main repository
+          command: |
+              if [[ $CIRCLE_PULL_REQUEST && $CIRCLE_PROJECT_USERNAME != "Khan" ]]; then
+                echo "Please disable CircleCI on your forked repository!"
+                exit 1
+              fi
+
+      - checkout
+      - *checkout_submodule
+
+      - *restore_npm_cache
+      - *npm_install
+      - save_cache:
+          key: *npm_cache_key
+          paths:
+            - node_modules
+
+      - run:
+          name: Run tests
+          command: npm test -- -- --coverage
+      - run:
+          name: Install codecov and upload results
+          command: |
+              sudo npm install -g codecov
+              codecov
+
+      - run:
+          name: Build KaTeX
+          command: npm run build
+
+      - store_artifacts:
+          path: dist/katex.js
+          destination: katex.js
+      - store_artifacts:
+          path: dist/katex.css
+          destination: katex.css
+      - store_artifacts:
+          path: dist/fonts
+          destination: fonts
+
   firefox:
     docker:
       - image: circleci/node:6
       - image: selenium/standalone-firefox:2.48.2
-    <<: *defaults
+    <<: *screenshotter
   chrome:
     docker:
       - image: circleci/node:6
       - image: selenium/standalone-chrome:2.48.2
-    <<: *defaults
+    <<: *screenshotter
 
 workflows:
   version: 2
   screenshotter:
     jobs:
+      - test
       - firefox
       - chrome

README.md

@@ -1,5 +1,6 @@
 # [<img src="https://khan.github.io/KaTeX/katex-logo.svg" width="130" alt="KaTeX">](https://khan.github.io/KaTeX/)
 [![Build Status](https://travis-ci.org/Khan/KaTeX.svg?branch=master)](https://travis-ci.org/Khan/KaTeX)
+[![CircleCI](https://circleci.com/gh/Khan/KaTeX.svg?style=svg)](https://circleci.com/gh/Khan/KaTeX)
 [![codecov](https://codecov.io/gh/Khan/KaTeX/branch/master/graph/badge.svg)](https://codecov.io/gh/Khan/KaTeX)
 [![Join the chat at https://gitter.im/Khan/KaTeX](https://badges.gitter.im/Join%20Chat.svg)](https://gitter.im/Khan/KaTeX?utm_source=badge&utm_medium=badge&utm_campaign=pr-badge&utm_content=badge) [![Greenkeeper badge](https://badges.greenkeeper.io/Khan/KaTeX.svg)](https://greenkeeper.io/)
 ![](https://img.badgesize.io/Khan/KaTeX/v0.10.0-beta/dist/katex.min.js?compression=gzip)

dockers/Screenshotter/README.md

@@ -48,10 +48,9 @@ fashion are well suited for visual inspection, but for exact binary
 comparisons it would be neccessary to carefully set up the environment
 to match the one used by the Docker approach.
 
-You can also verify and generate screenshots online using a CI(continuous
+Screenshots can also be verified and generated by opening a pull request.
-integration) service. Fork the project, enable [CircleCI](https://circleci.com/) on your repository,
+Diffs and generated screenshots are available at the `Artifacts` section
-and push your changes. Diffs and generated screenshots are available at
+of CircleCI builds.
-build artifacts.
 
 ## Choosing the list of test cases
 

dockers/Screenshotter/screenshotter.js

@@ -14,7 +14,7 @@ const firefox = require("selenium-webdriver/firefox");
 
 const webpack = require('webpack');
 const webpackDevServer = require("webpack-dev-server");
-const webpackConfig = require("../../webpack.dev");
+const webpackConfig = require("../../webpack.dev")[0];
 const data = require("../../test/screenshotter/ss_data");
 
 // Change to KaTeX root directory so that webpack (in particular
@@ -162,7 +162,7 @@ function startServer() {
     }
     const port = Math.floor(Math.random() * (maxPort - minPort)) + minPort;
     const compiler = webpack(webpackConfig);
-    const wds = new webpackDevServer(compiler, webpackConfig[0].devServer);
+    const wds = new webpackDevServer(compiler, webpackConfig.devServer);
     const server = wds.listen(port);
     server.once("listening", function() {
         devServer = wds;