Question

我很乐意在简单的待办事项列表中对组件进行单元测试。

这是组件：

   import React, { Component } from 'react';
import Task from '../Task';

export default class TaskList extends Component {

    render() {
        let tasks = this.props.items.map((item,index)=> <Task key={index} item={item} />)

        return (
            <ul>{tasks}</ul>
        )
    }

这是测试：

   import TaskList from './';
import Task from '../Task';

describe('<TaskList}/>', () => {
    let wrapper;
    beforeEach(()=>{
        wrapper = shallow(<TaskList items={["item 1", "item 2"]} />);
    })


    it('should have  2 list items', () => {
        expect(wrapper.find('ul')).to.have.length(1);
    })

});

无论我作为“项目”的元素输入（这些是组件的支柱） - “ul”的数量仅仅是一个。

此测试有什么问题？我怎样才能检查组件中有多少'ul'？

Answer 1

为了查看有多少＆＃39; ul＆＃39;在组件中我们应该使用chai函数： .childern（），像这样：

it('should have  2 list items', () => {
    expect(wrapper.find('ul').children()).to.have.length(2);
})

检查酶 - 反应我在组件中有多少ul

1 个答案: