Summary:
This PR aims to update the Inspector tool in React Native to use the new inspection APIs that have been added to the ReactNative renderer:
https://github.com/facebook/react/pull/9691
This PR also cleans up the code in `Inspector.js` so there's no usage of React's internals.
Closes https://github.com/facebook/react-native/pull/14160
Reviewed By: bvaughn
Differential Revision: D5129280
Pulled By: trueadm
fbshipit-source-id: b1b077c04f46b0f52cdea0e19b4154441558f77a
Summary:
Puts hierarchy and other inspector data in a fixed height scrollview so it never takes up
too much space and you can always scroll to see everything you want.
Reviewed By: fkgozali
Differential Revision: D4374819
fbshipit-source-id: 89356670c984c693db345ad66a97d4cb54a98aee
Summary: This removes `node_modules/react` from the list of directories that are used for haste module resolutions. Modules required from React are now imported with `require('react/lib/…')`.
Reviewed By: astreet
Differential Revision: D3509863
fbshipit-source-id: 32cd34e2b8496f0a6676dbe6bb1eacc18124c01e
Summary: the default child alignment of 'stretch' is not compatible with flexWrap:'wrap'. By aligning children to the start of the container we fix this.
Reviewed By: jingc
Differential Revision: D3436864
fbshipit-source-id: ead5a5765ed0c336ed6e727af2970d4e6d7ff34f
Summary:
Many RN devtools (inspector, source maps, etc.) rely on packager.
This refactors individual SourceCode.scriptURL parsing into one function
that will be easier to change in the future.
Reviewed By: javache
Differential Revision: D3348465
fbshipit-source-id: 5a55939ea59e1517cb63bcbe4963f57f02ab15f3
Summary:
public
When using dev menu - elements inspector, a yellow box appears
with React warning regarding missing key prop in elements array.
This commit fixes this issue.
Reviewed By: martinbigio
Differential Revision: D2835332
fb-gh-sync-id: 3fcb37dfb6bdcff3788963b36416b7da190b9a84
Summary:
The `InspectorOverlay` component was getting unwieldy, so I broke it into three components:
- Inspector
- InspectorOverlay
- InspectorPanel
and added @flow types.
The inspector was also living under the `ReactIOS` directory, and I moved it
up into the `Libraries` directory, as the inspector will soon be usable [on
Android](https://phabricator.fb.com/D2138319).
All features of the inspector should remain functional, with the addition of
one feature:
- you can toggle "touch to inspect" by tapping the "Inspect" button at the
bottom of the inspection panel. When inspection is disabled, the panel remains, but you can interact with
the app normally without touches being intercepted
@public
Test Plan:
Open the inspector:
- touch to inspect things, verify that margin, padding, size and position are
reported correctly, and that the component hierarchy is navigable.
- tap the "Inspect" button, and verify that you can interact with the app
normally.
{F22548949}
[Video of toggling inspection](https://www.latest.facebook.com/pxlcld/mrs9)
Dominic Gannaway
Brian Vaughn
Spencer Ahrens
Tim Yung
Ben Alpert
Sokovikov
David Aurelio
Emil Sjolander
Alex Kotliarskyi
Alex Kotliarskyi
Jared Forsyth
