1454880 - UI DeveloperTools Network Tab, when Request Details is on, Pushes Cause and Domain together and make them indistinguishable

Status: RESOLVED FIXED

(DevTools :: Netmonitor, enhancement, P3)

Description

[Pouyan]

Attachment: request-detail-on.jpeg

User Agent: Mozilla/5.0 (Macintosh; Intel Mac OS X 10.13; rv:60.0) Gecko/20100101 Firefox/60.0
Build ID: 20180409184545

Steps to reproduce:

Go to Developer Tools, Network Tab, Open a page and see the log. Click on Show Request Detail.


Actual results:

The right side of the Tab shrinks, domain and cause connect together and it is hard to distinguish them from each other. (See Attachment)


Expected results:

There should be a small distinguishable distance between these two.

Comment 1

[Pouyan]

Attachment: request-detail-off.jpeg

Comment 2

[Stefan [:StefanG_QA]]

I have tested this report on Windows 10 using latest Nightly, DevEdition and Fx release builds. I can see the mentioned behavior when clicking on Show Request Details. The displayed network tab is shrunk and is hard to distinguish between the Domain and Cause column. It would be great if the user has an option to edit the size of the column or at least there is a line making the distinguishing easier.

Comment 3

[Amy Chan (:amychan331)]

Can I work with this one? Would this be something similar to the grey vertical lines after the Size column?

Comment 4

[Amy Chan (:amychan331)]

Attachment: Bug 1454880 - Make the Domain and Cause column more readable

Review commit: https://reviewboard.mozilla.org/r/245282/diff/#index_header
See other reviews: https://reviewboard.mozilla.org/r/245282/

Comment 5

[Amy Chan (:amychan331)]

So, I started by adding a light grey border at the left side of Cause column. To make the Domain column easier to read when the request detail's panel expands and shrinks all the other columns, I also added a min-width for the Domain column. Don't know if other people would find it strange that only border between Domain and Cause column have a line though...

Comment 6

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

(In reply to Stefan [:StefanG_QA] from comment #2)
> It would be great if the user has an option to edit the size of the column or at least there is a line making the distinguishing easier.

Yeah, this is one of the most requested and missing feature related to Network panel UX.
We have meta bug 1463423 for this.

Comment 7

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

Comment on attachment 8979012 [details]
Bug 1454880 - Make the Domain and Cause column more readable

https://reviewboard.mozilla.org/r/245282/#review251842

Thanks for looking into this!

Please see my inline comment.

Honza

::: devtools/client/netmonitor/src/assets/styles/RequestList.css:401
(Diff revision 1)
>  .requests-list-cause {
>    min-width: 75px;
>  }
>  
> +.request-list-item .requests-list-cause.requests-list-column {
> +  border-left: 1px solid var(--grey-30);

Please remove the border, the padding itself should be already good step forward.

Comment 8

[Amy Chan (:amychan331)]

Comment on attachment 8979012 [details]
Bug 1454880 - Make the Domain and Cause column more readable

Review request updated; see interdiff: https://reviewboard.mozilla.org/r/245282/diff/1-2/

Comment 9

[Amy Chan (:amychan331)]

Comment on attachment 8979012 [details]
Bug 1454880 - Make the Domain and Cause column more readable

https://reviewboard.mozilla.org/r/245282/#review251842

> Please remove the border, the padding itself should be already good step forward.

The border has been removed

Comment 10

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

Comment on attachment 8979012 [details]
Bug 1454880 - Make the Domain and Cause column more readable

https://reviewboard.mozilla.org/r/245282/#review256150

Looks good to me, thanks for the help!

R+

Honza

Comment 11

[Hemakshi Sachdev [:hemakshis]]

Hi, is this bug open still open or unresolved? Because I'd like to work on this as my first bug. 

Thank you!

Comment 12

[Amy Chan (:amychan331)]

I didn't realized this still have a New status! I thought it was resolved with my last push. Am I supposed to do anything to turn it to Fixed status, or is there anything else that Hemakshi can work on in this bug? I have only done 2 bugs fixes, so I am still a bit confused about the process in Bugzilla. Sorry if I caused any confusion!

Comment 13

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

(In reply to Amy Chan from comment #12)
> I didn't realized this still have a New status! I thought it was resolved
> with my last push. Am I supposed to do anything to turn it to Fixed status,
> or is there anything else that Hemakshi can work on in this bug? I have only
> done 2 bugs fixes, so I am still a bit confused about the process in
> Bugzilla. Sorry if I caused any confusion!
Ah, yes. You need to set `checkin-needed` keyword.

1) Click the blue 'Edit Bug' button at the top
2) See Tracking->Keywords field and put new 'checkin-needed' keyword in it (keywords are comma separated)
3) Press 'Save Changes'

And the sheriff will commit the patch for you.

Since it's been a while you should try to apply the patch on the current (repo) HEAD locally - to make sure there are no conflicts.

Honza

Comment 14

[Amy Chan (:amychan331)]

I apply the patch locally on the current head, and it seems to work the same, so I have added the 'checkin-needed'. Thank you!

Comment 15

[Pulsebot]

Pushed by [e-mail]:
https://hg.mozilla.org/integration/autoland/rev/f97e87302374
Make the Domain and Cause column more readable r=Honza

Comment 16

[Andreea Pavel [:apavel]]

https://hg.mozilla.org/mozilla-central/rev/f97e87302374