Changeset 87683 in webkit


Ignore:
Timestamp:
May 30, 2011 6:48:09 AM (13 years ago)
Author:
apavlov@chromium.org
Message:

2011-05-27 Alexander Pavlov <​apavlov@chromium.org>

Reviewed by Yury Semikhatsky.

Web Inspector: node selection is slow in the Elements panel.
​https://bugs.webkit.org/show_bug.cgi?id=60813

  • http/tests/inspector/inspect-iframe-from-different-domain.html:
  • inspector/elements/elements-delete-inline-style.html:
  • inspector/elements/elements-panel-styles.html:
  • inspector/styles/styles-iframe.html:
  • inspector/styles/styles-update-from-js.html:
  • inspector/styles/styles-update-from-js-expected.txt:
  • inspector/styles/styles-url-linkify.html:

2011-05-25 Alexander Pavlov <​apavlov@chromium.org>

Reviewed by Yury Semikhatsky.

Web Inspector: node selection is slow in the Elements panel.
​https://bugs.webkit.org/show_bug.cgi?id=60813

Schedule full style updates rather than request all node styles from the backend up front.

  • inspector/front-end/StylesSidebarPane.js: (WebInspector.StylesSidebarPane.prototype.update.reloadAllStyles): (WebInspector.StylesSidebarPane.prototype.update):
Location:
trunk
Files:
10 edited

Legend:

