Changeset 199635 in webkit


Ignore:
Timestamp:
Apr 16, 2016 6:26:07 PM (8 years ago)
Author:
Matt Baker
Message:

Web Inspector: Adopt Number.prototype.toLocaleString For All Sizes and Times
​https://bugs.webkit.org/show_bug.cgi?id=152033
<rdar://problem/23815589>

Reviewed by Timothy Hatcher.

Source/WebInspectorUI:

Update string formatters to localize float and percentage strings. Hook up
console message formatters to use String.standardFormatters so that console
statements (e.g. console.log("%.3f", 3.14159)) are properly formatted.

  • Localizations/en.lproj/localizedStrings.js:
  • UserInterface/Base/Utilities.js:

(value):
tokenizeFormatString should default to 6 digits when no precision
sub-specifier is provided.

percentageString should localize formatting, and take a fraction value
(0 to 1) instead of a percentage.

secondsToString should perform special-case formatting for zero values
("0ms") instead of the general purpose float formatter.

(value.d):
Switch to parseInt to floor floating point values and support numeric strings.
Return NaN instead of zero when passed a value that can't be converted to integer.

(value.f):
Switch to parseFloat to support numeric strings, and localize formatting.
Remove precision check, as it will never be less than zero. Return NaN
instead of zero when passed a value that can't be converted to float.

(prettyFunctionName):
Convert substitutions (an arguments object) to an array before calling join.

  • UserInterface/Views/ConsoleMessageView.js:

(WebInspector.ConsoleMessageView.prototype._formatWithSubstitutionString.floatFormatter):
Use String.standardFormatters.f.

(WebInspector.ConsoleMessageView.prototype._formatWithSubstitutionString.integerFormatter):
Use String.standardFormatters.d.

  • UserInterface/Views/LayoutTimelineDataGridNode.js:

(WebInspector.LayoutTimelineDataGridNode.prototype.createCellContent):
(WebInspector.LayoutTimelineDataGridNode):
Use integer formatting for pixel values.

  • UserInterface/Views/ProfileDataGridNode.js:

(WebInspector.ProfileDataGridNode.prototype._recalculateData):
(WebInspector.ProfileDataGridNode.prototype._totalTimeContent):
Treat percentage as a fraction from 0 to 1.

  • UserInterface/Views/ResourceDetailsSidebarPanel.js:

(WebInspector.ResourceDetailsSidebarPanel.prototype._refreshImageSizeSection):
Use integer formatting for pixel values.

LayoutTests:

Add test coverage for string formatters, and additional test cases for
Number.percentageString and Number.secondsToString.

  • inspector/unit-tests/number-utilities-expected.txt:
  • inspector/unit-tests/number-utilities.html:
  • inspector/unit-tests/string-utilities-expected.txt: Added.
  • inspector/unit-tests/string-utilities.html: Added.
Location:
trunk
Files:
2 added
10 edited

Legend:

