Debugging; ad-hoc code inspection

Hey everyone, love the notebooks so far. Coming from a background of using Jupyter notebooks a lot, there are a few things that I’ve sorely missed as I’ve been trying to cobble together a few cool charts. If anyone has suggestions for alternatives for these I’d love to hear them.

console.log: My go-to for debugging a Javascript function that’s confusing to me is to console.log objects to sanity-check that they are what I think they are, but as far as I can tell there’s no obvious alternative for that. If you have a large block of code that you’re assigning to a name (like chart = { … }) which has a lot of locally defined functions, I would like the ability to inspect what’s going on inside of those functions each time they’re called. I can’t use a yield statement, and refactoring the code so the function exists outside the context seems like too much work.

tab-completion: this might just be a case of a feature not yet being built, but being able to quickly check what the member variables / functions of an object are saves to much time when I’m programming in a Jupyter notebook.

1 Like

Perhaps not ideal, but you can still use your browser’s built-in developer console with Observable. If you drop a debugger statement in your cell and open the developer console, the next time you run the cell it should pop you directly into the code so you can step through and see what’s happening.

5 Likes

Had no idea about the debugger statement, that’ll definitely come in handy. Thanks!

1 Like