1. ホーム
  2. reactjs

[解決済み] リアクトエンザイムが2番目(またはn番目)のノードを見つける

2022-04-25 16:15:29

質問

Jasmine Enzymeのシャローレンダリングで、Reactコンポーネントをテストしています。

この質問の目的のためにここで簡略化すると...

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

MyOuterComponent のインスタンスが2つあります。 MyInnerComponent で、それぞれでプロップをテストしたい。

最初のものは、私がテストする方法を知っています。 私は findfirst ...

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

しかし、2つ目のインスタンスである 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');