1422014 - Resend option in netmonitor

Status: RESOLVED FIXED

(DevTools :: Netmonitor, enhancement, P3)

Description

[Hrvoje Novosel]

In network monitor there is an option to "Edit and Resend" a request. I would be great to also have just a "Resend" option both in context menu and button in Headers subtab.

Also this would be great to have in Console tab context menu... there already is a Bug #879704 closed as won't fix for this.
In Firebug Resend option was present in Console tab... that was such a great time saver on debugging that I don't understand why is this a won't fix?

It may seem trivial but doing heavy debugging with, for example, 20 resends you now have to go through 80 clicks in various screen parts and tab switchings.. and it was just 20 clicks in Firebug.
The more you do it the more the diff and time waste gets to be a really big deal. 

Having atleast the "Resend" (without edit) option will eliminate 1 of the clicks in the flow.

Comment 1

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

I like the idea and I think the "Resend" action could be easily available in the context menu (in both network and console panel). The code base is now different and (from when Bug #879704 was closed) and it's simple to do this.

Honza

Comment 2

[Abhinav Koppula]

Hi Honza,
I am interested in working on this. Can I work on this?

Comment 3

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

Assigned!

Honza

Comment 4

[Hengyeow (:tanhengyeow)]

:Honza 

Would love to be assigned this issue! :)

Comment 5

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

@Heng: I just assigned you to bug 1358038, so let's fix that one first :)

Honza

Comment 6

[Milena Boselli]

Hello, Honza,

I would like to try to work on this issue as my first contribution.
How I should proceed?

Thanks, Milena.

Comment 7

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

@Harald, any opinions on this?

To summarize:
1) The Net panel context menu should have one more action: "Resend" - resend clicked request immediately, no edit form.
2) The Console panel context menu should have this new "Resend" item too (only when clicking on a request).

Comments (no strong opinion):
- We don't need "Edit and Resend" in the Console. 
- We don't need additional button "Resend" in the Headers panel.

Honza

Comment 8

[Eva]

Hello @Honza,

Please let me know if this issue is still available (I know it's been assigned before, but there haven't been any updates recently).

These are the steps I've taken so far:
1. I have firefox running locally (Nighty)
2. I've played with "edit and resend" and am aware of the two locations that the "resend" option has to be added (and I understand how this is timesaving).
3. I've looked into the code, and I reckon the solution is somewhere in devtools/client/netmonitor/src/ (selectors?)
4. No idea yet about Mercurial, but I'm familiar with Git, Javascript, CSS, and ReactJS, so hopefully I can figure this out!

I've never contributed to Mozilla before, so I also need to figure out that process still. 

Kind regards, 
Eva

p.s. I'm also on slack (@eva)

Comment 9

[:Harald Kirschner :digitarald]

SGTM.

I do like the idea of a quick Resend option, especially for RESTful API development.

Comment 10

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

(In reply to Milena Boselli from comment #6)
> I would like to try to work on this issue as my first contribution.
> How I should proceed?
Assigned to you.

0) Read about how to contribute to Firefox Developer Tools
https://developer.mozilla.org/en-US/docs/Tools/Contributing

1) The edit and resend panel (aka CustomRequestPanel component) is implemented here:
https://searchfox.org/mozilla-central/source/devtools/client/netmonitor/src/components/CustomRequestPanel.js

2) The context menu with 'edit and resend' action is here:
https://searchfox.org/mozilla-central/rev/a11c128b90ea85d7bb68f00c5de52c0794e0b215/devtools/client/netmonitor/src/widgets/RequestListContextMenu.js#179

3) Here is the action object that clones the selected request and opens the form:
https://searchfox.org/mozilla-central/rev/a11c128b90ea85d7bb68f00c5de52c0794e0b215/devtools/client/netmonitor/src/actions/requests.js#40

It's handled here (in a reducer):
https://searchfox.org/mozilla-central/rev/a11c128b90ea85d7bb68f00c5de52c0794e0b215/devtools/client/netmonitor/src/reducers/requests.js#121

4) Here is the place where the code decides whether to display the edit and resend form or not:
https://searchfox.org/mozilla-central/rev/a11c128b90ea85d7bb68f00c5de52c0794e0b215/devtools/client/netmonitor/src/components/NetworkDetailsPanel.js#43
- the `request` is the selected request.

