Debugging Firefox Mobile on Your Computer
June 25, 2015
I needed to debug a web page that I was working on, which was having some issues on mobile versions of firefox. I just needed to look at the console, but setting this up was a bit complicated, moreso than it should be. This should hopefully help:
- On your phone: Settings>About Phone>Build number (tap this 7 times to become a developer).
- Enable USB sharing: On your phone: Settings>Developer Options>USB Debugging
- In firefox on your desktop, open developer tools (Ctrl+Shift+I). Click on the gear icon. In the Advanced Settings section, check the boxes for 'Enable chrome and add-on debugging' and the 'Enable remote debugging.
- Open the firefox on your mobile device. Click on the menu, then go to Settings>Developer Tools. Enable remote debugging by checking the appropriate checkbox.
- Connect your phone to your computer with a USB cable
- In Firefox on your desktop, go to Tools>Web Developer>WebIDE
- Click on 'Select Runtime' dropdown, your device should be listed, click on it.
- Look at your phone, there should be a message to allow the connection. Click ok
- In WebIDE, click on the 'Open App' dropdown. There is a section that lists currently open tabs, click on the tab you would like to debug.
- You should now have access to the console, inspector, etc...
The Built Environment