React-devtools: undefined is not an object (evaluating 'component._instance')

Created on 27 Jul 2017  ·  4Comments  ·  Source: facebook/react-devtools

Environment

  1. react-native -v:
    react-native-cli: 2.0.1
    react-native: 0.46.4
  2. node -v: 6.11.1
  3. npm -v: 5.3.0
  4. yarn --version: 0.27.5
  5. react-devtools: 2.5.0

Then, specify:

  • Target Platform: Android

  • Development Operating System: Windows 10

  • Build tools: Android Studio

Steps to Reproduce

  1. create new empty app using react-native init AwesomeProject
  2. install genymotion and launch this app.
  3. install react-devtools and open it.
  4. in emulator window click Menu button and select "Toggle Inspector"
  5. Click on any text node from the sample app.

Expected Behavior

Select the corresponding component in react devtools.

Actual Behavior

Getting the red screen with the following error:

undefined is not an object (evaluating 'component._instance')
getHostProps
D:\RN\AwesomeProject\node_modules\react-native\Libraries\Renderer\ReactNativeStack-dev.js:2314:29
getInspectorDataForViewTag
D:\RN\AwesomeProject\node_modules\react-native\Libraries\Renderer\ReactNativeStack-dev.js:2334:259
onTouchViewTag
D:\RN\AwesomeProject\node_modules\react-native\Libraries\Inspector\Inspector.js:175:44
proxiedMethod
D:\RN\AwesomeProject\node_modules\react-proxy\modules\createPrototypeProxy.js:44:35

D:\RN\AwesomeProject\node_modules\react-native\Libraries\Inspector\InspectorOverlay.js:51:34
__invokeCallback
D:\RN\AwesomeProject\node_modules\react-native\Libraries\BatchedBridge\MessageQueue.js:301:19

D:\RN\AwesomeProject\node_modules\react-native\Libraries\BatchedBridge\MessageQueue.js:118:28
__guard
D:\RN\AwesomeProject\node_modules\react-native\Libraries\BatchedBridge\MessageQueue.js:228:6
invokeCallbackAndReturnFlushedQueue
D:\RN\AwesomeProject\node_modules\react-native\Libraries\BatchedBridge\MessageQueue.js:117:17

This seem to happen only when I click the Text component. Clicking on View component for example works fine.

I tested this on android 6.0 and android 7.1 on nexus 5 device.

Reproducible Demo

I'm experiencing this on a new project generated using react-native init AwesomeProject. No custom code added!

I made a small screen recording:

https://drive.google.com/file/d/0B7Ls870jI1CLeFRyaTRjWVV4YVU/view

Most helpful comment

I'm also experiencing this issue.

All 4 comments

I'm also experiencing this issue.

This issue's marked as closed, has anyone got a solution?

@imtmh It's not closed yet.

React DevTools has been rewritten and recently launched a new version 4 UI. The source code for this rewrite was done in a separate repository and now lives in the main React repo (github.com/facebook/react).

Because version 4 was a total rewrite, and all issues in this repository are related to the old version 3 of the extension, I am closing all issues in this repository. If you can still reproduce this issue, or believe this feature request is still relevant, please open a new issue in the React repo: https://github.com/facebook/react/issues/new?labels=Component:%20Developer%20Tools

Was this page helpful?
0 / 5 - 0 ratings

Related issues

zhammer picture zhammer  ·  4Comments

vxio picture vxio  ·  5Comments

lettywiterock picture lettywiterock  ·  3Comments

BrandonWade picture BrandonWade  ·  4Comments

aganglada picture aganglada  ·  4Comments