See, again the reducer, that's where the `isCustom` prop is set:
https://searchfox.org/mozilla-central/rev/a11c128b90ea85d7bb68f00c5de52c0794e0b215/devtools/client/netmonitor/src/reducers/requests.js#141


Note that knowledge about React & Redux is advantage here.

Let's start with the Network panel context menu and as soon as it works we can start with the Console menu.

Also, please ping Eva if you'd changed your mind and wanted to be unassigned from this bug, thanks!


(In reply to Eva from comment #8)
> Please let me know if this issue is still available (I know it's been
> assigned before, but there haven't been any updates recently).
Sorry, Milena asked first in this bug.

You might look here for alternatives: https://mzl.la/2zCcSFE

Honza

Comment 11

[Eva]

(In reply to Jan Honza Odvarko [:Honza] from comment #10)

Will do, thank you! :)

Comment 12

[Eva]

(In reply to Milena Boselli from comment #6)
> Hello, Honza,
> 
> I would like to try to work on this issue as my first contribution.
> How I should proceed?
> 
> Thanks, Milena.

Hi Milena, 

let me know if you would still like to work on this task, I'm quite familiar with React (not Redux though) and happy to take over if needed. 

Kind regards, 
Eva

Comment 13

[Milena Boselli]

(In reply to Jan Honza Odvarko [:Honza] from comment #10)
> (In reply to Milena Boselli from comment #6)
> > I would like to try to work on this issue as my first contribution.
> > How I should proceed?
> Assigned to you.
> 
> 0) Read about how to contribute to Firefox Developer Tools
> https://developer.mozilla.org/en-US/docs/Tools/Contributing
> 
> 1) The edit and resend panel (aka CustomRequestPanel component) is
> implemented here:
> https://searchfox.org/mozilla-central/source/devtools/client/netmonitor/src/
> components/CustomRequestPanel.js
> 
> 2) The context menu with 'edit and resend' action is here:
> https://searchfox.org/mozilla-central/rev/
> a11c128b90ea85d7bb68f00c5de52c0794e0b215/devtools/client/netmonitor/src/
> widgets/RequestListContextMenu.js#179
> 
> 3) Here is the action object that clones the selected request and opens the
> form:
> https://searchfox.org/mozilla-central/rev/
> a11c128b90ea85d7bb68f00c5de52c0794e0b215/devtools/client/netmonitor/src/
> actions/requests.js#40
> 
> It's handled here (in a reducer):
> https://searchfox.org/mozilla-central/rev/
> a11c128b90ea85d7bb68f00c5de52c0794e0b215/devtools/client/netmonitor/src/
> reducers/requests.js#121
> 
> 4) Here is the place where the code decides whether to display the edit and
> resend form or not:
> https://searchfox.org/mozilla-central/rev/
> a11c128b90ea85d7bb68f00c5de52c0794e0b215/devtools/client/netmonitor/src/
> components/NetworkDetailsPanel.js#43
> - the `request` is the selected request.
> 
> See, again the reducer, that's where the `isCustom` prop is set:
> https://searchfox.org/mozilla-central/rev/
> a11c128b90ea85d7bb68f00c5de52c0794e0b215/devtools/client/netmonitor/src/
> reducers/requests.js#141
> 
> 
> Note that knowledge about React & Redux is advantage here.
> 
> Let's start with the Network panel context menu and as soon as it works we
> can start with the Console menu.
> 
> Also, please ping Eva if you'd changed your mind and wanted to be unassigned
> from this bug, thanks!
> 
> 
> (In reply to Eva from comment #8)
> > Please let me know if this issue is still available (I know it's been
> > assigned before, but there haven't been any updates recently).
> Sorry, Milena asked first in this bug.
> 
> You might look here for alternatives: https://mzl.la/2zCcSFE
> 
> Honza

(In reply to Eva from comment #12)
> (In reply to Milena Boselli from comment #6)
> > Hello, Honza,
> > 
> > I would like to try to work on this issue as my first contribution.
> > How I should proceed?
> > 
> > Thanks, Milena.
> 
> Hi Milena, 
> 
> let me know if you would still like to work on this task, I'm quite familiar
> with React (not Redux though) and happy to take over if needed. 
> 
> Kind regards, 
> Eva

Hello, @Honza and @Eva,

I'd like to give it a try.

Milena

Comment 14

[Milena Boselli]

Hello, @Honza

I've been working on it, but I'm having some difficulties.
I've managed to add the "Resend" option to the context menu and I understand that the click action of it should call the function sendCustomRequest(connector), but could not figure out how to do this.
Besides, in the reducer called by "Edit and resend", isCustom is set to true. What'd be the best way to use the same function without showing the CustomRequestPanel?
Another noob question: how can I debug the code?

Best regards,
Milena.

Comment 15

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

(In reply to Milena Boselli from comment #14)
> Hello, @Honza
> 
> I've been working on it, but I'm having some difficulties.
> I've managed to add the "Resend" option to the context menu and I understand
> that the click action of it should call the function
> sendCustomRequest(connector), but could not figure out how to do this.

Can you pleas attach your changes as a patch to this bug, so I can see how far you've got?

Honza

Comment 16

[Milena Boselli]

Attachment: Bug1422014.patch

Comment 17

[Hengyeow (:tanhengyeow)]

Hi Honza

Does the current patch need more work on it? Would be glad to tie up any loose ends if so :)

Comment 18

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

(In reply to Heng Yeow (:tanhengyeow) from comment #17)

Hi Honza

Does the current patch need more work on it? Would be glad to tie up any loose ends if so :)
I was just testing this and:

1. The Network panel context menu has new "Resend" menu item, but it doesn't seem to work
2. The Console panel doesn't have the menu at all

See comment #7 for summary of what should be done here.

Thanks!
Honza

Comment 19

[Hengyeow (:tanhengyeow)]

Attachment: Bug 1422014 - Resend option in netmonitor. r=Honza

Add resend option in the context menu of netmonitor.

Comment 20

[Hengyeow (:tanhengyeow)]

Hi Honza

The attached patch does the following:

1. When a context menu is clicked, the Resend option appears on top of the Edit and Resend option.
2. When the Resend option is clicked, the same request is sent and appears at the bottom (signifies latest request). The request is also highlighted at the same time.

Would like to get your feedback on the patch :) Also, should I file a separate bug in the Console component for work to be done in the Console panel as well?

Comment 21

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

(In reply to Heng Yeow (:tanhengyeow) from comment #20)

Hi Honza

The attached patch does the following:

1. When a context menu is clicked, the Resend option appears on top of the Edit and Resend option.
2. When the Resend option is clicked, the same request is sent and appears at the bottom (signifies latest request). The request is also highlighted at the same time.

Would like to get your feedback on the patch :) Also, should I file a separate bug in the Console component for work to be done in the Console panel as well?

Thanks!

Feedback posted to Phabricator

Also, should I file a separate bug in the Console component for work to be done in the Console panel as well?

Yes, please

Honza

Comment 22

[Hengyeow (:tanhengyeow)]

Hi Honza

Updated the patch shown in Phabricator and also filed the bug which can be seen in this Bug 1530138.

Comment 23

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

Thanks, I just commented on Phabricator.
Honza

Comment 24

[Hengyeow (:tanhengyeow)]

Hi Honza

Updated the patch as seen in Phabricator.

Try results here for reference:
https://treeherder.mozilla.org/#/jobs?repo=try&revision=4a4112eef6f95b3ea85ddde84396d0123c22d206

Comment 25

[Pulsebot]

Pushed by [e-mail]:
https://hg.mozilla.org/integration/autoland/rev/1bab6b17eee5
Resend option in netmonitor. r=Honza

Comment 26

[Raul Gurzau (:RaulG)]

https://hg.mozilla.org/mozilla-central/rev/1bab6b17eee5

Comment 27

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

I filled a follow up bug 1536828 for implementing "Resend" also in the Console panel.

Honza

Comment 28

[Irene Smith]

Added this to the Network Request list context menu:

Resend
The Resend context menu option allows you to resend the request as it was originally sent with no changes made.

Comment 29

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

Sounds good to me, thanks Irene!
Honza