TestUtilsを使用して React コンポーネントの簡単なテストを書いていますが、TestUtils.FindRenderedDOMComponentWithClassとメソッドの両方TestUtils.FindRenderedDOMComponentWithTagがかなり制限的であることがわかりました。典型的な CSS セレクター (つまり ) を使用してコンポーネントを見つけたいのtag.class [attr]ですが、これはオプションではないようです。
特定の属性を持つ要素を見つける簡単な方法はありますか? そうでない場合、コンポーネントを見つけるための便利なツールはありますTestUtilsか?
Element.querySelector()/querySelectorAll()ブラウザのメソッドを DOM 要素に対して単純に使用すると便利だと思います。
たとえば、次のように呼び出すことができます。
var domElement = FindRenderedDOMComponentWithClass('myClass');
var firstTextInput = domElement.querySelector('input[type="text"]');
React.TestUtilsはCSS セレクターを使用したコンポーネント検索を提供しないため、 react-testutils-additionTestUtilsと呼ばれる基本クラス の軽量拡張を使用しました。CSS セレクター スタイルの入力を解析し、コンポーネントを見つけるために使用するメソッドを提供します。find()TestUtils.findAllInRenderedTree