Debugging Mobile Web Pages on your Computer

Have you ever wanted to turn on web developer tools on a mobile page on your phone? View the network requests, inspect elements or just stalk the console of your favorite mobile site.

It’s definitely a possibility and all you need is a computer and your Android phone!

Firstly, you need to ensure your phone has USB debugging turned on. If you already have this, you can skip this paragraph. If not, follow the steps listed out here.

Connect your phone to the computer, then open a new tab on the computer browser.

You may get a prompt on your phone to allow USB debugging.
Check Always allow from this computer and select Ok

For Chrome, visit chrome://inspect
For Brave, visit brave://inspect
For Firefox, visit about:debugging

Computer browser showing all phone browsers and tabs

You‘d see a list of all your browsers and tabs opened on your phone. To inspect a particular tab, click on the inspect button directly below the tab.

This opens the web dev tools for that particular tab.
You can choose to monitor the network requests, view the data stored in the local storage or inspect specific elements on the page.

Web developer tools for mobile web page

Thank you for getting this far in the article, I hope it helps and I look forward to your comments and questions.