Title: [196798] trunk/Source/WebInspectorUI
- Revision
- 196798
- Author
- [email protected]
- Date
- 2016-02-18 21:26:53 -0800 (Thu, 18 Feb 2016)
Log Message
Web Inspector: Styles Sidebar focus jumps when trying to edit a color
https://bugs.webkit.org/show_bug.cgi?id=154404
<rdar://problem/24725744>
Patch by Devin Rousso <[email protected]> on 2016-02-18
Reviewed by Timothy Hatcher.
Clicking an inline swatch in the CSS Rules sidebar causes any focused
editor, if any, to become blurred and therefore fire its handler function.
This causes an issue because when a CodeMirror instance in the styles
sidebar becomes blurred, it is possible for the entire Rules sidebar to
refresh and recreate all of the sections (r187714), meaning that it will
reselect whatever editor was previously selected before the refresh,
causing the swatch popup to be blurred and therefore dismiss.
* UserInterface/Views/CSSStyleDeclarationSection.js:
(WebInspector.CSSStyleDeclarationSection.prototype.cssStyleDeclarationTextEditorBlurActiveEditor):
* UserInterface/Views/CSSStyleDeclarationTextEditor.js:
(WebInspector.CSSStyleDeclarationTextEditor.prototype._createInlineSwatches.createSwatch):
(WebInspector.CSSStyleDeclarationTextEditor.prototype._inlineSwatchBeforeClicked):
Add listener for new event and call to delegate function for handling it.
* UserInterface/Views/InlineSwatch.js:
(WebInspector.InlineSwatch.prototype._swatchElementClicked):
Now fires an event before the clicked logic happens, but still after the
click event is fired on the element.
* UserInterface/Views/RulesStyleDetailsPanel.js:
(WebInspector.RulesStyleDetailsPanel.prototype.cssStyleDeclarationSectionBlurActiveEditor):
Clears the previously focused editor so when a reset happens no editor
is refocused.
Modified Paths
Diff
Modified: trunk/Source/WebInspectorUI/ChangeLog (196797 => 196798)
--- trunk/Source/WebInspectorUI/ChangeLog 2016-02-19 05:17:32 UTC (rev 196797)
+++ trunk/Source/WebInspectorUI/ChangeLog 2016-02-19 05:26:53 UTC (rev 196798)
@@ -1,3 +1,37 @@
+2016-02-18 Devin Rousso <[email protected]>
+
+ Web Inspector: Styles Sidebar focus jumps when trying to edit a color
+ https://bugs.webkit.org/show_bug.cgi?id=154404
+ <rdar://problem/24725744>
+
+ Reviewed by Timothy Hatcher.
+
+ Clicking an inline swatch in the CSS Rules sidebar causes any focused
+ editor, if any, to become blurred and therefore fire its handler function.
+ This causes an issue because when a CodeMirror instance in the styles
+ sidebar becomes blurred, it is possible for the entire Rules sidebar to
+ refresh and recreate all of the sections (r187714), meaning that it will
+ reselect whatever editor was previously selected before the refresh,
+ causing the swatch popup to be blurred and therefore dismiss.
+
+ * UserInterface/Views/CSSStyleDeclarationSection.js:
+ (WebInspector.CSSStyleDeclarationSection.prototype.cssStyleDeclarationTextEditorBlurActiveEditor):
+
+ * UserInterface/Views/CSSStyleDeclarationTextEditor.js:
+ (WebInspector.CSSStyleDeclarationTextEditor.prototype._createInlineSwatches.createSwatch):
+ (WebInspector.CSSStyleDeclarationTextEditor.prototype._inlineSwatchBeforeClicked):
+ Add listener for new event and call to delegate function for handling it.
+
+ * UserInterface/Views/InlineSwatch.js:
+ (WebInspector.InlineSwatch.prototype._swatchElementClicked):
+ Now fires an event before the clicked logic happens, but still after the
+ click event is fired on the element.
+
+ * UserInterface/Views/RulesStyleDetailsPanel.js:
+ (WebInspector.RulesStyleDetailsPanel.prototype.cssStyleDeclarationSectionBlurActiveEditor):
+ Clears the previously focused editor so when a reset happens no editor
+ is refocused.
+
2016-02-18 Joseph Pecoraro <[email protected]>
Web Inspector: Add Native Parameter Lists to Console prototype functions
Modified: trunk/Source/WebInspectorUI/UserInterface/Views/CSSStyleDeclarationSection.js (196797 => 196798)
--- trunk/Source/WebInspectorUI/UserInterface/Views/CSSStyleDeclarationSection.js 2016-02-19 05:17:32 UTC (rev 196797)
+++ trunk/Source/WebInspectorUI/UserInterface/Views/CSSStyleDeclarationSection.js 2016-02-19 05:26:53 UTC (rev 196798)
@@ -324,6 +324,12 @@
this._delegate.cssStyleDeclarationSectionEditorFocused(this);
}
+ cssStyleDeclarationTextEditorBlurActiveEditor()
+ {
+ if (typeof this._delegate.cssStyleDeclarationSectionBlurActiveEditor === "function")
+ this._delegate.cssStyleDeclarationSectionBlurActiveEditor(this);
+ }
+
cssStyleDeclarationTextEditorSwitchRule(reverse)
{
if (!this._delegate)
Modified: trunk/Source/WebInspectorUI/UserInterface/Views/CSSStyleDeclarationTextEditor.js (196797 => 196798)
--- trunk/Source/WebInspectorUI/UserInterface/Views/CSSStyleDeclarationTextEditor.js 2016-02-19 05:17:32 UTC (rev 196797)
+++ trunk/Source/WebInspectorUI/UserInterface/Views/CSSStyleDeclarationTextEditor.js 2016-02-19 05:26:53 UTC (rev 196798)
@@ -871,6 +871,7 @@
{
function createSwatch(swatch, marker, valueObject, valueString)
{
+ swatch.addEventListener(WebInspector.InlineSwatch.Event.BeforeClicked, this._inlineSwatchBeforeClicked, this);
swatch.addEventListener(WebInspector.InlineSwatch.Event.ValueChanged, this._inlineSwatchValueChanged, this);
let codeMirrorTextMarker = marker.codeMirrorTextMarker;
@@ -1302,6 +1303,12 @@
this._codeMirror.operation(update.bind(this));
}
+ _inlineSwatchBeforeClicked(event)
+ {
+ if (this._delegate && typeof this._delegate.cssStyleDeclarationTextEditorBlurActiveEditor === "function")
+ this._delegate.cssStyleDeclarationTextEditorBlurActiveEditor();
+ }
+
_inlineSwatchValueChanged(event)
{
let swatch = event && event.target;
Modified: trunk/Source/WebInspectorUI/UserInterface/Views/InlineSwatch.js (196797 => 196798)
--- trunk/Source/WebInspectorUI/UserInterface/Views/InlineSwatch.js 2016-02-19 05:17:32 UTC (rev 196797)
+++ trunk/Source/WebInspectorUI/UserInterface/Views/InlineSwatch.js 2016-02-19 05:26:53 UTC (rev 196798)
@@ -106,6 +106,8 @@
_swatchElementClicked(event)
{
+ this.dispatchEventToListeners(WebInspector.InlineSwatch.Event.BeforeClicked);
+
if (this._type === WebInspector.InlineSwatch.Type.Color && event.shiftKey && this._value) {
let nextFormat = this._value.nextFormat();
console.assert(nextFormat);
@@ -264,5 +266,6 @@
};
WebInspector.InlineSwatch.Event = {
+ BeforeClicked: "inline-swatch-before-clicked",
ValueChanged: "inline-swatch-value-changed"
};
Modified: trunk/Source/WebInspectorUI/UserInterface/Views/RulesStyleDetailsPanel.js (196797 => 196798)
--- trunk/Source/WebInspectorUI/UserInterface/Views/RulesStyleDetailsPanel.js 2016-02-19 05:17:32 UTC (rev 196797)
+++ trunk/Source/WebInspectorUI/UserInterface/Views/RulesStyleDetailsPanel.js 2016-02-19 05:26:53 UTC (rev 196798)
@@ -320,6 +320,11 @@
this._previousFocusedSection = focusedSection;
}
+ cssStyleDeclarationSectionBlurActiveEditor()
+ {
+ this._previousFocusedSection = null;
+ }
+
cssStyleDeclarationSectionEditorNextRule(currentSection)
{
currentSection.clearSelection();
_______________________________________________
webkit-changes mailing list
[email protected]
https://lists.webkit.org/mailman/listinfo/webkit-changes
