Move from karma to ava

.gitignore

@@ -1,2 +1,3 @@
 node_modules
 build
+npm-debug.log

README.md

@@ -1,6 +1,7 @@
 # connect-rxjs-to-react
 
-Simple way to connect [rxjs](https://www.npmjs.com/package/rxjs) to React component in Redux style... but without dispatch and constants.
+Simple way to connect [rxjs](https://www.npmjs.com/package/rxjs) to React component in Redux
+style... but without dispatch and constants.
 
 ```js
 export default connect(state => ({
@@ -10,8 +11,4 @@ export default connect(state => ({
 }))(Counter);
 ```
 
-Read more about RxJS with React: [http://michalzalecki.com/use-rxjs-with-react](http://michalzalecki.com/use-rxjs-with-react)
-
-### Using xstream?
-
-Checkout [xstream branch](https://github.com/MichalZalecki/connect-rxjs-to-react/tree/xstream) for rewrite with `xstream`.
+Read more about RxJS with React: [http://michalzalecki.com/use-rxjs-with-react](http://michalzalecki.com/use-rxjs-with-react)

package.json

@@ -1,5 +1,5 @@
 {
-  "name": "react-the-boring-part",
+  "name": "connect-rxjs-to-react",
   "version": "0.0.1",
   "description": "",
   "main": "src/index.js",
@@ -9,11 +9,11 @@
     "postinstall": "npm run build",
     "build": "webpack --config webpack/webpack.prod.config.js -p",
     "clean": "rm -rf build",
-    "test": "karma start",
-    "test:watch": "karma start --auto-watch --no-single-run"
+    "test": "ava",
+    "test:watch": "ava --watch"
   },
   "author": "Michał Załęcki <michal@michalzalecki.com>",
-  "license": "WTFPL",
+  "license": "MIT",
   "dependencies": {
     "babel": "^6.5.2",
     "babel-core": "^6.6.5",
@@ -41,21 +41,24 @@
     "webpack": "^1.12.14"
   },
   "devDependencies": {
-    "babel-istanbul-loader": "^0.1.0",
-    "extend": "^3.0.0",
+    "ava": "^0.16.0",
+    "enzyme": "^2.4.1",
     "inject-loader": "^2.0.1",
-    "jasmine-core": "^2.4.1",
-    "karma": "^0.13.22",
-    "karma-chrome-launcher": "^0.2.2",
-    "karma-coverage": "^0.5.5",
-    "karma-jasmine": "^0.3.6",
-    "karma-mocha-reporter": "^2.0.0",
-    "karma-notify-reporter": "^0.1.1",
-    "karma-phantomjs-launcher": "^1.0.0",
-    "karma-sourcemap-loader": "^0.3.6",
-    "karma-webpack": "^1.7.0",
-    "phantomjs-prebuilt": "^2.1.6",
-    "react-addons-test-utils": "^15.0.1",
+    "jsdom": "^9.5.0",
+    "react-addons-test-utils": "^15.3.1",
+    "react-dom": "^15.3.1",
     "webpack-dev-server": "^1.14.1"
+  },
+  "ava": {
+    "files": [
+      "src/**/*.spec.js"
+    ],
+    "require": [
+      "babel-register",
+      "./tests/setup/setupBrowser.js"
+    ],
+    "babel": "inherit",
+    "timeout": "60s",
+    "verbose": true
   }
 }

src/actions/counterActions.js

@@ -1,3 +1,3 @@
-import { createActions } from "../rx-state/RxState";
+import { createActions } from "../state/RxState";
 
 export default createActions(["increment$", "decrement$", "reset$"]);

src/components/App.js → src/components/App.jsx

@@ -20,7 +20,12 @@ class App extends React.Component {
     return (
       <div>
         <Counter />
-        {this.state.showSecondCounter ? <Counter /> : null}
+        {this.state.showSecondCounter ? (
+          <div>
+            <p>That one is connected as well and recived current state in props</p>
+            <Counter />
+          </div>
+        ) : null}
       </div>
     );
   }

src/components/Counter.js

@@ -1,5 +1,5 @@
 import React, { PropTypes, Component } from "react";
-import { connect } from "../rx-state/RxState";
+import { connect } from "../state/RxState";
 import counterActions from "app/actions/counterActions";
 
 export class Counter extends Component {

src/main.js

@@ -0,0 +1,13 @@
+import Rx from "rxjs";
+import React from "react";
+import ReactDOM from "react-dom";
+import { RxStateProvider, createState } from "./state/RxState"
+import App from "./components/App";
+import reducer$ from "./reducers";
+
+ReactDOM.render(
+  <RxStateProvider state$={createState(reducer$)}>
+    <App />
+  </RxStateProvider>,
+  document.getElementById("root"),
+);

src/state.js → src/reducers/index.js

@@ -1,9 +1,8 @@
-import Rx from "rxjs";
-import { createState } from "./rx-state/RxState";
+import Rx from "rxjs"
 import CounterReducer$ from "app/reducers/CounterReducer";
 
 const reducer$ = Rx.Observable.merge(
   CounterReducer$.map(reducer => ["counter", reducer]),
 );
 
-export default createState(reducer$);
+export default reducer$;

src/state/RxState.spec.js

@@ -0,0 +1,75 @@
+import test from "ava";
+import { mount } from "enzyme";
+import Rx from "rxjs";
+import React from "react";
+
+import {
+  createAction,
+  createActions,
+  createState,
+  RxStateProvider,
+  connect,
+} from "./RxState";
+
+test("createAction creates new Subject instance", t => {
+  const action$ = createAction();
+  const anotherAction$ = createAction();
+
+  t.true(action$ instanceof Rx.Subject);
+  t.not(action$, anotherAction$);
+});
+
+test("createActions creates new dict with actions", t => {
+  const actions = createActions(["add$", "decrement$"]);
+
+  t.deepEqual(actions.add$, new Rx.Subject);
+  t.deepEqual(actions.decrement$, new Rx.Subject);
+  t.is(actions.count$, undefined);
+});
+
+test("createState creates reactive state using scoped reducers", t => {
+  const add$ = new Rx.Subject;
+  const counterReducer$ = add$.map(payload => state => state + payload);
+  const rootReducer$ = counterReducer$.map(counter => ["counter", counter]);
+  const state$ = createState(rootReducer$, Rx.Observable.of({ counter: 10 }));
+
+  t.plan(1);
+
+  add$.next(1); // No subscribers yet
+
+  state$.toArray().subscribe(results => {
+    t.deepEqual(results, [{ counter: 10 }, { counter: 12 }]);
+  });
+
+  add$.next(2);
+  add$.complete();
+});
+
+test("connect maps state to props in RxStateProvider context", t => {
+  const add$ = new Rx.Subject;
+  const counterReducer$ = add$.map(payload => state => state + payload);
+  const rootReducer$ = counterReducer$.map(counter => ["counter", counter]);
+  const state$ = createState(rootReducer$, Rx.Observable.of({ counter: 10 }));
+
+  const Counter = ({ counter, add }) => (
+    <div>
+      <h1>{counter}</h1>
+      <button onClick={add}>add</button>
+    </div>
+  );
+
+  const ConnectedCounter = connect(state => ({
+    counter: state.counter,
+    add: () => add$.next(1),  
+  }))(Counter);
+
+  const tree = mount(
+    <RxStateProvider state$={state$}>
+      <ConnectedCounter />
+    </RxStateProvider> 
+  );
+
+  t.is(tree.find("h1").text(), "10");
+  tree.find("button").simulate("click")
+  t.is(tree.find("h1").text(), "11");
+});

tests/setup/setupBrowser.js

@@ -0,0 +1,3 @@
+global.document = require('jsdom').jsdom('<body></body>');
+global.window = document.defaultView;
+global.navigator = window.navigator;

webpack/webpack.config.js

@@ -4,7 +4,7 @@ var HTMLWebpackPlugin = require("html-webpack-plugin");
 
 var config = {
   entry: [
-    path.resolve("src/index.js"),
+    path.resolve("src/main.js"),
   ],
 
   output: {