2017-03-20 5 views
1

フィーチャテストをデバッグまたは追加する場合、ELEMENTビューで要素を強調表示し、コンソールを使用してhtml要素でコンポーネントを取得する方がずっと簡単です。はAngular(1)のangular.elementに相当する反作用があります

角度がangular.element($0)

でこれを提供し、私はどこにでも振りかけるreact-id="10.0.0.8.1.0.$=10.0.1"を反応気づくが、今の質問は、私は、コンソールのコンポーネントを見つけるためにここに魔法を使うことができますか?

反応開発者エクステンションを使用する/使用しない。


EDIT:例として、私が反応の私のバージョンで動作するように見えるとカピバラ-webkitの(ホバーとのMouseEnter doesntのがいないように反応コンポーネントのonmouseenterをトリガーする必要がE2Eテストを、書いていますハンドラをトリガする)、要素を選択してネイティブイベントをトリガするJavaScriptを実行しません(私の理解からReact.Event#onmouseenterは合成イベントです)。私はちょうどReact.getComponent($0).handleMouseEnter(new Event(....))でさえ、何とかそれを引き金にするでしょう。

+0

あなたのユースケースをよりよく指定する必要があると思います。これはテスト/デバッグ専用ですか?なぜあなたはReactコンポーネントにアクセスする必要がありますか?ここに例をあげてください。 – jered

答えて

1

Chromeの場合はReact Developer ToolsReact Developer Tools for Firefoxの場合は、

これは、Reactコンポーネントを開発するときに本当に役に立ちます。

+0

私は元のコンポーネントを見つけることができるボンネットの下にどのようなdonigがあるのか​​不思議に思っています。 – user2167582

0

ReactDOM's findDOMNodeメソッドを使用して、Reactコンポーネントの基になるDOMノードを取得できます。ほとんどの場合、

、あなたはDOMノードへの参照を添付して、全くfindDOMNodeの使用を避けることができます:それは良い選択だが、一般的にあなたが反応するドキュメントのアドバイスに従うべきでデバッグする

関連する問題