无法测试React Router中存在的组件？

Question

我在我的app文件中定义了我的路线，就像这样。我正在使用jest和酶来测试，但是，我的快照永远不会匹配。在我的测试中渲染时，我手动将道具注入组件，但快照似乎总是只输出一个空div。

我已经附上：

• 错误日志
• 组件
• Component.Spec
• 路由文件

错误日志

TypeError: Cannot read property 'have' of undefined

  37 |         // ).toJSON()
  38 |         // expect(wrapper).toMatchSnapshot();
> 39 |         expect(wrapper.find('test')).to.have.length(0)

  40 |     });
  41 |
  42 | });

测试

import Dashboard from '../src/Dashboard/components/Dashboard';
const wrapper = shallow(<Dashboard />);
console.log(wrapper.find('.test'))
// const DashboardComponent = withRouter(Dashboard);

// Snapshot for Home React Component
describe('>>>D A S H B O A R D --- Snapshot',()=>{
    it('+++capturing Snapshot of Dashboard', () => {
        expect(wrapper.find('test')).to.have.length(0)
    });

App.js

import React, { Component } from 'react';
import Dashboard from './Dashboard/containers/DashboardContainer';
import Budget from './Budget/containers/BudgetContainer'
import { BrowserRouter as Router, Route, Switch } from 'react-router-dom';

export default class App extends Component {
  render() {
    return (
      <div>
        <Router>
          <div>
            <Dashboard />
            <Route path="/editBudget" component={Budget} />
            <Route path="/settings" component={Budget} />
          </div>
        </Router>
      </div>
    );
  }
}

我的仪表板组件如下所示（呈现两个子组件）

控制台

  render() {
    return (
      <div>
        <div className="test"/>
      </div>
    )
  }

Answer 1

<Router history={browserHistory}>
<Route path="/" component={Main}>
         <IndexRoute component={Dashboard} />
         <Route path="/editBudget" component={Budget} />
    </Route>
</Router>

请使用Indexroute显示要在页面上呈现的默认组件。