Quick Guide to using FireFox Developer Edition to Remote Debugging/Inspect Element on iOS
I’ve been running FireFox Developer Edition for two days now, and easily one of the most exciting features is having access to FireFox’s Dev tools on iOS. Safari Development tools work, but FireFox’s dev tools are a bit easier to use once properly fired up.
The instructions are pretty good on FireFox’s website but here’s a quicker, easier guide to getting going with Remote debugging in FireFox.
1) Enable development mode on your iOS device (or simulator).
Go to Settings -> Safari -> Advanced and check Web Inspector. Physical devices need to be plugged in via USB.
2) In FireFox Developer Edition go to Tools -> Web Developer WebIDE
3) From the WebIDE window select Safari, FireFox and other WebViews on iOS on the right-hand side from Select Runtime.
4) From Open App select the open tab
Troubleshooting!
FireFox Developer Edition is exceptionally finicky about multiple iOS devices, so if you’re experiencing problems, connect only one device (a simulator or physical hardware).
WebIDE also doesn’t like when devices to go to sleep, letting a device go to sleep probably will require disconnecting and reconnecting, be sure Safari is open and the active application.
When in doubt, Disconnect from the WebIDE and select again from the WebIDE. Your device should show up on the Open App menu.