mercredi 17 août 2016

Spying on React components using Enzyme (and sinon?) to check arguments

I'm wanting to assert that a component gets called from within another component with the correct arguments.

So within the component that I am testing there is a Title component that gets called with properties title & url. I'm trying to assert that it gets called with the correct arguments.

I'm pretty sure I want to use a sinon spy and do something like this

const titleSpy = sinon.spy(Title, render)
expect(titleSpy).to.be.calledWith( '< some title >' )

but with regards to React and Enzyme, I'm not really sure what I should be spying on. (Because apparently it's not render!)

In my spec file I am importing Title and console.loging it's value to find a function to spy on and I get:

function _class() {
  _classCallCheck(this, _class);
  return _possibleConstructorReturn(this, Object.getPrototypeOf(_class).apply(this, arguments));
}

Any ideas on how I can do this? Is is a case of going through and finding the element and checking it's attributes? If so that seems a bit...messy and seems like it goes against the principle of the Shallow render ("Shallow rendering is useful to constrain yourself to testing a component as a unit").

Aucun commentaire:

Enregistrer un commentaire