Question

我第二次测试有错误。他们怎么了？我按文档进行了所有操作，但有错误：“无法读取未定义的属性'prop'”。我尝试使用提供程序，但对我没有帮助，也许我做错了什么？

我可以以某种方式调试它吗？

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)

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

Answer 1

您似乎正在查看提供程序组件而不是ConnectedBoard组件的道具。

我还要注意以下几点：

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

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

道具本身的错误事实是否未定义？当您尝试访问属性“木板”

无法读取未定义的react-redux-jest的属性'prop'

1 个答案: