, wie man reagieren Komponentenmethoden mit Scherz verspotten und Enzym

Ich habe eine Komponente reagieren (dies wird vereinfacht, um das Problem zu demonstrieren):, wie man reagieren Komponentenmethoden mit Scherz verspotten und Enzym

class MyComponent extends Component { 
    handleNameInput = (value) => { 
     this.searchValue(value); 
    }; 

    searchValue = (value) => { 
     //Do something 
    } 

    render() { 
     reutrn(<div></div>) 
    } 
}

Jetzt möchte ich searchValue mit dem angegebenen Wert, der handleNameInput() Anrufe testen .

Um dies zu tun, möchte ich eine jest mock function erstellen, die die Komponentenmethode ersetzt.

Hier mein Testfall ist so weit:

it('handleNameInput',() => { 
    let wrapper = shallow(<MyComponent/>); 
    wrapper.searchDish = jest.fn(); 
    wrapper.instance().handleNameInput('BoB'); 
    expect(wrapper.searchDish).toBeCalledWith('BoB'); 
})

Aber alles, was ich in der Konsole ist SyntaxError:

Syntax

at XMLHttpRequest.open (node_modules/jsdom/lib/jsdom/living/xmlhttprequest.js:458:15) 
    at run_xhr (node_modules/browser-request/index.js:215:7) 
    at request (node_modules/browser-request/index.js:179:10) 
    at DishAdmin._this.searchDish (src/main/react/components/DishAdmin.js:155:68) 
    at DishAdmin._this.handleNameInput (src/main/react/components/DishAdmin.js:94:45) 
    at Object.<anonymous> (src/main/react/tests/DishAdmin.test.js:122:24)

Also meine Frage ist, Wie stelle ich Komponentenmethoden mit Enzym richtig vor?

Quelle

2017-01-24 Miha Šušteršič

Was ist der Syntaxfehler? –

Zu der Frage hinzugefügt :) –

Ohne genau zu wissen, was die Quelle ist, ist es unmöglich zu helfen - ich sehe keine Syntaxfehler in dem Code, den Sie gepostet haben. –

Das Verfahren kann auf diese Weise verspottet:

it('handleNameInput',() => { 
    let wrapper = shallow(<MyComponent/>); 
    wrapper.instance().searchDish = jest.fn(); 
    wrapper.update(); 
    wrapper.instance().handleNameInput('BoB'); 
    expect(wrapper.instance().searchDish).toBeCalledWith('BoB'); 
})

Sie müssen auch .update auf der Umhüllung der getesteten Komponente aufrufen, um die Schein Funktion ordnungsgemäß zu registrieren.

Der Syntaxfehler kam von der falschen Zuordnung (Sie müssen die Methode der Instanz zuweisen). Meine anderen Probleme kamen von .update() nachdem ich die Methode verspottete.

Quelle

2017-01-25 09:20:57

Für mich wirft es und Fehler mit 'expect (wrapper.searchDish)' - keine Spottfunktion oder Spion. Nur wenn ich zu 'expect (wrapper.instance(). SearchDish) wechsele' funktioniert es richtig. –

@NikSumeiko sogar ich bekam den gleichen Fehler, ich speicherte die Mock-Funktion in eine Variable und überprüft 'toBeCalledWith' auf dem: ' const searchDishMock = jest.fn(); ... expect (searchDishMock) .toBeCalledWith ('BoB'); ' – Yusufali2205

Wenn' wrapper.update(); 'nicht funktioniert, können Sie auch' wrapper.instance(). ForceUpdate(); 'versuchen –

@ arbeitete Miha Antwort mit einer kleinen Änderung:

it('handleNameInput',() => { 
    let wrapper = shallow(<MyComponent/>); 
    const searchDishMock = jest.fn(); 
    wrapper.instance().searchDish = searchDishMock; 
    wrapper.update(); 
    wrapper.instance().handleNameInput('BoB'); 
    expect(searchDishMock).toBeCalledWith('BoB'); 
})

Quelle

2017-09-14 21:20:41 Yusufali2205

, wie man reagieren Komponentenmethoden mit Scherz verspotten und Enzym

Antwort

Verwandte Themen