Question

我总是遇到以下错误，而我尝试运行以下测试用例，该测试用例应该验证URL。如果需要，函数validateUrl应该添加前缀＆＃34; http：//＆＃34;到URL。我这样做是因为我使用的API没有这个前缀：

import userDetail from '../src/container/user-detail'

describe('UrlValidation', () => {
    it('should be a valid string', () => {
    var result = new userDetail()
    result.validateUrl("google.com")
    exept (result).toBe("http://google.com")
    })
})

userDetail看起来像这样：

import React, { Component } from 'react';
import { connect } from "react-redux";

class UserDetail extends Component {
    renderUser(userData){
    return (
      <tr key={userData.id}>
        <td>
            {userData.name}
        </td>
        <td>
            <a target="_blank" href={this.validateUrl(userData.website)}>{userData.website}</a>
        </td>
        <td>
            {userData.address.city}
        </td>
        <td>
            <a>
                <img alt="edit" src="./media/edit-icon.svg" className="edit-img"></img>
            </a>
        </td>

      </tr>
      );
  }
  validateUrl(providedUrl){
      var url = providedUrl;
      var r = new RegExp('/^(http|https):\/\/[^ "]+$/');
      if (!r.test(url)) {
          return "http://" + providedUrl
      } else {
          return providedUrl
      }
  }
  render() {
      const {users} = this.props
      console.log(users.map(user => this.renderUser(user)));
      return (
          <table className="table table-hover">
              <thead>
                  <tr>
                      <th>Name</th>
                      <th>Website</th>
                      <th>City</th>
                      <th>Edit</th>
                  </tr>
              </thead>
              <tbody>
                  {users.map(user => this.renderUser(user))}
              </tbody>
          </table>
      )}
  }

  function mapStateToProps({ users }){
    return { users }; // { user } == { user: user }
  }

  export default connect(mapStateToProps)(UserDetail);

我不清楚，我在定义中的错误是什么。

我首先想到函数validateUrl是不可访问的，但应该是。

输出如下：

joshii @ laptop~ / dev / User-Manager / UserManagement $ npm test

user-management@1.0.0 test / home / joshii / dev / User-Manager / UserManagement   开玩笑

失败测试 /app.test.jsx      UrlValidation        ✕应该是一个有效的字符串（3ms）

●UrlValidation>应为有效字符串
 TypeError: Cannot read property 'store' of undefined

   3 | describe('UrlValidation', () => {
   4 |     it('should be a valid string', () => {
  >5 |       var result = new userDetail()
   6 |       result.validateUrl("google.com")
   7 |       exept (result).toBe("http://google.com")
   8 |     })
   9 | })

   at new Connect (node_modules/react-redux/lib/components/connect.js:102:29)
   at Object.<anonymous> (__tests__/app.test.jsx:5:18)
测试套房：1次失败，共1次测试：1次失败，共1次快照：总共0 时间：0.744s，估计1s 跑完所有测试套件。错误的ERR！测试失败。有关详细信息，请参见上文。

Answer 1

你validateUrl函数看起来更像是库函数而不是类成员（你不能在它的任何地方使用this）所以我建议你把它移到一个单独的位置lib文件（也许可以在代码中的其他地方重用它）。那么测试会更容易;）

但是，如果您只是想在没有Redux部分的情况下测试您的validateUrl函数，请尝试单独导出该类（例如，将导出添加到您的类定义，如export class UserDetail extends Component {....}），然后在您的测试用例中：

import {UserDetail} from ''../src/container/user-detail'

describe('UrlValidation', () => {
    it('should be a valid string', () => {
    var result = new UserDetail()
    result.validateUrl("google.com")
    expect(result).toBe("http://google.com")
    })
})

Jest TypeError：无法读取＆＃39;存储＆＃39;未定义的

1 个答案: