Allow Inspecting Elements Within Iframes

[philipp-spiess]

This change adds support for element inspecting within <iframe/>s.

The iframes are kept in a Set so that we only append listeners once and clean them up properly. I’ve run a few tests and it seems to behave as expected.

Here’s a screencapture: http://cl.ly/358a8f22715d/iframe-demo.mov

The fixture includes a cross-origin iframe to make sure we do not error in this case.

I’ve run through the following scenarios locally:

• Nexted iframes
• Iframe is removed while we’re inspecting
• Chrome and Firefox

Let me know if/where I should add tests. 🙂

[bvaughn]

Hm... why doesn't this work on the regression test fixture? Am I overlooking something silly?

1. Run the test fixture

   node ./fixtures/regression/server.js

2. Open the fixture: http://localhost:3000/
3. Try to select any iframe

[philipp-spiess]

@bvaughn Huh this is interesting, the tooltips shows up but when you click an element, nothing happens. Perhaps a different issue given that this was also not working before but I'll look into it.

[philipp-spiess]

@bvaughn Found the issue in the getIDForNode() implementation (see my latest comment). Inspecting in the regression fixture now works everywhere except React 0.14.9 where the element is not highlighted in DevTools. No errors in the console though so this might be ok