は未定義の「プッシュ」に反応ルータ

Question

私はそうのようにルータを反応させ使用するコンポーネントを持たを読み取ることができない、ユニットテストに反応：

_viewCompany(companyId) { 
    this.context.router.push(`/admin/companies/${companyId}`); 
} 

それはコンポーネントで素晴らしい作品が、コンポーネントのテストを書きながら、私は走りましたエラーになります。ここでは、問題を引き起こしてテストがある（私は、酵素、冗談、sinonを使用しています）：

it('should call _viewCompany',() => { 
     jest.spyOn(CompaniesList.prototype, '_viewCompany'); 
     wrapper = mount(<CompaniesList {...props}/>); 
     const viewButton = wrapper.find('.btn-info').at(0); 
     viewButton.simulate('click'); 
     expect(CompaniesList.prototype._viewCompany).toHaveBeenCalled(); 
    }); 

をこのテストでは、次のことを言って、エラーを返します。

Cannot read property 'push' of undefined

は私が行うことができるものがありますそれを嘲笑したり、テストのための空の関数を作成したりできますか？

Answer 1

コンポーネントをマウントするときにコンテキストオブジェクトを渡す必要があります。

function Router() { 
    this.router = []; 

    this.push = function(a) { 
    this.router.push(a); 
    }; 

    this.get = function(index){ 
     return this.router[index]; 
    } 
    this.length = function(){ 
    return this.router.length; 
    } 
} 

function History() { 
    this.history = []; 

    this.push = function(a) { 
    this.history.push(a); 
    }; 

    this.get = function(index){ 
    return this.history[index]; 
    } 
    this.length = function(){ 
     return this.history.length; 
    } 
} 

it('should call _viewCompany',() => { 
    jest.spyOn(CompaniesList.prototype, '_viewCompany'); 
    wrapper = mount(<CompaniesList {...props}/>,{context:{router: new 
       Router(), history: new History()}}); 
    const viewButton = wrapper.find('.btn-info').at(0); 
    viewButton.simulate('click'); 
    expect(CompaniesList.prototype._viewCompany).toHaveBeenCalled(); 
    expect(wrapper.context().router.length()).toEqual('1'); 
}); 

コンテキストオブジェクトもテストできます。上記のように