comment vérifier que la fonction onclick est déclenchée ou non en réaction?

Vous pouvez utiliser une bibliothèque comme Sinon pour espionner les fonctions de votre classe:

import sinon from 'sinon';
const sandbox = sinon.createSandbox();

Ensuite, lorsque vous configurez vos tests, avant d'effectuer un rendu superficiel de votre composant:

it("check counter increment function is callled", () => {
  const spy = sandbox.spy(Counter.prototype, 'onClickHandler');
  const wrapper = shallow(<Counter />);
  wrapper.find("button").simulate("click");
  expect(spy.called).toBe(true);
});

Mise à jour:

Le gestionnaire onClick ne doit pas être défini comme une fonction anonyme, utilisez plutôt:

onClickHandler() {
  const increamentCounter = this.state.counter + 1;
  this.setState({
    counter: increamentCounter
  });
}

Et dans votre fonction de rendu, liez ceci:

render() {
  return (
    <div>
      <p>{this.state.counter}</p>
      <button onClick{this.onClickHandler.bind(this)}>INCREMENT</button>
    </div>
  );
}

Mettre à jour à l'aide de Jest

En fait, vous n'avez même pas besoin d'une bibliothèque tierce comme sinon. Vous pouvez réaliser la même chose en utilisant Jest:

it("check counter increment function is callled", () => {
  const spy = jest.spyOn(Counter.prototype, "onClickHandler");
  const wrapper = shallow(<Counter />);
  wrapper.find("button").simulate("click");
  expect(spy).toBeCalled();
});