Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Multiple Dev Menu's on Device #21747

Closed
3 tasks
afisherdev opened this issue Oct 12, 2018 · 51 comments
Closed
3 tasks

Multiple Dev Menu's on Device #21747

afisherdev opened this issue Oct 12, 2018 · 51 comments
Labels
Bug Debugger Issues related to React Native DevTools or legacy JavaScript/Hermes debugging DX Issues concerning how the developer experience can be improved. Priority: Low Stale There has been a lack of activity on this issue and it may be closed soon.

Comments

@afisherdev
Copy link

Environment

React Native Environment Info:
System:
OS: macOS High Sierra 10.13.6
CPU: x64 Intel(R) Core(TM) i7-4770HQ CPU @ 2.20GHz
Memory: 29.78 MB / 16.00 GB
Shell: 3.2.57 - /bin/bash
Binaries:
Node: 8.12.0 - /usr/local/bin/node
Yarn: 1.10.1 - /usr/local/bin/yarn
npm: 6.4.1 - /usr/local/bin/npm
Watchman: 4.9.0 - /usr/local/bin/watchman
SDKs:
iOS SDK:
Platforms: iOS 11.4, macOS 10.13, tvOS 11.4, watchOS 4.3
IDEs:
Android Studio: 3.1 AI-173.4819257
Xcode: 9.4/9F1027a - /usr/bin/xcodebuild
npmPackages:
react: ^16.5.2 => 16.5.2
react-native: ^0.57.2 => 0.57.2
npmGlobalPackages:
create-react-native-app: 2.0.2
react-native-camera: 1.3.0
react-native-cli: 2.0.1
react-native-git-upgrade: 0.2.7

Description

Whenever I load my app onto my real device it displays 2 Developer Menu's on top of each other.

Reproducible Demo

Initialize a new react app and run it on a device. Shake the device for the developer menu and watch 2 menu's pop up on top of each other.
img_0483

@bashbers
Copy link

Your first dev menu has an additional entry named "Start systrace".

@kelset kelset added DX Issues concerning how the developer experience can be improved. Debugger Issues related to React Native DevTools or legacy JavaScript/Hermes debugging labels Dec 17, 2018
@kelset
Copy link
Contributor

kelset commented Dec 17, 2018

I can confirm that this happens still to me with latest version (0.57.8) but it's intermittent, and if I kill the app & simulator & restart it goes away.

@vrgimael
Copy link

vrgimael commented Feb 5, 2019

Happens to me too on 0.58.3 with pretty much a fresh project + cocoa pods

@vrgimael
Copy link

vrgimael commented Feb 5, 2019

