小编r31*_*gN_的帖子

React Enzyme - 测试`componentDidMount`异步调用

大家.

在发生异步调用后,我遇到了测试状态更新的奇怪问题componentDidMount.

这是我的组件代码:

'use strict';


import React from 'react';
import UserComponent from './userComponent';
const request = require('request');


class UsersListComponent extends React.Component {
  constructor(props) {
    super(props);

    this.state = {
      usersList: []
    };
  }

  componentDidMount() {
    request('https://api.github.com/users', (err, res) => {
      if (!err && res.statusCode === 200) {
        this.setState({
          usersList: res.slice(0)
        });
      }
      else {
        console.log(err);
      }
    });
  }

  render() {
    if (!this.state.usersList.length) {
      return null;
    }

    return (
      <div className="users-list">
        { this._constructUsersList() }
      </div>
    );
  }

  _constructUsersList() {
    return …
Run Code Online (Sandbox Code Playgroud)

javascript reactjs enzyme

11
推荐指数
2
解决办法
8869
查看次数

使用Browserify设置Karma以测试React(ES6)组件

我在使用Karma + Browserify为一些React组件设置测试配置时遇到了麻烦.提到代码是用ES6编写的,我已升级到最新的Babel版本(6+),我认为这是该配置中所有邪恶的根源.

由于Babel现在被拆分并且有这种基于插件的方法(预设),我不知道如何在karma.conf文件中指定它.

我当前的配置如下所示:

module.exports = function(config) {
  config.set({
    basePath: '',
    browsers: ['PhantomJS'],
    frameworks: ['browserify', 'jasmine'],
    files: [
      'app/js/**/*',
      'app/__tests__/**/*'
    ],
    preprocessors: {
      'app/js/**/*': ['browserify'],
      'app/__tests__/**/*': ['browserify']
    },
    browserify: {
      debug: true,
      transform: ['babelify']
    },
    singleRun: true
  });
};
Run Code Online (Sandbox Code Playgroud)

但是,这会因为包错误而失败(解析文件时出现意外的令牌......).我也收到You need to include some adapter that implements __karma__.start method!错误消息.

对于一些非常简单的组件来说,这很有趣.

例如简单的React文件:

import React from 'react';


class FooterComponent extends React.Component {
  render() {
    return (
      <footer>
        This is the application's footer
      </footer>
    );
  }
}


export …
Run Code Online (Sandbox Code Playgroud)

javascript browserify ecmascript-6 karma-runner babeljs

6
推荐指数
1
解决办法
1145
查看次数