Unmodified
Added
Removed

  • trunk/LayoutTests/ChangeLog

    r87682 r87683  
     12011-05-27  Alexander Pavlov  <apavlov@chromium.org>
     2
     3        Reviewed by Yury Semikhatsky.
     4
     5        Web Inspector: node selection is slow in the Elements panel.
     6        https://bugs.webkit.org/show_bug.cgi?id=60813
     7
     8        * http/tests/inspector/inspect-iframe-from-different-domain.html:
     9        * inspector/elements/elements-delete-inline-style.html:
     10        * inspector/elements/elements-panel-styles.html:
     11        * inspector/styles/styles-iframe.html:
     12        * inspector/styles/styles-update-from-js.html:
     13        * inspector/styles/styles-update-from-js-expected.txt:
     14        * inspector/styles/styles-url-linkify.html:
     15
    1162011-05-30  Mikhail Naganov  <mnaganov@chromium.org>
    217

  • trunk/LayoutTests/http/tests/inspector/inspect-iframe-from-different-domain.html

    r78535 r87683  
    1717function test()
    1818{
    19     InspectorTest.selectNodeWithId("iframe-body", step1);
     19    InspectorTest.selectNodeWithId("iframe-body");
     20    InspectorTest.addSniffer(WebInspector.StylesSidebarPane.prototype, "_rebuildUpdate", step1);
    2021
    2122    function step1()

  • trunk/LayoutTests/inspector/elements/elements-delete-inline-style.html

    r82713 r87683  
    88{
    99    WebInspector.showPanel("elements");
    10     InspectorTest.selectNodeWithId("inspected", step1);
     10    InspectorTest.selectNodeWithId("inspected");
     11    InspectorTest.addSniffer(WebInspector.StylesSidebarPane.prototype, "_rebuildUpdate", step1);
    1112
    1213    function step1(node)
    … …  
    1516        InspectorTest.dumpSelectedElementStyles(true);
    1617        node.removeAttribute("style");
    17         InspectorTest.runAfterPendingDispatches(step2);
     18        InspectorTest.addSniffer(WebInspector.StylesSidebarPane.prototype, "_rebuildUpdate", step2);
    1819    }
    1920

  • trunk/LayoutTests/inspector/elements/elements-panel-styles.html

    r78535 r87683  
    99function test()
    1010{
    11     InspectorTest.selectNodeWithId("foo", step1);
     11    InspectorTest.selectNodeWithId("foo");
     12    InspectorTest.addSniffer(WebInspector.StylesSidebarPane.prototype, "_rebuildUpdate", step1);
    1213
    1314    function step1()

  • trunk/LayoutTests/inspector/styles/styles-iframe.html

    r86672 r87683  
    3131        InspectorTest.addResult("Main frame style:");
    3232        InspectorTest.dumpSelectedElementStyles(true, false, true);
    33         InspectorTest.selectNodeWithId("iframeBody", step2);
     33        InspectorTest.selectNodeWithId("iframeBody");
     34        InspectorTest.addSniffer(WebInspector.StylesSidebarPane.prototype, "_rebuildUpdate", step2);
    3435    }
    3536

  • trunk/LayoutTests/inspector/styles/styles-update-from-js-expected.txt

    r82713 r87683  
    11Tests that changes to an inline style from JavaScript are reflected in the Styles pane and Elements tree.
    22
    3 
    4 Running: testInit
    5 
    6 Running: testSetStyleAttribute
     3Modified "style" attribute
    74<div id="container" style="color: #daC0DE; border: 1px solid black;"></div>
    85[expanded] element.style { ()
    … …  
    2320
    2421
    25 
    26 Running: testSetStyleCSSText
     22Modified cssText
    2723<div id="container" style="color: rgb(192, 255, 238); "></div>
    2824[expanded] element.style { ()
    … …  
    3026
    3127
    32 
    33 Running: testSetViaParsedAttributes
     28Modified parsed attributes
    3429<div id="container" style="color: rgb(192, 255, 238); border-top-style: dashed; border-right-style: dashed; border-bottom-style: dashed; border-left-style: dashed; border-top-color: green; border-right-color: green; border-bottom-color: green; border-left-color: green; border-top-width: 3px; border-right-width: 3px; border-bottom-width: 3px; border-left-width: 3px; "></div>
    3530[expanded] element.style { ()

  • trunk/LayoutTests/inspector/styles/styles-update-from-js.html

    r82713 r87683  
    2323function test()
    2424{
    25     InspectorTest.runTestSuite([
     25    var sniffCount = 0;
    2626
    27         function testInit(next)
    28         {
    29             InspectorTest.selectNodeWithId("container", next);
    30         },
     27    InspectorTest.selectNodeWithId("container", installSniffer);
    3128
    32         function testSetStyleAttribute(next)
    33         {
    34             var updateCount = 0;
    35             function callback()
    36             {
    37                 // Expect two updates while setting attribute.
    38                 if (++updateCount === 2) {
    39                     dumpAttributeAndStyles();
    40                     next();
    41                 }
    42             }
    43             InspectorTest.addSniffer(WebInspector.StylesSidebarPane.prototype, "_rebuildUpdate", callback, true);
    44             InspectorTest.evaluateInPage("modifyStyleAttribute()");
    45         },
     29    function installSniffer()
     30    {
     31        InspectorTest.addSniffer(WebInspector.StylesSidebarPane.prototype, "_rebuildUpdate", snifferCallback, true);
     32        InspectorTest.evaluateInPage("modifyStyleAttribute()");
     33    }
    4634
    47         function testSetStyleCSSText(next)
    48         {
    49             var updateCount = 0;
    50             function callback()
    51             {
    52                 // Expect two updates while setting css text.
    53                 if (++updateCount === 2) {
    54                     dumpAttributeAndStyles();
    55                     next();
    56                 }
    57             }
    58             InspectorTest.addSniffer(WebInspector.StylesSidebarPane.prototype, "_rebuildUpdate", callback, true);
    59             InspectorTest.evaluateInPage("modifyCSSText()", callback);
    60         },
    61 
    62         function testSetViaParsedAttributes(next)
    63         {
    64             function callback()
    65             {
     35    function snifferCallback()
     36    {
     37        switch (++sniffCount) {
     38            case 1:
     39                InspectorTest.addResult("Modified \"style\" attribute");
    6640                dumpAttributeAndStyles();
    67                 next();
    68             }
    69             InspectorTest.addSniffer(WebInspector.StylesSidebarPane.prototype, "_rebuildUpdate", callback);
    70             InspectorTest.evaluateInPage("modifyParsedAttributes()");
     41                InspectorTest.evaluateInPage("modifyCSSText()");
     42                break;
     43            case 2:
     44                InspectorTest.addResult("Modified cssText");
     45                dumpAttributeAndStyles();
     46                InspectorTest.evaluateInPage("modifyParsedAttributes()");
     47                break;
     48            case 3:
     49                InspectorTest.addResult("Modified parsed attributes");
     50                dumpAttributeAndStyles();
     51                InspectorTest.completeTest();
     52                break;
    7153        }
    72     ]);
     54    }
    7355
    7456    function dumpAttributeAndStyles()

  • trunk/LayoutTests/inspector/styles/styles-url-linkify.html

    r82713 r87683  
    5353        InspectorTest.addResult("Link for a URI from CSS document:");
    5454        dumpHref();
    55         InspectorTest.selectNodeWithId("iframed", step2);
     55        InspectorTest.selectNodeWithId("iframed");
     56        InspectorTest.addSniffer(WebInspector.StylesSidebarPane.prototype, "_rebuildUpdate", step2);
     57
    5658    }
    5759

  • trunk/Source/WebCore/ChangeLog

    r87681 r87683  
     12011-05-25  Alexander Pavlov  <apavlov@chromium.org>
     2
     3        Reviewed by Yury Semikhatsky.
     4
     5        Web Inspector: node selection is slow in the Elements panel.
     6        https://bugs.webkit.org/show_bug.cgi?id=60813
     7
     8        Schedule full style updates rather than request all node styles from the backend up front.
     9
     10        * inspector/front-end/StylesSidebarPane.js:
     11        (WebInspector.StylesSidebarPane.prototype.update.reloadAllStyles):
     12        (WebInspector.StylesSidebarPane.prototype.update):
     13
    1142011-05-30  Andrey Kosyakov  <caseq@chromium.org>
    215

  • trunk/Source/WebCore/inspector/front-end/StylesSidebarPane.js

    r87617 r87683  
    236236        }
    237237
     238        function reloadAllStyles()
     239        {
     240            delete this._reloadAllStylesTimer;
     241            WebInspector.cssModel.getStylesAsync(this._allStylesNodeId, stylesCallback.bind(this))
     242        }
     243
    238244        if (refresh)
    239245            WebInspector.cssModel.getComputedStyleAsync(node.id, computedStyleCallback.bind(this));
    240         else
    241             WebInspector.cssModel.getStylesAsync(node.id, stylesCallback.bind(this));
     246        else {
     247            // Always refresh the node to request styles for.
     248            this._allStylesNodeId = node.id;
     249            if ("_reloadAllStylesTimer" in this)
     250                return;
     251            this._reloadAllStylesTimer = setTimeout(reloadAllStyles.bind(this), 0);
     252        }
    242253    },
    243254
Note: See TracChangeset for help on using the changeset viewer.