Web Inspector: nodes can be dragged from the console log
authorgraouts@apple.com <graouts@apple.com@268f45cc-cd09-0410-ab3c-d52691b4dbfc>
Mon, 30 Sep 2013 20:06:06 +0000 (20:06 +0000)
committergraouts@apple.com <graouts@apple.com@268f45cc-cd09-0410-ab3c-d52691b4dbfc>
Mon, 30 Sep 2013 20:06:06 +0000 (20:06 +0000)
https://bugs.webkit.org/show_bug.cgi?id=122105

Reviewed by Darin Adler.

Catch "dragstart" events targeting nodes hosted in a DOMTreeOutline within the console
log view and prevent the default logic to trigger so that these nodes can't be dragged
off the console as it wouldn't make sense to.

* UserInterface/DOMTreeOutline.js:
(WebInspector.DOMTreeOutline):
Create a class property to allow the CSS class name to be used in WebInspector.LogContentView.

* UserInterface/LogContentView.js:
(WebInspector.LogContentView):
(WebInspector.LogContentView.prototype._ondragstart):
Track the "dragstart" events in their capture phase such that, if the event target is
a DOM node hosted in a DOMTreeOutline, we can prevent the event from propagating and
cancel its default behavior such that no dragging at all is performed.

git-svn-id: https://svn.webkit.org/repository/webkit/trunk@156672 268f45cc-cd09-0410-ab3c-d52691b4dbfc

Source/WebInspectorUI/ChangeLog
Source/WebInspectorUI/UserInterface/DOMTreeOutline.js
Source/WebInspectorUI/UserInterface/LogContentView.js

index db5e98ecdb3d81fa40c05dd40d9591802397d377..8b45d11fca7d05dabc39601277aef58fff3e5d83 100644 (file)
@@ -1,3 +1,25 @@
+2013-09-30  Antoine Quint  <graouts@apple.com>
+
+        Web Inspector: nodes can be dragged from the console log
+        https://bugs.webkit.org/show_bug.cgi?id=122105
+
+        Reviewed by Darin Adler.
+
+        Catch "dragstart" events targeting nodes hosted in a DOMTreeOutline within the console
+        log view and prevent the default logic to trigger so that these nodes can't be dragged
+        off the console as it wouldn't make sense to.
+
+        * UserInterface/DOMTreeOutline.js:
+        (WebInspector.DOMTreeOutline):
+        Create a class property to allow the CSS class name to be used in WebInspector.LogContentView.
+
+        * UserInterface/LogContentView.js:
+        (WebInspector.LogContentView):
+        (WebInspector.LogContentView.prototype._ondragstart):
+        Track the "dragstart" events in their capture phase such that, if the event target is
+        a DOM node hosted in a DOMTreeOutline, we can prevent the event from propagating and
+        cancel its default behavior such that no dragging at all is performed.
+
 2013-09-26  Brian J. Burg  <burg@cs.washington.edu>
 
         Web Inspector: dissociate old content views that are spliced from back/forward list
index 8ceb23d0b4a5ed1ec17664e0be1fb2e7333ff4a1..895100a35d713498d9a9b4bffe202cdf792fa409 100644 (file)
@@ -46,7 +46,7 @@ WebInspector.DOMTreeOutline = function(omitRootDOMNode, selectEnabled, showInEle
     this.element.addEventListener("drop", this._ondrop.bind(this), false);
     this.element.addEventListener("dragend", this._ondragend.bind(this), false);
 
-    this.element.classList.add("dom-tree-outline");
+    this.element.classList.add(WebInspector.DOMTreeOutline.StyleClassName);
     this.element.classList.add(WebInspector.SyntaxHighlightedStyleClassName);
 
     TreeOutline.call(this, this.element);
@@ -71,6 +71,8 @@ WebInspector.DOMTreeOutline = function(omitRootDOMNode, selectEnabled, showInEle
 
 WebInspector.Object.addConstructorFunctions(WebInspector.DOMTreeOutline);
 
+WebInspector.DOMTreeOutline.StyleClassName = "dom-tree-outline";
+
 WebInspector.DOMTreeOutline.Event = {
     SelectedNodeChanged: "dom-tree-outline-selected-node-changed"
 }
index 60c85829af86fea7247c404c5724744b622dc63a..5c32de629ccd1593c4ad95e31220f2c3723ac587 100644 (file)
@@ -41,6 +41,7 @@ WebInspector.LogContentView = function(representedObject)
     this.messagesElement.addEventListener("blur", this._didBlur.bind(this));
     this.messagesElement.addEventListener("keydown", this._keyDown.bind(this));
     this.messagesElement.addEventListener("click", this._click.bind(this), true);
+    this.messagesElement.addEventListener("dragstart", this._ondragstart.bind(this), true);
     this.element.appendChild(this.messagesElement);
 
     this.prompt = WebInspector.quickConsole.prompt;
@@ -433,6 +434,14 @@ WebInspector.LogContentView.prototype = {
         delete this._mouseInteractionShouldPreventClickPropagation;
     },
 
+    _ondragstart: function(event)
+    {
+        if (event.target.enclosingNodeOrSelfWithClass(WebInspector.DOMTreeOutline.StyleClassName)) {
+            event.stopPropagation();
+            event.preventDefault();
+        }
+    },
+
     handleEvent: function(event)
     {
         switch (event.type) {