如何使用jest库编写导航的jest测试用例

时间:2018-04-09 09:56:27

标签: reactjs react-redux react-router jestjs enzyme

我是Jest测试用例写作的新手,尝试编写用于检查反应应用程序中导航的测试用例。

目前我编写的测试用例如下所示:我有登录页面,上面有注册链接,将用户重定向到Register页面。所以我要检查的是1.加载登录页面2.触发注册链接点击事件3.所以用户移动到注册页面

但我无法检查注册页面是否已加载?有没有办法检查“注册”页面的快照和URL中的链接。

我使用了 jest react-test-render ,如下面的代码所示。

登录页面Html -

<React.Fragment>       
<BodyContainer noDrawer fullSpan>
  <Grid container spacing={0} className={classes.gridContainer}>
    <Grid item xs={12} md={6} lg={7} className="login--form">
      <div className="login--form--container">
        <img src={LogoPurple} alt="ABL" className="onboarding-logo" />
        <h3>Welcome back! Please login to your account.</h3>
          {error ? <p>{error}</p> : null}
          <Field name="email" component={renderTextField} label="Email" style={styles.formField}/>
          <Field name="password" component={renderTextField} label="Password" style={styles.formField} />
          <Field name="rememberMe" component={renderCheckbox} label="Remember Me" />
          <div className="has-spacing">
            <Button variant="raised" size="large" color="primary" className="extraLarge" type="submit" onClick={this.handleSubmit}>
              Login
            </Button>
          </div>

          <Link to="forgot-password">Forgot Password</Link>
            <p className="need-account">
              Need an account?
              <Link to="/register">
                <strong> Sign up</strong>
            </p>
          </Link>
        <LegalLinks />
      </div>
    </Grid>
  </Grid>
</BodyContainer>

测试用例 -

 it('Terms of use link test ',()=>{
const component = renderer.create(
  <StaticRouter location="terms" context={props}>
    <Link to="/terms">Terms of use.&nbsp;</Link>
</StaticRouter>);
let tree = component.toJSON();
expect(tree).toMatchSnapshot(); });

it('Privacy policy link test ',()=>{
const component = renderer.create(
  <StaticRouter location="privacy" context={props}>
    <Link to="/privacy">Privacy policy</Link>
</StaticRouter>);
let tree = component.toJSON();
expect(tree).toMatchSnapshot();});

在上面的代码寄存器中是用于导航的链接。 请给我任何建议。 感谢....

0 个答案:

没有答案