jeudi 25 juillet 2019

Aren't Enzyme selected nodes updated when its props change?

I need to test a prop change in a component that happens when a click event is triggered.

I would expected the following code to work:

it('should change active <ListItem /> when its clicked', () => {
  const itemNumber = 2;

  const itemComponent = wrapper.find(ListItem).at(itemNumber);

  itemComponent.dive().simulate('click');

  expect(itemComponent.props().isActive).to.equal(true);
});

And it doesn't.

But debugging the whole wrapper in the console, I figured out that the prop was actually being updated.

So, I assumed that the "selected node" (itemComponent) is not updated by Enzyme and I tried to select it once again after the click happens:

it('should change active <CustomListItem /> when clicked', () => {
  const itemNumber = 2;

  let itemComponent = wrapper.find(CustomListItem).at(itemNumber);

  itemComponent.dive().simulate('click');

  // added line
  itemComponent = wrapper.find(CustomListItem).at(itemNumber);

  expect(itemComponent.props().isActive).to.equal(true);
});

And it works!

But I'm not sure why.. Can anyone give me some hint about it?

Aucun commentaire:

Enregistrer un commentaire