Add a "Use in console" & "Copy as Fetch" context menu entries

RESOLVED FIXED in Firefox 68

Status

enhancement
P3
normal
RESOLVED FIXED
4 months ago
2 months ago

People

(Reporter: nchevobbe, Assigned: mrigankkrishan)

Tracking

66 Branch
Firefox 68

Firefox Tracking Flags

(firefox68 fixed)

Details

(Whiteboard: [qa-68b-p2])

Attachments

(1 attachment)

Feedback from https://twitter.com/fux0r/status/1111323909532643329

Some people would like to have the ability to transform a network entry into a fetch expression in the console to be able to iterate on a given network call.

So imagine you have a call to https://example.com?hello=world, the context menu entry would fill the console with:

await fetch("https://example.com?hello=world", {
  method: "GET",
})

or even better (so you can play with params more easily):

await fetch(`https://example.com?${new URLSearchParams({
  hello: "world",
})}`", {
  method: "GET",
})

We could also have a different context menu entry to only assign the response result to a temp variable in the console, like we do for dom nodes in the inspector.
It creates a temp* variable, and pre-fill the console input with the variable name. I can see that being handy when working with JSON responses (I used to copy the response body and paste it in the console, but that takes many steps).

And then we could have the same thing for network messages in the console so it would be even faster for people.

I really like the ideas, thanks for the report Nicolas!

I created a follow up for the second idea (comment #1): bug 1540077

Honza

add "Copy as fetch" context menu item

Hey! Please take a look at my attempt on this.
Currently, I have added a context menu item "Copy as fetch" to copy the selected request as fetch.

I'm looking into ways to pre-fill the console. Any pointers?

Flags: needinfo?(odvarko)
Flags: needinfo?(nchevobbe)

Thanks for working on this. Please see my comments in Phabricator.

Honza

Flags: needinfo?(odvarko)

clearing ni

Flags: needinfo?(nchevobbe)

Do we really need a "Use in console" option? I think having just "Copy as Fetch" is enough, it covers a broader use case.
Users can paste into the console if they want or they can use it wherever they want.

What do you think?

Flags: needinfo?(nchevobbe)
Flags: needinfo?(nchevobbe)
Summary: Add a "Use in console" context menu entry → Add a "Use in console" & "Copy as Fetch" context menu entries

So, we were discussing this and there are good reasons to have both these actions.

  • "Copy as Fetch" in the existing "Copy" context sub-menu
  • "Use in Console" in top level Context menu. Please create separator at the bottom and put this one as the last one. This one should open the Split Console and put the generated source into the input field.

This will help us:

  • Extend existing set of Copy actions and improve parity with Chrome
  • Extend existing set (there is similar action in the Inspector panel) of "Use in" actions - support for close integration with other panels. No need for a sub-menu at this point.

Please, update the patch and I'll review it.

Thanks!

Honza

Flags: needinfo?(mrigankkrishan)

Updated on phabricator

Flags: needinfo?(mrigankkrishan)
Pushed by jodvarko@mozilla.com:
https://hg.mozilla.org/integration/autoland/rev/29e9e55681ab
Create fetch request from selection. r=Honza
Status: NEW → RESOLVED
Closed: 3 months ago
Resolution: --- → FIXED
Target Milestone: --- → Firefox 68
Assignee: nobody → mrigankkrishan
Whiteboard: [qa-68b-p2]
You need to log in before you can comment on or make changes to this bug.