get npm test working (#762)

2016-07-14 19:50:47 -07:00 · 2016-07-14 19:50:47 -07:00 · 24e85f52b4
parent 1fed498e33
commit 24e85f52b4
7 changed files with 136 additions and 58 deletions
--- a/caravel/assets/.babelrc
+++ b/caravel/assets/.babelrc
@ -1,3 +1,3 @@
 {
-  "presets" : ["es2015", "react"]
+  "presets" : ["airbnb", "es2015", "react"]
 }
--- a/caravel/assets/javascripts/explore/components/QueryAndSaveBtns.jsx
+++ b/caravel/assets/javascripts/explore/components/QueryAndSaveBtns.jsx
@ -6,28 +6,25 @@ const propTypes = {
  onQuery: PropTypes.func.isRequired,
 };

-export default class QueryAndSaveBtns extends React.Component {
-  render() {
-    const saveClasses = classnames('btn btn-default', {
-      'disabled disabledButton': this.props.canAdd !== 'True',
-    });
+export default function QueryAndSaveBtns({ canAdd, onQuery }) {
+  const saveClasses = classnames('btn btn-default', {
+    'disabled disabledButton': canAdd !== 'True',
+  });

-    return (
-      <div className="btn-group query-and-save">
-        <button type="button" className="btn btn-primary" onClick={this.props.onQuery}>
-          <i className="fa fa-bolt"></i>Query
-        </button>
-        <button type="button"
-                className={saveClasses}
-                onClick={this.props.onSave}
-                data-target="#save_modal"
-                data-toggle="modal"
-        >
-          <i className="fa fa-plus-circle"></i>Save as
-        </button>
-      </div>
-    );
-  }
+  return (
+    <div className="btn-group query-and-save">
+      <button type="button" className="btn btn-primary" onClick={onQuery}>
+        <i className="fa fa-bolt"></i>Query
+      </button>
+      <button type="button"
+              className={saveClasses}
+              data-target="#save_modal"
+              data-toggle="modal"
+      >
+        <i className="fa fa-plus-circle"></i>Save as
+      </button>
+    </div>
+  );
 }

 QueryAndSaveBtns.propTypes = propTypes;
--- a/caravel/assets/js_build.sh
+++ b/caravel/assets/js_build.sh
@ -4,4 +4,5 @@ cd "$(dirname "$0")"
 npm --version
 npm install
 npm run lint
+npm run test
 npm run prod
--- a/caravel/assets/package.json
+++ b/caravel/assets/package.json
@ -1,13 +1,13 @@
 {
  "name": "caravel",
  "version": "0.1.0",
-  "description": "Any database to any visualization",
+  "description": "Caravel is a data exploration platform designed to be visual, intuitive, and interactive.",
  "directories": {
    "doc": "docs",
-    "test": "tests"
+    "test": "spec"
  },
  "scripts": {
-    "test": "echo \"Error: no test specified\" && exit 1",
+    "test": "mocha --compilers js:babel-core/register --required spec/helpers/browser.js spec/**/*_spec.*",
    "dev": "webpack -d --watch --colors",
    "prod": "webpack -p --colors",
    "lint": "npm run --silent lint:js",
@ -36,10 +36,6 @@
  "homepage": "https://github.com/airbnb/caravel#readme",
  "dependencies": {
    "autobind-decorator": "^1.3.3",
-    "babel-loader": "^6.2.1",
-    "babel-polyfill": "^6.3.14",
-    "babel-preset-es2015": "^6.3.13",
-    "babel-preset-react": "^6.3.13",
    "bootstrap": "^3.3.6",
    "bootstrap-datepicker": "^1.6.0",
    "bootstrap-toggle": "^2.2.1",
@ -47,7 +43,6 @@
    "brfs": "^1.4.3",
    "cal-heatmap": "3.5.4",
    "classnames": "^2.2.5",
-    "css-loader": "^0.23.1",
    "d3": "^3.5.14",
    "d3-cloud": "^1.2.1",
    "d3-sankey": "^0.2.1",
@ -55,20 +50,15 @@
    "datamaps": "^0.4.4",
    "datatables-bootstrap3-plugin": "^0.4.0",
    "datatables.net-bs": "^1.10.11",
-    "exports-loader": "^0.6.3",
    "font-awesome": "^4.5.0",
    "gridster": "^0.5.6",
    "immutability-helper": "^2.0.0",
-    "imports-loader": "^0.6.5",
    "jquery": "^2.2.1",
-    "jquery-ui": "^1.10.5",
-    "json-loader": "^0.5.4",
-    "less": "^2.6.1",
-    "less-loader": "^2.2.2",
+    "jquery-ui": "1.10.5",
    "mapbox-gl": "^0.20.0",
    "mustache": "^2.2.1",
    "nvd3": "1.8.3",
-    "react": "^15.2.0",
+    "react": "^15.2.1",
    "react-bootstrap": "^0.28.3",
    "react-bootstrap-table": "^2.3.7",
    "react-dom": "^0.14.8",
@ -77,17 +67,35 @@
    "react-resizable": "^1.3.3",
    "select2": "3.5",
    "select2-bootstrap-css": "^1.4.6",
-    "style-loader": "^0.13.0",
    "supercluster": "https://github.com/georgeke/supercluster/tarball/ac3492737e7ce98e07af679623aad452373bbc40",
    "topojson": "^1.6.22",
-    "transform-loader": "^0.2.3",
-    "viewport-mercator-project": "^2.1.0",
-    "webpack": "^1.12.12",
-    "webworkify-webpack": "1.0.6"
+    "viewport-mercator-project": "^2.1.0"
  },
  "devDependencies": {
+    "babel": "^6.3.26",
+    "babel-core": "^6.10.4",
+    "babel-loader": "^6.2.4",
+    "babel-preset-airbnb": "^1.1.1",
+    "babel-preset-es2015": "^6.9.0",
+    "babel-preset-react": "^6.11.1",
+    "chai": "^3.5.0",
+    "css-loader": "^0.23.1",
+    "enzyme": "^2.0.0",
    "eslint": "^2.2.0",
+    "exports-loader": "^0.6.3",
    "file-loader": "^0.8.5",
-    "url-loader": "^0.5.7"
+    "imports-loader": "^0.6.5",
+    "jsdom": "^8.0.1",
+    "json-loader": "^0.5.4",
+    "less": "^2.6.1",
+    "less-loader": "^2.2.2",
+    "mocha": "^2.4.5",
+    "react-addons-test-utils": "^0.14.8",
+    "react-dom": "^0.14.8",
+    "style-loader": "^0.13.0",
+    "transform-loader": "^0.2.3",
+    "url-loader": "^0.5.7",
+    "webpack": "^1.13.1",
+    "webworkify-webpack": "1.0.6"
  }
 }
--- a/caravel/assets/spec/helpers/browser.js
+++ b/caravel/assets/spec/helpers/browser.js
@ -0,0 +1,22 @@
+/* eslint no-undef: 0, no-native-reassign: 0 */
+
+require('babel-register')();
+
+var jsdom = require('jsdom').jsdom;
+
+var exposedProperties = ['window', 'navigator', 'document'];
+
+global.document = jsdom('');
+global.window = document.defaultView;
+Object.keys(document.defaultView).forEach((property) => {
+  if (typeof global[property] === 'undefined') {
+    exposedProperties.push(property);
+    global[property] = document.defaultView[property];
+  }
+});
+
+global.navigator = {
+  userAgent: 'node.js'
+};
+
+documentRef = document;
--- a/caravel/assets/spec/javascripts/explore/components/QueryAndSaveBtns_spec.jsx
+++ b/caravel/assets/spec/javascripts/explore/components/QueryAndSaveBtns_spec.jsx
@ -0,0 +1,35 @@
+import React from 'react';
+import { expect } from 'chai';
+import { shallow } from 'enzyme';
+
+import QueryAndSaveButtons from '../../../../javascripts/explore/components/QueryAndSaveBtns';
+
+describe('QueryAndSaveButtons', () => {
+  let defaultProps = {
+    canAdd: 'True',
+    onQuery: () => {}
+  };
+
+  // It must render
+  it('renders', () => {
+    expect(React.isValidElement(<QueryAndSaveButtons {...defaultProps} />)).to.equal(true);
+  });
+
+  // Test the output
+  describe('output', () => {
+    let wrapper;
+
+    beforeEach(() => {
+      wrapper = shallow(<QueryAndSaveButtons {...defaultProps} />);
+    });
+
+    it('renders 2 buttons', () => {
+      expect(wrapper.find('button')).to.have.lengthOf(2);
+    });
+
+    it('renders buttons with correct text', () => {
+      expect(wrapper.find('button').contains('Query')).to.eql(true);
+      expect(wrapper.find('button').contains('Save as')).to.eql(true);
+    });
+  });
+});
--- a/caravel/assets/webpack.config.js
+++ b/caravel/assets/webpack.config.js
@ -1,9 +1,9 @@
-var path      = require('path');
-var APP_DIR   = path.resolve(__dirname, './'); // input
-var BUILD_DIR = path.resolve(__dirname, './javascripts/dist'); // output
+const path = require('path');

-var config = {
-  // for now generate one compiled js file per entry point / html page
+const APP_DIR = path.resolve(__dirname, './'); // input
+const BUILD_DIR = path.resolve(__dirname, './javascripts/dist'); // output
+
+const config = {
  entry: {
    'css-theme': APP_DIR + '/javascripts/css-theme.js',
    dashboard: APP_DIR + '/javascripts/dashboard/Dashboard.jsx',
@ -18,6 +18,7 @@ var config = {
    filename: '[name].entry.js'
  },
  resolve: {
+    extensions: ['', '.js', '.jsx'],
    alias: {
      webworkify: 'webworkify-webpack'
    }
@ -25,41 +26,50 @@ var config = {
  module: {
    loaders: [
      {
-        test: /\.jsx?/,
-        include: APP_DIR,
+        test: /\.jsx?$/,
        exclude: APP_DIR + '/node_modules',
-        loader: 'babel'
+        loader: 'babel',
+        query: {
+          presets: ['react', 'es2015', 'stage-0']
+        }
      },
-    /* for react-map-gl overlays */
+
+      /* for react-map-gl overlays */
      {
        test: /\.react\.js$/,
        include: APP_DIR + '/node_modules/react-map-gl/src/overlays',
        loader: 'babel'
      },
-    /* for require('*.css') */
+
+      /* for require('*.css') */
      {
        test: /\.css$/,
        include: APP_DIR,
        loader: "style-loader!css-loader"
      },
-    /* for css linking images */
+
+      /* for css linking images */
      { test: /\.png$/, loader: "url-loader?limit=100000" },
      { test: /\.jpg$/, loader: "file-loader" },
      { test: /\.gif$/, loader: "file-loader" },
-    /* for font-awesome */
+
+      /* for font-awesome */
      { test: /\.woff(2)?(\?v=[0-9]\.[0-9]\.[0-9])?$/, loader: "url-loader?limit=10000&minetype=application/font-woff" },
      { test: /\.(ttf|eot|svg)(\?v=[0-9]\.[0-9]\.[0-9])?$/, loader: "file-loader" },
-    /* for require('*.less') */
+
+      /* for require('*.less') */
      {
        test: /\.less$/,
        include: APP_DIR,
        loader: "style!css!less"
      },
-    /* for mapbox */
+
+      /* for mapbox */
      {
        test: /\.json$/,
        loader: 'json-loader'
-      }, {
+      },
+      {
        test: /\.js$/,
        include: APP_DIR + '/node_modules/mapbox-gl/js/render/painter/use_program.js',
        loader: 'transform/cacheable?brfs'
@ -71,6 +81,11 @@ var config = {
      query: 'brfs'
    }]
  },
+  externals: {
+    cheerio: 'window',
+    'react/lib/ExecutionEnvironment': true,
+    'react/lib/ReactContext': true
+  },
  plugins: []
 };