Safari is usually a very large pain when building Javascript apps. There are many small issues that seem to pop up all the time. But now with the release of Safari 2.0, you have a bit of help. Safari now has a Javascript console! It’s nothing fancy, and the errors it shows are sometimes less than optimal, but it’s far better than just guessing randomly at the problem.

To enable the Javascript console, first you must enable Safari’s debug menu. Do this by opening your Terminal and inputting this line:

defaults write com.apple.Safari IncludeDebugMenu 1

Now the next time you start Safari, you’ll have an extra menu up top called “Debug” and inside are all kinds of goodies. Here’s what the menu looks like:

Back to the original point of this post, one of the items is “Show JavaScript Console” and selecting that item opens up this little window:

It’s not nearly as sleek and useful as the Firefox/Mozilla Javascript console, but it’s a step in the right direction, and definitely better than nothing.

Well, after a few hours of tyring different ways to hack Safari into submission, I decided that the only way I could get it working was to use some Javascript, so I thought I should share the code since there were a few pages on Google also looking for solutions.

Here is what the Javascript looks like:

var targBox = "box";
function init() {
	if (document.getElementById) {
		var atags = document.getElementsByTagName("A");
		for (var i=0;i<atags.length;i++) {
			var ca = atags[i];
			if (ca.href.indexOf("#") > -1) {
				ca.onclick = function() {
					scrollDivToAnchor(this.href.split("#")[1]);
				}
			}
		}
	}
}
function scrollDivToAnchor(a) {
	var b = document.getElementById(targBox);
	b.scrollTop = document.getElementById(a).offsetTop - b.offsetTop;
}

Sample page with the working code:

View Example