test stateful components with chai

.babelrc

{
  "presets": ["env"],
  "plugins": [
      ["transform-react-jsx", { "pragma":"h" }]
  ]
}

package.json

{
  "devDependencies": {
    "babel-core": "^6.25.0",
    "babel-plugin-transform-react-jsx": "^6.24.1",
    "babel-preset-env": "^1.6.0",
    "chai": "^4.1.0",
    "mocha": "^3.5.0",
    "preact-jsx-chai": "^2.2.1"
  }
}

r.js

import { h, Component } from 'preact';

export default class R extends Component {
    render(props, state = {count:1}) {
        return (
            <h1 onClick={this.up.bind(this)}>{props.children} {state.count}</h1>
        );
    }
    up() {
        this.setState(function(state, props) {
            let count = state.count ? state.count : 1;
            return {
                count: count + 1
            }
        });
    }
};

spec.js

import { h, Component } from 'preact';
import chai, { expect } from 'chai';
import jsxAssert from 'preact-jsx-chai';
jsxAssert.options.functions = false;

import R from './r';

chai.use(jsxAssert);

// tests
describe('testing component', () => {
  it('has a tag', () => {
    let o = (<R>Hello World</R>);
    expect(o).to.equal(<h1>Hello World </h1>);
  });
});

describe('testing stateful component', () => {
  it('has a right count', () => {
    let counted = new R({children:["Hello World"]});
    expect(counted)
      .to.have.nested.property('props.children')
      .that.contains('Hello World');
      
    expect(counted.render(counted.props))
      .to.equal(<h1>Hello World 1</h1>);
      
    counted.state.count = 20;
    expect(counted.render(counted.props, counted.state))
      .to.equal(<h1>Hello World 20</h1>);
    });
});