859138 - Add a plain text response view for json objects

Status: RESOLVED WORKSFORME

(DevTools :: Netmonitor, defect, P2)

Description

[Victor Porof [:vporof][:vp]]

JSON responses are currently shown in a VariablesView instance. This is great, but if someone wants to batch-copy the exact response text, they're goona' have a bad time. Something like "view source" would be nice (this can even just simply open a new tab with the response listed as plain text).

See also bug 859133.

Comment 1

[Victor Porof [:vporof][:vp]]

Moving into Developer Tools: Netmonitor component. Filter on NETMONITORAMA.

Comment 3

[Pierre de La Morinerie]

+1. I often run into this issue, and have to run another browser to copy the response text.

Comment 5

[Pierre de La Morinerie]

Attachment: Allow copying the network response string.

Here is a new version of the patch initialy submitted in bug 955933.
It adds a test for the 'Copy Response as String' menu item.

Comment 6

[Pierre de La Morinerie]

Now that I'm thinking about it: a better solution could be to adopt the same behavior than for HTTP responses: having a "Preview" tab with a structured view of the content, and keep the "Response" tab plain-text.

It would allow for other usages than just "Copy to clipboard" (for instance checking that the JSON is properly prettified or minified), and be more discoverable than a context menu. But it also would change the current behavior of the "Response" tab.

Any thoughts on this?

Comment 7

[Jeff Griffiths (:canuckistani) (:⚡︎)]

