Phản ứng Enzyme tìm nút thứ hai (hoặc thứ n)

Tôi đang thử nghiệm một thành phần React với kết xuất nông Jasmine Enzyme.

Đơn giản hóa ở đây cho các mục đích của câu hỏi này ...

function MyOuterComponent() {
  return (
    <div>
      ...
      <MyInnerComponent title="Hello" />
      ...
      <MyInnerComponent title="Good-bye" />
      ...
    </div>
  )
}

MyOuterComponentcó 2 trường hợp MyInnerComponentvà tôi muốn kiểm tra đạo cụ trên từng cái.

Người đầu tiên tôi biết làm thế nào để kiểm tra. Tôi sử dụng findvới first...

expect(component.find('MyInnerComponent').first()).toHaveProp('title', 'Hello');

Tuy nhiên, tôi đang vật lộn để kiểm tra phiên bản thứ hai của MyInnerComponent.

Tôi đã hy vọng một cái gì đó như thế này sẽ làm việc ...

expect(component.find('MyInnerComponent').second()).toHaveProp('title', 'Good-bye');

hoặc thậm chí ...

expect(component.find('MyInnerComponent')[1]).toHaveProp('title', 'Good-bye');

Nhưng tất nhiên không phải công việc trên.

Tôi cảm thấy như tôi đang thiếu điều hiển nhiên.

Nhưng khi tôi xem qua các tài liệu tôi không thấy một ví dụ tương tự.

Bất kỳ ai?

Những gì bạn muốn là .at(index)phương thức: .at (index) .

Vì vậy, ví dụ của bạn:

expect(component.find('MyInnerComponent').at(1)).toHaveProp('title', 'Good-bye');

Nếu bạn muốn kiểm tra một số thứ nhất định trên mỗi thứ, hãy xem xét việc lặp lại thông qua bộ phù hợp:

component.find('MyInnerComponent').forEach( (node) => {
    expect(node.prop('title')).toEqual('Good-bye')
})

 const component = wrapper.find('MyInnerComponent').at(1); 
 //at(1) index of element 0 to ~

 expect(component.prop('title')).to.equal('Good-bye');