How to debug lazily-loaded javascripts in Safari debugger

Question

I have a very simple script that lazy-loads javascripts at runtime. There are unknown dependencies on each page, so they are not all loaded until needed.

Like most frameworks, this works by adding a script tag to the document head.

Everything executes fine, but the Safari debugger neither sees the new script tags in the "Elements" inspector, nor shows them in the "Scripts" tab. Errors are reported as occurring on the root document, rather than the proper script.

An obvious workaround is to author and debug everything normally, and then add the dependency loading as a last step. But I would love to know if there is there a better way to lazy-load scripts that makes the debugger happier?

Answer 1

I know that if you lazy load scripts with eval then the firebug debugger has a hack to get at the script.

Normally lazy loaded script can not be accessed from the debugger. You should hard link it and add the lazy loading for production.

Answer 2

Safari has a setting in the Script tab to pause on exceptions, giving you an interactive debugger at the point in code whenever an exception is thrown, or alternately, only on unhandled exceptions.

It looks like a little octagon with two vertical bars. It's a tri-state button, and the tooltips summarize each state's functionality.