使用 React 组件开玩笑测试失败

Question

我正在尝试测试一个 React 组件，这里是测试

jest.dontMock('../js/components/Navigation.js');
var React = require('react/addons');
var Navigation = require('../js/components/Navigation.js');
var Router = require('react-router').Router;
var Route = require('react-router').Route;
var Link = require('react-router').Link;
TestUtils = React.addons.TestUtils;

describe('Navigation', function() {

 var NavElement = TestUtils.renderIntoDocument(
    <Navigation items={['nav1', 'nav2', 'nav3']} />
  );

  var items = TestUtils.scryRenderedDOMComponentsWithTag(NavElement, 'li');


  it('renders each item as a li', function() {
    expect(items.length).toEqual(3);


  });


});

这是组件

var React = require('react');
var Router = require('react-router').Router;
var Link = require('react-router').Link;
var RouteHandler = require('react-router').RouteHandler;    

var Navigation = React.createClass({
    render: function() {
        return (
            <div>
            <header>
            <ul>
            <li><Link to="nav1">nav1</Link></li>
            <li><Link to="nav2">nav2</Link></li>
            <li><Link to="nav3">nav3</Link></li>
            </ul>
            </header>
            <RouteHandler />
            </div>
            );
        }
    });

当我运行 'npm test' 我得到以下警告和错误警告：React.createElement：类型不应为空、未定义、布尔值或数字。它应该是一个字符串（对于 DOM 元素）或一个 ReactClass（对于复合组件）。

  - Invariant Violation: Element type is invalid: expected a string (for built-in components) or a class/function (for composite components) but got: undefined.

我错过了什么？

我尝试删除并重新安装节点模块还尝试导入为

var Navigation = require('../js/components/Navigation.js').default;

并使用

modules.export = Navigation;

Answer 1

你的组件有没有

module.exports = App;

部分?

看起来您可能没有正确导入它

您还需要在组件文件中导入 Link 和 RouteHandler 组件，就在您导入 React 的位置下。

使用 React 组件开玩笑测试失败

Jest test failure with React component

browserify

reactjs

jestjs