I am working on a cross-platform React Native mobile app. I am writing console.log statements as I develop. I want to see these logging statements in Chrome while I'm running the Android app in the default Android emulator. According to Facebook's docs I just need to "shake the device". How do I do this in the Android emulator?
To access the in-app developer menu: On iOS shake the device or press control + ⌘ + z in the simulator. On Android shake the device or press hardware menu button (available on older >devices and in most of the emulators, e.g. in genymotion you can press ⌘ + m to >simulate hardware menu button click)
Within your app in the Android Emulator press Command + M on macOS or Ctrl + M on Linux and Windows.
With a React Native running in the emulator, Press ctrl+m (for Linux, I suppose it's the same for Windows and ⌘+m for Mac OS X) or run the following in terminal:
adb shell input keyevent 82
adb -s <device id/serial> shell input keyevent 82
. I use this when using both an emulator and a physical device.
If you're using the new emulator that comes with Android Studio 2.0, the keyboard shortcut for the menu key is now Cmd+M, just like in Genymotion.
Alternatively, you can always send a menu button press using adb
in a terminal:
adb shell input keyevent KEYCODE_MENU
Also note that the menu button shortcut isn't a strict requirement, it's just the default behavior provided by the ReactActivity
Java class (which is used by default if you created your project with react-native init
). Here's the relevant code from onKeyUp
in ReactActivity.java
:
if (keyCode == KeyEvent.KEYCODE_MENU) {
mReactInstanceManager.showDevOptionsDialog();
return true;
}
If you're adding React Native to an existing app (documentation here) and you aren't using ReactActivity
, you'll need to hook the menu button up in a similar way. You can also call ReactInstanceManager.showDevOptionsDialog
through any other mechanism. For example, in an app I'm working on, I added a dev-only Action Bar menu item that brings up the menu, since I find that more convenient than shaking the device when working on a physical device.
ReactActivity
and haven't hooked up the menu button through other means.
For Linux you click on the three dots "..." beside the emulator, on Virtual sensors check "Move" and then try quickly moving either x, y or z coordinates.
https://i.stack.imgur.com/0EqIA.png
'Ctrl + m' works for Windows in the Android emulator to bring up the React-Native developer menu.
Couldn't find that documented anywhere. Found my way here, guessed the rest... Good grief.
By the way: OP: You didn't mention what OS you were on.
I am on Mac OS so when I press Command, it enable zooming option. Here is my solution
Open Configuration window [...] button
Go toSettings tab ->General tab -> Send keyboard shortcuts to field
Change value to Virtual device" as shown in the picture
After that focus on the emulator and press Command + M, the dev menu appears.
https://i.stack.imgur.com/ElrBk.jpg
'Command + M' for OSX is working for me.
As while developing react native apps, we play with the terminal so much
so I added a script in the scripts in the package.json file
"menu": "adb shell input keyevent 82"
and I hit $ yarn menu
for the menu to appear on the emulator it will forward the keycode 82 to the emulator via ADB not the optimal way but I like it and felt to share it.
https://i.stack.imgur.com/Mb1u1.png
Use command + m(cmd + M)
on MAC. Also make sure that you are accessing your application while you try to access the Debug Menu
i.e. your app must be running otherwise Cmd + M
will just return the usual ordinary phone menu.
on linux ctrl+m should work but it doesn't for solving the problem click on the (...) (its extended controls) and then close that window.now you can open menu by ctrl+m. then:
click on the (...) (its extended controls) close extended controls ctrl+m
If you want to simulate a 1 second shake from terminal you can use the following command:
adb emu sensor set acceleration 100:100:100; sleep 1; adb emu sensor set acceleration 0:0:0
It might be not direct solution, but I've created a lib that allows you to use 3 fingers touch instead of shake to open dev menu, when in development mode
https://github.com/pie6k/react-native-dev-menu-on-touch
You only have to wrap your app inside:
import DevMenuOnTouch from 'react-native-dev-menu-on-touch'; // or: import { DevMenuOnTouch } from 'react-native-dev-menu-on-touch'
class YourRootApp extends Component {
render() {
return (
<DevMenuOnTouch>
<YourApp />
</DevMenuOnTouch>
);
}
}
It's really useful when you have to debug on real device and you have co-workers sitting next to you.
I was trying on a release build via adb install -r -d <app-release>.apk
🤦
Make sure you're running the debug build, then the menu will work via the shortcut or CLI.
Success story sharing