2016-09-29 91 views
2

可以使用酶的方法.simulate()定製事件。 例如:使用酶模擬自定義事件?

// Code 
<Element onFoo={someFunction}></Elements> 

// Test 
const element = shallow(<Element>); 
element.simulate('foo'); 

這是方式自定義事件應與酶進行測試或者是一個更好的方法來使用某事物像:

//Test 
const element = shallow(<Element>); 
element.props.onFoo() 

回答

2

看來,.simulate()自定義事件沒有實現。目前在GitHub上,一個issue其中這個話題進行了討論,並建議使用您所提供的第二種方法的維護者之一:

wrapper.find(Child).prop('customEvent')(fakeEvent) 
+1

感謝您的回答。只要on ..在它之前(例如onFoo),就可以在自定義事件上模擬()炒作。我只是徘徊,如果api更改會崩潰我的測試,因爲我'濫用'模擬()方法,或者不是一個錯誤的做法,並且實現是好的。 – Frank

0

什麼爲我工作,試圖siumlate自定義事件上這是一個組件不是頂層成分如下:

const myComponent = enzymeWrapper.find('MyComponent'); 
myComponent.node.onThingSelected({}, { thing: newThing}); 

凡myComponent的是一個陣營組成部分,onThingSelected是完全一樣的命名組件上的自定義事件處理程序,newThing是預期類型的​​對象由事件處理程序。

1

但是,它不是實際上已經在當前的淺層渲染?

/* Film component */ 
render() { 
    return (
    ... 
    <FilmHeader onSearchClick={this.handleSearchClick}> 
    ... 
) 
} 

/* Test */ 
const wrapper = shallow(<Film {...props} />); 
wrapper.find('FilmHeader').simulate('searchClick'); 

雖然上述酶issue仍然是公開的。並且文檔沒有說明這個特性的任何明顯的內容。所以也許這個問題是文檔本身。

+0

上面的代碼對我來說工作得很好,至少與Enzyme 3和React 16是一樣的。 – dubbha

+0

@KARTHIKEYAN A.,不確定我得到你的'。,可能在之前.'編輯,你能改說嗎? – dubbha