Changeset 272976 in webkit

Timestamp:

Feb 16, 2021 7:47:18 PM (17 months ago)

Author:

commit-queue@webkit.org

Message:

Web Inspector: Grids with overlays that disappear and reappear remain checked in Layout pane, toggling hits assertion
​https://bugs.webkit.org/show_bug.cgi?id=221919
<rdar://problem/74363006>

Patch by Razvan Caliman <Razvan Caliman> on 2021-02-16
Reviewed by Devin Rousso.

When a DOMNode's grid layout context changes to something else,
its corresponding shown grid overlay is automatically hidden on the backend.
The frontend needs to update its mapping of nodes to overlays and notify listeners of the change in state.

• UserInterface/Controllers/OverlayManager.js:

(WI.OverlayManager):
(WI.OverlayManager.prototype._handleLayoutContextTypeChanged):

Location:

trunk/Source/WebInspectorUI

Files:

• ChangeLog (modified) (1 diff)
• UserInterface/Controllers/OverlayManager.js (modified) (4 diffs)

trunk/Source/WebInspectorUI/ChangeLog

@@ +1 @@
+2021-02-16  Razvan Caliman  <rcaliman@apple.com>
+
+        Web Inspector: Grids with overlays that disappear and reappear remain checked in Layout pane, toggling hits assertion
+        https://bugs.webkit.org/show_bug.cgi?id=221919
+        <rdar://problem/74363006>
+
+        Reviewed by Devin Rousso.
+
+        When a DOMNode's grid layout context changes to something else,
+        its corresponding shown grid overlay is automatically hidden on the backend.
+        The frontend needs to update its mapping of nodes to overlays and notify listeners of the change in state.
+
+        * UserInterface/Controllers/OverlayManager.js:
+        (WI.OverlayManager):
+        (WI.OverlayManager.prototype._handleLayoutContextTypeChanged):
+
 2021-02-16  Razvan Caliman  <rcaliman@apple.com>
 

trunk/Source/WebInspectorUI/UserInterface/Controllers/OverlayManager.js

@@ -54 +54 @@
         console.assert(domNode instanceof WI.DOMNode, domNode);
         console.assert(!color || color instanceof WI.Color, color);
+        console.assert(domNode.layoutContextType === WI.DOMNode.LayoutContextType.Grid, domNode.layoutContextType);
 
         color ||= WI.Color.fromString("magenta"); // fallback color
@@ -72 +73 @@
         this._gridOverlayForNodeMap.set(domNode, overlay);
 
+        domNode.addEventListener(WI.DOMNode.Event.LayoutContextTypeChanged, this._handleLayoutContextTypeChanged, this);
         this.dispatchEventToListeners(WI.OverlayManager.Event.GridOverlayShown, overlay);
     }
@@ -79 +81 @@
         console.assert(domNode instanceof WI.DOMNode, domNode);
         console.assert(!domNode.destroyed, domNode);
+        console.assert(domNode.layoutContextType === WI.DOMNode.LayoutContextType.Grid, domNode.layoutContextType);
         if (domNode.destroyed)
             return;
@@ -89 +92 @@
         target.DOMAgent.hideGridOverlay(domNode.id);
 
+        domNode.removeEventListener(WI.DOMNode.Event.LayoutContextTypeChanged, this._handleLayoutContextTypeChanged, this);
         this.dispatchEventToListeners(WI.OverlayManager.Event.GridOverlayHidden, overlay);
     }
 
     // Private
+
+    _handleLayoutContextTypeChanged(event)
+    {
+        let domNode = event.target;
+        console.assert(domNode.layoutContextType !== WI.DOMNode.LayoutContextType.Grid, domNode);
+
+        domNode.removeEventListener(WI.DOMNode.Event.LayoutContextTypeChanged, this._handleLayoutContextTypeChanged, this);
+
+        // When the context type changes, the overlay is automatically hidden on the backend. Here, we only update the map and notify listeners.
+        let overlay = this._gridOverlayForNodeMap.take(domNode);
+        this.dispatchEventToListeners(WI.OverlayManager.Event.GridOverlayHidden, overlay);
+    }
 
     _handleGridSettingChanged(event)