web-dev-qa-db-fra.com

React Enzyme trouve le deuxième (ou nième) noeud

Je teste un composant React avec un rendu superficiel Jasmine Enzyme.

Simplifié ici aux fins de cette question ...

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

MyOuterComponent a 2 instances de MyInnerComponent et j'aimerais tester les accessoires sur chacun d'eux. 

Le premier que je sais comment tester. J'utilise find avec first...

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

Cependant, j'ai du mal à tester la deuxième instance de MyInnerComponent.

J'espérais que quelque chose comme ça marcherait ...

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

ou même cela ...

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

Mais bien sûr, aucun des travaux ci-dessus ne fonctionne. 

Je sens que je manque l'évidence. 

Mais lorsque je regarde à travers les docs , je ne vois pas d’exemple analogue.

N'importe qui?

84
sfletche

Si vous voulez tester certaines chosessur chacune d'elles, envisagez également de parcourir le jeu correspondant:

component.find('MyInnerComponent').forEach( (node) => {
    expect(node.prop('title')).toEqual('Good-bye)
})
4
Frank Nocke
 const component = wrapper.find('MyInnerComponent').at(1); 
 //at(1) index of element 0 to ~

 expect(component.prop('title')).to.equal('Good-bye');
0
D V Yogesh