浅在反应测试中无法正常工作

时间:2018-10-13 13:08:07

标签: reactjs react-test-renderer

我有一个下面的部分,

class CampaignLanding extends Component {
  constructor(props) {
    super(props);
  }

  render() {
    let { hasError } = this.props;
    if (hasError) {
      return <Page404 />;
    } else {
      return (
        <div>
          <Switch>
            <Route
              path="/vacions/:delogin"
              component={Login}
            />
          </Switch>
          <div
            className={classNames('filter-overlay', {
              show: showFilterOverlay
            })}
          />
        </div>
      );
    }
  }
}

function mapStateToProps(state) {
  if (state.user) {
    return {
      user: state.user.content
    };
  } else {
    return {
      id: state.app.id
    };
  }
}

function mapDispatchToProps(dispatch) {
  return {
    actions: {
      getUser: bindActionCreators(getUser, dispatch)
    }
  };
}

export default connect(mapStateToProps, mapDispatchToProps, null, {
  withRef: true
})(CampaignLanding);

我试图按照以下方式运行规范,

const store = configureStore(window.REDUX_STATE || {});
const LocalProps = {
  match: {
    hasError: true
  }
};

// Snapshot for Home React Component
export const CustomProvider = ({ children }) => {
  return (
    <Provider store={store}>
      {children}
    </Provider>
  );
};

// Snapshot for Home React Component
describe('>>>Campaign Landing --- Snapshot', () => {
  it('+++Capturing Snapshot of CampaignLanding', () => {
    const wrapper = shallow(<CustomProvider><CampaignLanding {...LocalProps} /></CustomProvider>);
    expect(wrapper.contains(<Page404 />)).toBe(true);
  });
});

我已使用此测试用例来检查404页面是否退出。根据我的代码,它应该返回true,但是接收到的值为false ..我做错了什么?

当我运行以下测试时,

it('+++Capturing Snapshot of CampaignLanding', () => {
    const renderedValue = renderer.create(<CustomProvider><CampaignLanding {...LocalProps} /></CustomProvider>).toJSON()
    expect(renderedValue).toMatchSnapshot();
  });

它显示以下错误,

永久违反:您不应在<Switch>之外使用<Router>

你能给个建议吗?

0 个答案:

没有答案