Attachment 347987 Details for Bug 187026 – Patch

[patch] Patch

bug-187026-20180823221758.patch (text/plain), 4.33 KB, created by Devin Rousso on 2018-08-23 21:17:59 PDT

(hide)

Description:

Filename:

MIME Type:

Creator: Devin Rousso

Created: 2018-08-23 21:17:59 PDT

Size: 4.33 KB

patch

obsolete

>diff --git a/Source/WebInspectorUI/ChangeLog b/Source/WebInspectorUI/ChangeLog
>index 9d64ffe5c15c7ae901c4ed38979bee09c4579fca..15b1a1322f809e1242fba7fd5c9dcd1c058fe383 100644
>--- a/Source/WebInspectorUI/ChangeLog
>+++ b/Source/WebInspectorUI/ChangeLog
>@@ -1,3 +1,23 @@
>+2018-08-23  Devin Rousso  <drousso@apple.com>
>+
>+        Web Inspector: Color picker: can't enter decimal numbers for opacity
>+        https://bugs.webkit.org/show_bug.cgi?id=187026
>+        <rdar://problem/41446500>
>+
>+        Reviewed by Brian Burg.
>+
>+        After every "input" event, we update the `color` value of the `WI.ColorPicker` based on a
>+        generated string using the values of the various <input>. The issue with this approach is
>+        that adding a decimal point (e.g. "0.") would still be construed as 0, meaning that the
>+        color wouldn't change and would instead be reset back to it's old value. This patch adds an
>+        early return if the newly generated color has the same value as the current color, thereby
>+        meaning that the `color` wouldn't change when changing from "0" to "0.".
>+
>+        * UserInterface/Views/ColorPicker.js:
>+        (WI.ColorPicker):
>+        (WI.ColorPicker.createColorInput):
>+        (WI.ColorPicker.prototype._handleColorInputInput):
>+
> 2018-08-23  Devin Rousso  <drousso@apple.com>
> 
>         Web Inspector: support breakpoints for timers and animation-frame events
>diff --git a/Source/WebInspectorUI/UserInterface/Views/ColorPicker.js b/Source/WebInspectorUI/UserInterface/Views/ColorPicker.js
>index 3c188ac49600f7ff2ac4e4166dec592d7efc2121..69fcc4cbc4665721729176a8feb25471fb6c5c45 100644
>--- a/Source/WebInspectorUI/UserInterface/Views/ColorPicker.js
>+++ b/Source/WebInspectorUI/UserInterface/Views/ColorPicker.js
>@@ -44,32 +44,32 @@ WI.ColorPicker = class ColorPicker extends WI.Object
>         let colorInputsContainerElement = document.createElement("div");
>         colorInputsContainerElement.classList.add("color-inputs");
> 
>-        function createColorInput(label, {min: min = 0, max: max = 100, step: step = 1, units} = {}) {
>+        let createColorInput = (label, {min, max, step, units} = {}) => {
>             let containerElement = colorInputsContainerElement.createChild("div");
> 
>             containerElement.append(label);
> 
>             let numberInputElement = containerElement.createChild("input");
>             numberInputElement.type = "number";
>-            numberInputElement.min = min;
>-            numberInputElement.max = max;
>-            numberInputElement.step = step;
>+            numberInputElement.min = min || 0;
>+            numberInputElement.max = max || 100;
>+            numberInputElement.step = step || 1;
>             numberInputElement.addEventListener("input", this._handleColorInputInput.bind(this));
> 
>             if (units && units.length)
>                 containerElement.append(units);
> 
>             return {containerElement, numberInputElement};
>-        }
>+        };
> 
>         this._colorInputs = new Map([
>-            ["R", createColorInput.call(this, "R", {max: 255})],
>-            ["G", createColorInput.call(this, "G", {max: 255})],
>-            ["B", createColorInput.call(this, "B", {max: 255})],
>-            ["H", createColorInput.call(this, "H", {max: 360})],
>-            ["S", createColorInput.call(this, "S", {units: "%"})],
>-            ["L", createColorInput.call(this, "L", {units: "%"})],
>-            ["A", createColorInput.call(this, "A"), {max: 1, step: 0.01}]
>+            ["R", createColorInput("R", {max: 255})],
>+            ["G", createColorInput("G", {max: 255})],
>+            ["B", createColorInput("B", {max: 255})],
>+            ["H", createColorInput("H", {max: 360})],
>+            ["S", createColorInput("S", {units: "%"})],
>+            ["L", createColorInput("L", {units: "%"})],
>+            ["A", createColorInput("A", {max: 1, step: 0.01})]
>         ]);
> 
>         this._element = document.createElement("div");
>@@ -324,7 +324,11 @@ WI.ColorPicker = class ColorPicker extends WI.Object
>             return;
>         }
> 
>-        this.color = WI.Color.fromString(colorString);
>+        let newColor = WI.Color.fromString(colorString);
>+        if (newColor.toString() === this._color.toString())
>+            return;
>+
>+        this.color = newColor;
>         this._color.format = oldFormat;
> 
>         this.dispatchEventToListeners(WI.ColorPicker.Event.ColorChanged, {color: this._color});

Actions: View | Formatted Diff | Diff

Attachments on bug 187026: 343558 | 347939 | 347987