Question

我知道有很多“无法读取属性“ .find”为未定义“问题，但是我一直在寻找它们，却没有找到我想要的答案。我正在运行我的组件的测试..并且此测试未通过..我能够使其他测试通过..但“ .find”返回未定义的错误..整个上午都在查看它，但是无法找到解决方案..有人可以帮助我吗？这是commentList.test.js文件：

import React from 'react';
import { mount } from 'enzyme';

import { CommentList } from 'components/commentList';
import Root from 'Root';

let wrapped;
beforeEach(() => {
  const initialState = {
    comments: ['Comment 1', 'Comment 2']
  };

  wrapped = mount(
    <Root initialState={initialState}>
      <CommentList />
    </Root>
  );
});

it('creates one LI per comment', () => {
  expect(wrapped.find('li').length).toEqual(2);
});

这是commentList.js文件

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

class CommentList extends Component {
  renderComments() {
    return this.props.comments.map(comment  => {
      return <li key={comment}>{comment}</li>
    })
  }

  render() {
      return (
        <div>
          <ul>
            {this.renderComments()}
          </ul>
      </div>
    )
}
}

const mapStateToProps = (state) => {
  return {
    comments: state.comments
  };
}

export default connect(mapStateToProps)(CommentList);

最后是Root.js文件：

import React from 'react';
import { Provider } from 'react-redux';
import { createStore } from 'redux';
import reducers from 'reducers';

export default ({ children, initialState = {} }) => {
  return (
    <Provider store={createStore(reducers, initialState)}>
      {children}
    </Provider>
  )
}

这是我的终端机中可以看到的蜜蜂 enter image description here

Answer 1

尝试查找主机节点：

it('creates one LI per comment', () => {
  expect(wrapped.hostNodes().find('li').length).toEqual(2);
});

https://github.com/airbnb/enzyme/blob/master/docs/api/ShallowWrapper/hostNodes.md

Answer 2

这可能有点晚了。.当时我无法给出答案，因为我没有给出要求的声誉来给出答案..大声笑..但对于那些一直关注此问题并想知道我在哪里做修复..这是

替换此行代码

import { CommentList } from 'components/commentList';

与此：

import CommentList from 'components/commentList';

希望这对外面的人会有所帮助。

TypeError：运行测试时无法读取React-redux中未定义的属性'find'

2 个答案: