Closed Bug 1410351 Opened 3 years ago Closed 3 years ago

Make it more obvious when requests are paused in the netmonitor

Categories

(DevTools :: Netmonitor, defect, P3)

defect

Tracking

(Not tracked)

RESOLVED FIXED
Firefox 59

People

(Reporter: ntim, Assigned: Honza)

Details

Attachments

(7 files)

Right now, pausing the request simply changes the pause icon to play. It would be nice to add a message saying "requests are paused, click the play icon to unpause" or make the play button more visible (blue/red background to the button for example).
Victoria, we recently introduce the play/pause network request icon at top left side of netmonitor,
Can you help find a proper way to enhance its usability, ex via adding color to the button, or make the hover tooltip more instructive?
Flags: needinfo?(victoria)
I'm thinking the netmonitor could have a big "Unpause" button like the performance tool (Start recording performance) or the memory tool (take snapshot)
I like the idea of making the play button a solid blue. I'm assuming this is a situation where most people will be aware that they've paused the recording, and will only need a subtle nudge to remember to restart it. (If this is a situation in which people will totally forget about pausing, and get confused about why they aren't seeing items roll in, we may need a stronger indicator, like a "Paused" message somewhere).

(This is sort of off-topic, but also in the mockup is a bunch of ideas related to the global settings/toolbar refresh I'm working on right now - would love to discuss it more. One of the changes it proposes is moving the play/pause away from the clear button to keep the destructive action separated from other elements.
Flags: needinfo?(victoria)
Attached image Play icon
Play button SVG attached
Attached image Pause button
Bolder pause button SVG attached
Attached image icons.png
@Victoria: thanks for the icons!

The play icon looks good, but the pause icon is somehow too much bold, so I am using he original pause icon. See my attached screenshot. Does it look ok? Or should I use the bold one?

Honza
Flags: needinfo?(victoria)
Oh wow, haha, it's not supposed to be that bold :). It should look about the same as the ones in this mockup, with 2px wide lines: https://pbs.twimg.com/media/DOIygzoUMAEN3ml.jpg:large

Maybe it's enlarged? The icon should be 7px by 10px. I could add more blank space to the graphic but, but it's probably better to just display it at 7x10 and add a little spacing around it if needed for centering.
Flags: needinfo?(victoria)
Also, in your screenshot, it looks like the Play button could be centered a bit better - it's a bit too far to the left.
All our icons are within a 16x16 square :)
Ah thanks Tim - I will just fix the icons to be in 16x16 so everything can be consistent!
Attached image play 16x16
Attached image pause 16x16
Comment on attachment 8926835 [details]
Bug 1410351 - Make it more obvious when requests are paused in the netmonitor;

https://reviewboard.mozilla.org/r/198084/#review203576

Thanks Victoria & Honza!

I've verified that new icons are displayed properly on toolbox and launchpad. Please make sure try is green before landing. Thanks!
Attachment #8926835 - Flags: review?(rchien) → review+
Pushed by jodvarko@mozilla.com:
https://hg.mozilla.org/integration/autoland/rev/e18bb1a3d095
Make it more obvious when requests are paused in the netmonitor; r=rickychien
@Cosmin: I can't see the problem. Do you know whhat files are duplicated?

Honza
Flags: needinfo?(odvarko) → needinfo?(csabou)
Comment on attachment 8926835 [details]
Bug 1410351 - Make it more obvious when requests are paused in the netmonitor;

https://reviewboard.mozilla.org/r/198084/#review204488

::: devtools/client/netmonitor/src/assets/icons/pause.svg:4
(Diff revision 1)
> +<!-- This Source Code Form is subject to the terms of the Mozilla Public
> +   - License, v. 2.0. If a copy of the MPL was not distributed with this
> +   - file, You can obtain one at http://mozilla.org/MPL/2.0/. -->
> +<svg width="16" height="16" viewBox="0 0 16 16" xmlns="http://www.w3.org/2000/svg" fill="context-fill #0b0b0b">

This file is the same as devtools/client/themes/images/pause.svg

You can remove the file you've added, and simply change devtools/client/themes/images/pause.svg
Thanks Tim for answering that. I was off duty and didn't see the comment until now.
Flags: needinfo?(csabou)
Thanks Tim!

Fixed, trying to land again...

Honza
Pushed by jodvarko@mozilla.com:
https://hg.mozilla.org/integration/autoland/rev/c7416b8613b6
Make it more obvious when requests are paused in the netmonitor; r=rickychien
https://hg.mozilla.org/mozilla-central/rev/c7416b8613b6
Status: NEW → RESOLVED
Closed: 3 years ago
Resolution: --- → FIXED
Target Milestone: --- → Firefox 59
I can reproduce this issue with Nightly 58.0a1 (2017-10-20)on Windows 10 pro, 64 Bit!

This bug's fix is verified with latest Nightly!

Build ID 	20171122220056
User Agent 	Mozilla/5.0 (Windows NT 10.0; Win64; x64; rv:59.0) Gecko/20100101 Firefox/59.0
QA Whiteboard: [bugday-20171122]
Product: Firefox → DevTools
Assignee: nobody → odvarko
You need to log in before you can comment on or make changes to this bug.