Firebug For iOS Bookmarklet: Adds A Firebug Console To iOS
by Joe White
December 4, 2011
A new bookmarklet for iOS (developed by Joe Hewitt) adds a Firebug console to Safari for iOS.
Though Marin Kool has published a concise how-to guide on installing and using the Firebug bookmarklet, the text box on his webpage didn't load properly on my iPhone. Because of that, I'll outline how I managed to install the bookmarklet here.
First, create a bookmark in Safari on your iOS device for any webpage, and name that bookmark "Firebug."
Next, copy the below text to your iPhone's clipboard:
javascript:(function(F,i,r,e,b,u,g,L,I,T,E){if(F.getElementById(b))return;E=F[i+'NS']&&F.documentElement.namespaceURI;E=E?F[i+'NS'](E,'script'):F[i]('script');E[r]('id',b);E[r]('src',I+g+T);E[r](b,u);(F[e]('head')[0]||F[e]('body')[0]).appendChild(E);E=new%20Image;E[r]('src',I+L);})(document,'createElement','setAttribute','getElementsByTagName','FirebugLite','4','firebug-lite.js','releases/lite/latest/skin/xp/sprite.png','https://getfirebug.com/','#startOpened');(Apologies - the above text isn't playing nice with our AppAdvice page design, but I'm going to leave it as it is for fear of disrupting the bookmarklet.) Following this, launch Safari and edit the Firebug bookmark, replacing the URL with the above text. Hit "Done," and the bookmarklet should be created and ready to use. In order to launch the Firebug console, visit a website on your iOS device and, once the website has loaded, open your Bookmarks in Safari and touch Firebug. After a few moments, the console should appear at the bottom of the webpage (as you can see in the above image). That's all, folks! Hopefully the above method will work for you (I emailed myself the bookmarklet, but if you keep this webpage open in Safari on your iOS device you can copy the text from here). Let us know how the Firebug console works for you in the comments below.
