From 9e978cad76ad3f2e4d83bdd9ef909003b060dc8e Mon Sep 17 00:00:00 2001 From: Michel Weststrate Date: Fri, 7 May 2021 09:02:49 -0700 Subject: [PATCH] Bump react-devtools-core upward for compatibility Reviewed By: passy Differential Revision: D27850934 fbshipit-source-id: 0b03b110accce7aa522f3e18edba8c316f9d00d8 --- docs/troubleshooting.mdx | 11 +++++++++++ .../ReactNativeFlipperExample/ios/Podfile.lock | 4 ++-- .../ReactNativeFlipperExample/package.json | 3 ++- react-native/ReactNativeFlipperExample/yarn.lock | 16 ++++++++-------- 4 files changed, 23 insertions(+), 11 deletions(-) diff --git a/docs/troubleshooting.mdx b/docs/troubleshooting.mdx index ca4192248..c8495fe6e 100644 --- a/docs/troubleshooting.mdx +++ b/docs/troubleshooting.mdx @@ -182,6 +182,17 @@ That is correct, the dependencies won't be actually included in the release (whe 1. Make sure you have only one device running to connect to. If there are multiple devices, close them and try again (restart Flipper if needed). 1. Make sure there is only one RN app running on the device +#### Q: Cannot inspect an element in the React DevTools: "Could not inspect element with id ..." + +The "Could not inspect element with id XXX" error will appear when selecting a specific element in the React DevTools, when the version of the DevTools shipped in Flipper is incompatible with the `react-devtools-core` package used by the React Native application. +A way to fix this is to set the `resolutions` field in the `package.json` of the app to force a specific version and then run `yarn install`, for example: + +```json +"resolutions": { + "react-devtools-core": "4.13.2" +} +``` + #### Q: How to select a specific element in the React DevTools? 1. Trigger the debug menu on your RN app (you can use the button in the Flipper toolbar for that) diff --git a/react-native/ReactNativeFlipperExample/ios/Podfile.lock b/react-native/ReactNativeFlipperExample/ios/Podfile.lock index 154d9d4ff..36c53f155 100644 --- a/react-native/ReactNativeFlipperExample/ios/Podfile.lock +++ b/react-native/ReactNativeFlipperExample/ios/Podfile.lock @@ -282,7 +282,7 @@ PODS: - React-jsi (= 0.64.0) - React-perflogger (= 0.64.0) - React-jsinspector (0.64.0) - - react-native-flipper (0.87.0): + - react-native-flipper (0.88.0): - React-Core - React-perflogger (0.64.0) - React-RCTActionSheet (0.64.0): @@ -515,7 +515,7 @@ SPEC CHECKSUMS: React-jsi: 74341196d9547cbcbcfa4b3bbbf03af56431d5a1 React-jsiexecutor: 06a9c77b56902ae7ffcdd7a4905f664adc5d237b React-jsinspector: 0ae35a37b20d5e031eb020a69cc5afdbd6406301 - react-native-flipper: a5770950f79017f17f50b316cb74b66d14192c79 + react-native-flipper: 5370d05b398481ee4589099e2e1962aba2e1cb90 React-perflogger: 9c547d8f06b9bf00cb447f2b75e8d7f19b7e02af React-RCTActionSheet: 3080b6e12e0e1a5b313c8c0050699b5c794a1b11 React-RCTAnimation: 3f96f21a497ae7dabf4d2f150ee43f906aaf516f diff --git a/react-native/ReactNativeFlipperExample/package.json b/react-native/ReactNativeFlipperExample/package.json index 6342d2972..804b5486f 100644 --- a/react-native/ReactNativeFlipperExample/package.json +++ b/react-native/ReactNativeFlipperExample/package.json @@ -30,6 +30,7 @@ "react-native-flipper": "../react-native-flipper" }, "resolutions": { - "xmldom": "0.5.0" + "xmldom": "0.5.0", + "react-devtools-core": "4.13.2" } } diff --git a/react-native/ReactNativeFlipperExample/yarn.lock b/react-native/ReactNativeFlipperExample/yarn.lock index 2f5494625..4ef714249 100644 --- a/react-native/ReactNativeFlipperExample/yarn.lock +++ b/react-native/ReactNativeFlipperExample/yarn.lock @@ -4949,10 +4949,10 @@ range-parser@~1.2.1: resolved "https://registry.yarnpkg.com/range-parser/-/range-parser-1.2.1.tgz#3cf37023d199e1c24d1a55b84800c2f3e6468031" integrity sha512-Hrgsx+orqoygnmhFbKaHE6c296J+HTAQXoxEF6gNupROmmGJRoyzfG3ccAveqCBrwr/2yxQ5BVd/GTl5agOwSg== -react-devtools-core@^4.6.0: - version "4.10.0" - resolved "https://registry.yarnpkg.com/react-devtools-core/-/react-devtools-core-4.10.0.tgz#027ed231f851e5e9d697812bb905648ab822ec48" - integrity sha512-5m5VBtpjuHI7odyk3GAR3BJq3/IHQ0fVZ0+h8zUvoHulSj7Z9hp9d9n4Y1HmSZZxv7NUKfBtsnH+NfLNFDtfog== +react-devtools-core@4.13.2, react-devtools-core@^4.6.0: + version "4.13.2" + resolved "https://registry.yarnpkg.com/react-devtools-core/-/react-devtools-core-4.13.2.tgz#61399c6648d3ded5917eaa4e59b474b3fa838faa" + integrity sha512-/lA5FVLMhUHrkQwtEf5wZNCKsXmc2RBZMNS/kkq3WlXPg2Y7COUGMh0Lmz34jjMpM0kvLMDuj+DqsPT/jSADbw== dependencies: shell-quote "^1.6.1" ws "^7" @@ -4976,10 +4976,10 @@ react-native-codegen@^0.0.6: jscodeshift "^0.11.0" nullthrows "^1.1.1" -react-native-flipper@^0.87.0: - version "0.87.0" - resolved "https://registry.yarnpkg.com/react-native-flipper/-/react-native-flipper-0.87.0.tgz#7442994a5dd3fadd64b78293835af36bcf7fa891" - integrity sha512-WCi0j/4gRxYbEizVHN9kNWKx7m/sBajxXXhhTQBmhNLywSData+za62e5XtTGTnHoS8bDC5ev65PKAA7ncM9Lg== +react-native-flipper@^0.88.0: + version "0.88.0" + resolved "https://registry.yarnpkg.com/react-native-flipper/-/react-native-flipper-0.88.0.tgz#d90bec23ed6c7b1c071ae303c31f50171f6d3e74" + integrity sha512-lQnrEYSJmOICYBDl18bZ9Y8F8I3ij6B46p/bzj7kBmL6HLLANifACyg0bErg6UO6lr6VNCTBZdsC+c5Gu8V9VA== react-native@^0.64.0: version "0.64.0"