React Enzyme 두 번째 (또는 n 번째) 노드를 찾으십시오.

Question

Jasmine Enzyme 얕은 렌더링으로 React 구성 요소를 테스트하고 있습니다. 이 질문의 목적을 위해 여기에 단순화 된

...

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

MyOuterComponent는 MyInnerComponent의 두 인스턴스를 가지고 있는데 각각의 소품을 테스트하고 싶습니다.

테스트하는 방법을 처음 알았습니다. 나는 내가 MyInnerComponent의 두 번째 인스턴스를 테스트하기 위해 사투를 벌인거야, 그러나 ...

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

을 first와 find 사용합니다.

나는 ... 심지어이

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

나 ...이 같은 작업 것이다

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

그러나 물론도 위의 작업을 기대했다.

나는 분명히 실종 된 것처럼 느낍니다.

그러나 내가 docs을 살펴볼 때 비슷한 예는 보이지 않습니다.

누구나?

Answer 1

원하는 것은 .at(index)입니다. http://airbnb.io/enzyme/docs/api/ShallowWrapper/at.html입니다.

따라서, 귀하의 예를 들면 다음과 같습니다

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