Ik wissel naar Jest from Mocha en ik vraag me af of er een manier is om een React-methode te bespioneren. Laten we bijvoorbeeld zeggen dat ik de volgende methode in mijn component heb (negeer de sdk
-bibliotheek, het maakt gewoon een jQuery Ajax-aanroep):
getData() {
sdk.getJSON('/someURL').done(data => {
this.setState({data});
});
}
Met Sinon zou ik dit testen door het prototype als volgt te bespioneren:
it('should call getData', () => {
sinon.spy(Component.prototype, 'getData');
mount(<Component />);
expect(Component.prototype.getData.calledOnce).to.be.true;
});
Dit zou codedekking garanderen zonder de methode te bespotten. Is er vergelijkbare functionaliteit in Jest?
EDIT: En als deze functionaliteit niet bestaat, wat is dan de beste strategie voor het testen van API-aanroepen?
Antwoord 1, autoriteit 100%
Er is de spyOn
methode, die enkele dagen geleden met v19 werd geïntroduceerd, die precies doet wat u zoekt
Antwoord 2, autoriteit 99%
Eigenlijk kun je jest.spyOn jest.spyOn gebruiken
Als de methode wordt aangeroepen bij het maken van een component, gebruik dan:
import { mount } from 'enzyme';
describe('My component', () => {
it('should call getData', () => {
const spy = jest.spyOn(Component.prototype, 'getData');
mount(<Component />);
expect(spy).toHaveBeenCalledTimes(1)
});
})
Of als u het in uw DOM en methode hebt, gebruikt u Bind U kunt gebruiken:
import { shallow } from 'enzyme';
describe('My component', () => {
it('should call getData', () => {
const wrapper = shallow(<Component />);
const instance = wrapper.instance()
const spy = jest.spyOn(instance, 'getData');
wrapper.find('button').simulate('click')
expect(spy).toHaveBeenCalledTimes(1)
});
})
Antwoord 3, Autoriteit 79%
U kunt gaan voor de nieuwe spyOn
-methode of het volgende moet ook goed werken.
it('should call getData', () => {
Component.prototype.getData = jest.fn(Component.prototype.getData);
expect(Component.prototype.getData).toBeCalled();
});
Antwoord 4, Autoriteit 21%
Ik gebruik JEST met react 16.8 – dit werkte voor mij:
it("lifecycle method should have been called", () => {
jest.spyOn(RedirectingOverlay.prototype, 'componentWillUnmount');
jest.spyOn(RedirectingOverlay.prototype, 'componentDidMount');
const wrapper = mount(<RedirectingOverlay message="Hi There!"/>);
expect(RedirectingOverlay.prototype.componentDidMount).toHaveBeenCalledTimes(1)
wrapper.unmount()
expect(RedirectingOverlay.prototype.componentWillUnmount).toHaveBeenCalledTimes(1)
})
Gebruik ook:
"enzyme": "^3.6.0"
"jest": "23.5.0"
"enzyme-adapter-react-16": "^1.5.0"