メソッドをテストする方法は、酵素で一度呼び出されます

Question

ドロップダウンメニューのonChangeイベントによってトリガされる私のhandleChange関数をテストします。そのメニューに関する反応構造を以下に示します。

class StationNavigationBar extends React.Component { 
handleChange = (event, index, value) => { 
    this.props.onStationChange(value); 
    } 

render() { 
    return (
<DropDownMenu value={this.props.initial} onChange={this.handleChange}> 
       { this.props.stations.map((station, index) => 
       <MenuItem key={station.id} value={station.id} primaryText={station.name} /> 
      )} 
      </DropDownMenu> 
); 
} 
} 

私はそのhandleChange機能をスパイする酵素を使用しようとしましたが、ここに私の現在のテストコードは、スパイ機能はonChangeイベントを検出することができないようです。

describe("when `dropDownMenu` is changed",() => { 
    it("onStationChange should be called",() => { 
    let props = { 
     initial: 'Something', 
     title: 'something', 
     onStationChange:()=>{}, 
     onLogOut:()=>{}, 
     stations: [{ 
     id: '1', 
     name: "Station 2" }, 
     { id: '2', 
     name: "Station 3" }, 
     { id: '3', 
     name: 'Station 4'}] 
    }; 
    const stationNavigationBar = shallow(<StationNavigationBar {...props} />); 
    const instance = stationNavigationBar.instance(); 
    const goSpy = sinon.spy(instance, 'handleChange'); 
    stationNavigationBar.update(); 
    const toolbarGroup = stationNavigationBar.find('ToolbarGroup'); 
    const dropDownMenu = toolbarGroup.find('DropDownMenu'); 
    dropDownMenu.simulate('change'); 
    expect(goSpy.calledOnce).toBe(true); 
    }); 
    }); 

私が注意しなかった部分はありますか？私のテストケースでは、どの部分が欠けていましたか。

Answer 1

スパイメソッドを作成し、スパイをonStationChangeプロップとして渡します。

const onStationChange = sinon.spy(); 

const props = { 
    initial: 'Something', 
    title: 'something', 
    onStationChange, 
    //... 
};