Тестирование JSX внутри .map функции с помощью фермента

Question

Так сказать, у меня есть эта таблица:

<table> 
    <thead> 
    <tr> 
     <th>cat name</th> 
    </tr> 
    </thead> 
    <tbody> 
    {cats.map(cat => { 
     return (
     <tr key={cat.id}> 
      <td styleName="table-item">{ cat.name }</td> 
     </tr> 
    ); 
    })} 
    </tbody> 
</table> 

Как я идти о тестировании JSX внутри функции карты с ферментом?

Я в состоянии проверить другие части этого хорошо, как так:

describe('<CatsTable />',() => { 
    const wrapper = mount(
    <CatsTable cats={cats} /> 
); 

    it('renders correctly',() => { 
    expect(wrapper.find('table')).to.have.length(1); 
    expect(wrapper.find('tbody')).to.have.length(1); 
    }); 
}); 

Но если я попробовать то же самое с тем, что внутри функции карты возвращает undefined

Answer 1

Вы можете использовать следующий код, чтобы проверить другие части таблицы внутри функции карты

describe('<CatsTable />',() => { 
    const wrapper = mount(
    <CatsTable cats={cats} /> 
); 

    it('renders child correctly',() => { 
     expect(wrapper.find('tbody').children()).to.have.length(cats.length); 
     expect(wrapper.find('tbody').children().find('tr')).to.have.length(cats.length); 

    }); 

Вы можете прочитать больше о том, как использовать фермент в его документации здесь http://airbnb.io/enzyme/docs/api/