Devtools[LayoutEditor]: Rework layout-editor workflow

Source/devtools/front_end/sdk/DOMModel.js

Index: Source/devtools/front_end/sdk/DOMModel.js
diff --git a/Source/devtools/front_end/sdk/DOMModel.js b/Source/devtools/front_end/sdk/DOMModel.js
index 645e32f0bf227bcdf2eaa95ed490234378fe346d..414068a78ceb3c6493ed412f5af232fed1b8e6b8 100644
--- a/Source/devtools/front_end/sdk/DOMModel.js
+++ b/Source/devtools/front_end/sdk/DOMModel.js
@@ -877,6 +877,15 @@ WebInspector.DOMNode.prototype = {
         this._domModel.highlightDOMNode(this.id, mode, undefined, objectId);
     },
 
+    /**
+     * @param {!{mode: (string|undefined), showInfo: (boolean|undefined), showLayoutEditor: (boolean|undefined)}=} config
+     * @param {!RuntimeAgent.RemoteObjectId=} objectId
+     */
+    highlightWithConfig: function(config, objectId)
+    {
+        this._domModel.highlightDOMNodeWithConfig(this.id, config, undefined, objectId);
+    },
+
     highlightForTwoSeconds: function()
     {
         this._domModel.highlightDOMNodeForTwoSeconds(this.id);
@@ -1710,13 +1719,13 @@ WebInspector.DOMModel.prototype = {
 
     /**
      * @param {!DOMAgent.NodeId=} nodeId
-     * @param {!{mode: (string|undefined), showInfo: (boolean|undefined)}=} config
+     * @param {!{mode: (string|undefined), showInfo: (boolean|undefined), showLayoutEditor: (boolean|undefined)}=} config
      * @param {!DOMAgent.BackendNodeId=} backendNodeId
      * @param {!RuntimeAgent.RemoteObjectId=} objectId
      */
     highlightDOMNodeWithConfig: function(nodeId, config, backendNodeId, objectId)
     {
-        config = config || { mode: "all", showInfo: undefined };
+        config = config || { mode: "all", showInfo: undefined, showLayoutEditor: undefined };
         if (this._hideDOMNodeHighlightTimeout) {
             clearTimeout(this._hideDOMNodeHighlightTimeout);
             delete this._hideDOMNodeHighlightTimeout;
@@ -1724,6 +1733,10 @@ WebInspector.DOMModel.prototype = {
         var highlightConfig = this._buildHighlightConfig(config.mode);
         if (typeof config.showInfo !== "undefined")
             highlightConfig.showInfo = config.showInfo;
+
+        if (typeof config.showLayoutEditor !== undefined)
+            highlightConfig.showLayoutEditor = config.showLayoutEditor;

[pfeldman, 2015/08/25 21:25:29]

There should never be showLayoutEditor option in the config.

[sergeyv, 2015/08/26 02:25:49]

Done.

+
         this._highlighter.highlightDOMNode(this.nodeForId(nodeId || 0), highlightConfig, backendNodeId, objectId);
     },
 
@@ -1746,10 +1759,10 @@ WebInspector.DOMModel.prototype = {
 
     /**
      * @param {boolean} enabled
-     * @param {boolean} inspectUAShadowDOM
+     * @param {?string} mode

[pfeldman, 2015/08/25 21:25:29]

This all can be reverted.

[sergeyv, 2015/08/26 02:25:49]

No, now we have LayoutEditor mode, so we need String here

[pfeldman, 2015/08/26 21:04:48]

But we never trigger layout editor through this code path.

      * @param {function(?Protocol.Error)=} callback
      */
-    setInspectModeEnabled: function(enabled, inspectUAShadowDOM, callback)
+    setInspectModeEnabled: function(enabled, mode, callback)
     {
         /**
          * @this {WebInspector.DOMModel}
@@ -1757,7 +1770,7 @@ WebInspector.DOMModel.prototype = {
         function onDocumentAvailable()
         {
             this.dispatchEventToListeners(WebInspector.DOMModel.Events.InspectModeWillBeToggled, enabled);
-            this._highlighter.setInspectModeEnabled(enabled, inspectUAShadowDOM, this._buildHighlightConfig(), callback);
+            this._highlighter.setInspectModeEnabled(enabled, mode, this._buildHighlightConfig(), callback);
         }
         this.requestDocument(onDocumentAvailable.bind(this));
     },
@@ -2101,11 +2114,11 @@ WebInspector.DOMNodeHighlighter.prototype = {
 
     /**
      * @param {boolean} enabled
-     * @param {boolean} inspectUAShadowDOM
+     * @param {?string} mode
      * @param {!DOMAgent.HighlightConfig} config
      * @param {function(?Protocol.Error)=} callback
      */
-    setInspectModeEnabled: function(enabled, inspectUAShadowDOM, config, callback) {},
+    setInspectModeEnabled: function(enabled, mode, config, callback) {},
 
     /**
      * @param {!PageAgent.FrameId} frameId
@@ -2142,13 +2155,13 @@ WebInspector.DefaultDOMNodeHighlighter.prototype = {
     /**
      * @override
      * @param {boolean} enabled
-     * @param {boolean} inspectUAShadowDOM
+     * @param {?string} mode
      * @param {!DOMAgent.HighlightConfig} config
      * @param {function(?Protocol.Error)=} callback
      */
-    setInspectModeEnabled: function(enabled, inspectUAShadowDOM, config, callback)
+    setInspectModeEnabled: function(enabled, mode, config, callback)
     {
-        this._agent.setInspectModeEnabled(enabled, inspectUAShadowDOM, config, callback);
+        this._agent.setInspectModeEnabled(enabled, mode || undefined, config, callback);
     },
 
     /**