Damn, just spent a few hours trying to figure this out (I thought it might have something to do with the pods but it seems that's not the problem).

Just noticed something interesting that makes sense with what @kelset said about the glitch being intermittent and seeming to go away when you kill the app:

There's another issue happening here in which when I launch the app (from closed, not background) this error comes up for a second "Unable to find module for DevLoadingView" (does this happen to you guys too?) and then the app loads normally (seems like the loading screen needs fixing guys). During this one second, however, the button to force reload the app appears at the bottom as part of the dev UI.

The double dev menu glitch only happens here when I tap this reload button quickly - if I just wait through the "DevLoadingView" error this glitch does not happen, consistently.

I guess tapping reload forces the dev menu (or maybe some other things too) to spawn twice.

Hope this helps someone with investigating this issue, I won't have time to look much further now.

@Meox92
Copy link

Meox92 commented Mar 22, 2019

Same problem here, sometime the first menu shows 'Enable remote debug' and the second 'Disable remote debug' or viceversa...

@cpojer
Copy link
Contributor

cpojer commented Mar 26, 2019

Does anybody know how we can repro this reliably so we can fix this?

@cpojer cpojer removed the Follow Up label Mar 26, 2019
@danielmtavares
Copy link

It's happening to me as well on the iOS simulator on 0.58.6. Unfortunately I have no identified reliable steps to repro it.

@kelset
Copy link
Contributor

kelset commented Apr 29, 2019

I think I've actually seen a PR with a fix for this. Does it still happen in latest 59? 🤔

@jacobwallstrom
Copy link

It still happens on 0.59.5

@mcavaliere
Copy link

Happening on 0.59.9 as well.

@Villar74
Copy link

Villar74 commented Jul 9, 2019

Happening on 0.60.0
It appears when i try to open it with command+control+Z on Mac. When i press command+D it opens only 1 window

@JonnyBurger
Copy link
Contributor

I had this option enabled, and when I disabled it the problem went away:

Screenshot 2019-07-10 at 13 38 17

Although I'm not sure why I enabled it in the first place, curious if this is the same issue for other people.

@kelset
Copy link
Contributor

kelset commented Jul 10, 2019

@JonnyBurger would you mind trying to open a PR that sets that flag to false for the template? Sounds like it may be it 🤔

@JonnyBurger
Copy link
Contributor

@kelset In the current template the flag is already set to false.. it must have previously been true or something else must have happened so that it got set to true on my project 🤔

@yolpsoftware
Copy link

Still happens with 0.60.5

@yolpsoftware
Copy link

yolpsoftware commented Aug 27, 2019

I don't have exact reproduction steps, but I think it often happens when you do this:

  • Enable Hot Reloading
  • Enable JS debugging in Chrome devtools
  • Set some breakpoints so that the debugger pauses
  • Now, while the debugger is paused, change a current file to trigger Hot Reloading

I just checked, and unfortunately I couldn't reproduce the problem by doing this once. However, I had this problem twice after exactly that scenario (no idea what scenario was before that).

Maybe the Hot Reloading does not work due to the paused debugger, and then there is some internal state change in the debug server. After that, I have two dev menus, and they are missing several items.

@JonnyBurger
Copy link
Contributor

It happened to me recently again and I also think it gets triggered by a combination of Remote Debugging, Hot Reloading, running on device after some time (programming your app for a while, reloading often, making mistakes). Must remember to set some breakpoints next time and report here!

@yolpsoftware
Copy link

The issue happened to me many times on the simulator, so I don't think running on device is a factor.

@kelset
Copy link
Contributor

kelset commented Aug 28, 2019

Can anyone check if it still happens with the first 61 rc?

I also believe it's related to what @JonnyBurger mentions - and maybe with the introduction of Fast Refresh it's fixed?

@JonnyBurger
Copy link
Contributor

Still happens, BUUT I have managed to set some breakpoints!

This line here gets called twice:
https://github.com/facebook/react-native/blob/master/React/DevSupport/RCTDevMenu.m#L115-L118

So when the shake notification gets sent just once, the callback gets called twice!
https://github.com/facebook/react-native/blob/master/React/DevSupport/RCTDevMenu.m#L31

I did a quick test and adding [[NSNotificationCenter defaultCenter] removeObserver:self name:RCTShowDevMenuNotification object:nil]; is not a viable fix since self is different and will therefore not remove the old listener.

Here is the stacktrace of when RCTDevMenu gets initialized for the second time and triggers the bug:

#0 0x00000001050ae654 in -[RCTDevMenu init] at /Users/jonnyburger/bestande/node_modules/react-native/React/DevSupport/RCTDevMenu.m:115 #1 0x0000000105001f24 in ::__44-[RCTModuleData initWithModuleClass:bridge:]_block_invoke() at /Users/jonnyburger/bestande/node_modules/react-native/React/Base/RCTModuleData.mm:77 #2 0x00000001050028cc in ::-[RCTModuleData setUpInstanceAndBridge]() at /Users/jonnyburger/bestande/node_modules/react-native/React/Base/RCTModuleData.mm:124 #3 0x00000001050048fc in ::__25-[RCTModuleData instance]_block_invoke() at /Users/jonnyburger/bestande/node_modules/react-native/React/Base/RCTModuleData.mm:294 #4 0x000000010507a40c in RCTUnsafeExecuteOnMainQueueSync at /Users/jonnyburger/bestande/node_modules/react-native/React/Base/RCTUtils.m:267 #5 0x000000010500463c in ::-[RCTModuleData instance]() at /Users/jonnyburger/bestande/node_modules/react-native/React/Base/RCTModuleData.mm:293 #6 0x0000000104f99318 in ::-[RCTCxxBridge moduleForName:lazilyLoadIfNecessary:](NSString *, BOOL) at /Users/jonnyburger/bestande/node_modules/react-native/React/CxxBridge/RCTCxxBridge.mm:488 #7 0x0000000104f99920 in ::-[RCTCxxBridge moduleForClass:](Class) at /Users/jonnyburger/bestande/node_modules/react-native/React/CxxBridge/RCTCxxBridge.mm:524 #8 0x00000001050b21e8 in -[RCTBridge(RCTDevMenu) devMenu] at /Users/jonnyburger/bestande/node_modules/react-native/React/DevSupport/RCTDevMenu.m:483 #9 0x000000010501dc30 in -[RCTPerfMonitor setBridge:] at /Users/jonnyburger/bestande/node_modules/react-native/React/Profiler/RCTPerfMonitor.m:144 #10 0x00000001cd7088d0 in -[NSObject(NSKeyValueCoding) setValue:forKey:] () #11 0x0000000105002fa0 in ::-[RCTModuleData setBridgeForInstance]() at /Users/jonnyburger/bestande/node_modules/react-native/React/Base/RCTModuleData.mm:175 #12 0x0000000105002b28 in ::-[RCTModuleData setUpInstanceAndBridge]() at /Users/jonnyburger/bestande/node_modules/react-native/React/Base/RCTModuleData.mm:144 #13 0x00000001050048fc in ::__25-[RCTModuleData instance]_block_invoke() at /Users/jonnyburger/bestande/node_modules/react-native/React/Base/RCTModuleData.mm:294 #14 0x000000010507a40c in RCTUnsafeExecuteOnMainQueueSync at /Users/jonnyburger/bestande/node_modules/react-native/React/Base/RCTUtils.m:267 #15 0x000000010500463c in ::-[RCTModuleData instance]() at /Users/jonnyburger/bestande/node_modules/react-native/React/Base/RCTModuleData.mm:293 #16 0x0000000104f9e2e8 in ::__49-[RCTCxxBridge _prepareModulesWithDispatchGroup:]_block_invoke() at /Users/jonnyburger/bestande/node_modules/react-native/React/CxxBridge/RCTCxxBridge.mm:859

@juanlet
Copy link

juanlet commented Apr 13, 2020

Happening to me on 0.61.5

@yolpsoftware
Copy link

Happening on 0.61.4.

@stephanoparaskeva
Copy link

stephanoparaskeva commented Apr 23, 2020

React Native Ver 0.62.2

2 Dev Menus, Keep getting error saying 'not ready to debug' and my app uses RAM like crazy sometimes. Where ram of app starts increasing exponentially at certain points going up to 30gb used if the process isn't killed. Even when removing most of app components. And running barebones app, (removal of components would happen when I start to see memory going up in order to test). This happens randomly. I'm not sure if it's related to the dual dev menus.

Nearly every dev session, after time -- there'll be 2 dev menus.

Both menu have a different "name" and this name is a long combination of letters.

Screenshot 2020-04-30 at 19 24 23

Screenshot 2020-04-30 at 19 24 28

And an example:

ipone

@renatobenks
Copy link

renatobenks commented May 18, 2020

I have been facing a lot of times this issue happening with me, and it sounds to be happening just in iOS, right?

by the way, it just happens when I use CTRL + CMD + Z which I just use when the CMD + D doesn't work.

did you find any other workaround to that @JonnyBurger?

@l1fe
Copy link

l1fe commented Aug 13, 2020

Is there an update on this? This seems very annoying!

@renatobenks
Copy link

renatobenks commented Aug 15, 2020

I still didn't find any workaround to fix that @l1fe, sometimes it happens, and other times just don't 😕

@origamih
Copy link

This is super annoying and frustrated and a HUGE waste of time. It also cause unexpected crash when open React Debugger.

@HimiGame
Copy link

I use Xcode to recompile the running project to solve this problem

@hitsthings
Copy link

Possibly related: I've sometimes seen sort of a "recursive" component tree in the standalone React Devtools. Like the root component has a root component as its child (so there might actually be two full apps running?). Haven't found a repro though. I suspect related to Fast Refresh and toggling Debug on and off.

@stale
Copy link

stale bot commented Dec 25, 2020

Hey there, it looks like there has been no activity on this issue recently. Has the issue been fixed, or does it still require the community's attention? This issue may be closed if no further activity occurs. You may also label this issue as a "Discussion" or add it to the "Backlog" and I will leave it open. Thank you for your contributions.

@stale stale bot added the Stale There has been a lack of activity on this issue and it may be closed soon. label Dec 25, 2020
@JonnyBurger
Copy link
Contributor

@Stale Please keep it open again!

@stale stale bot removed the Stale There has been a lack of activity on this issue and it may be closed soon. label Dec 26, 2020
@sbrighiu
Copy link

Anything new?

@davidvmckay
Copy link

Still happening in 0.63.4

@lukewlms
Copy link

lukewlms commented Mar 22, 2021

In Simulator top menu: Device -> "Erase All Content and Settings..." seems to take care of this.

A bit of a nuclear option but in my case only took a minute or two.

(StackOverflow source)


Edit: Unfortunately this bug started happening again within an hour.

@thunermay
Copy link

Any fixed for newest version?

@aarshad-devani
Copy link

Exists in React 0.64.1 as well...

I have been seeing that proper refresh of bundle happens only when both reload are clicked in dev menu.. just one reload shows un-deallocated React components

@kfernandes29
Copy link

Still happening

@ilkkaylik
Copy link

Still happening in 0.65.2

@kg-currenxie
Copy link

Same here. 0.65.0

@jmhungdev
Copy link

still happening in 0.67.1

@joeljerushan
Copy link

"react-native": "0.70.6", still have this issue

Simulator Screen Recording - iPhone X - 2023-01-06 at 17 10 02

@robsco
Copy link

robsco commented Mar 29, 2023

I was glad this bug appeared for me as It meant I could go back to using Chrome to view my logs, on a different machine to Xcode.

Then it randomly went again.

Safe to say, this issue still persists, 0.70.6

Now, how can I get the menu to appear that allows me to "Debug JS Remotely" that was ideal.

@robsco
Copy link

robsco commented Mar 31, 2023

FYI, after a fresh install of my app via xCode, this bug went away, but then today randomly came back mid-development as I was editing some JS files.

@github-actions
Copy link

This issue is stale because it has been open 180 days with no activity. Remove stale label or comment or this will be closed in 7 days.

@github-actions github-actions bot added the Stale There has been a lack of activity on this issue and it may be closed soon. label Sep 28, 2023
@popejrh19
Copy link

popejrh19 commented Sep 28, 2023 via email

@cortinico
Copy link
Contributor

Closing as stale

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
Bug Debugger Issues related to React Native DevTools or legacy JavaScript/Hermes debugging DX Issues concerning how the developer experience can be improved. Priority: Low Stale There has been a lack of activity on this issue and it may be closed soon.
Projects
None yet
Development

No branches or pull requests