Skip to content

Instantly share code, notes, and snippets.

@dhbalaji

dhbalaji/DebugChromeAndroid.md

Last active June 7, 2020 14:27
Show Gist options
  • Save dhbalaji/095b226ad423b9dbbd42014e6f98e289 to your computer and use it in GitHub Desktop.
Save dhbalaji/095b226ad423b9dbbd42014e6f98e289 to your computer and use it in GitHub Desktop.
Download ZIP
How to debug UI issues on chrome android
Raw
DebugChromeAndroid.md

Debug mobile chrome UI screens on android

If you had done any responsive web development, you can verify your code on the mobile devices in 2 ways. It could be done on

  1. the chrome devtools with device emulator
  2. the real android or IOS device connected to your laptop via USB

Let us look into step 2 in this short article

Things you need

  1. A website running on your chrome browser on android device
  2. A laptop/computer with USB
  3. Chrome devtools open

Steps to get started

  1. Open chrome://inspect/#devices to see the devices connected. If you have a developer enabled android with USB debugging, you can skip other steps.
  2. Enable developer on your android but clicking the build number multiple times
  3. Go into your developer settings and enable USB debugging
  4. Open your website on chrome / supported browsers. Some browsers other than chrome support UI debugging.
  5. Click on inspect and voila!

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment