React Router V4单元测试

Question

我知道如何编写以前反应路由器的单元测试，如何使用react路由器v4实现它。我用摩卡。单元测试是否有任何差异。如何测试if语句的每个路由。我认为浏览器历史记录和indexroute没有必要。

routes.js：

const Routes = ({isLoggedIn, redirectToLoginPage, login}) =>
    <BrowserRouter>
        <Switch>
            <Route path='/login-callback' render={() => {

                if (!isLoggedIn)
                    login()
                return <Redirect to="/"/>

            }}
            />
            <Route path="/" render={({location}) => {

                if (!isLoggedIn)
                    redirectToLoginPage()

                return (
                    <Root >
                        <Switch>
                            <Route path='/home' component={Home} />
                            <Route path='/devices' component={Devices} />
                            <Route path='/users' exact component={Users} />
                            <Route path='/users/add' component={AddOrEditUser}/>
                            <Route path='/users/edit/:personId' component={AddOrEditUser}/>
                            <Route path='/patients' exact component={Patients} />
                            <Route path='/patients/add' component={AddOrEditPatient} />
                            <Route path='/patients/edit/:personId' component={AddOrEditPatient} />
                            <Route path='/plans' component={Plans} />
                            <Route path='/commissioning' component={Commissioning} />
                            <Route path='/server-settings' component={ServerSettings} />
                            <Route path='/about' component={About} />
                            <Route path='/' exact component={Home} />
                        </Switch>
                    </Root>)
            }}
            />
        </Switch>
    </BrowserRouter>

路由-test.js：

import Home from '../src/components/homePage'
import Devices from '../src/components/devices'
import ServerSettings from '../src/components/settings'
import About from '../src/components/aboutPage'
import Users from '../src/components/users'
import Plans from '../src/components/plans'
import Routes from '../src/routes'
import Patients from '../src/components/patients'
import {Route, IndexRoute, browserHistory, hashHistory } from 'react-router'

describe('<Routes/>', () => {
    let routes
    let authenticate
    let processLoginCallback

    beforeEach(() => routes = shallow(<Routes authenticate={authenticate=sinon.spy()} processLoginCallback={processLoginCallback = sinon.spy()}/>))

    describe('Renders child components', () => {
        it('renders <IndexRoute/>', () => {
            routes.find(IndexRoute).should.have.lengthOf(1)
            routes.find(IndexRoute).props().component.should.equal(Home)
        });

        [{ path: 'home', component: Home },
        { path: 'devices', component: Devices },
        { path: 'users', component: Users },
        { path: 'plans', component: Plans },
        { path: 'patients', component: Patients },
        { path: 'server-settings', component: ServerSettings },
        { path: 'about', component: About }]
        .forEach(x =>
            it('renders <Route/> to ' + x.path, () => {
                routes.find(Route).some({ path: x.path, component: x.component }).should.be.true
            }))
    })

    it('Should use history but not hashHistory', () => {
        routes.props().history.should.be.equal(browserHistory)
        routes.props().history.should.not.be.equal(hashHistory)
    })

    it('on entering application root should call authenticate', () => {
        routes.find(Route).findWhere(x => x.props().path === '/').props().onEnter()

        authenticate.calledOnce.should.be.true
    })

    it('on entering /login-callback should call processLoginCallback', () => {
        routes.find(Route).findWhere(x => x.props().path === '/login-callback').props().onEnter()

        processLoginCallback.calledOnce.should.be.true
    })
})