Bug 1498669 - flex devtools are broken if a flex container is a grandchild of a flex container. r=gl
authorMicah Tigley <mtigley@mozilla.com>
Wed, 17 Oct 2018 14:55:18 +0000
changeset 490148 7dfafc01cf471ed9985443d9d370ad5a00852ac8
parent 490147 6191777b6e40eab703c643088e6ad265cf960d32
child 490149 b94a2aa50ef2a049dace3fb54fbaf825c6503a25
push id247
push userfmarier@mozilla.com
push dateSat, 27 Oct 2018 01:06:44 +0000
reviewersgl
bugs1498669
milestone64.0a1
Bug 1498669 - flex devtools are broken if a flex container is a grandchild of a flex container. r=gl Differential Revision: https://phabricator.services.mozilla.com/D8911
devtools/server/actors/layout.js
--- a/devtools/server/actors/layout.js
+++ b/devtools/server/actors/layout.js
@@ -290,20 +290,23 @@ const LayoutActor = ActorClassWithSpec(l
    * selected node. The current node can be a grid/flex container or grid/flex item.
    * If it is a grid/flex item, returns the parent grid/flex container. Otherwise, returns
    * null if the current or parent node is not a grid/flex container.
    *
    * @param  {Node|NodeActor} node
    *         The node to start iterating at.
    * @param  {String} type
    *         Can be "grid" or "flex", the display type we are searching for.
+   * @param  {Boolean|null} onlyLookAtCurrentNode
+   *         Whether or not to consider only the current node's display (ie, don't walk
+   *         up the tree).
    * @return {GridActor|FlexboxActor|null} The GridActor or FlexboxActor of the
    * grid/flex container of the give node. Otherwise, returns null.
    */
-  getCurrentDisplay(node, type) {
+  getCurrentDisplay(node, type, onlyLookAtCurrentNode) {
     if (isNodeDead(node)) {
       return null;
     }
 
     // Given node can either be a Node or a NodeActor.
     if (node.rawNode) {
       node = node.rawNode;
     }
@@ -311,19 +314,22 @@ const LayoutActor = ActorClassWithSpec(l
     const treeWalker = this.walker.getDocumentWalker(node, SHOW_ELEMENT);
     let currentNode = treeWalker.currentNode;
     let displayType = this.walker.getNode(currentNode).displayType;
 
     if (!displayType) {
       return null;
     }
 
-    if (type == "flex" &&
-        (displayType == "inline-flex" || displayType == "flex")) {
-      return new FlexboxActor(this, currentNode);
+    if (type == "flex") {
+      if (displayType == "inline-flex" || displayType == "flex") {
+        return new FlexboxActor(this, currentNode);
+      } else if (onlyLookAtCurrentNode) {
+        return null;
+      }
     } else if (type == "grid" &&
                (displayType == "inline-grid" || displayType == "grid")) {
       return new GridActor(this, currentNode);
     }
 
     // Otherwise, check if this is a flex/grid item or the parent node is a flex/grid
     // container.
     while ((currentNode = treeWalker.parentNode())) {
@@ -378,17 +384,17 @@ const LayoutActor = ActorClassWithSpec(l
    * @return {FlexboxActor|null} The FlexboxActor of the flex container of the given node.
    * Otherwise, returns null.
    */
   getCurrentFlexbox(node, onlyLookAtParents) {
     if (onlyLookAtParents) {
       node = node.rawNode.parentNode;
     }
 
-    return this.getCurrentDisplay(node, "flex");
+    return this.getCurrentDisplay(node, "flex", onlyLookAtParents);
   },
 
   /**
    * Returns an array of GridActor objects for all the grid elements contained in the
    * given root node.
    *
    * @param  {Node|NodeActor} node
    *         The root node for grid elements