효소 반응을 확인하십시오. 성분 중 몇 개가 반응합니까?

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); 
    }) 

}); 

아무리 내가 "항목"(이 구성 요소의 소품입니다)의 elemnts로 입력 한 내용 - 'ul'의 양은 알 수없는 것입니다.

이 테스트의 문제점은 무엇입니까? 구성 요소에 'ul'이 얼마나 있는지 확인할 수 있습니까? 이 같은 .childern() : 우리가 차이 기능을 사용하는 방법 많은 'UL'구성 요소를 확인하기 위해

Answer 1

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