Bug 160054 – Web Inspector: Console log counter on the dashboard should be better at displaying large numbers

• Component: Web Inspector
• Status: RESOLVED FIXED

[Nikita Vasilyev]

Created attachment 284271 [details]
[Image] Current behavior

When there are >=1000 messages in the console, it is always shown as "999+".

Instead, we should show:
2000 as 2k
2500 as 2.5k
2542 as 2.5k
1000000 as 1m

[Radar WebKit Bug Importer]

<rdar://problem/27481266>

[Devin Rousso]

Created attachment 286441 [details]
Patch

[Matt Baker]

Comment on attachment 286441 [details]
Patch

View in context: https://bugs.webkit.org/attachment.cgi?id=286441&action=review

This could be a utility function, like Number.bytesToString:

Object.defineProperty(Number, "abbreviate",
{
    ...
});

> Source/WebInspectorUI/UserInterface/Views/DefaultDashboardView.js:104
> +            return `${Math.round(number / 100) / 10}k`;

I think uppercase K, M, and B are more common. Although these pseudo-standard metric abbreviations are widely used, they should be UIStrings to allow localization.

> Source/WebInspectorUI/UserInterface/Views/DefaultDashboardView.js:109
> +        return `${Math.round(number / 100000000) / 10}b`;

That's a lot of console messages!

[Devin Rousso]

Created attachment 286455 [details]
Patch

[Matt Baker]

Comment on attachment 286455 [details]
Patch

r=me

Let's remove _formatPossibleLargeNumber and just call Number.abbreviate directly in the two places it's used.

[Devin Rousso]

Created attachment 286463 [details]
Patch

[WebKit Commit Bot]

Comment on attachment 286463 [details]
Patch

Clearing flags on attachment: 286463

Committed r204642: <http://trac.webkit.org/changeset/204642>

[WebKit Commit Bot]

All reviewed patches have been landed.  Closing bug.

[Nikita Vasilyev]

Comment on attachment 286463 [details]
Patch

View in context: https://bugs.webkit.org/attachment.cgi?id=286463&action=review

Looks good!

> Source/WebInspectorUI/UserInterface/Base/Utilities.js:1047
> +            return WebInspector.UIString("%.1fK").format(Math.round(num / 100) / 10);

1000 is shown as "1.0K" and not "1K".
It's better in the case when the counter changes and the width stays the same.