running html5 in an android emulator - android

I've just started developing an html5 game using VS Code. I see it being mainly used from pcs/laptops and have managed to set up the Chrome debugger so I can debug the webpage in chrome.
However I'd like to be able to debug it using an android emulator too, to check the screens look right, etc. I have Android Studio installed, and an emulator that works, but I can't find any VS Code debugger extensions that will launch the webpage in the browser of the emulator.
Is there any way to do it ?

This method is tested both on emulator and actual physical device.
Goto Chrome. Then goto chrome://inspect/#devices.
Physical Device:
Then you can connect your phone to pc and turn on USB Debugging on your phone. Accept the debugging message on your phone. Then you get access to all chromium based apps like Chrome, Brave or other Hybrid apps developed using Cordova etc.
Emulator:
Close all emulators running. Start Android Studio. Start the emulator. Goto Android Studio logcat and check if emulated is alive. Then goto chrome://inspect/#devices.
If emulator ADB authentication fails in chrome. Goto AVD manager and wipe data of virtual device.(Only Emulator)

Related

Android studio and expo - how can I open the app in the emulator instead of my phone?

I have everything installed (android studio, and the emulator is open) and it works well on my phone (android), but I can't get the app open on the damn emulator on my pc. My phone is connected to my pc via usb tethering wifi because of some issues (long story, but I tried to just delete Expo from the phone and even that didn't force start the emulator on my pc?), but surely I should be able to select the emulator instead? I tried shift+A and to select the emulator from the options (it comes up as just "(emulator)", but it won't open :/

Chrome remote devices not showing Cordova app

I'm trying to get a Cordova (= webview) app showing in the Chrome inspector remote devices, but it's not working.
It seems everything is OK with the developer options, since:
The phone is detected by the Chrome tool, but the tool says "No browsers detected" when my app is running on the phone ;
If I launch a browser on my phone, then the tool allows me to inspect it.
My coworker has the exact same phone (OnePlus One) and it works for him (he can inspect when the app is running). The difference is his phone is rooted.
We tried my phone on his PC and his phone on my PC: it didn't work with my phone but it worked with his.
We tried another phone, it didn't work on any PC.
I checked this: Chrome inspect devices not showing device but it doesn't change anything.
I checked this: Chrome Inspect Device not showing android app but since it's a webapp with Cordova, I'm not sure I'm suppose to do something like that, plus it works for my cowoker with the same app so it would be strange if I need to do this but not him.
In order for Chrome to detect in app 'WebView' of your Cordova application, your Cordova application must be of 'debug' version obtained from Cordova build. If your Cordova application is of 'release' version, Chrome will not be able to detect the 'WebView'
For Windows 10 User Just Install the new version of Microsoft Edge and Open edge://inspect/#devices.
I have a contribution :)
Download ADB, put on C:\ drive under adb folder (C:\adb),
open Command Prompt (cmd), do:
cd C:\adb && adb devices
It will enable daemon, and device will be showed in Chrome inspector.
An alternative to download adb is to use adb from Android Studio program folder.
Be happy.

Ionic template cache doesn't work on device, only in browser

I implemented gulp-angular-templatecache-ionic to my Ionic app, which made my application run significantly faster in my desktop chrome browser, but when I build and deploy (ionic run android) this application to my device (LG Nexus 5x) it is still slow, it looks like nothing has changed, as if the built android version does not use the angular template cache.
I followed this article: http://tombuyse.com/improving-the-performance-of-your-ionic-application/
Any ideas or suggestions how to debug?
Thanks!
In order to debug your WebView app please follow this guide from google
https://developer.chrome.com/devtools/docs/remote-debugging
If your android version is less than 4.4, then you cannot debug through the chrome devtools.
you can instead run an emulator via the adb emulator, you'll need the android sdk and the adb tool.
read more here: https://developer.android.com/studio/run/emulator.html
The default android emulator/simulator is slow, and also need the HAXM accelerator, you can download the Genymotion simulator which is a replacement for the default android emulators, and run faster, also doesn't need to change anything in your hardware configuration
https://www.genymotion.com/

Genymotion Android Emulator Plugin for Mosync IDE

i've been trying to develop an Android application for some time now but the problem i keep facing is finding a suitable emulator to run a demo of the application (I think the default Android SDK emulator is crap). Anyway i did some research and came across the genymotion android emulator which is faster than any other emulators i have tired so far. I then went on to search for a plugin for my Mosync IDE which is an IDE built on eclipse that allows you to develop native, web or hybrid apps using htnl5, css, javscript, c/c++. Anyway i installed the plugin with the MosyncIDE the same way you install any new software in any eclipse based IDE and it installed fine. The problem i have now is that i am able to run the emulator okay but when i try to run my application inside that emulator i am unable to locate the genymotion virtual device in the list. I have been fiddling with my configuratin settings for days now without any results, i do not own an android phone so testing it directly on one is not an option for me, i would like someone to help me out with this problem thank you.
Please note that i am able to run the app normally with the default androidsdk emulator.
[What i have been trying soo far]
This is what i do currently, i start the genymotion emulator within the IDE.
I go to run configurations.
I choose Android Emulator.
I hit "Refresh AVD list"
Then i choose the android emulator i want from the list, the problem is i can't find the
genymotion emulator i started within that list.
Ok. The thing is that Genymotion device is not considered as an emulator but like a real device plugged on USB. You won't find it on the AVDs list but on the "running Android devices".
You first have to check if the running Genymotion VM is connected TO ADB: Run adb devices on a console. It should show you something like this:
List of devices attached
192.168.56.101:5555 device
The Genymotion device is shown as it's IP address.
If the Genymotion device is shown on this list, it should also appear on the list of available devices when you hit the "run" button of your IDE. Like in this picture (done with Eclipse IDE).
If it is not shown on the list, read my previous answer.
So you installed the Genymotion Eclipse plugin isn't it?
And it seems that adb devices does sometimes not display your Genymotion device.
When the VM boots into the Genymotion player, it executes:
adb connect <VM's IP address>
This connects the device to adb, so you are able to debug your apps with it.
Sometimes, it appears that the connection is lost and you have to run adb connect <VM's IP address> again. You have to do it manually for now.
You can get the IP of your running device using the Genymotion Shell with the command devices list

How to debug Android apps on Samsung gts5360 device via Windows 7

I want to debug Android app on Samsung gts5360 device via Windows 7. USB debugging on Android side is enabled, but device is not showing in Eclipse when connected. I had no such problems in Ubuntu.
So please suggest me how to debug apps on Android device via Window 7?
Try resetting the adb. I usually run Dalvik Debug Monitor in the background when using connected devices, so I can verify that the AVD and/or devices really are registered. You'll find this tool in C:\Program Files (x86)\android-sdk\tools or wherever you have your Android SDK installed. It's called ddms.exe.
If you don't see your device there, go to the menu Actions --> Reset asb. Now, all AVDs and devices should popup, and it will be available in Eclipse. At least, this works for me.

Categories

Resources