Closed Bug 581352 Opened 14 years ago Closed 12 years ago

Console HTTP output should make JSON viewable as objects

Categories

(DevTools :: Console, defect, P3)

defect

Tracking

(Not tracked)

RESOLVED FIXED
Firefox 23

People

(Reporter: dangoor, Unassigned)

References

Details

(Whiteboard: [console-2])

If data is sent or received with the application/json MIME type, we should make that data viewable as an object rather than just text. This is incredibly useful for modern webapps which often send JSON data back and forth.
Whiteboard: [console-2]
What's an example of the type of output that should be seen?
(In reply to Allison from comment #1) > What's an example of the type of output that should be seen? if you type "window" in the Web Console and hit enter, you'll see "[object Window]" in the output. Click that, and you'll get an object inspector. We should be able to use the object inspector to view JSON data that has come back from requests, because it's a lot easier to browse in many cases.
I have started working on this bug. I would like some input about my design: I think it is important to display the JSON string as a string with a dropdown arrow. The simplest implementation would show it as an Object but I think this could be misleading to users. For example, inspecting the following object: {a: 1, b: 2, foo: "{\"c\": 3, \"d\": \"four\"}"} Would show the following in the Property Panel: a: 1 b: 2 *foo: "{\"c\": 3, \"d\": \"four\"}" c: 3 d: "four" As opposed to: a: 1 b: 2 *foo: [object Object] c: 3 d: "four"
Allison: thanks for your interest to take this bug! I have assigned it to you now. The property panel should display objects correctly (hopefully it does!). What you seem to suggest is beyond the scope of this bug. If you believe otherwise, please open a separate bug report. In terms of work and UI the easiest approach would be to allow the user to inspect the JSON string using the Property Panel. In the Network Panel, when a response body is available and when the response is a JSON content type, then you can display a button below (or above) the response body: "Inspect the JSON object". On button click you just do JSON.parse(responseBody) and give it to the property panel. You do not need to worry about the actual object representation from there on. Please let us know if you have further concerns. Thanks again! (assigning the bug to you, since you've already started work on it)
Assignee: nobody → allisoneer
Status: NEW → ASSIGNED
Component: Developer Tools → Developer Tools: Console
OS: Mac OS X → All
QA Contact: developer.tools → developer.tools.console
Hardware: x86 → All
Not currently working on bug
Assignee: allisoneer → nobody
Status: ASSIGNED → NEW
Version: unspecified → Trunk
would be cool if we could embed this directly in the console output area. Marking P3. Filter on TARDIS.
Priority: -- → P3
This should be fixed once bug 855544 lands, but we should do some testing.
Depends on: 855544
JSON responses are now inspectable in network response views, thanks to bug 855544. The network panel from the web console will be removed and we will link logs to the new netmonitor tool, see bug 861335.
Status: NEW → RESOLVED
Closed: 12 years ago
Resolution: --- → FIXED
Target Milestone: --- → Firefox 23
Product: Firefox → DevTools
You need to log in before you can comment on or make changes to this bug.