State should allow to check against primitives like []

[weblogixx]

Hi all,

first of all, thank you for this plugin. It makes testing with enzyme a little less painful 👍.
I just wanted to try the .state check on a fairly simple component that currently looks like this:

class MyComponent extends React.Component {

  constructor(props) {
    super(props);
    this.state = {
      items: []
    };
  }
}

The test looks like this:

describe('MyComponent', function() {

  describe('when initializing the component', function() {
    it('should set a default state', function() {
      const component = shallow(<Component />);
      expect(component).to.have.state('items', []);
    });
  });
});

_Current behaviour:_
AssertionError: expected to have a 'items' state with the value [], but the value was [].

_Expected Behaviour:_
I would expect the output to be true, e.g. a deep check should happen instead of a regular one.

_Additional Input:_
It would be nice if we could also write something like this if the first parameter of state is a plain object to deep check everything:

expect(MyComponent).to.have.state({
  items: []
});

This would be equivalent to the currently used function below:

expect(MyComponent.state()).to.deep.equal({
  items: []
});

Thank you again for writing this beauty, hope the feedback is helpful for you.

[ayrton]

chai-enzyme doesn't do any deep comparisons by default, nor does chai afaik, you have to explicitly add the flag:

const component = shallow(<Component />);
expect(component).to.have.state('items').deep.equal([]);

I agree that the following would be nice to have:

expect(MyComponent).to.have.state({ foo: 'foo' });
expect(MyComponent).to.have.deep.state({ items: [] });

Similar to props, PRs are welcome.