Title: [221648] trunk/Source/WebInspectorUI
- Revision
- 221648
- Author
- nvasil...@apple.com
- Date
- 2017-09-05 16:38:11 -0700 (Tue, 05 Sep 2017)
Log Message
Web Inspector: Layout flashing for internal View.prototype.layout
https://bugs.webkit.org/show_bug.cgi?id=176389
Reviewed by Matt Baker.
Add a checkbox to Settings (Debug panel) to draw an orange outline around an element every time View.prototype.layout is called.
This is similar to paint flashing, except this is only for View.prototype.layout.
* UserInterface/Base/Setting.js:
* UserInterface/Views/SettingsTabContentView.js:
(WI.SettingsTabContentView.prototype._createDebugSettingsView):
* UserInterface/Views/View.js:
(WI.View.prototype._layoutSubtree):
(WI.View.prototype._drawLayoutFlashingOutline):
Modified Paths
Diff
Modified: trunk/Source/WebInspectorUI/ChangeLog (221647 => 221648)
--- trunk/Source/WebInspectorUI/ChangeLog 2017-09-05 23:36:59 UTC (rev 221647)
+++ trunk/Source/WebInspectorUI/ChangeLog 2017-09-05 23:38:11 UTC (rev 221648)
@@ -1,3 +1,20 @@
+2017-09-05 Nikita Vasilyev <nvasil...@apple.com>
+
+ Web Inspector: Layout flashing for internal View.prototype.layout
+ https://bugs.webkit.org/show_bug.cgi?id=176389
+
+ Reviewed by Matt Baker.
+
+ Add a checkbox to Settings (Debug panel) to draw an orange outline around an element every time View.prototype.layout is called.
+ This is similar to paint flashing, except this is only for View.prototype.layout.
+
+ * UserInterface/Base/Setting.js:
+ * UserInterface/Views/SettingsTabContentView.js:
+ (WI.SettingsTabContentView.prototype._createDebugSettingsView):
+ * UserInterface/Views/View.js:
+ (WI.View.prototype._layoutSubtree):
+ (WI.View.prototype._drawLayoutFlashingOutline):
+
2017-09-04 Nikita Vasilyev <nvasil...@apple.com>
Web Inspector: Styles Redesign: hook up real data to spreadsheet style editor
Modified: trunk/Source/WebInspectorUI/UserInterface/Base/Setting.js (221647 => 221648)
--- trunk/Source/WebInspectorUI/UserInterface/Base/Setting.js 2017-09-05 23:36:59 UTC (rev 221647)
+++ trunk/Source/WebInspectorUI/UserInterface/Base/Setting.js 2017-09-05 23:38:11 UTC (rev 221648)
@@ -106,6 +106,7 @@
autoLogProtocolMessages: new WI.Setting("auto-collect-protocol-messages", false),
autoLogTimeStats: new WI.Setting("auto-collect-time-stats", false),
enableUncaughtExceptionReporter: new WI.Setting("enable-uncaught-exception-reporter", true),
+ enableLayoutFlashing: new WI.Setting("enable-layout-flashing", false),
enableLineWrapping: new WI.Setting("enable-line-wrapping", false),
indentUnit: new WI.Setting("indent-unit", 4),
tabSize: new WI.Setting("tab-size", 4),
Modified: trunk/Source/WebInspectorUI/UserInterface/Views/SettingsTabContentView.js (221647 => 221648)
--- trunk/Source/WebInspectorUI/UserInterface/Views/SettingsTabContentView.js 2017-09-05 23:36:59 UTC (rev 221647)
+++ trunk/Source/WebInspectorUI/UserInterface/Views/SettingsTabContentView.js 2017-09-05 23:38:11 UTC (rev 221648)
@@ -292,6 +292,10 @@
this._debugSettingsView.addSeparator();
+ this._debugSettingsView.addSetting(WI.unlocalizedString("Layout Flashing:"), WI.settings.enableLayoutFlashing, WI.unlocalizedString("Draw borders when a view performs a layout"));
+
+ this._debugSettingsView.addSeparator();
+
this._debugSettingsView.addSetting(WI.unlocalizedString("Uncaught Exception Reporter:"), WI.settings.enableUncaughtExceptionReporter, WI.unlocalizedString("Enabled"));
this._debugSettingsView.addSeparator();
Modified: trunk/Source/WebInspectorUI/UserInterface/Views/View.js (221647 => 221648)
--- trunk/Source/WebInspectorUI/UserInterface/Views/View.js 2017-09-05 23:36:59 UTC (rev 221647)
+++ trunk/Source/WebInspectorUI/UserInterface/Views/View.js 2017-09-05 23:38:11 UTC (rev 221648)
@@ -260,6 +260,9 @@
this.layout();
+ if (WI.settings.enableLayoutFlashing.value)
+ this._drawLayoutFlashingOutline();
+
for (let view of this._subviews) {
view._setLayoutReason(this._layoutReason);
view._layoutSubtree();
@@ -276,6 +279,24 @@
this._layoutReason = layoutReason || WI.View.LayoutReason.Dirty;
}
+ _drawLayoutFlashingOutline()
+ {
+ if (this._layoutFlashingTimeout)
+ clearTimeout(this._layoutFlashingTimeout);
+ else
+ this._layoutFlashingPreviousOutline = this._element.style.outline;
+
+ this._element.style.outline = "1px solid hsla(39, 100%, 51%, 0.8)";
+
+ this._layoutFlashingTimeout = setTimeout(() => {
+ if (this._element)
+ this._element.style.outline = this._layoutFlashingPreviousOutline;
+
+ this._layoutFlashingTimeout = undefined;
+ this._layoutFlashingPreviousOutline = null;
+ }, 500);
+ }
+
// Layout controller logic
static _scheduleLayoutForView(view)
_______________________________________________
webkit-changes mailing list
webkit-changes@lists.webkit.org
https://lists.webkit.org/mailman/listinfo/webkit-changes
