Rip out sinon & mocha into separate modules

.gitignore

@@ -30,4 +30,5 @@ node_modules
 .idea
 
 /build
+packages/*/build
 _book

.travis.yml

@@ -12,7 +12,7 @@ node_js:
 before_install:
   - 'if [ "${TRAVIS_NODE_VERSION}" != "0.9" ]; then case "$(npm --version)" in 1.*) npm install -g npm@1.4.28 ;; 2.*) npm install -g npm@2 ;; esac ; fi'
   - 'if [ "${TRAVIS_NODE_VERSION}" != "0.6" ] && [ "${TRAVIS_NODE_VERSION}" != "0.9" ]; then npm install -g npm; fi'
-before_script: "sh install-relevant-react.sh"
+before_script: "sh scripts/install-relevant-react.sh"
 script:
   - 'if [ "${TRAVIS_NODE_VERSION}" = "4.2" ]; then npm run lint && npm run travis ; elif [ "${TRAVIS_NODE_VERSION}" = "0.12" ]; then npm run travis ; else npm test ; fi'
 after_script:

README.md

@@ -14,6 +14,10 @@ compatible with all major test runners and assertion libraries out there. The do
 examples for enzyme use [mocha](https://mochajs.org/) and [chai](http://chaijs.com/), but you
 should be able to extrapolate to your framework of choice.
 
+[Using Enzyme with Mocha](/docs/guides/mocha.md)
+[Using Enzyme with Karma](/docs/guides/karma.md)
+[Using Enzyme with Jasmine](/docs/guides/jasmine.md)
+
 
 
 ### [Installation](/docs/installation/README.md)
@@ -42,6 +46,7 @@ Basic Usage
 ## [Shallow Rendering](/docs/api/shallow.md)
 
 ```jsx
+import React from 'react';
 import { shallow } from 'enzyme';
 
 describe('<MyComponent />', () => {
@@ -81,22 +86,14 @@ Read the full [API Documentation](/docs/api/shallow.md)
 
 
 
-## [JSDOM Full Rendering](/docs/api/mount.md)
+## [Full DOM Rendering](/docs/api/mount.md)
 
 ```jsx
-import {
-  describeWithDOM,
-  mount,
-  spyLifecycle,
-} from 'enzyme';
-
-describeWithDOM('<Foo />', () => {
+import React from 'react';
+import sinon from 'sinon';
+import { mount } from 'enzyme';
 
-  it('calls componentDidMount', () => {
-    spyLifecycle(Foo);
-    const wrapper = mount(<Foo />);
-    expect(Foo.prototype.componentDidMount.calledOnce).to.be.true;
-  });
+describe('<Foo />', () => {
 
   it('allows us to set props', () => {
     const wrapper = mount(<Foo bar="baz" />);
@@ -113,6 +110,13 @@ describeWithDOM('<Foo />', () => {
     wrapper.find('button').simulate('click');
     expect(onButtonClick.calledOnce).to.be.true;
   });
+
+  it('calls componentDidMount', () => {
+    sinon.spy(Foo.prototype, 'componentDidMount');
+    const wrapper = mount(<Foo />);
+    expect(Foo.prototype.componentDidMount.calledOnce).to.be.true;
+    Foo.prototype.componentDidMount.restore();
+  });
 
 });
 ```
@@ -123,6 +127,7 @@ Read the full [API Documentation](/docs/api/mount.md)
 ## [Static Rendered Markup](/docs/api/render.md)
 
 ```jsx
+import React from 'react';
 import { render } from 'enzyme';
 
 describe('<Foo />', () => {

docs/api/mount.md

@@ -4,8 +4,11 @@ Full DOM rendering is ideal for use cases where you have components that may int
 or may require the full lifecycle in order to fully test the component (ie, `componentDidMount` 
 etc.)
 
-Full DOM rendering  depends on a library called [jsdom](https://github.com/tmpvar/jsdom) which is
-essentially a headless browser implemented completely in JS.
+Full DOM rendering requires that a full DOM API be available at the global scope. This means that 
+it must be run in an environment that at least "looks like" a browser environment. If you do not 
+want to run your tests inside of a browswer, the recommended approach to using `mount` is to depend 
+on a library called [jsdom](https://github.com/tmpvar/jsdom) which is essentially a headless browser 
+implemented completely in JS.
 
 ```jsx
 import { mount } from 'enzyme';

docs/guides/mocha.md

@@ -0,0 +1,21 @@
+# Using Enzyme with Mocha
+
+```bash
+npm i --save-dev enzyme-mocha
+```
+
+```jsx
+import { mount } from 'enzyme';
+import { describeWithDOM } from 'enzyme-mocha';
+
+describe('<Foo />', () => {
+
+  it('calls componentDidMount', () => {
+    spy(Foo.prototype, 'componentDidMount');
+    const wrapper = mount(<Foo />);
+    expect(Foo.prototype.componentDidMount.calledOnce).to.be.true;
+  });
+
+});
+
+```

docs/installation/jsdom.md

@@ -26,32 +26,3 @@ nvm use 0.12
 ```bash
 nvm use 4
 ```
-
-### Preventing tests from failing on old versions
-
-If you are worried about tests not passing on versions of node that don't support jsdom, Enzyme
-comes with a helper function to wrap your tests in a safety layer such that any tests written
-inside of that function will be skipped if jsdom is not available.  (Note that this is for mocha
-only).
-
-```jsx
-import { mount, shallow } from 'enzyme';
-
-describe('MyComponent', () => {
-  describeWithDOM('interaction', () => {
-    // these tests will get skipped if jsdom is not available...
-    it('should do something', () => {
-      const wrapper = mount(<MyComponent />);
-      // ...
-    });
-  });
-  describe('non-interaction', () => {
-    // these tests will always run
-    it('should do something', () => {
-      const wrapper = shallow(<MyComponent />);
-      // ...
-    });
-  });
-});
-
-```

package.json

@@ -9,11 +9,15 @@
     "postversion": "git push && git push --tags && npm run clean && npm run docs:publish",
     "version": "npm run build",
     "clean": "rimraf build",
-    "lint": "eslint src/**",
-    "test": "mocha --compilers js:babel/register --recursive src/**/__tests__/*.js",
+    "lint": "eslint src/** packages/**/src/**",
     "check": "npm run lint && npm run test:all",
-    "build": "babel src --out-dir build",
-    "test:watch": "mocha --compilers js:babel/register --recursive src/**/__tests__/*.js --watch",
+    "build": "npm run build:core && npm run build:packages",
+    "build:core": "babel src --out-dir build",
+    "build:packages": "bash ./scripts/build-packages.sh",
+    "test": "npm run test:core && npm run test:packages",
+    "test:core": "mocha --compilers js:babel/register test/*.js",
+    "test:packages": "bash ./scripts/test-packages.sh",
+    "test:watch": "mocha --compilers js:babel/register test/*.js packages/**/test/*.js --watch",
     "test:all": "npm run react:13 && npm test && npm run react:14 && npm test",
     "react:clean": "rimraf node_modules/react node_modules/react-dom node_modules/react-addons-test-utils",
     "react:13": "npm run react:clean && npm i react@0.13",
@@ -23,7 +27,7 @@
     "docs:build": "npm run docs:prepare && gitbook build",
     "docs:watch": "npm run docs:prepare && gitbook serve",
     "docs:publish": "npm run docs:clean && npm run docs:build && cd _book && git init && git commit --allow-empty -m 'update book' && git fetch https://github.com/airbnb/enzyme.git gh-pages && git checkout -b gh-pages && git add . && git commit -am 'update book' && git push https://github.com/airbnb/enzyme.git gh-pages --force",
-    "travis": "istanbul cover _mocha -- --compilers js:babel/register --recursive src/**/__tests__/*.js"
+    "travis": "istanbul cover _mocha -- --compilers js:babel/register test/*.js packages/**/test/*.js"
   },
   "repository": {
     "type": "git",
@@ -47,7 +51,6 @@
   "license": "MIT",
   "dependencies": {
     "cheerio": "^0.19.0",
-    "sinon": "^1.15.4",
     "underscore": "^1.8.3"
   },
   "devDependencies": {
@@ -60,14 +63,13 @@
     "eslint-plugin-react": "^3.8.0",
     "gitbook-cli": "^1.0.0",
     "istanbul": "^0.4.0",
+    "jsdom": "^6.1.0",
     "mocha": "^2.2.5",
-    "rimraf": "^2.4.3"
+    "mocha-jsdom": "^1.0.0",
+    "rimraf": "^2.4.3",
+    "sinon": "^1.15.4"
   },
   "peerDependencies": {
     "react": "0.13.x || 0.14.x"
-  },
-  "optionalDependencies": {
-    "jsdom": "^6.1.0",
-    "mocha-jsdom": "^1.0.0"
   }
 }

packages/enzyme-mocha/.npmignore

@@ -0,0 +1 @@
+# Left empty in order to include the build directory for npm publish

packages/enzyme-mocha/package.json

@@ -0,0 +1,25 @@
+{
+  "name": "enzyme-mocha",
+  "version": "1.1.0",
+  "description": "Make Mocha and Enzyme play nice",
+  "main": "build/index.js",
+  "scripts": {
+    "build": "babel src --out-dir build",
+    "test": "mocha --compilers js:babel/register"
+  },
+  "repository": "https://github.com/airbnb/enzyme/tree/master/packages/enzyme-mocha",
+  "keywords": [
+    "mocha",
+    "enzyme"
+  ],
+  "author": "Leland Richardson <leland.richardson@airbnb.com>",
+  "license": "MIT",
+  "dependencies": {
+    "jsdomify": "^1.0.2"
+  },
+  "peerDependencies": {
+    "react": "0.13.x || 0.14.x",
+    "mocha": ">= 2.0.0",
+    "enzyme": "^1.1.0"
+  }
+}

packages/enzyme-mocha/src/index.js

@@ -0,0 +1,33 @@
+let jsdomify;
+
+try {
+  jsdomify = require('jsdomify');
+  jsdomify.create();
+  require('react'); // require react explicitly after jsdomify.create() has been called
+  jsdomify.destroy();
+} catch (e) {
+  // jsdom is not supported
+}
+
+export function jsdomSetup() {
+  if (!jsdomify) return;
+  jsdomify.create();
+}
+
+export function jsdomTeardown() {
+  if (!jsdomify) return;
+  jsdomify.destroy();
+}
+
+export function describeWithDOM(a, b) {
+  describe('(uses jsdom)', () => {
+    if (typeof jsdom === 'function') {
+      beforeEach(jsdomSetup);
+      afterEach(jsdomTeardown);
+      describe(a, b);
+    } else {
+      // if jsdom isn't available, skip every test in this describe context
+      describe.skip(a, b);
+    }
+  });
+}

packages/enzyme-mocha/test/jsdom-spec.js

@@ -0,0 +1,3 @@
+describe('jsdom', () => {
+  it.skip('TODO: set up tests');
+});

packages/enzyme-sinon/.npmignore

@@ -0,0 +1 @@
+# Left empty in order to include the build directory for npm publish

packages/enzyme-sinon/package.json

@@ -0,0 +1,25 @@
+{
+  "name": "enzyme-sinon",
+  "version": "1.1.0",
+  "description": "Make Sinon and Enzyme play nice",
+  "main": "build/index.js",
+  "scripts": {
+    "build": "babel src --out-dir build",
+    "test": "mocha --compilers js:babel/register"
+  },
+  "repository": "https://github.com/airbnb/enzyme/tree/master/packages/enzyme-mocha",
+  "keywords": [
+    "sinon",
+    "enzyme"
+  ],
+  "author": "Leland Richardson <leland.richardson@airbnb.com>",
+  "license": "MIT",
+  "dependencies": {
+    "sinon": "^1.17.2"
+  },
+  "peerDependencies": {
+    "react": "0.13.x || 0.14.x",
+    "mocha": ">= 2.0.0",
+    "enzyme": "^1.1.0"
+  }
+}

packages/enzyme-sinon/src/index.js

@@ -0,0 +1,20 @@
+import Sinon from 'sinon';
+import onPrototype from './onPrototype';
+
+export let sinon = Sinon.sandbox.create();
+
+export function spySetup() {
+  sinon = Sinon.sandbox.create();
+}
+
+export function spyTearDown() {
+  sinon.restore();
+}
+
+export function spyLifecycle(Component, sinonInstance = sinon) {
+  onPrototype(Component, (proto, name) => sinonInstance.spy(proto, name));
+}
+
+export function spyMethods(Component, sinonInstance = sinon) {
+  onPrototype(Component, null, (proto, name) => sinonInstance.spy(proto, name));
+}

packages/enzyme-sinon/src/onPrototype.js

@@ -0,0 +1,25 @@
+export default function onPrototype(Component, lifecycle, method) {
+  const proto = Component.prototype;
+  Object.getOwnPropertyNames(proto).forEach((name) => {
+    if (typeof proto[name] !== 'function') return;
+    switch (name) {
+    case 'componentDidMount':
+    case 'componentWillMount':
+    case 'componentDidUnmount':
+    case 'componentWillUnmount':
+    case 'componentWillReceiveProps':
+    case 'componentDidUpdate':
+    case 'componentWillUpdate':
+    case 'shouldComponentUpdate':
+    case 'render':
+      if (lifecycle) lifecycle(proto, name);
+      break;
+    case 'constructor':
+      // don't spy on the constructor, even though it shows up in the prototype
+      break;
+    default:
+      if (method) method(proto, name);
+      break;
+    }
+  });
+}

packages/enzyme-sinon/test/onPrototype-spec.js

@@ -0,0 +1,31 @@
+import { expect } from 'chai';
+import sinon from 'sinon';
+import onPrototype from '../src/onPrototype';
+
+describe('onPrototype', () => {
+
+  it('makes the expected calls', () => {
+
+    class Foo {
+      a() {}
+      b() {}
+      componentDidUpdate() {}
+    }
+
+    const lifecycleSpy = sinon.spy();
+    const methodSpy = sinon.spy();
+
+    onPrototype(Foo, lifecycleSpy, methodSpy);
+
+    expect(lifecycleSpy.callCount).to.equal(1);
+    expect(lifecycleSpy.args[0][0]).to.equal(Foo.prototype);
+    expect(lifecycleSpy.args[0][1]).to.equal('componentDidUpdate');
+
+    expect(methodSpy.callCount).to.equal(2);
+    expect(methodSpy.args[0][0]).to.equal(Foo.prototype);
+    expect(methodSpy.args[0][1]).to.equal('a');
+    expect(methodSpy.args[1][1]).to.equal('b');
+
+  });
+
+});

scripts/build-packages.sh

@@ -0,0 +1,10 @@
+#!/usr/bin/env zsh
+
+# die on error
+setopt -e
+
+for pkg in packages/*/ ; do
+  pushd ${pkg} > /dev/null
+  npm run build
+  popd > /dev/null
+done