(In reply to Pierre de La Morinerie from comment #6)
> Now that I'm thinking about it: a better solution could be to adopt the same
> behavior than for HTTP responses: having a "Preview" tab with a structured
> view of the content, and keep the "Response" tab plain-text.
> 
> It would allow for other usages than just "Copy to clipboard" (for instance
> checking that the JSON is properly prettified or minified), and be more
> discoverable than a context menu. But it also would change the current
> behavior of the "Response" tab.
> 
> Any thoughts on this?

I like it. Also, this more-than-occasionally comes up in feedback:

https://twitter.com/jessewilliamson/status/487591765697105921

Victor: what are your thoughts on this?

The simplest workaround currently is to right-click on the request and open it in a new tab in Firefox.

Comment 8

[Victor Porof [:vporof][:vp]]

The way I see it, it's a bit tricky. If we were to be consistent, for example, we'd have images in the Preview tab, in which case we wouldn't display anything in the response tab?

I would very much prefer a simple button on the JSON scope header (in the response tab) that opens a new tab with the plain text response. Same goes for request/response headers.

Comment 9

[Jeff Griffiths (:canuckistani) (:⚡︎)]

(In reply to Victor Porof [:vporof][:vp] from comment #8)
> The way I see it, it's a bit tricky. If we were to be consistent, for
> example, we'd have images in the Preview tab, in which case we wouldn't
> display anything in the response tab?

I think it's worth considering the different classes of things and thinking about what a developer might want to do with the response:

* js/html/css/ other text
 - need to copy the text or easily open in view-source / larger viewer
* JSON
 - copy the text
 - view / filter / search the data structure
* images
 - view the image, save it to disk?
* non-image binary files
 - easily see the mime type, save it to disk?

> I would very much prefer a simple button on the JSON scope header (in the
> response tab) that opens a new tab with the plain text response. Same goes
> for request/response headers.

That make sense to me as well.

Comment 10

[James Long (:jlongster)]

rtorruellas, this might give you something to work towards as you get to know the code? I can definitely help you on this also. ping me on IRC if you want to work on this!

Comment 13

[Jan Lubeck]

Is this being worked on? It would be really helpful to be able to copy the JSON string without having to make another call in a new tab. Thanks

Comment 14

[Jeff Griffiths (:canuckistani) (:⚡︎)]

(In reply to Jan Lubeck from comment #13)
> Is this being worked on? It would be really helpful to be able to copy the
> JSON string without having to make another call in a new tab. Thanks

FYI recently added a context menu item to copy the response of these requests, see bug 955933

Comment 15

[Jeff Griffiths (:canuckistani) (:⚡︎)]

Current suggested workaround, for the record, should be to open the json request in a new tab, which in dev edition which will provide the full JSON response view

Comment 16

[jade]

It's a big problem when trying to diagnose errors in POST requests that are supposed to return JSON but aren't. I used to be able to get a raw text output to see what was being returned. All I get now is a blank response tab with 'SyntaxError: JSON.parse: unexpected end of data at line 1 column 1 of the JSON data'

Comment 17

[jade]

POST requests can not be easily opened in a new tab

(In reply to Jeff Griffiths (:canuckistani) (:⚡︎) from comment #15)
> Current suggested workaround, for the record, should be to open the json
> request in a new tab, which in dev edition which will provide the full JSON
> response view

(In reply to jade from comment #16)
> It's a big problem when trying to diagnose errors in POST requests that are
> supposed to return JSON but aren't. I used to be able to get a raw text
> output to see what was being returned. All I get now is a blank response tab
> with 'SyntaxError: JSON.parse: unexpected end of data at line 1 column 1 of
> the JSON data'

Just noticed 'Copy Repsonse' in the context menu that Jeff Driffiths mentioned. That is all I need, thanks. I should have read everything before posting.

Comment 19

[Aurélien]

The workaround 'Copy Repsonse' in the context menu is very useful.

However, to really solve the problem 2 changes would be good:
1. fall back to the text parser if the default parser (JSON, image, ...) cannot parse the response,
2. a dropdown menu should enable to choose the parser: if the response has a wrong content type but the user wants to display the JSON view, it should be possible.

Comment 20

[anikolaev]

> Current suggested workaround, for the record, should be to open the json
> request in a new tab, which in dev edition which will provide the full JSON
> response view

This doesn't work if response depends on some specific HTTP headers sent. Copying the response from context menu is not convenient when you need to look at raw response and copy some part of it. It would be more user friendly to have 'Raw data' button similar to the one at HTTP headers tab.

Comment 21

[T.Rosenau]

There are several more annoyances related to this:

- a response body that looks like JSON is always treated as application/json, even if it is served as text/plain.
(Reminds me of MIME Type Guessing in IE4…)
- a response containing nothing but an empty array [] is displayed exactly like an emty object {}
- Duplicate keys are not displayed (remember that {"a":1,"a":2} is perfectly valid JSON)
This is because JSON.parse() does actually parses AND evaluates its argument, but who knows if I use a custom JSON parser that handles duplicate keys…
- The tree is collapsed, and I could not find a way to expand all nodes by default, or with a single shortcut

All these are not related to copying, but simply to viewing the response.

Comment 22

[Kumar Harsh]

It's been 3 years since this harebrained "design" was introduced, and even after so many suggestions that it's counter-productive, the firefox team just doesn't have any desire to fix this simple problem. There was a time when atleast Firebug was better. But now? well, just look at this issue raised 18 months back: https://github.com/firebug/firebug.next/issues/326

Comment 23

[Jo Cutajar]

I'd much prefer plain text first. If there's a JSON or ANYTHINGOTHER view then offer it as an alternative.

Comment 24

[lehienduc]

In Network tab, just right click the request then select Copy Response.

Comment 25

[sivalingam]

I wonder, this 5 years old request is still not addressed but its a simple usecase for developer to view response in raw format.
For this, I need to run chrome in my machine. Earlier, firebug has this feature.

Comment 26

[Jan Honza Odvarko [:Honza] (always need-info? me)]

Seeing and copying raw response data should be possible when bug 1362036 lands
(it's been pushed today)

Honza

Comment 27

[lloan alas:[lloanalas]]

:(In reply to Jan Honza Odvarko [:Honza] (always need-info? me) from comment #26)

Seeing and copying raw response data should be possible when bug 1362036
lands
(it's been pushed today)

Honza

Should this be marked as fixed since bug # 1362036 was marked as verified? I just checked and it looks like its working fine.

Visual: https://i.imgur.com/lmP3Tes.png

Comment 28

[Jan Honza Odvarko [:Honza] (always need-info? me)]

Yes, this can be closed since this has been already implemented.

But the bug # you are pointing to is incorrect. Do you know the right bug? We should mark it as dup
(I can't find it atm)

Honza

Comment 29

[Jan Honza Odvarko [:Honza] (always need-info? me)]

I didn't find any dup, but this is fixed, so I am closing it.

Honza

Comment 30

[lloan alas:[lloanalas]]

(In reply to Jan Honza Odvarko [:Honza] (always need-info? me) from comment #29)

I didn't find any dup, but this is fixed, so I am closing it.

Honza

I could not find it either. I just know I referred to that previous bug and when I tested it, it works fine on my end.

Comment 31

[swordangel]

Can we re-open this? Right now the FF dev tools only allows us to copy the whole JSON response. But we don't always want the whole response. Sometimes we only want one of the key, sometimes only one of the primitive values, sometimes a whole subtree.

It gets annoying when the JSON response is quite large, then we'd need to copy the whole response to a text editor and fish for the thing we're looking for, when we could already see the JSON pretty-formatted, right under our nose in the Response panel.

For the record, when viewing, for instance, HTML or CSS in the same Response panel, we can select and copy only the selection.

Comment 32

[Sebastian Zartner [:sebo]]

You should rather create a new request for your suggestion, because this one was explicitly for adding a plain text view for JSON objects.

Sebastian

Comment 33

[Jan Honza Odvarko [:Honza] (always need-info? me)]

Yep, I second Sebastian. Please create a new fresh report.
Honza