Commit Graph

21 Commits

Author SHA1 Message Date
Pieter De Baets 3e4a8928b3 Fix reference to invariant
Reviewed By: davidaurelio, bvaughn

Differential Revision: D5274530

fbshipit-source-id: 0b75976bb91b530a371521d5381a3d53f0ad2640
2017-06-19 08:46:32 -07:00
Dan Abramov 86fad4b2f3 Remove dependency on internal data structure
Summary:
See context for this change in https://github.com/facebook/react-devtools/pull/770.
We'll later stop exposing `instance` (because it is a Fiber and is private to React).
Closes https://github.com/facebook/react-native/pull/14290

Reviewed By: trueadm

Differential Revision: D5164997

Pulled By: gaearon

fbshipit-source-id: cda479dd8a18773f01319f6b005e832e8e61387a
2017-06-01 13:06:24 -07:00
Dominic Gannaway 59e41b4485 Refactor of Fiber integration with React Fiber + Stack
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
2017-05-30 10:02:32 -07:00
Spencer Ahrens 21ba956560 Fix inspector overflow
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
2017-01-03 13:43:35 -08:00
Siqi Liu f20d5ed67f Intercept XMLHttpRequest network operations and gather their information in inspector tool
Summary:
This diff
- creates `XHRInterceptor` to intercept all XMLHttpRequest network operations in React Native by monkey-patching.
- enables `XHRInterceptor` in RN development tool "inspector".

This interception and inspector tool work well on both Android and iOS. And this supports interception on any network API based on XMLHttpRequest, especially the Fetch API.

By now, we can intercept 12 information fields of a XMLHttpRequest including method, url, data sent, status, response type, response size, requestHeaders, responseHeaders, response, responseURL, responseType and timeout.

Follow-up:
- Will add UIs in the inspector on top of this diff, to display all the network operation information. (Not in this diff just to make this shorter)
- Will extend this to gather other valuable information towards one XMLHttpRequest.
- Should support other network request APIs like WebSocket.

Reviewed By: davidaurelio

Differential Revision: D3598873

fbshipit-source-id: 3221050ab2ebd876a718fc326646c344d0944a5f
2016-07-27 12:28:32 -07:00
Ben Alpert 92d6632d7a Update React to 15.2.0-rc.1
Summary:
Notable changes (excluding DOM-only things):

- Improved warning messages for propTypes and key warnings
- Production error codes
- Improved performance in DEV mode
- More accurate data in ReactPerf instrumentation
- Experimental JSON test renderer
- Minor bug fixes

Full changelog: fef495942a...c66f40f749.

Reviewed By: AaaChiuuu

Differential Revision: D3442002

fbshipit-source-id: 940fc65ba5d0b742417bbe2fcbd36eb9dc7443e1
2016-06-16 14:44:18 -07:00
Alex Kotliarskyi 30e9c40898 Remove unused rootTag
Summary:
`rootTag` is a lie, it's passed around but never actually used. IIRC
`findInstanceByNativeTag` needed it but seems like not anymore.

Reviewed By: spicyj

Differential Revision: D3382144

fbshipit-source-id: eb96870a3848333e66bf045e78e95c7763812cc4
2016-06-08 14:43:30 -07:00
Alex Kotliarskyi bdab834036 Improve how inspector handles native components
Reviewed By: sebmarkbage

Differential Revision: D3347768

fbshipit-source-id: 221ec54dc7bf9513a76578d90a272ed41fe189f9
2016-05-26 10:58:30 -07:00
Alex Kotliarskyi e4753867ea Fix internal fields access for inspector
Reviewed By: sebmarkbage

Differential Revision: D3325549

fbshipit-source-id: d6cf89f5dbbe9db5bec37632e6976c6e537575fb
2016-05-20 12:13:48 -07:00
Alex Kotliarskyi f203c5d78c Add "Open file" button to elements inspector
Summary:
Depends on #6351

Now you can open file directly from Elements Inspector!

Credit for the original implementation goes to jaredly

