React Enzyme은 두 번째 (또는 n 번째) 노드를 찾습니다.

React Enzyme은 두 번째 (또는 n 번째) 노드를 찾습니다.

---

Jasmine Enzyme 얕은 렌더링으로 React 구성 요소를 테스트하고 있습니다.

이 질문의 목적을 위해 여기에서 단순화했습니다 ...

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

MyOuterComponent2 개의 인스턴스가 MyInnerComponent있고 각각의 소품을 테스트하고 싶습니다.

내가 테스트하는 방법을 아는 첫 번째. 나는 find함께 사용 first...

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

그러나 두 번째 인스턴스를 테스트하는 데 어려움을 겪고 MyInnerComponent있습니다.

나는 이와 같은 것이 효과가 있기를 바랬다.

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

아니면 이것도 ...

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

그러나 물론 위의 작업은 없습니다.

나는 명백한 것을 놓치고있는 것 같다.

그러나 문서를 살펴보면 비슷한 예가 보이지 않습니다.

누군가?

---

원하는 것은 .at (index).at(index) 메서드 입니다.

따라서 귀하의 예를 들어 :

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

---

각각에 대해 특정 사항을 테스트 하려면 일치하는 집합을 반복하는 것도 고려하십시오.

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

참고 URL : https://stackoverflow.com/questions/39966151/react-enzyme-find-second-or-nth-node