如何编写反应导航的jest测试用例

时间:2018-04-09 08:15:50

标签: enzyme jest react-test-renderer

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

目前我编写的测试用例如下所示: 我有登录页面,上面有注册链接,将用户重定向到注册页面。所以我正在检查的是 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>
  </React.Fragment>

上面的代码寄存器是用于导航的链接。

提前感谢...

0 个答案:

没有答案