无法读取未定义的 react-redux-jest 的属性“prop”答案

【问题标题】：Cannot read property 'prop' of undefined react-redux-jest无法读取未定义的 react-redux-jest 的属性“prop”
【发布时间】：2019-01-21 10:01:44
【问题描述】：

我在第二次测试时出错。他们怎么了？我按文档做所有事情，但有错误：“无法读取未定义的属性'prop'”。我尝试使用 Provider，但它对我没有帮助，也许我做错了什么？

我可以调试它吗？

BoardContainer.test.js

import React from 'react'
import configureStore from 'redux-mock-store'

import ConnectedBoard,{Board} from './BoardContainer'

import { shallow, configure,mount} from 'enzyme'
import Adapter from 'enzyme-adapter-react-16';
import {Provider} from 'react-redux'
import PropTypes from 'prop-types';



configure({adapter: new Adapter()});

const boards = [{
  id: 1,
  title: 'first_board'
}, {
  id: 2,
  title: 'second_board',
}];

describe('>>>H O M E --- REACT-REDUX (Shallow + passing the {store} directly)',()=> {
  const initialState = {boards: boards};
  const mockStore = configureStore();
  let store, wrapper;

  beforeEach(()=>{
    store = mockStore(initialState);
    wrapper = shallow( <Provider store={store}><ConnectedBoard /></Provider> );

  })


  it('+++ render the connected(SMART) component', () => {
    expect(wrapper.length).toEqual(1);
  });

  it('+++ check Prop matches with initialState', () => {
    expect(wrapper.prop('boards')).toEqual(initialState.boards);
  });

})

BoardContainer.js

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

import {loadBoards} from '../../actions/boardJS'
import Board from '../../components/Board/Board'

export class BoardContainer extends Component {
  getBoards() {
    fetch(process.env.REACT_APP_DEV_API_URL + `todo_lists`)
        .then(res => res.json())
        .then(data => {
          this.props.dispatch(loadBoards(data))
        })
  }

  componentDidMount() {
    this.getBoards()
  }

  render() {
    return <Board/>
  }
}

const mapStateToProps = state => {
  return {
    boards: state.boards
  }
}

export default connect(mapStateToProps)(BoardContainer)

如果有人知道解决方案，那就太好了:)

【问题讨论】：

标签： reactjs react-redux jestjs

【解决方案1】：

看起来您正在查看 Provider 组件的 props 而不是 ConnectedBoard 组件。

我还要注意以下几点：

“在浅包装器上调用时，.prop(key) 将返回组件呈现的根节点上的 props 值，而不是组件本身。” - https://airbnb.io/enzyme/docs/api/ShallowWrapper/prop.html

您能否详细说明一下，您说缺少属性“prop”，但这意味着包装器没有分配 ShallowWrapper。这意味着 beforeEach 没有执行......我怀疑测试 1 是否成功。

错误是不是 props 本身没有定义？当您尝试访问属性“板”时

【讨论】：