Tidbits | Feb. 19, 2014

Django Debugging Bookmarklet Trick

by Frank Wiles

So this is one of those little things where you think, why the hell didn't I think of this years ago?

I'm sure many Django developers end up doing this on a fairly regular basis. You're working on a site, go to the production/staging version, navigate around and then want to view the same URL path but on your local development server.

If you're like me you cut-n-paste the current URL into a new tab and manually remove the host and replace it with http://localhost:8000. That way you have a browser tab of the real site and a tab with the local version for comparision. I've done this at least a billion times. It's a silly little annoyance because it's easy to mess up the URL leaving off the slash after 8000 for example.

This morning while working on a site I realized, WTF I can do this with a bookmarklet! They're super easy as it turns out.

Version that replaces the current tab:

javascript:(function() { window.location.replace("http://localhost:8000" + window.location.pathname); }())

Version that creates a new tab:

javascript:(function() {  window.open("http://localhost:8000" + window.location.pathname, '_blank'); }())

I still can't quite believe I didn't think to do this long ago! I wonder how many hours of time I would have saved over the years? I've included two links below that you can create your own bookmarks from, you'll obviously need to edit them if you don't use the Django defaults of localhost:8000.

Simply drag which ever version you prefer into your bookmarks and you're ready to go.

Make localhost:8000

Make localhost:8000 tab

You could easily modify these to create bookmarklets that take you to your staging or QA system and even when working with development frameworks other than Django.

Hope this saves you as much time as it is going to save me!

UPDATE: Jacob sent me a great additional add-on tip to this. Michael Mahemoff has a good tip on how to change the Favicon in your browser between different environments like staging and production. So you can combine these two techniques for maximal win!

A little bookmarklet that redirects you from the current page to the same path on http://localhost:8000/. Helpful when debugging Django.

2014-02-19T08:28:41 2018-04-18T16:25:07.468545 2014 programming,django,Featured Posts