Jak drwić React metod składnik o żartach i enzymów

Question

Mam składnikiem reakcji (to jest uproszczone w celu wykazania wydania)

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

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

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

Teraz chcę przetestować że handleNameInput() Telefonowanie searchValue z podanej wartości .

W tym celu chciałbym stworzyć jest mock function, który zastępuje metodę komponentu.

Oto mój przypadek testowy do tej pory:

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

Ale mam w konsoli jest SyntaxError:

SyntaxError

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) 

Więc moje pytanie brzmi: jak właściwie kpić z metod składowych z enzymem?

Answer 1

Metoda może być wyśmiewany w ten sposób:

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

też trzeba zadzwonić .update na opakowaniu badanego składnika w celu zarejestrowania funkcji makiety prawidłowo.

Błąd składniowy pochodził z niewłaściwego przypisania (trzeba przypisać metodę do instancji). Inne moje problemy wynikały z braku wywoływania .update() po wyśmiewaniu metody.

Answer 2

@ odpowiedź miha pracował z małą zmianą:

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