![zcichu7kem](https://cloud.githubusercontent.com/assets/192222/14573876/cb100f6e-030c-11e6-925f-6a6dff510145.gif)

**Test plan**

Made sure it doesn't crash the app with or without #6351 (i.e. can be merged safely before #6351 gets in).
Closes https://github.com/facebook/react-native/pull/7005

Differential Revision: D3313714

Pulled By: frantic

fbshipit-source-id: 3b80abd3e81a0db5ca5136e2d2c94c775fa04f3a
2016-05-17 20:58:25 -07:00
Pieter De Baets 57ceeafd4f Move UI-specific logic from NativeModules to UIManager
Summary: Move all requires of UIManager to UIManager.js, so we can load the view manager configuration lazily when UIManager is required.

Reviewed By: majak

Differential Revision: D3270147

fb-gh-sync-id: 8208ee8d5919102ea5345e7031af47ee78162fe0
fbshipit-source-id: 8208ee8d5919102ea5345e7031af47ee78162fe0
2016-05-09 08:21:19 -07:00
Sebastian Markbage 47a470a97c Move React Core Integration to a Dependency
Summary:Adding the react native renderer dependency and various fixes to support React 15.

Don't use dispatchID for touchableHandleResponderGrant

This callback argument was removed because "IDs" no longer exist. Instead, we'll
use the tag from the event target.

The corresponding PR on React Core is: https://github.com/facebook/react/pull/6338

Reviewed By: spicyj

Differential Revision: D3159788

fb-gh-sync-id: 60e5cd2aa0af69d83fcdac3dfde0a85a748cb7b9
fbshipit-source-id: 60e5cd2aa0af69d83fcdac3dfde0a85a748cb7b9
2016-04-21 09:28:23 -07:00
Spencer Ahrens d5c1de7708 Hook up touchable debugging to Inspector button
Reviewed By: vjeux

Differential Revision: D3188719

fb-gh-sync-id: 271e902399900242f577a77807868bd2a28add37
fbshipit-source-id: 271e902399900242f577a77807868bd2a28add37
2016-04-16 11:57:22 -07:00
Sebastian Markbage 613ca14612 React.findNodeHandle -> ReactNative.findNodeHandle
Summary:Since the React 0.14 split of modules, the findNodeHandle feature is part of the
renderer and not the generic React API.

This just greps for React.findNodeHandle and replace them with ReactNative.findNodeHandle. I fixed up the imports manually.

I also found two callers each of ReactNative.createClass and React.render with the exception of downstream and examples will fix them separately.

I'll need to find more things like `var { PropTypes } = ReactNative;` separately. I think this is a good start though.

Reviewed By: vjeux

Differential Revision: D3149356

fb-gh-sync-id: 50ed60bc67270b16f561d4c641f2f19e85724d3b
fbshipit-source-id: 50ed60bc67270b16f561d4c641f2f19e85724d3b
2016-04-07 19:44:31 -07:00
Edvin Erikson c489660f26 Inspecting stateless components.
Summary:
Fixes #4602

Fixes a bug where the app crashes when you try to inspect a stateless
component.
Fixed by replacing all occurrences of the getPublicInstance method in
Libraries/Inspector/Inspector.js with the _instance property instead.
Defaults to an empty object if _instance is falsy.
Closes https://github.com/facebook/react-native/pull/4642

Reviewed By: svcscm

Differential Revision: D2734491

Pulled By: androidtrunkagent

fb-gh-sync-id: 4ea753b7e0ef3fd05af2d80abadc365c5c787f98
2015-12-08 10:13:25 -08:00
Jared Forsyth 9e4af68d91 [react-native] enable react devtools from JavascriptCore 2015-07-23 17:14:09 -08:00
Jared Forsyth e06af51cf9 [react-native] inspector + devtools, naming things 2015-07-22 16:50:32 -08:00
Jared Forsyth a43987309d [react native] prepare the react native inspector for the new react devtools
Summary:
These are the changes needed for full interop with the (as yet unreleased) new
version of React Devtools.

- the on-device inspector is minimized when devtools is open
- devtools highlight -> device and device touch -> devtools select works
- editing react native styles :)
2015-07-14 12:35:43 -08:00
Jing Chen b58578e935 [rn] Add PerformanceOverlay to the inspector 2015-06-23 15:41:41 -08:00
Olivier Notteghem 58d01c7981 [RN Inspector] : fix CSS not to use view overflow which is not supported on iOS 2015-06-18 05:46:33 -08:00
Jared Forsyth 15907419f3 [ReactNative] refactor the inspector
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)
2015-06-11 13:49:54 -08:00