commit 79e70b3c803dd15ac4af0f68de173d1ff28017e4
parent 553ae5aedb4f7e1d77d740a758c6fea158cf4319
Author: Konstantin Tarkus <hello@tarkus.me>
Date: Sat, 16 Apr 2016 15:31:54 +0300
Update npm modules; replace Jest with Mocha
Diffstat:
22 files changed, 145 insertions(+), 109 deletions(-)
diff --git a/CHANGELOG.md b/CHANGELOG.md
@@ -4,6 +4,12 @@ All notable changes to this project will be documented in this file.
### [Unreleased][unreleased]
+- Update `isomorphic-style-loader` to `v1.0.0`, it adds comparability with ES2015+ decorators.
+ Code such as `export default withStyles(MyComponent, style1, style2)` must be replaced with
+ `export default withStyles(style1, style2)(MyComponent)` (BREAKING CHANGE).
+- Replace Jest with Mocha, Chai, Sinon. Unit test files must be renamed from
+ `MyComponent/__test__/MyComponent-test.js` to `MyComponent/MyComponent.test.js` (BREAKING CHANGE).
+- Remove `actions`, `stores` folders since there is no Flux library included into the kit
- Rename `server` variable in `server.js` to `app`
- Integrate [Sequelize](http://docs.sequelizejs.com/) to make the project compatible with different types of databases
- Rename `onSetTitle`, `onSetMeta` context variables to `setTitle`, `setMeta`
@@ -13,15 +19,17 @@ All notable changes to this project will be documented in this file.
- Update routing to use `universal-router` library
- Move Babel, ESLint and JSCS configurations to `package.json` [#497](https://github.com/kriasoft/react-starter-kit/pull/497)
- Convert `Feedback`, `Footer`, `Header`, and `Navigation` to functional stateless components
-- Move page / screen components into the `src/routes` folder along with the routing information for them [BREAKING CHANGE]. [6553936](https://github.com/kriasoft/react-starter-kit/commit/6553936e693e24a8ac6178f4962af15e0ea87dfd)
+- Move page / screen components into the `src/routes` folder along with the routing information for them (BREAKING CHANGE). [6553936](https://github.com/kriasoft/react-starter-kit/commit/6553936e693e24a8ac6178f4962af15e0ea87dfd)
-### [v0.5.1] - 2016-03-02
+### [v0.5.1]
+> 2016-03-02
-- Remove `Html` React component in favor of compiled Jade templates (`src/views`) [BREAKING CHANGE]. [e188388](https://github.com/kriasoft/react-starter-kit/commit/e188388f87069cdc7d501b385d6b0e46c98fed60)
+- Remove `Html` React component in favor of compiled Jade templates (`src/views`) (BREAKING CHANGE). [e188388](https://github.com/kriasoft/react-starter-kit/commit/e188388f87069cdc7d501b385d6b0e46c98fed60)
- Add global error handling in Node.js/Express app. [e188388](https://github.com/kriasoft/react-starter-kit/commit/e188388f87069cdc7d501b385d6b0e46c98fed60)
- Add support for Markdown and HTML for static pages. [#469](https://github.com/kriasoft/react-starter-kit/pull/469), [#477](https://github.com/kriasoft/react-starter-kit/pull/477)
-### [v0.5.0] - 2016-02-27
+### [v0.5.0]
+> 2016-02-27
- Replace RESTful API endpoint (`src/api`) with GraphQL (`src/data`)
- Add a sample GraphQL endpoint [localhost:3000/graphql](https://localhost:3000/graphql)
@@ -40,7 +48,8 @@ All notable changes to this project will be documented in this file.
- Add support of `--release` and `--verbose` flags to build scripts
- Add `CHANGELOG.md` file with a list of notable changes to this project
-### [v0.4.1] - 2015-10-04
+### [v0.4.1]
+> 2015-10-04
- Replace React Hot Loader (depricated) with React Transform
- Replace `index.html` template with `Html` (shell) React component
diff --git a/README.md b/README.md
@@ -9,7 +9,7 @@
> following the best practices. A solid starting point for both professionals
> and newcomers to the industry.
-See [homepage](https://www.reactstarterkit.com) |
+See [getting started](./docs/getting-started.md) |
[demo](http://demo.reactstarterkit.com) |
[docs](https://github.com/kriasoft/react-starter-kit/tree/master/docs) |
[to-do list](https://waffle.io/kriasoft/react-starter-kit) |
@@ -27,8 +27,8 @@ visit our sponsors:<br><br>
### Backers
♥ React Starter Kit? Help us keep it alive by donating funds to cover project
-expenses via [Bountysource](https://salt.bountysource.com/teams/react-starter-kit)
-or [PayPal](https://www.paypal.com/cgi-bin/webscr?cmd=_s-xclick&hosted_button_id=RETHAJHV3T972)!
+expenses via [OpenCollective](https://opencollective.com/react-starter-kit) or
+[PayPal](https://www.paypal.com/cgi-bin/webscr?cmd=_s-xclick&hosted_button_id=RETHAJHV3T972)!
<a href="http://www.nekst.me/" target="_blank" title="lehneres">
<img src="https://github.com/lehneres.png?size=64" width="64" height="64" alt="lehneres">
@@ -48,16 +48,10 @@ or [PayPal](https://www.paypal.com/cgi-bin/webscr?cmd=_s-xclick&hosted_button_id
<a href="http://zanehitchcox.com/" target="_blank" title="Zane Hitchcox">
<img src="https://github.com/zwhitchcox.png?size=64" width="64" height="64" alt="Zane Hitchcox">
</a>
-<a href="https://salt.bountysource.com/teams/react-starter-kit" target="_blank">
+<a href="https://opencollective.com/react-starter-kit" target="_blank">
<img src="https://opencollective.com/static/images/become_backer.svg" width="64" height="64" alt="">
</a>
-### Related Projects
-
- * [Membership Database](https://github.com/membership/membership.db) — SQL schema boilerplate for user accounts, profiles, roles, and auth claims
- * [React Static Boilerplate](https://github.com/koistya/react-static-boilerplate) — Generates static websites from React components
- * [Babel Starter Kit](https://github.com/kriasoft/babel-starter-kit) — Boilerplate for authoring JavaScript/React.js libraries
-
### Learn More
* [Getting Started with React.js](http://facebook.github.io/react/)
@@ -65,11 +59,17 @@ or [PayPal](https://www.paypal.com/cgi-bin/webscr?cmd=_s-xclick&hosted_button_id
* [React.js Questions on StackOverflow](http://stackoverflow.com/questions/tagged/reactjs)
* [React.js Discussion Board](https://discuss.reactjs.org/)
* [Flux Architecture for Building User Interfaces](http://facebook.github.io/flux/)
- * [Jest - Painless Unit Testing](http://facebook.github.io/jest/)
- * [Flow - A static type checker for JavaScript](http://flowtype.org/)
+ * [Enzyme — JavaScript Testing utilities for React](http://airbnb.io/enzyme/)
+ * [Flow — A static type checker for JavaScript](http://flowtype.org/)
* [The Future of React](https://github.com/reactjs/react-future)
* [Learn ES6](https://babeljs.io/docs/learn-es6/), [ES6 Features](https://github.com/lukehoban/es6features#readme)
+### Related Projects
+
+ * [Membership Database](https://github.com/membership/membership.db) — SQL schema boilerplate for user accounts, profiles, roles, and auth claims
+ * [React Static Boilerplate](https://github.com/koistya/react-static-boilerplate) — Generates static websites from React components
+ * [Babel Starter Kit](https://github.com/kriasoft/babel-starter-kit) — Boilerplate for authoring JavaScript/React.js libraries
+
### Support
* [#react-starter-kit](http://stackoverflow.com/questions/tagged/react-starter-kit) on Stack Overflow — Questions and answers
diff --git a/docs/getting-started.md b/docs/getting-started.md
@@ -1,28 +1,34 @@
## Getting Started
+### Requirements
+
+ * Mac OS X, Windows, or Linux
+ * [Node.js](https://nodejs.org/) v5.0 or newer
+ * `npm` v3.3 or newer (new to [npm](https://docs.npmjs.com/)?)
+ * `node-gyp` prerequisites mentioned [here](https://github.com/nodejs/node-gyp)
+ * Text editor or IDE pre-configured with React/JSX/Flow/ESlint ([learn more](./how-to-configure-text-editors.md))
+
### Directory Layout
+Before you start, take a moment to see how the project structure looks like:
+
```
.
├── /build/ # The folder for compiled output
├── /docs/ # Documentation files for the project
├── /node_modules/ # 3rd-party libraries and utilities
├── /src/ # The source code of the application
-│ ├── /actions/ # Action creators that allow to trigger a dispatch to stores
│ ├── /components/ # React components
-│ ├── /constants/ # Constants (action types etc.)
-│ ├── /content/ # Static content (plain HTML or Markdown, Jade, you name it)
+│ ├── /content/ # Static pages like About Us, Privacy Policy etc.
│ ├── /core/ # Core framework and utility functions
-│ ├── /data/ # GraphQL server schema
-│ ├── /decorators/ # Higher-order React components
+│ ├── /data/ # GraphQL server schema and data models
│ ├── /public/ # Static files which are copied into the /build/public folder
│ ├── /routes/ # Page/screen components along with the routing information
-│ ├── /stores/ # Stores contain the application state and logic
-│ ├── /views/ # Express.js views for index and error pages
+│ ├── /views/ # Express.js views (templates) for index and error pages
│ ├── /client.js # Client-side startup script
│ ├── /config.js # Global application settings
-│ ├── /routes.js # Universal (isomorphic) application routes
│ └── /server.js # Server-side startup script
+├── /test/ # Unit and end-to-end tests
├── /tools/ # Build automation scripts and utilities
│ ├── /lib/ # Library for utility snippets
│ ├── /build.js # Builds the project from source to output (build) folder
@@ -37,13 +43,10 @@
└── package.json # The list of 3rd party libraries and utilities
```
-### Requirements
-
- * Mac OS X, Windows, or Linux
- * [Node.js](https://nodejs.org/) v5.0 or newer
- * `npm` v3.3 or newer (new to [npm](https://docs.npmjs.com/)?)
- * `node-gyp` prerequisites mentioned [here](https://github.com/nodejs/node-gyp)
- * Text editor or IDE pre-configured with React/JSX/Flow/ESlint ([learn more](./how-to-configure-text-editors.md))
+**Note**: The current version of RSK does not contain a Flux implementation.
+It can be easily integrated with any Flux library of your choice. The most
+commonly used Flux libraries are [Flux](http://facebook.github.io/flux/),
+[Redux](http://redux.js.org/), and [Relay](http://facebook.github.io/relay/).
### Quick Start
@@ -122,12 +125,13 @@ $ npm run lint
To launch unit tests:
```shell
-$ npm test
+$ npm test # Run unit tests with Mocha
+$ npm run test:watch # Launch unit test runner and start watching for changes
```
-Test any javascript module by creating a `__tests__/` directory where
-the file is. Append `-test.js` to the filename and
-[Jest](https://facebook.github.io/jest/) will do the rest.
+By default, [Mocha](https://mochajs.org/) test runner is looking for test files
+matching the `src/**/*.test.js` pattern. Take a look at `src/components/App/App.test.js`
+as an example.
To deploy the app, run:
diff --git a/package.json b/package.json
@@ -22,12 +22,12 @@
"graphiql": "0.7.0",
"graphql": "0.5.0",
"history": "2.0.2",
- "isomorphic-style-loader": "0.0.12",
+ "isomorphic-style-loader": "1.0.0",
"jade": "1.11.0",
"jsonwebtoken": "5.7.0",
"markdown-it": "6.0.1",
- "node-fetch": "1.5.0",
- "normalize.css": "4.0.0",
+ "node-fetch": "1.5.1",
+ "normalize.css": "4.1.1",
"passport": "0.3.2",
"passport-facebook": "2.1.0",
"pretty-error": "2.0.0",
@@ -44,9 +44,9 @@
"autoprefixer": "^6.3.6",
"babel-cli": "^6.7.5",
"babel-eslint": "^6.0.2",
- "babel-jest": "^10.0.1",
"babel-loader": "^6.2.4",
"babel-plugin-react-transform": "^2.0.2",
+ "babel-plugin-rewire": "^1.0.0-rc-2",
"babel-plugin-transform-react-constant-elements": "^6.5.0",
"babel-plugin-transform-react-inline-elements": "^6.6.5",
"babel-plugin-transform-react-remove-prop-types": "^0.2.5",
@@ -55,13 +55,16 @@
"babel-preset-node5": "^11.0.1",
"babel-preset-react": "^6.5.0",
"babel-preset-stage-0": "^6.5.0",
- "browser-sync": "^2.11.2",
+ "babel-register": "^6.7.2",
+ "browser-sync": "^2.12.3",
+ "chai": "^3.5.0",
"css-loader": "^0.23.1",
"del": "^2.2.0",
"enzyme": "^2.2.0",
- "eslint": "^2.7.0",
- "eslint-config-airbnb": "^6.2.0",
+ "eslint": "^2.8.0",
+ "eslint-config-airbnb": "^7.0.0",
"eslint-loader": "^1.3.0",
+ "eslint-plugin-jsx-a11y": "^0.6.2",
"eslint-plugin-react": "^4.3.0",
"estraverse-fb": "^1.3.1",
"extend": "^3.0.0",
@@ -70,7 +73,6 @@
"git-repository": "^0.1.4",
"glob": "^7.0.3",
"jade-loader": "^0.8.0",
- "jest-cli": "^0.10.0",
"jscs": "^2.11.0",
"json-loader": "^0.5.4",
"mkdirp": "^0.5.1",
@@ -88,7 +90,7 @@
"stylelint": "^5.4.0",
"stylelint-config-standard": "^5.0.0",
"url-loader": "^0.5.7",
- "webpack": "^1.12.14",
+ "webpack": "^1.13.0",
"webpack-hot-middleware": "^2.10.0",
"webpack-middleware": "^1.5.1"
},
@@ -97,7 +99,14 @@
"react",
"node5",
"stage-0"
- ]
+ ],
+ "env": {
+ "test": {
+ "plugins": [
+ "rewire"
+ ]
+ }
+ }
},
"eslintConfig": {
"parser": "babel-eslint",
@@ -106,8 +115,7 @@
"__DEV__": true
},
"env": {
- "browser": true,
- "jest": true
+ "browser": true
},
"rules": {
"no-confusing-arrow": 0,
@@ -126,21 +134,6 @@
],
"disallowSpacesInsideTemplateStringPlaceholders": null
},
- "jest": {
- "rootDir": "./src",
- "testPathDirs": [
- "<rootDir>",
- "<rootDir>/../test/"
- ],
- "moduleNameMapper": {
- "\\.scss$": "SCSSStub"
- },
- "unmockedModulePathPatterns": [
- "react",
- "enzyme",
- "core-js"
- ]
- },
"stylelint": {
"extends": "stylelint-config-standard",
"rules": {
@@ -152,7 +145,8 @@
"jscs": "jscs src tools --verbose",
"stylelint": "stylelint \"src/**/*.scss\" --syntax scss",
"lint": "npm run eslint && npm run jscs && npm run stylelint",
- "test": "npm run lint && jest",
+ "test": "mocha src/**/*.test.js --require test/setup.js --compilers js:babel-register",
+ "test:watch": "mocha src/**/*.test.js --require test/setup.js --compilers js:babel-register --reporter min --watch",
"clean": "babel-node tools/run clean",
"copy": "babel-node tools/run copy",
"bundle": "babel-node tools/run bundle",
diff --git a/src/actions/.gitignore b/src/actions/.gitignore
diff --git a/src/components/App/App.test.js b/src/components/App/App.test.js
@@ -0,0 +1,30 @@
+/**
+ * React Starter Kit (https://www.reactstarterkit.com/)
+ *
+ * Copyright © 2014-2016 Kriasoft, LLC. All rights reserved.
+ *
+ * This source code is licensed under the MIT license found in the
+ * LICENSE.txt file in the root directory of this source tree.
+ */
+
+/* eslint-env mocha */
+/* eslint-disable padded-blocks, no-unused-expressions */
+
+import React from 'react';
+import { expect } from 'chai';
+import { shallow } from 'enzyme';
+import App from './App';
+
+describe('App', () => {
+
+ it('renders children correctly', () => {
+ const wrapper = shallow(
+ <App context={{ insertCss: () => {} }}>
+ <div className="child" />
+ </App>
+ );
+
+ expect(wrapper.contains(<div className="child" />)).to.be.true;
+ });
+
+});
diff --git a/src/components/App/__tests__/App-test.js b/src/components/App/__tests__/App-test.js
@@ -1,16 +0,0 @@
-jest.unmock('../App');
-
-import App from '../App';
-import React from 'react';
-import { shallow } from 'enzyme';
-
-describe('App', () => {
- it('renders children correctly', () => {
- const wrapper = shallow(
- <App context={{ insertCss: () => {} }}>
- <div className="child" />
- </App>
- );
- expect(wrapper.contains(<div className="child" />)).toBe(true);
- });
-});
diff --git a/src/components/Feedback/Feedback.js b/src/components/Feedback/Feedback.js
@@ -29,4 +29,4 @@ function Feedback() {
);
}
-export default withStyles(Feedback, s);
+export default withStyles(s)(Feedback);
diff --git a/src/components/Footer/Footer.js b/src/components/Footer/Footer.js
@@ -28,4 +28,4 @@ function Footer() {
);
}
-export default withStyles(Footer, s);
+export default withStyles(s)(Footer);
diff --git a/src/components/Header/Header.js b/src/components/Header/Header.js
@@ -31,4 +31,4 @@ function Header() {
);
}
-export default withStyles(Header, s);
+export default withStyles(s)(Header);
diff --git a/src/components/Navigation/Navigation.js b/src/components/Navigation/Navigation.js
@@ -30,4 +30,4 @@ Navigation.propTypes = {
className: PropTypes.string,
};
-export default withStyles(Navigation, s);
+export default withStyles(s)(Navigation);
diff --git a/src/constants/ActionTypes.js b/src/constants/ActionTypes.js
@@ -1,14 +0,0 @@
-/**
- * React Starter Kit (https://www.reactstarterkit.com/)
- *
- * Copyright © 2014-2016 Kriasoft, LLC. All rights reserved.
- *
- * This source code is licensed under the MIT license found in the
- * LICENSE.txt file in the root directory of this source tree.
- */
-
-import keyMirror from 'fbjs/lib/keyMirror';
-
-export default keyMirror({
-
-});
diff --git a/src/routes/contact/Contact.js b/src/routes/contact/Contact.js
@@ -27,4 +27,4 @@ function Contact(props, context) {
Contact.contextTypes = { setTitle: PropTypes.func.isRequired };
-export default withStyles(Contact, s);
+export default withStyles(s)(Contact);
diff --git a/src/routes/content/Content.js b/src/routes/content/Content.js
@@ -40,4 +40,4 @@ class Content extends Component {
}
-export default withStyles(Content, s);
+export default withStyles(s)(Content);
diff --git a/src/routes/error/ErrorPage.js b/src/routes/error/ErrorPage.js
@@ -37,4 +37,4 @@ function ErrorPage({ error }, context) {
ErrorPage.propTypes = { error: PropTypes.object.isRequired };
ErrorPage.contextTypes = { setTitle: PropTypes.func.isRequired };
-export default withStyles(ErrorPage, s);
+export default withStyles(s)(ErrorPage);
diff --git a/src/routes/home/Home.js b/src/routes/home/Home.js
@@ -44,4 +44,4 @@ Home.propTypes = {
};
Home.contextTypes = { setTitle: PropTypes.func.isRequired };
-export default withStyles(Home, s);
+export default withStyles(s)(Home);
diff --git a/src/routes/login/Login.js b/src/routes/login/Login.js
@@ -117,4 +117,4 @@ function Login(props, context) {
Login.contextTypes = { setTitle: PropTypes.func.isRequired };
-export default withStyles(Login, s);
+export default withStyles(s)(Login);
diff --git a/src/routes/register/Register.js b/src/routes/register/Register.js
@@ -27,4 +27,4 @@ function Register(props, context) {
Register.contextTypes = { setTitle: PropTypes.func.isRequired };
-export default withStyles(Register, s);
+export default withStyles(s)(Register);
diff --git a/src/stores/.gitignore b/src/stores/.gitignore
diff --git a/test/.eslintrc b/test/.eslintrc
@@ -0,0 +1,9 @@
+{
+ "env": {
+ "mocha": true
+ },
+ "rules": {
+ "no-unused-expressions": 0,
+ "padded-blocks": 0
+ }
+}
diff --git a/test/setup.js b/test/setup.js
@@ -0,0 +1,25 @@
+/**
+ * React Starter Kit (https://www.reactstarterkit.com/)
+ *
+ * Copyright © 2014-2016 Kriasoft, LLC. All rights reserved.
+ *
+ * This source code is licensed under the MIT license found in the
+ * LICENSE.txt file in the root directory of this source tree.
+ */
+
+/* Configure Mocha test runner, see package.json/scripts/test */
+
+process.env.NODE_ENV = 'test';
+
+function noop() {
+ return null;
+}
+
+require.extensions['.css'] = noop;
+require.extensions['.scss'] = noop;
+require.extensions['.md'] = noop;
+require.extensions['.png'] = noop;
+require.extensions['.svg'] = noop;
+require.extensions['.jpg'] = noop;
+require.extensions['.jpeg'] = noop;
+require.extensions['.gif'] = noop;
diff --git a/test/stubs/SCSSStub.js b/test/stubs/SCSSStub.js
@@ -1,5 +0,0 @@
-/**
- * @providesModule SCSSStub
- */
-
-module.exports = {};
