I am building a website which needs to be views on the Android browser as well.
I heard that on the android browser the javascript seems to be breaking. I do not have an android device to view it for myself.
Are there an emulators for the android browser that I can download and check for myself.
My Dev Env: MAC (Lion).
In order to use the emulator you need to have the android sdk installed: instructions here. Then you can look at using the Android emulator docs by Google: here
Another option is to run your own VM of android using parrallels, vmware, etc. The information for that and downloads can be found here
Related
I was trying to run an APK on Android Studio Mac and inspect that on Edge/Chrome using the below method.
edge://inspect/#devices
But edge/Crhome doesn't show me the "Inspect" button with other details
I'm using a Mac M1 Android studio latest version. both Edge and Chrome up to date.
By default chrome/edge dev tools will show your app on the list when app is open on the screen that contains WebView (It will allow inspection of that WebView).
EDIT: WebView debug is enabled by default on simulators, on a real device you need to enable this explicitly (Thanks Robert( https://developer.chrome.com/docs/devtools/remote-debugging/webviews/#configure_webviews_for_debugging
Personally, I'm using stetho library which allows inspecting apps using chrome dev tools, It has really nice options. http://facebook.github.io/stetho/
I am desperately looking, with my friend Google, for the best practical tool to debug on Android - I mean, for real, not with Chrome.
For iOS, Apple came with their Simulator in XCode, which is great because it's replicating the exact behavior of a real device, and you have multiple choices, very handy.
What about Android? Is there something equivalent? Android Studio has been a mess for me, is there something better to advice?
Depends on which environment you're coding in. If you're coding an native app you use Android Studio and it's debugger. If you're coding in React Native you'd use Chrome or React Developer Tools (https://facebook.github.io/react-native/docs/debugging.html), and so forth (Xamarin has its debugger, and the web based options use Chrome I suppose).
AVD (Android Virtual Device) is a part of the Android Studio install and it contains emulators. You can open it without opening Android Studio, if you'd like to. See this thread on how to do it in the terminal (Mac Terminal - How to start Android Virtual Device Manager on CLI?).
For Android we have Android Virtual Device (AVD). You need to ensure Android-Studio is installed. For details creating an AVD refer to this official documentation for step by step guide.
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/
I am new to PhoneGap development and had just picked with the most basic approaches of it.
How can we debug an application developed using PhoneGap. Debugging the application built on phonegap over the browser is easy as we can see the browser console. But things change a lot when the same application is build using phonegap and packaged in the APK file.
I tried some Android Command Line emulator apps, but was not successful to see the logs.
While developing the android application I had used log.v and in phonegap I am using console.log.
How can I see the logs I am making in the application. Is there any way to get the logs for the application built by Phonegap.?
Debugging phonegap is nothing but debugging JS. we had a tough time doing so. but Weinre was very helpful for our (partially) purpose. just install weinre and have the code injected to your device index.html. now you can get what is happening through the device console in the webinspector. hope this helps you...
If you are starting with phonegap you should read this link:
http://cordova.apache.org/docs/en/3.5.0/guide_next_index.md.html#Next%20Steps
It include a lot of useful information about phonegap programming, debugging, etc.
Debugging
Debugging Cordova requires some setup. Unlike a desktop application,
you can't simply open dev tools on your mobile device and start
debugging, luckily there are some great alternatives. Safari Remote
Debugging
The first option is Safari Remote Debugging. This works only on OSX
and only with iOS 6 (and higher). It uses Safari to connect to your
device (or the simulator) and will connect the browser's dev tools to
the Cordova application. You get what you expect from dev tools - DOM
inspection/manipulation, a JavaScript debugger, network inspection,
the console, and more. For more details, see this excellent blog post:
http://moduscreate.com/enable-remote-web-inspector-in-ios-6/
Chrome Remote Debugging
Virtually the same as the Safari version, this works with Android only
but can be used from any desktop operating system. It requires a
minimum of Android 4.4 (KitKat), minimum API level of 19, and Chrome
30+ (on the desktop). Once connected, you get the same Chrome Dev
Tools experience for your mobile applications as you do with your
desktop applications. Even better, the Chrome Dev Tools have a mirror
option that shows your app running on the mobile device. This is more
than just a view - you can scroll and click from dev tools and it
updates on the mobile device. More details on Chrome Remote Debugging
may be found here:
https://developers.google.com/chrome/mobile/docs/debugging
It is possible to use Chrome Dev Tools to inspect iOS apps, through a
WebKit proxy: https://github.com/google/ios-webkit-debug-proxy/
Ripple
Ripple is a desktop based emulator for Cordova projects. Essentially
it lets you run a Cordova application in your desktop application and
fake various Cordova features. For example, it lets you simulate the
accelerometer to test shake events. It fakes the camera API by letting
you select a picture from your hard drive. Ripple lets you focus more
on your custom code rather than worrying about Cordova plugins. You
can find out more about Ripple here:
http://ripple.incubator.apache.org/
Weinre
Weinre creates a local server that can host a remote debug client for
your Cordova applications. After you've installed and started it up,
you copy a line of code into your Cordova application and then restart
it. You can then open a dev tool panel on your desktop to work with
the application. Weinre is not quite as fancy as Chrome and Safari
Remote debugging but has the benefit of working with a much greater
range of operating systems and platforms. More information may be
found here: http://people.apache.org/~pmuellr/weinre/docs/latest/
Other Options
BlackBerry 10 supports debugging as well: Documentation
You can debug using Firefox App Manager as well, see this blog post and this MDN article.
For more examples and explanation of the above debugging tips, see:
http://developer.telerik.com/featured/a-concise-guide-to-remote-debugging-on-ios-android-and-windows-phone/
In Android you can debug your app in eclipse logcat where all javascript and other errors will be shown in console.
But for ios you need to install phonegap console plugin to see errors. install below plugin from url.
https://github.com/apache/cordova-plugin-console
Hope this helps..
Thanks
Reference: Genymotion how to debug with Chrome Dev Tools
I'm also trying to get chrome developer tools to work with a genymotion emulator. However, when I follow all of the steps recommended (including at the above link), I don't get the "inspect" link. See: http://neu14.com/demos/screenshot.png
Note: I found out that the default browser on the android devices, at least on most of the prior os versions is not Chrome. Finding an apk to download for Chrome android compatible versions, without an actual google play account, is quite challenging?
It took me ages to get the remote debugging working on Genymotion as I couldn't install Chrome on it without the Google play store which isn't installed by default.
Finally found this video so thought I'd share. It explains how to install this virtual device which has the play store ready installed. Once that was set up and I could install Chrome and set up remote debugging.
Won't work with the default android browser though as you said, but its a step forward!
Hope that helps
I know my answer is little late, but I thought it may be helpful for someone
1) In the device, go to dev settings/ dev tools and enable USB debugging.
2) Start your app on genymotion (for instance if you are using ionic framework, then launch the app using "ionic run android"
3)Go to you chrome and try running "chrome://inspect"
4) Also , please ensure that you have android 4.4 or above version. Else it wont work. I spent quite a lot of time because i was using android 4.3 version.
Hope this helps
I found it far simpler to use a product like Ghostlab (https://www.vanamco.com/ghostlab/) (paid product).
It will let you connect to the site running on your host machine, from the Genymotion emulator. You can then launch chrome dev tools from your host machine.