Firefox has some tremendous web developer capabilities: listening and modifying http requests, the web developer extension, DOM browser, Firebug to name some. Source Chart is also amazing. Firefox has one huge problem, however: it is zloooow on my mac and once I load all of these extensions, it gets even slower.
[Rant paragraph: the killer browser for the mac platform, imho, will be a webkit browser which can easily allow for extensions: if I want to store my bookmarks on del.icio.us, it should seamlessly integrate with that. If I want to install 50 extensions, it should allow me to do that, without becoming a 800 pound gorilla.]
So, I spent a bit of time yesterday trying to get Safari to mimick as much as possible some of the indispensible functionality in the Firefox developer extensions. Most of the scripts that I found were already there. Some I made.
Step 0: Enable debug menu in Safari
Just open Terminal.app and type the following:
defaults write com.apple.Safari IncludeDebugMenu 1
Step 1: Enable debugging
Go to webkit.org and download the newest webkit browser. Inside the dmg package you will also find an application called Drosera. Drosera is your webkit debugger.
Bonus point: by using webkit instead of Safari 3, you will get the newest Page Inspector, which is tremendously better than the original Safari 3 Page Inspector, which ships with Safari 3 (Edit: this page inspector is now standard in Safari 3).
Step 2: Most important Web Developer extensions for Safari
Please note: remove the newlines from the following lines of code.
Show tables:
javascript:var%20f=function(tt,col)%7Bvar%20a=document.getElementsByTagName(tt);
for(var%20b=0;b%3Ca.length;b++)%7Ba%5Bb%5D.style.border='1px%20solid%20%23'+col;
%7D%7D;f('table','00F');f('td','0F0');f('th','0FF');
Hide tables:
javascript:var%20f=function(tt,col)%7Bvar%20a=document.getElementsByTagName(tt);
for(var%20b=0;b%3Ca.length;b++)%7Ba%5Bb%5D.style.border='';
%7D%7D;f('table','00F');f('td','0F0');f('th','0FF');
Execute javascript:
javascript:var%20c='document.location.href',r='';
while(c=prompt(r+'Enter%20the%20code%20to%20be%20executed:',c)){
try{r='Returned:%20'+eval(c)+'\n';}catch(err){r='Error:%20'+err.message+'\n';}}
View generated source:
javascript:var%20str%20=%20document.documentElement.outerHTML;
str%20=%20str.replace(/%3c/g,%20"<");str%20=%20str.replace(/%3e/g,%20">");
str%20=%20"%3chtml%3e%3chead%3e%3c/head%3e%3cbody%3e%3cp%3e"%20+%20str%20+%20"%3c/p%3e%3c/body%3e%3c/html%3e";
var%20theWinref%20=%20window.open('','_blank');theWinref.document.write(str);
Step 3: Tinker headers in Safari
No known solutions yet. Any clue how to do this easily?
References:
No comments:
Post a Comment