Unmodified
Added
Removed

  • trunk/LayoutTests/ChangeLog

    r199613 r199635  
     12016-04-16  Matt Baker  <mattbaker@apple.com>
     2
     3        Web Inspector: Adopt Number.prototype.toLocaleString For All Sizes and Times
     4        https://bugs.webkit.org/show_bug.cgi?id=152033
     5        <rdar://problem/23815589>
     6
     7        Reviewed by Timothy Hatcher.
     8
     9        Add test coverage for string formatters, and additional test cases for
     10        Number.percentageString and Number.secondsToString.
     11
     12        * inspector/unit-tests/number-utilities-expected.txt:
     13        * inspector/unit-tests/number-utilities.html:
     14        * inspector/unit-tests/string-utilities-expected.txt: Added.
     15        * inspector/unit-tests/string-utilities.html: Added.
     16
    1172016-04-15  Myles C. Maxfield  <mmaxfield@apple.com>
    218

  • trunk/LayoutTests/inspector/unit-tests/number-utilities-expected.txt

    r196284 r199635  
    1515
    1616-- Running test case: Number.secondsToString
     17PASS: normal resolution of 0ms should be ms with no decimals
    1718PASS: normal resolution of sub 1ms should be ms
    1819PASS: normal resolution of sub 10ms should be ms
    … …  
    2627PASS: normal resolution of greater than 1 day should be days
    2728PASS: normal resolution of greater than 1 day should be days
     29PASS: high resolution of 0ms should be ms with no decimals
    2830PASS: high resolution of sub 1ms should be ms with decimals
    2931PASS: high resolution of sub 10ms should be ms with decimals
    … …  
    4749PASS: high resolution of greater than 10mb should be megabytes
    4850
     51-- Running test case: Number.percentageString
     52PASS: precision should default to 1 if unspecified
     53

  • trunk/LayoutTests/inspector/unit-tests/number-utilities.html

    r196284 r199635  
    3333        test: () => {
    3434            // Normal resolution.
     35            InspectorTest.expectThat(Number.secondsToString(0, false) === "0ms", "normal resolution of 0ms should be ms with no decimals");
    3536            InspectorTest.expectThat(Number.secondsToString(0.000123456, false) === "0.12ms", "normal resolution of sub 1ms should be ms");
    3637            InspectorTest.expectThat(Number.secondsToString(0.00123456, false) === "1.23ms", "normal resolution of sub 10ms should be ms");
    … …  
    4647
    4748            // High resolution.
     49            InspectorTest.expectThat(Number.secondsToString(0, true) === "0ms", "high resolution of 0ms should be ms with no decimals");
    4850            InspectorTest.expectThat(Number.secondsToString(0.000123456, true) === "0.123ms", "high resolution of sub 1ms should be ms with decimals");
    4951            InspectorTest.expectThat(Number.secondsToString(0.00123456, true) === "1.235ms", "high resolution of sub 10ms should be ms with decimals");
    … …  
    8385    });
    8486
     87    suite.addTestCase({
     88        name: "Number.percentageString",
     89        test: () => {
     90            InspectorTest.expectThat(Number.percentageString(1 / 3) === "33.3%", "precision should default to 1 if unspecified");
     91
     92            return true;
     93        }
     94    });
     95
    8596    suite.runTestCasesAndFinish();
    8697}

  • trunk/Source/WebInspectorUI/ChangeLog

    r199634 r199635  
     12016-04-16  Matt Baker  <mattbaker@apple.com>
     2
     3        Web Inspector: Adopt Number.prototype.toLocaleString For All Sizes and Times
     4        https://bugs.webkit.org/show_bug.cgi?id=152033
     5        <rdar://problem/23815589>
     6
     7        Reviewed by Timothy Hatcher.
     8
     9        Update string formatters to localize float and percentage strings. Hook up
     10        console message formatters to use String.standardFormatters so that console
     11        statements (e.g. console.log("%.3f", 3.14159)) are properly formatted.
     12
     13        * Localizations/en.lproj/localizedStrings.js:
     14        * UserInterface/Base/Utilities.js:
     15        (value):
     16        tokenizeFormatString should default to 6 digits when no precision
     17        sub-specifier is provided.
     18
     19        percentageString should localize formatting, and take a fraction value
     20        (0 to 1) instead of a percentage.
     21
     22        secondsToString should perform special-case formatting for zero values
     23        ("0ms") instead of the general purpose float formatter.
     24
     25        (value.d):
     26        Switch to parseInt to floor floating point values and support numeric strings.
     27        Return NaN instead of zero when passed a value that can't be converted to integer.
     28
     29        (value.f):
     30        Switch to parseFloat to support numeric strings, and localize formatting.
     31        Remove precision check, as it will never be less than zero. Return NaN
     32        instead of zero when passed a value that can't be converted to float.
     33
     34        (prettyFunctionName):
     35        Convert substitutions (an arguments object) to an array before calling join.
     36
     37        * UserInterface/Views/ConsoleMessageView.js:
     38        (WebInspector.ConsoleMessageView.prototype._formatWithSubstitutionString.floatFormatter):
     39        Use String.standardFormatters.f.
     40
     41        (WebInspector.ConsoleMessageView.prototype._formatWithSubstitutionString.integerFormatter):
     42        Use String.standardFormatters.d.
     43
     44        * UserInterface/Views/LayoutTimelineDataGridNode.js:
     45        (WebInspector.LayoutTimelineDataGridNode.prototype.createCellContent):
     46        (WebInspector.LayoutTimelineDataGridNode):
     47        Use integer formatting for pixel values.
     48
     49        * UserInterface/Views/ProfileDataGridNode.js:
     50        (WebInspector.ProfileDataGridNode.prototype._recalculateData):
     51        (WebInspector.ProfileDataGridNode.prototype._totalTimeContent):
     52        Treat percentage as a fraction from 0 to 1.
     53
     54        * UserInterface/Views/ResourceDetailsSidebarPanel.js:
     55        (WebInspector.ResourceDetailsSidebarPanel.prototype._refreshImageSizeSection):
     56        Use integer formatting for pixel values.
     57
    1582016-04-16  Matt Baker  <mattbaker@apple.com>
    259

  • trunk/Source/WebInspectorUI/Localizations/en.lproj/localizedStrings.js

    r199380 r199635  
    2424localizedStrings["%d \xd7 %d pixels (Natural: %d \xd7 %d pixels)"] = "%d \xd7 %d pixels (Natural: %d \xd7 %d pixels)";
    2525localizedStrings["%d matches"] = "%d matches";
    26 localizedStrings["%fpx"] = "%fpx";
    27 localizedStrings["%fpx²"] = "%fpx²";
     26localizedStrings["%dpx"] = "%dpx";
     27localizedStrings["%dpx²"] = "%dpx²";
    2828localizedStrings["%s (computed)"] = "%s (computed)";
    2929localizedStrings["%s (default)"] = "%s (default)";

  • trunk/Source/WebInspectorUI/UserInterface/Base/Utilities.js

    r199143 r199635  
    641641            }
    642642
    643             var precision = -1;
     643            const defaultPrecision = 6;
     644
     645            let precision = defaultPrecision;
    644646            if (format[index] === ".") {
    645647                // This is a precision specifier. If no digit follows the ".",
    646                 // then the precision should be zero.
     648                // then use the default precision of six digits (ISO C99 specification).
    647649                ++index;
    648650
    649651                precision = parseInt(format.substring(index), 10);
    650652                if (isNaN(precision))
    651                     precision = 0;
     653                    precision = defaultPrecision;
    652654
    653655                while (!isNaN(format[index]))
    … …  
    716718        d: function(substitution)
    717719        {
    718             return !isNaN(substitution) ? substitution : 0;
     720            return parseInt(substitution);
    719721        },
    720722
    721723        f: function(substitution, token)
    722724        {
    723             if (substitution && token.precision > -1)
    724                 substitution = substitution.toFixed(token.precision);
    725             return !isNaN(substitution) ? substitution : (token.precision > -1 ? Number(0).toFixed(token.precision) : 0);
     725            let value = parseFloat(substitution);
     726            if (isNaN(value))
     727                return NaN;
     728
     729            let options = {
     730                minimumFractionDigits: token.precision,
     731                maximumFractionDigits: token.precision,
     732                useGrouping: false
     733            };
     734            return value.toLocaleString(undefined, options);
    726735        },
    727736
    … …  
    742751        function prettyFunctionName()
    743752        {
    744             return "String.format(\"" + format + "\", \"" + substitutions.join("\", \"") + "\")";
     753            return "String.format(\"" + format + "\", \"" + Array.from(substitutions).join("\", \"") + "\")";
    745754        }
    746755
    … …  
    913922Object.defineProperty(Number, "percentageString",
    914923{
    915     value: function(percent, precision = 1)
    916     {
    917         console.assert(percent >= 0 && percent <= 100);
    918         return percent.toFixed(precision) + "%";
     924    value: function(fraction, precision = 1)
     925    {
     926        console.assert(fraction >= 0 && fraction <= 1);
     927        return fraction.toLocaleString(undefined, {minimumFractionDigits: precision, style: "percent"});
    919928    }
    920929});
    … …  
    937946    {
    938947        let ms = seconds * 1000;
     948        if (!ms)
     949            return WebInspector.UIString("%.0fms").format(0);
    939950
    940951        if (Math.abs(ms) < 10) {

  • trunk/Source/WebInspectorUI/UserInterface/Views/ConsoleMessageView.js

    r196275 r199635  
    600600        }
    601601
    602         function floatFormatter(obj)
     602        function floatFormatter(obj, token)
    603603        {
    604             if (typeof obj.value !== "number")
    605                 return parseFloat(obj.description);
    606             return obj.value;
     604            let value = typeof obj.value === "number" ? obj.value : obj.description;
     605            return String.standardFormatters.f(value, token);
    607606        }
    608607
    609608        function integerFormatter(obj)
    610609        {
    611             if (typeof obj.value !== "number")
    612                 return parseInt(obj.description);
    613             return Math.floor(obj.value);
     610            let value = typeof obj.value === "number" ? obj.value : obj.description;
     611            return String.standardFormatters.d(value);
    614612        }
    615613

  • trunk/Source/WebInspectorUI/UserInterface/Views/LayoutTimelineDataGridNode.js

    r197909 r199635  
    6969        case "width":
    7070        case "height":
    71             return isNaN(value) ? emDash : WebInspector.UIString("%fpx").format(value);
     71            return isNaN(value) ? emDash : WebInspector.UIString("%dpx").format(value);
    7272
    7373        case "area":
    74             return isNaN(value) ? emDash : WebInspector.UIString("%fpx²").format(value);
     74            return isNaN(value) ? emDash : WebInspector.UIString("%dpx²").format(value);
    7575
    7676        case "startTime":

  • trunk/Source/WebInspectorUI/UserInterface/Views/ProfileDataGridNode.js

    r199201 r199635  
    189189        let totalTime = duration;
    190190        let selfTime = leafDuration + this._extraSelfTimeFromChargedChildren;
    191         let percent = (totalTime / this._tree.totalSampleTime) * 100;
    192 
    193         this._data = {totalTime, selfTime, percent};
     191        let fraction = totalTime / this._tree.totalSampleTime;
     192
     193        this._data = {totalTime, selfTime, fraction};
    194194    }
    195195
    196196    _totalTimeContent()
    197197    {
    198         let {totalTime, percent} = this._data;
     198        let {totalTime, fraction} = this._data;
    199199
    200200        let fragment = document.createDocumentFragment();
    … …  
    204204        let percentElement = fragment.appendChild(document.createElement("span"));
    205205        percentElement.classList.add("percentage");
    206         percentElement.textContent = Number.percentageString(percent);
     206        percentElement.textContent = Number.percentageString(fraction);
    207207        return fragment;
    208208    }

  • trunk/Source/WebInspectorUI/UserInterface/Views/ResourceDetailsSidebarPanel.js

    r196275 r199635  
    417417        // Get the metrics for this resource and fill in the metrics rows with that information.
    418418        resource.getImageSize(function(size) {
    419             this._imageWidthRow.value = WebInspector.UIString("%fpx").format(size.width);
    420             this._imageHeightRow.value = WebInspector.UIString("%fpx").format(size.height);
     419            this._imageWidthRow.value = WebInspector.UIString("%dpx").format(size.width);
     420            this._imageHeightRow.value = WebInspector.UIString("%dpx").format(size.height);
    421421        }.bind(this));
    422422    }
Note: See TracChangeset for help on using the changeset viewer.