测试与开玩笑和酶的反应组件.错误:无法读取地图的属性未定义

Question

，所以我无法从父元组件中传递出来，也无法成功地将它们设置为自己。目前，我并不是要特别测试任何内容。只是组件"存在"而没有错误

组件代码：

import React, { Component } from 'react';
import TodoItem from './TodoItem';
class TodoList extends Component {
    renderTodos = () => {
        const { todos } = this.props;
        return todos.map(todo => {
            return <TodoItem key={todo.id} {...todo} />;
        });
    };
    render() {
        return (
            <div>
                {this.renderTodos()}
            </div>
        );
    }
}
export default TodoList;

测试代码：

import React from 'react';
import { shallow } from 'enzyme';
import renderer from 'react-test-renderer';
import TodoList from './TodoList';
import TodoItem from './TodoItem';
describe(TodoList, () => {
    const todos = [
        {
            id: 1,
            text: 'Walk the walk'
        },
        {
            id: 2,
            text: 'Talk the talk'
        }
    ];
    const component = shallow(<TodoList todos={todos} />);
    it('should exist', () => {
        const component = renderer.create(<TodoList />);
        const tree = component.toJSON();
        expect(tree).toMatchSnapshot();
    });
});

请帮忙。开玩笑的新手，一般是测试的新手。

Answer 1

创建组件的浅实例时，您需要传递您在零件中使用有条件检查的道具

const component = shallow(<TodoList todos={[]}/>);

和

const component = renderer.create(<TodoList todos={[]}/>);