2016-06-15 11 views
3

である私はユニットテストアクションを反応させる - browserHistoryは未定義

{ browserHistory } from 'react-router'; 

を使用して、私は私のテストを実行しているときに、自分の行動のためのテストを書く、browserHistoryは未知の理由のために定義されていない輸入。したがって、テストではエラーがスローされます。 "未定義のpush 'プロパティを読み取ることはできません。 私のアプリでうまくいけば、browserHistoryが未定義の理由は分かりません。誰かが私を助けることができますか?

答えて

11

私はあなたのテストを実行するためにカルマまたは任意のブラウザを使用していないと思います。ブラウザがない場合、オブジェクトbrowserHistoryは未定義になります。あなたのブラウザ履歴をスタブするためにsinonを使用する必要があるかもしれません。次多分役に立つような何か:

import chai from 'chai'; 
import sinonChai from 'sinon-chai'; 
import componentToTest from './component-to-test' 
import sinon from 'sinon'; 
import * as router from 'react-router'; 

var expect = chai.expect; 
chai.use(sinonChai); 

describe('Test A Component',() => { 

    it('Should success.',() => { 
     router.browserHistory = { push:()=>{} }; 
     let browserHistoryPushStub = sinon.stub(router.browserHistory, 'push',() => { }); 
     //mount your component and do your thing here 
     expect(browserHistoryPushStub).to.have.been.calledOnce; 

     browserHistoryPushStub.restore(); 
    }); 

}); 
+0

この答えで私のために鍵がある、だけではなく、 'browserHistory'または' hashHistory'の全体 'router'のインポートましたどのように私はそれを嘲笑しようとしていた。 –

1

時計(npm run test -- --watch)を使用する場合、私は(下)Invariant Violationを避けるために、元のrouter.browserHistoryを保存し、復元する必要がありました。

import * as router from 'react-router' 

describe('some description',() => { 
    const oldBrowserHistory = router.browserHistory 
    after(() => { router.browserHistory = oldBrowserHistory }) 

    it('some expectation',() => { 
    const spy = sinon.spy() 
    router.browserHistory = { push: spy } 

    // call your code here 

    expect(spy.withArgs(expectedArgs).calledOnce).to.be.true 
    }) 
}) 

不変違反:あなたは歴史のバージョン2.xまたはそれ以前のバージョンで作成した履歴オブジェクトを提供してきました。このバージョンのReact Routerは、v3の履歴オブジェクトとのみ互換性があります。履歴v3.xにアップグレードしてください。

(クレジットは私が正しい道に入門用user3682091する)

関連する問題