From 49c0601307dfcff6d7c7f28f63ae9ffb4a19579f Mon Sep 17 00:00:00 2001 From: "pfeldman@chromium.org" Date: Mon, 25 Jun 2012 14:36:00 +0000 Subject: [PATCH] Web Inspector: toggling style should not start property edit first. https://bugs.webkit.org/show_bug.cgi?id=89834 Reviewed by Yury Semikhatsky. Source/WebCore: Otherwise property flickers upon toggling. * inspector/front-end/StylesSidebarPane.js: (WebInspector.StylePropertyTreeElement.prototype): LayoutTests: * http/tests/inspector/elements-test.js: (initialize_ElementTest.InspectorTest.dumpSelectedElementStyles): (initialize_ElementTest.InspectorTest.toggleStylePropertyEnabled): * inspector/styles/styles-disable-inherited.html: * inspector/styles/styles-disable-then-change.html: * inspector/styles/styles-disable-then-delete.html: * inspector/styles/styles-disable-then-enable.html: * inspector/styles/undo-property-toggle.html: git-svn-id: http://svn.webkit.org/repository/webkit/trunk@121156 268f45cc-cd09-0410-ab3c-d52691b4dbfc --- LayoutTests/ChangeLog | 16 ++++++++++++++++ LayoutTests/http/tests/inspector/elements-test.js | 8 +++++++- .../inspector/styles/styles-disable-inherited.html | 3 +-- .../inspector/styles/styles-disable-then-change.html | 3 +-- .../inspector/styles/styles-disable-then-delete.html | 5 +---- .../inspector/styles/styles-disable-then-enable.html | 4 ++-- LayoutTests/inspector/styles/undo-property-toggle.html | 2 +- Source/WebCore/ChangeLog | 12 ++++++++++++ Source/WebCore/inspector/front-end/StylesSidebarPane.js | 3 ++- 9 files changed, 43 insertions(+), 13 deletions(-) diff --git a/LayoutTests/ChangeLog b/LayoutTests/ChangeLog index 39bc750..1754ce3 100644 --- a/LayoutTests/ChangeLog +++ b/LayoutTests/ChangeLog @@ -1,3 +1,19 @@ +2012-06-25 Pavel Feldman + + Web Inspector: toggling style should not start property edit first. + https://bugs.webkit.org/show_bug.cgi?id=89834 + + Reviewed by Yury Semikhatsky. + + * http/tests/inspector/elements-test.js: + (initialize_ElementTest.InspectorTest.dumpSelectedElementStyles): + (initialize_ElementTest.InspectorTest.toggleStylePropertyEnabled): + * inspector/styles/styles-disable-inherited.html: + * inspector/styles/styles-disable-then-change.html: + * inspector/styles/styles-disable-then-delete.html: + * inspector/styles/styles-disable-then-enable.html: + * inspector/styles/undo-property-toggle.html: + 2012-06-25 Philip Rogers Fix rewinding of SVG animations diff --git a/LayoutTests/http/tests/inspector/elements-test.js b/LayoutTests/http/tests/inspector/elements-test.js index 0c46213..2221daa 100644 --- a/LayoutTests/http/tests/inspector/elements-test.js +++ b/LayoutTests/http/tests/inspector/elements-test.js @@ -157,7 +157,13 @@ InspectorTest.dumpSelectedElementStyles = function(excludeComputed, excludeMatch } InspectorTest.addResult(""); } -}; +} + +InspectorTest.toggleStyleProperty = function(propertyName, checked) +{ + var treeItem = InspectorTest.getElementStylePropertyTreeItem(propertyName); + treeItem.toggleEnabled({ target: { checked: checked }, consume: function() { } }); +} InspectorTest.expandAndDumpSelectedElementEventListeners = function(callback) { diff --git a/LayoutTests/inspector/styles/styles-disable-inherited.html b/LayoutTests/inspector/styles/styles-disable-inherited.html index 44d55f3..762ec68 100644 --- a/LayoutTests/inspector/styles/styles-disable-inherited.html +++ b/LayoutTests/inspector/styles/styles-disable-inherited.html @@ -20,8 +20,7 @@ function test() function step2() { - var treeItem = InspectorTest.getElementStylePropertyTreeItem("font-weight"); - treeItem.toggleEnabled({ target: { checked: false } }); + InspectorTest.toggleStyleProperty("font-weight", false); InspectorTest.selectNodeAndWaitForStyles("nested", step3); } diff --git a/LayoutTests/inspector/styles/styles-disable-then-change.html b/LayoutTests/inspector/styles/styles-disable-then-change.html index 428ac9a..c5bbf79 100644 --- a/LayoutTests/inspector/styles/styles-disable-then-change.html +++ b/LayoutTests/inspector/styles/styles-disable-then-change.html @@ -13,8 +13,7 @@ function test() InspectorTest.addResult("Before disable"); InspectorTest.dumpSelectedElementStyles(true, true); - var treeItem = InspectorTest.getElementStylePropertyTreeItem("font-weight"); - treeItem.toggleEnabled({ target: { checked: false } }); + InspectorTest.toggleStyleProperty("font-weight", false); InspectorTest.waitForStyles("container", step2); } diff --git a/LayoutTests/inspector/styles/styles-disable-then-delete.html b/LayoutTests/inspector/styles/styles-disable-then-delete.html index e6c890a..affa64a 100644 --- a/LayoutTests/inspector/styles/styles-disable-then-delete.html +++ b/LayoutTests/inspector/styles/styles-disable-then-delete.html @@ -13,10 +13,7 @@ function test() // Disable property InspectorTest.addResult("Before disable"); InspectorTest.dumpSelectedElementStyles(true, true); - - var treeItem = InspectorTest.getElementStylePropertyTreeItem("font-weight"); - treeItem.toggleEnabled({ target: { checked: false } }); - + InspectorTest.toggleStyleProperty("font-weight", false); InspectorTest.runAfterPendingDispatches(step2); } diff --git a/LayoutTests/inspector/styles/styles-disable-then-enable.html b/LayoutTests/inspector/styles/styles-disable-then-enable.html index f0156e3..4cc00ee 100644 --- a/LayoutTests/inspector/styles/styles-disable-then-enable.html +++ b/LayoutTests/inspector/styles/styles-disable-then-enable.html @@ -14,7 +14,7 @@ function test() var treeItem = InspectorTest.getElementStylePropertyTreeItem("font-weight"); InspectorTest.dumpStyleTreeItem(treeItem, ""); - treeItem.toggleEnabled({ target: { checked: false } }); + InspectorTest.toggleStyleProperty("font-weight", false); InspectorTest.waitForStyles("container", step2); } @@ -24,7 +24,7 @@ function test() var treeItem = InspectorTest.getElementStylePropertyTreeItem("font-weight"); InspectorTest.dumpStyleTreeItem(treeItem, ""); - treeItem.toggleEnabled({ target: { checked: true } }); + InspectorTest.toggleStyleProperty("font-weight", true); InspectorTest.waitForStyles("container", step3); } diff --git a/LayoutTests/inspector/styles/undo-property-toggle.html b/LayoutTests/inspector/styles/undo-property-toggle.html index 6d14101..fe8b69a 100644 --- a/LayoutTests/inspector/styles/undo-property-toggle.html +++ b/LayoutTests/inspector/styles/undo-property-toggle.html @@ -14,7 +14,7 @@ function test() var treeItem = InspectorTest.getElementStylePropertyTreeItem("font-weight"); InspectorTest.dumpStyleTreeItem(treeItem, ""); - treeItem.toggleEnabled({ target: { checked: false } }); + InspectorTest.toggleStyleProperty("font-weight", false); InspectorTest.waitForStyles("container", step2); } diff --git a/Source/WebCore/ChangeLog b/Source/WebCore/ChangeLog index fdaa1a7..23f1514 100644 --- a/Source/WebCore/ChangeLog +++ b/Source/WebCore/ChangeLog @@ -1,3 +1,15 @@ +2012-06-25 Pavel Feldman + + Web Inspector: toggling style should not start property edit first. + https://bugs.webkit.org/show_bug.cgi?id=89834 + + Reviewed by Yury Semikhatsky. + + Otherwise property flickers upon toggling. + + * inspector/front-end/StylesSidebarPane.js: + (WebInspector.StylePropertyTreeElement.prototype): + 2012-06-25 Alexander Pavlov Web Inspector: "Emulate Touch Events" breaks selecting elements with "touchstart" event listeners for inspection. diff --git a/Source/WebCore/inspector/front-end/StylesSidebarPane.js b/Source/WebCore/inspector/front-end/StylesSidebarPane.js index c9d4b9c..ef091cd 100644 --- a/Source/WebCore/inspector/front-end/StylesSidebarPane.js +++ b/Source/WebCore/inspector/front-end/StylesSidebarPane.js @@ -1693,7 +1693,7 @@ WebInspector.StylePropertyTreeElement.prototype = { enabledCheckboxElement.className = "enabled-button"; enabledCheckboxElement.type = "checkbox"; enabledCheckboxElement.checked = !this.disabled; - enabledCheckboxElement.addEventListener("change", this.toggleEnabled.bind(this), false); + enabledCheckboxElement.addEventListener("click", this.toggleEnabled.bind(this), false); } var nameElement = document.createElement("span"); @@ -1986,6 +1986,7 @@ WebInspector.StylePropertyTreeElement.prototype = { this._parentPane._userOperation = true; this.property.setDisabled(disabled, callback.bind(this)); + event.consume(); }, updateState: function() -- 2.7.4