Jake Wilson
Jake Wilson

Reputation: 91193

Android AVD Emulator Dev Tools for Mobile Browser?

I'm working on a mobile web app. I have a variety of devices I'm testing with but one device I do not have is an Android device running Android 2.3.x. I've resorted to using Android AVD emulators via Eclipse.

It's good using the emulator for testing, however a few CSS styles of my web app render strangely in the Android 2.3.x Web Browser.

Is there any way to debug or experiment with the CSS using the default Android browser in an AVD emulator? I'm not sure if it's possible to somehow examine and alter the CSS in the browser so that I can figure out what the problem is (similar to what you do with Chrome dev tools or Firebug).

I've read that there is some way to do this using mobile Chrome for Android where it connects with Chrome on your desktop and you debug it that way... But I'm not sure about the default Android 2.3.x Browser.

Upvotes: 9

Views: 4085

Answers (1)

Pierz
Pierz

Reputation: 8118

You can connect from Chrome on your desktop to either an emulated Android device (e.g. an AVD started from Android Studio), or a usb connected real device (with USB debug enabled), running Chrome. Type in the following url into the desktop Chrome browser:

chrome://inspect/#devices

Then it will list any connected devices you can interact with. For example, you can get it to open a specific url and then inspect that tab - which provides for access to the web dev tools console - just like on desktop Chrome.

Upvotes: 1

Related Questions