JSON explorer for Firebug

by Honza

Thanks to Ashish Datta, Firebug is having a fresh new support for inspecting JSON in net responses. This feature allows to see JSON formatted as an expandable tree of items and also explore them using Firebug's Dom tab.

The view is available within Net panel and visible as soon as a JSON request is expanded. In such a case the user can see another tab (like Params, Headers, etc.). See the following screen-shot.

Explore JSON response using a JSON viewer

By clicking on links within the view (green labels) the user is automatically navigated to the Dom tab to explore particular parts of the JSON response as javascript objects.

The feature should be part of Firebug 1.4a11.

Ahshis is a senior at Tufts University and he did this work as a part of his class focusing on open source development. It's great to see how community around Firebug is growing and willing to contribute to this indispensable tool!

Rss Commenti

9 Comments

  1. [...] bugs). I thought it was funny that right as I was resuming work on JSONView I noticed that a JSON explorer had actually landed for Firebug 1.4, which I’ll also be looking forward to. Initially I had intended to build that functionality [...]

    #1 JSONView - View JSON documents in Firefox « Blog | BRH.numbera.com

  2. This is great if it worked. Perhaps the installation went bad or a configuration i'm missing. 1.4a12 is completely missing the response altogether in the Net -> Response tab for a JSON response (or probably for all responses for that matter). 1.4a11 has responses, but it looks no different than today's production version of firebug, ie, no JSON tab as the screenshot in this page. Thanks!

    #2 dannyd

  3. @dannyd: this looks like http://code.google.com/p/fbug/issues/detail?id=1465. Do you have a simple test case (online URL or a file) that could be used to reproduce the problem?

    #3 admin

  4. I use JSONP (JSON wrapped in a callback), so my responses are not recognized as JSON and I get an HTML tab instead. Could I suggest an enhancement that would see a JS response as follows
    some_callback_function(JSON object)
    and let me navigate through the object?

    Thanks!

    #4 DaveE

  5. I just installed 1.4a14, unfortunately I cannot find the JSON tab. The content type response header is set to:"text/json; charset=utf-8". I'll try falling back to 1.4a11.

    Thanks :)

    #5 Matt

  6. Could you please try my online test here:
    http://www.janodvarko.cz/firebug/tests/1275/Issue1275.htm
    If the test passes for you, it must be something with the JSON response.

    #6 admin

  7. I am using 1.4.0a17 but cannot see the JSON tab in my own test or in the test provided above (although that is responded with invalid request : 411 Length Required

    #7 wioota

  8. Good post... keep it up!!!

    #8 net software development

  9. [...] Firebug JSON Explorer I actually have it tried this one, but it might work. I use Firebug but this feature is only available in the 1.4 beta. I wasn’t feeling brave enough to upgrade my Firebug version. [...]

    #9 View, Browse, and Edit JSON Objects Visually | Pressing the Red Button

Leave a comment