Jest/Enzyme kann Klasseneigenschaft nicht vortäuschen

Question

Ich schreibe gerade Tests für React-Komponenten mit Jest an Enzyme. Ich stehe fest, wenn ich eine Klasseneigenschaftsfunktion, die mit Pfeilsyntax geschrieben ist, verspotten muss: Der Schein wird nicht angewendet. Hier

ist ein Auszug der getesteten Komponente:

class MaClass extends React.Component { 
    ... 
    componentWillMount() { 
    this.getNotifications() 
    } 
    getNotifications =() => { 
    axios.get(window.Routing.generate(
     'api_notifications_get_collection' 
    ), { 
     headers: { 
     'Accept': 'application/json' 
     } 
    }).then(response => { 
     this.setState({ 
     notifications: response.data 
     }) 
    }).catch(error => { 
     console.log('Error : ', error) 
    }) 
    } 
    ... 
} 

Und hier ist der Test:

import React from 'react' 
import { configure, shallow } from 'enzyme' 
import Adapter from 'enzyme-adapter-react-15' 

import NotificationsComponent from './NotificationsComponent' 

configure({adapter: new Adapter()}) 

describe('Testing NotificationsComponent',() => { 
    /** 
    * This should call getNotifications 
    */ 
    test('getNotifications should be called',() => { 
    let wrapper = shallow(<NotificationsComponent />) 
    const getMock = jest.fn() 
    wrapper.instance().getNotifications = getMock 
    wrapper.update() 
    expect(getMock).toHaveBeenCalled() 
    }) 
}) 

Soweit zu lesen, das ist der richtige Weg für regelmäßige Methoden zu tun. Aber es scheint, dass Klasseneigenschaftsfunktionen, die mit Pfeilsyntax geschrieben sind, auf diese Weise nicht verspottet werden können.

Mein Terminal wirft einen Fehler über das, was im Inneren des Bauteils Methode getestet ist:

TypeError: Cannot read property 'generate' of undefined

was bedeutet, dass das Mock nicht durchlaufen wird.

Würde jemand darauf hinweisen, wo ist mein Fehler bitte? Vielen Dank.

Answer 1

Sie verwenden den falschen Lebenszyklushaken. componentWillMount heißt "innen" shallow(<NotificationsComponent />). Somit wurde das Original getNotifications aufgerufen.

wrapper.update() erzwingt ein erneutes Rendering und bindet die Komponente nicht erneut ein, sodass die Zuweisung des Mocks nicht den gewünschten Effekt erzielt.