Diff
Modified: trunk/LayoutTests/ChangeLog (96710 => 96711)
--- trunk/LayoutTests/ChangeLog 2011-10-05 16:10:31 UTC (rev 96710)
+++ trunk/LayoutTests/ChangeLog 2011-10-05 16:14:25 UTC (rev 96711)
@@ -1,3 +1,17 @@
+2011-10-05 Pavel Feldman <pfeld...@google.com>
+
+ Web Inspector: move elements panel update semantics from ElementsPanel to ElementsTreeOutline.
+ https://bugs.webkit.org/show_bug.cgi?id=69431
+
+ Reviewed by Yury Semikhatsky.
+
+ * http/tests/inspector/elements-test.js:
+ (initialize_ElementTest.InspectorTest.dumpElementsTree):
+ (initialize_ElementTest.InspectorTest.expandElementsTree.onAllNodesAvailable):
+ (initialize_ElementTest.InspectorTest.expandElementsTree):
+ * inspector/elements/edit-dom-actions.html:
+ * inspector/styles/styles-update-from-js.html:
+
2011-10-05 Ilya Tikhonovsky <loi...@chromium.org>
Web Inspector: debugger-activation-crash2.html are flaky.
Modified: trunk/LayoutTests/http/tests/inspector/elements-test.js (96710 => 96711)
--- trunk/LayoutTests/http/tests/inspector/elements-test.js 2011-10-05 16:10:31 UTC (rev 96710)
+++ trunk/LayoutTests/http/tests/inspector/elements-test.js 2011-10-05 16:14:25 UTC (rev 96711)
@@ -320,7 +320,7 @@
print(children[children.length - 1], prefix);
}
- WebInspector.panels.elements.updateModifiedNodes();
+ WebInspector.panels.elements.treeOutline._updateModifiedNodes();
var treeOutline = WebInspector.panels.elements.treeOutline;
print(rootNode ? treeOutline.findTreeElement(rootNode) : treeOutline, "");
};
@@ -340,7 +340,7 @@
function onAllNodesAvailable()
{
- WebInspector.panels.elements.updateModifiedNodes();
+ WebInspector.panels.elements.treeOutline._updateModifiedNodes();
expand(WebInspector.panels.elements.treeOutline);
callback();
}
Modified: trunk/LayoutTests/inspector/elements/edit-dom-actions.html (96710 => 96711)
--- trunk/LayoutTests/inspector/elements/edit-dom-actions.html 2011-10-05 16:10:31 UTC (rev 96710)
+++ trunk/LayoutTests/inspector/elements/edit-dom-actions.html 2011-10-05 16:14:25 UTC (rev 96711)
@@ -94,7 +94,7 @@
var editorElement = window.getSelection().anchorNode.parentElement;
editorElement.textContent = "newattr=\"new-value\"";
editorElement.dispatchEvent(InspectorTest.createKeyEvent("Enter"));
- InspectorTest.addSniffer(WebInspector.ElementsPanel.prototype, "updateModifiedNodes", done);
+ InspectorTest.addSniffer(WebInspector.ElementsTreeUpdater.prototype, "_updateModifiedNodes", done);
}
}
},
@@ -162,7 +162,7 @@
editorElement.textContent = newValue;
editorElement.dispatchEvent(InspectorTest.createKeyEvent("Enter"));
if (useSniffer)
- InspectorTest.addSniffer(WebInspector.ElementsPanel.prototype, "updateModifiedNodes", step2);
+ InspectorTest.addSniffer(WebInspector.ElementsTreeUpdater.prototype, "_updateModifiedNodes", step2);
else
InspectorTest.runAfterPendingDispatches(step2);
}
Modified: trunk/LayoutTests/inspector/styles/styles-update-from-js.html (96710 => 96711)
--- trunk/LayoutTests/inspector/styles/styles-update-from-js.html 2011-10-05 16:10:31 UTC (rev 96710)
+++ trunk/LayoutTests/inspector/styles/styles-update-from-js.html 2011-10-05 16:14:25 UTC (rev 96711)
@@ -70,7 +70,7 @@
function findNodeTreeElement()
{
- WebInspector.panels.elements.updateModifiedNodes();
+ WebInspector.panels.elements.treeOutline._updateModifiedNodes();
var expandedNode = InspectorTest.expandedNodeWithId("container");
if (!expandedNode) {
InspectorTest.addResult("'container' node not found");
Modified: trunk/Source/WebCore/ChangeLog (96710 => 96711)
--- trunk/Source/WebCore/ChangeLog 2011-10-05 16:10:31 UTC (rev 96710)
+++ trunk/Source/WebCore/ChangeLog 2011-10-05 16:14:25 UTC (rev 96711)
@@ -1,3 +1,53 @@
+2011-10-05 Pavel Feldman <pfeld...@google.com>
+
+ Web Inspector: move elements panel update semantics from ElementsPanel to ElementsTreeOutline.
+ https://bugs.webkit.org/show_bug.cgi?id=69431
+
+ Reviewed by Yury Semikhatsky.
+
+ * inspector/front-end/ConsoleMessage.js:
+ (WebInspector.ConsoleMessageImpl.prototype._formatParameterAsNode):
+ * inspector/front-end/ElementsPanel.js:
+ (WebInspector.ElementsPanel.get this):
+ (WebInspector.ElementsPanel):
+ (WebInspector.ElementsPanel.prototype.show):
+ (WebInspector.ElementsPanel.prototype.hide):
+ (WebInspector.ElementsPanel.prototype._selectedNodeChanged):
+ (WebInspector.ElementsPanel.prototype._reset):
+ (WebInspector.ElementsPanel.prototype._nodeRemoved):
+ (WebInspector.ElementsPanel.prototype.updateBreadcrumb.selectCrumbFunction):
+ (WebInspector.ElementsPanel.prototype.updateBreadcrumb):
+ * inspector/front-end/ElementsTreeOutline.js:
+ (WebInspector.ElementsTreeOutline):
+ (WebInspector.ElementsTreeOutline.prototype.wireToDomAgent):
+ (WebInspector.ElementsTreeOutline.prototype.setVisible):
+ (WebInspector.ElementsTreeOutline.prototype.addEventListener):
+ (WebInspector.ElementsTreeOutline.prototype.removeEventListener):
+ (WebInspector.ElementsTreeOutline.prototype.selectDOMNode):
+ (WebInspector.ElementsTreeOutline.prototype.update):
+ (WebInspector.ElementsTreeOutline.prototype._selectedNodeChanged):
+ (WebInspector.ElementsTreeOutline.prototype.findTreeElement.parentNode):
+ (WebInspector.ElementsTreeOutline.prototype.findTreeElement):
+ (WebInspector.ElementsTreeOutline.prototype.createTreeElementFor):
+ (WebInspector.ElementsTreeOutline.prototype._ondrop.callback):
+ (WebInspector.ElementsTreeOutline.prototype._ondrop):
+ (WebInspector.ElementsTreeOutline.prototype.adjustCollapsedRange):
+ (WebInspector.ElementsTreeOutline.prototype._updateModifiedNodes):
+ (WebInspector.ElementsTreeElement.prototype.insertChildElement):
+ (WebInspector.ElementsTreeElement.prototype.selectOnMouseDown):
+ (WebInspector.ElementsTreeElement.prototype._startEditingAsHTML.dispose):
+ (WebInspector.ElementsTreeElement.prototype._startEditingAsHTML):
+ (WebInspector.ElementsTreeElement.prototype._attributeEditingCommitted.moveToNextAttributeIfNeeded):
+ (WebInspector.ElementsTreeElement.prototype._attributeEditingCommitted):
+ (WebInspector.ElementsTreeElement.prototype._tagNameEditingCommitted.changeTagNameCallback):
+ (WebInspector.ElementsTreeElement.prototype._tagNameEditingCommitted):
+ (WebInspector.ElementsTreeElement.prototype._textNodeEditingCommitted):
+ (WebInspector.ElementsTreeElement.prototype._editingCancelled):
+ ():
+ * inspector/front-end/externs.js:
+ (WebInspector.ElementsTreeOutline):
+ * inspector/front-end/utilities.js:
+
2011-10-05 Yury Semikhatsky <yu...@chromium.org>
Web Inspector: provide a way for persisting worker inspector state
Modified: trunk/Source/WebCore/inspector/front-end/ConsoleMessage.js (96710 => 96711)
--- trunk/Source/WebCore/inspector/front-end/ConsoleMessage.js 2011-10-05 16:10:31 UTC (rev 96710)
+++ trunk/Source/WebCore/inspector/front-end/ConsoleMessage.js 2011-10-05 16:14:25 UTC (rev 96711)
@@ -288,8 +288,7 @@
this._formatParameterAsObject(object, elem);
return;
}
- var treeOutline = new WebInspector.ElementsTreeOutline();
- treeOutline.showInElementsPanelEnabled = true;
+ var treeOutline = new WebInspector.ElementsTreeOutline(false, false, true);
treeOutline.rootDOMNode = WebInspector.domAgent.nodeForId(nodeId);
treeOutline.element.addStyleClass("outline-disclosure");
if (!treeOutline.children[0].hasChildren)
Modified: trunk/Source/WebCore/inspector/front-end/ElementsPanel.js (96710 => 96711)
--- trunk/Source/WebCore/inspector/front-end/ElementsPanel.js 2011-10-05 16:10:31 UTC (rev 96710)
+++ trunk/Source/WebCore/inspector/front-end/ElementsPanel.js 2011-10-05 16:14:25 UTC (rev 96711)
@@ -41,29 +41,11 @@
this.contentElement.addEventListener("contextmenu", this._contextMenuEventFired.bind(this), true);
- this.treeOutline = new WebInspector.ElementsTreeOutline();
- this.treeOutline.panel = this;
- this.treeOutline.includeRootDOMNode = false;
- this.treeOutline.selectEnabled = true;
+ this.treeOutline = new WebInspector.ElementsTreeOutline(true, true);
+ this.treeOutline.wireToDomAgent();
- this.treeOutline.selectedNodeChanged = function(forceUpdate)
- {
- this.panel.updateBreadcrumb(forceUpdate);
+ this.treeOutline.addEventListener(WebInspector.ElementsTreeOutline.Events.SelectedNodeChanged, this._selectedNodeChanged, this);
- for (var pane in this.panel.sidebarPanes)
- this.panel.sidebarPanes[pane].needsUpdate = true;
-
- this.panel.updateStyles(true);
- this.panel.updateMetrics();
- this.panel.updateProperties();
- this.panel.updateEventListeners();
-
- if (this._selectedDOMNode) {
- ConsoleAgent.addInspectedNode(this._selectedDOMNode.id);
- WebInspector.extensionServer.notifyObjectSelected(this.panel.name);
- }
- };
-
this.contentElement.appendChild(this.treeOutline.element);
this.crumbsElement = document.createElement("div");
@@ -113,15 +95,8 @@
this._registerShortcuts();
- WebInspector.domAgent.addEventListener(WebInspector.DOMAgent.Events.NodeInserted, this._nodeInserted, this);
WebInspector.domAgent.addEventListener(WebInspector.DOMAgent.Events.NodeRemoved, this._nodeRemoved, this);
- WebInspector.domAgent.addEventListener(WebInspector.DOMAgent.Events.AttrModified, this._attributesUpdated, this);
- WebInspector.domAgent.addEventListener(WebInspector.DOMAgent.Events.AttrRemoved, this._attributesUpdated, this);
- WebInspector.domAgent.addEventListener(WebInspector.DOMAgent.Events.CharacterDataModified, this._characterDataModified, this);
WebInspector.domAgent.addEventListener(WebInspector.DOMAgent.Events.DocumentUpdated, this._documentUpdated, this);
- WebInspector.domAgent.addEventListener(WebInspector.DOMAgent.Events.ChildNodeCountUpdated, this._childNodeCountUpdated, this);
- WebInspector.domAgent.addEventListener(WebInspector.DOMAgent.Events.InspectElementRequested, this._inspectElementRequested, this);
- this.recentlyModifiedNodes = [];
}
WebInspector.ElementsPanel.prototype = {
@@ -151,14 +126,10 @@
this.sidebarResizeElement.style.right = (this.sidebarElement.offsetWidth - 3) + "px";
this.updateBreadcrumb();
this.treeOutline.updateSelection();
- if (this.recentlyModifiedNodes.length)
- this.updateModifiedNodes();
+ this.treeOutline.setVisible(true);
if (Preferences.nativeInstrumentationEnabled)
this.sidebarElement.insertBefore(this.sidebarPanes.domBreakpoints.element, this.sidebarPanes.eventListeners.element);
-
- if (!this.rootDOMNode)
- WebInspector.domAgent.requestDocument();
},
hide: function()
@@ -167,6 +138,7 @@
WebInspector.highlightDOMNode(0);
this.setSearchingForNode(false);
+ this.treeOutline.setVisible(false);
},
onResize: function()
@@ -175,28 +147,38 @@
this.updateBreadcrumbSizes();
},
- _reset: function()
+ _selectedNodeChanged: function()
{
- if (this.selectedDOMNode())
- this._selectedPathOnReset = this.selectedDOMNode().path();
+ var selectedNode = this.selectedDOMNode();
+ if (!selectedNode && this._lastValidSelectedNode)
+ this._selectedPathOnReset = this._lastValidSelectedNode.path();
- this.rootDOMNode = null;
- this.selectDOMNode(null);
+ this.updateBreadcrumb(false);
- WebInspector.highlightDOMNode(0);
+ for (var pane in this.sidebarPanes)
+ this.sidebarPanes[pane].needsUpdate = true;
- this.recentlyModifiedNodes = [];
+ this.updateStyles(true);
+ this.updateMetrics();
+ this.updateProperties();
+ this.updateEventListeners();
- delete this.currentQuery;
+ if (selectedNode) {
+ ConsoleAgent.addInspectedNode(selectedNode.id);
+ WebInspector.extensionServer.notifyObjectSelected(this.name);
+ this._lastValidSelectedNode = selectedNode;
+ }
},
- _documentUpdated: function(event)
+ _reset: function()
{
- this._setDocument(event.data);
+ delete this.currentQuery;
},
- _setDocument: function(inspectedRootDocument)
+ _documentUpdated: function(event)
{
+ var inspectedRootDocument = event.data;
+
this._reset();
this.searchCanceled();
@@ -206,8 +188,6 @@
if (Preferences.nativeInstrumentationEnabled)
this.sidebarPanes.domBreakpoints.restoreBreakpoints();
- this.rootDOMNode = inspectedRootDocument;
-
function selectNode(candidateFocusNode)
{
if (!candidateFocusNode)
@@ -391,16 +371,6 @@
// TODO: Implement Shifting the oldSelector, and its contents to a newSelector
},
- get rootDOMNode()
- {
- return this.treeOutline.rootDOMNode;
- },
-
- set rootDOMNode(x)
- {
- this.treeOutline.rootDOMNode = x;
- },
-
selectedDOMNode: function()
{
return this.treeOutline.selectedDOMNode();
@@ -411,96 +381,18 @@
this.treeOutline.selectDOMNode(node, focus);
},
- _attributesUpdated: function(event)
- {
- this.recentlyModifiedNodes.push({node: event.data.node, updated: true});
- if (this.visible)
- this._updateModifiedNodesSoon();
- },
-
- _characterDataModified: function(event)
- {
- this.recentlyModifiedNodes.push({node: event.data, updated: true});
- if (this.visible)
- this._updateModifiedNodesSoon();
- },
-
- _nodeInserted: function(event)
- {
- this.recentlyModifiedNodes.push({node: event.data, parent: event.data.parentNode, inserted: true});
- if (this.visible)
- this._updateModifiedNodesSoon();
- },
-
_nodeRemoved: function(event)
{
- this.recentlyModifiedNodes.push({node: event.data.node, parent: event.data.parent, removed: true});
- if (this.visible)
- this._updateModifiedNodesSoon();
- },
-
- _childNodeCountUpdated: function(event)
- {
- var treeElement = this.treeOutline.findTreeElement(event.data);
- if (treeElement)
- treeElement.hasChildren = event.data.hasChildNodes();
- },
-
- _inspectElementRequested: function(event)
- {
- var node = event.data;
- WebInspector.updateFocusedNode(node.id);
- },
-
- _updateModifiedNodesSoon: function()
- {
- if ("_updateModifiedNodesTimeout" in this)
+ if (!this.visible)
return;
- this._updateModifiedNodesTimeout = setTimeout(this.updateModifiedNodes.bind(this), 0);
- },
- updateModifiedNodes: function()
- {
- if ("_updateModifiedNodesTimeout" in this) {
- clearTimeout(this._updateModifiedNodesTimeout);
- delete this._updateModifiedNodesTimeout;
- }
-
- var updatedParentTreeElements = [];
- var updateBreadcrumbs = false;
-
- for (var i = 0; i < this.recentlyModifiedNodes.length; ++i) {
- var parent = this.recentlyModifiedNodes[i].parent;
- var node = this.recentlyModifiedNodes[i].node;
-
- if (this.recentlyModifiedNodes[i].updated) {
- var nodeItem = this.treeOutline.findTreeElement(node);
- if (nodeItem)
- nodeItem.updateTitle();
- continue;
+ var crumbs = this.crumbsElement;
+ for (var crumb = crumbs.firstChild; crumb; crumb = crumb.nextSibling) {
+ if (crumb.representedObject === event.data.node) {
+ this.updateBreadcrumb(true);
+ return;
}
-
- if (!parent)
- continue;
-
- var parentNodeItem = this.treeOutline.findTreeElement(parent);
- if (parentNodeItem && !parentNodeItem.alreadyUpdatedChildren) {
- parentNodeItem.updateChildren();
- parentNodeItem.alreadyUpdatedChildren = true;
- updatedParentTreeElements.push(parentNodeItem);
- }
-
- if (!updateBreadcrumbs && (this.selectedDOMNode() === parent || (this.selectedDOMNode() && this.selectedDOMNode().isAncestor(parent))))
- updateBreadcrumbs = true;
}
-
- for (var i = 0; i < updatedParentTreeElements.length; ++i)
- delete updatedParentTreeElements[i].alreadyUpdatedChildren;
-
- this.recentlyModifiedNodes = [];
-
- if (updateBreadcrumbs)
- this.updateBreadcrumb(true);
},
_stylesPaneEdited: function()
@@ -552,7 +444,7 @@
var foundRoot = false;
var crumb = crumbs.firstChild;
while (crumb) {
- if (crumb.representedObject === this.rootDOMNode)
+ if (crumb.representedObject === this.treeOutline.rootDOMNode)
foundRoot = true;
if (foundRoot)
@@ -601,13 +493,8 @@
}
panel.updateBreadcrumbSizes(crumb);
- } else {
- // Clicking a dimmed crumb or double clicking (event.detail >= 2)
- // will change the root node in addition to the focused node.
- if (event.detail >= 2 || crumb.hasStyleClass("dimmed"))
- panel.rootDOMNode = crumb.representedObject.parentNode;
+ } else
panel.selectDOMNode(crumb.representedObject, true);
- }
event.preventDefault();
}
@@ -617,7 +504,7 @@
if (current.nodeType() === Node.DOCUMENT_NODE)
continue;
- if (current === this.rootDOMNode)
+ if (current === this.treeOutline.rootDOMNode)
foundRoot = true;
var crumb = document.createElement("span");
Modified: trunk/Source/WebCore/inspector/front-end/ElementsTreeOutline.js (96710 => 96711)
--- trunk/Source/WebCore/inspector/front-end/ElementsTreeOutline.js 2011-10-05 16:10:31 UTC (rev 96710)
+++ trunk/Source/WebCore/inspector/front-end/ElementsTreeOutline.js 2011-10-05 16:14:25 UTC (rev 96711)
@@ -28,7 +28,15 @@
* THIS SOFTWARE, EVEN IF ADVISED OF THE POSSIBILITY OF SUCH DAMAGE.
*/
-WebInspector.ElementsTreeOutline = function() {
+/**
+ * @constructor
+ * @extends {TreeOutline}
+ * @param {boolean=} omitRootDOMNode
+ * @param {boolean=} selectEnabled
+ * @param {boolean=} showInElementsPanelEnabled
+ */
+WebInspector.ElementsTreeOutline = function(omitRootDOMNode, selectEnabled, showInElementsPanelEnabled)
+{
this.element = document.createElement("ol");
this.element.addEventListener("mousedown", this._onmousedown.bind(this), false);
this.element.addEventListener("mousemove", this._onmousemove.bind(this), false);
@@ -41,15 +49,53 @@
TreeOutline.call(this, this.element);
- this.includeRootDOMNode = true;
- this.selectEnabled = false;
- this.showInElementsPanelEnabled = false;
- this.rootDOMNode = null;
+ this._includeRootDOMNode = !omitRootDOMNode;
+ this._selectEnabled = selectEnabled;
+ this._showInElementsPanelEnabled = showInElementsPanelEnabled;
+ this._rootDOMNode = null;
this._selectDOMNode = null;
+ this._eventSupport = new WebInspector.Object();
+ this._editing = false;
+
+ this._visible = false;
+
this.element.addEventListener("contextmenu", this._contextMenuEventFired.bind(this), true);
}
+WebInspector.ElementsTreeOutline.Events = {
+ SelectedNodeChanged: "SelectedNodeChanged"
+}
+
WebInspector.ElementsTreeOutline.prototype = {
+ wireToDomAgent: function()
+ {
+ this._elementsTreeUpdater = new WebInspector.ElementsTreeUpdater(this);
+ },
+
+ setVisible: function(visible)
+ {
+ this._visible = visible;
+ if (!this._visible)
+ return;
+
+ if (!this.rootDOMNode) {
+ WebInspector.domAgent.requestDocument();
+ return;
+ }
+
+ this._updateModifiedNodes();
+ },
+
+ addEventListener: function(eventType, listener, thisObject)
+ {
+ this._eventSupport.addEventListener(eventType, listener, thisObject);
+ },
+
+ removeEventListener: function(eventType, listener, thisObject)
+ {
+ this._eventSupport.removeEventListener(eventType, listener, thisObject);
+ },
+
get rootDOMNode()
{
return this._rootDOMNode;
@@ -94,10 +140,10 @@
// The _revealAndSelectNode() method might find a different element if there is inlined text,
// and the select() call would change the selectedDOMNode and reenter this setter. So to
- // avoid calling selectedNodeChanged() twice, first check if _selectedDOMNode is the same
+ // avoid calling _selectedNodeChanged() twice, first check if _selectedDOMNode is the same
// node as the one passed in.
if (this._selectedDOMNode === node)
- this.selectedNodeChanged();
+ this._selectedNodeChanged();
},
get editing()
@@ -115,16 +161,16 @@
return;
var treeElement;
- if (this.includeRootDOMNode) {
+ if (this._includeRootDOMNode) {
treeElement = new WebInspector.ElementsTreeElement(this.rootDOMNode);
- treeElement.selectable = this.selectEnabled;
+ treeElement.selectable = this._selectEnabled;
this.appendChild(treeElement);
} else {
// FIXME: this could use findTreeElement to reuse a tree element if it already exists
var node = this.rootDOMNode.firstChild;
while (node) {
treeElement = new WebInspector.ElementsTreeElement(node);
- treeElement.selectable = this.selectEnabled;
+ treeElement.selectable = this._selectEnabled;
this.appendChild(treeElement);
node = node.nextSibling;
}
@@ -142,7 +188,10 @@
element.updateSelection();
},
- selectedNodeChanged: function(forceUpdate) {},
+ _selectedNodeChanged: function()
+ {
+ this._eventSupport.dispatchEventToListeners(WebInspector.ElementsTreeOutline.Events.SelectedNodeChanged);
+ },
findTreeElement: function(node)
{
@@ -150,6 +199,12 @@
{
return ancestor.isAncestor(node);
}
+
+ function parentNode(node)
+ {
+ return node.parentNode;
+ }
+
var treeElement = TreeOutline.prototype.findTreeElement.call(this, node, isAncestorNode, parentNode);
if (!treeElement && node.nodeType() === Node.TEXT_NODE) {
// The text node might have been inlined if it was short, so try to find the parent element.
@@ -167,7 +222,7 @@
if (!node.parentNode)
return null;
- var treeElement = this.createTreeElementFor(node.parentNode);
+ treeElement = this.createTreeElementFor(node.parentNode);
if (treeElement && treeElement.showChild(node.index))
return treeElement.children[node.index];
@@ -355,7 +410,7 @@
if (error)
return;
- WebInspector.panels.elements.updateModifiedNodes();
+ this._updateModifiedNodes();
var newNode = WebInspector.domAgent.nodeForId(newNodeId);
if (newNode)
this.selectDOMNode(newNode, true);
@@ -384,7 +439,7 @@
_contextMenuEventFired: function(event)
{
- if (!this.showInElementsPanelEnabled)
+ if (!this._showInElementsPanelEnabled)
return;
var treeElement = this._treeElementFromEvent(event);
@@ -426,11 +481,22 @@
adjustCollapsedRange: function()
{
+ },
+
+ _updateModifiedNodes: function()
+ {
+ if (this._elementsTreeUpdater)
+ this._elementsTreeUpdater._updateModifiedNodes();
}
}
WebInspector.ElementsTreeOutline.prototype.__proto__ = TreeOutline.prototype;
+/**
+ * @constructor
+ * @extends {TreeElement}
+ * @param {boolean=} elementCloseTag
+ */
WebInspector.ElementsTreeElement = function(node, elementCloseTag)
{
this._elementCloseTag = elementCloseTag;
@@ -679,7 +745,7 @@
insertChildElement: function(child, index, closingTag)
{
var newElement = new WebInspector.ElementsTreeElement(child, closingTag);
- newElement.selectable = this.treeOutline.selectEnabled;
+ newElement.selectable = this.treeOutline._selectEnabled;
this.insertChild(newElement, index);
return newElement;
},
@@ -889,9 +955,9 @@
if (this._editing)
return;
- if (this.treeOutline.showInElementsPanelEnabled) {
+ if (this.treeOutline._showInElementsPanelEnabled) {
WebInspector.showPanel("elements");
- WebInspector.panels.elements.selectDOMNode(this.representedObject, true);
+ this.treeOutline.selectDOMNode(this.representedObject, true);
}
// Prevent selecting the nearest word on double click.
@@ -1168,7 +1234,7 @@
function dispose()
{
- delete this._editing;
+ this._editing = false;
// Remove editor.
this.listItemElement.removeChild(this._htmlEditElement);
@@ -1196,8 +1262,9 @@
_attributeEditingCommitted: function(element, newText, oldText, attributeName, moveDirection)
{
- delete this._editing;
+ this._editing = false;
+ var treeOutline = this.treeOutline;
function moveToNextAttributeIfNeeded(error)
{
if (error)
@@ -1206,7 +1273,7 @@
if (!moveDirection)
return;
- WebInspector.panels.elements.updateModifiedNodes();
+ treeOutline._updateModifiedNodes();
// Search for the attribute's position, and then decide where to move to.
var attributes = this.representedObject.attributes();
@@ -1252,7 +1319,7 @@
_tagNameEditingCommitted: function(element, newText, oldText, tagName, moveDirection)
{
- delete this._editing;
+ this._editing = false;
var self = this;
function cancel()
@@ -1296,7 +1363,7 @@
}
// Select it and expand if necessary. We force tree update so that it processes dom events and is up to date.
- WebInspector.panels.elements.updateModifiedNodes();
+ treeOutline._updateModifiedNodes();
WebInspector.updateFocusedNode(nodeId);
var newTreeItem = treeOutline.findTreeElement(WebInspector.domAgent.nodeForId(nodeId));
@@ -1311,7 +1378,7 @@
_textNodeEditingCommitted: function(element, newText)
{
- delete this._editing;
+ this._editing = false;
var textNode;
if (this.representedObject.nodeType() === Node.ELEMENT_NODE) {
@@ -1326,7 +1393,7 @@
_editingCancelled: function(element, context)
{
- delete this._editing;
+ this._editing = false;
// Need to restore attributes structure.
this.updateTitle();
@@ -1580,7 +1647,7 @@
return;
// Select it and expand if necessary. We force tree update so that it processes dom events and is up to date.
- WebInspector.panels.elements.updateModifiedNodes();
+ treeOutline._updateModifiedNodes();
WebInspector.updateFocusedNode(nodeId);
if (wasExpanded) {
@@ -1633,3 +1700,128 @@
}
WebInspector.ElementsTreeElement.prototype.__proto__ = TreeElement.prototype;
+
+/**
+ * @constructor
+ */
+WebInspector.ElementsTreeUpdater = function(treeOutline)
+{
+ WebInspector.domAgent.addEventListener(WebInspector.DOMAgent.Events.NodeInserted, this._nodeInserted, this);
+ WebInspector.domAgent.addEventListener(WebInspector.DOMAgent.Events.NodeRemoved, this._nodeRemoved, this);
+ WebInspector.domAgent.addEventListener(WebInspector.DOMAgent.Events.AttrModified, this._attributesUpdated, this);
+ WebInspector.domAgent.addEventListener(WebInspector.DOMAgent.Events.AttrRemoved, this._attributesUpdated, this);
+ WebInspector.domAgent.addEventListener(WebInspector.DOMAgent.Events.CharacterDataModified, this._characterDataModified, this);
+ WebInspector.domAgent.addEventListener(WebInspector.DOMAgent.Events.DocumentUpdated, this._documentUpdated, this);
+ WebInspector.domAgent.addEventListener(WebInspector.DOMAgent.Events.ChildNodeCountUpdated, this._childNodeCountUpdated, this);
+ WebInspector.domAgent.addEventListener(WebInspector.DOMAgent.Events.InspectElementRequested, this._inspectElementRequested, this);
+
+ this._treeOutline = treeOutline;
+ this._recentlyModifiedNodes = [];
+}
+
+WebInspector.ElementsTreeUpdater.prototype = {
+ _documentUpdated: function(event)
+ {
+ var inspectedRootDocument = event.data;
+
+ this._reset();
+
+ if (!inspectedRootDocument)
+ return;
+
+ this._treeOutline.rootDOMNode = inspectedRootDocument;
+ },
+
+ _attributesUpdated: function(event)
+ {
+ this._recentlyModifiedNodes.push({node: event.data.node, updated: true});
+ if (this._treeOutline._visible)
+ this._updateModifiedNodesSoon();
+ },
+
+ _characterDataModified: function(event)
+ {
+ this._recentlyModifiedNodes.push({node: event.data, updated: true});
+ if (this._treeOutline._visible)
+ this._updateModifiedNodesSoon();
+ },
+
+ _nodeInserted: function(event)
+ {
+ this._recentlyModifiedNodes.push({node: event.data, parent: event.data.parentNode, inserted: true});
+ if (this._treeOutline._visible)
+ this._updateModifiedNodesSoon();
+ },
+
+ _nodeRemoved: function(event)
+ {
+ this._recentlyModifiedNodes.push({node: event.data.node, parent: event.data.parent, removed: true});
+ if (this._treeOutline._visible)
+ this._updateModifiedNodesSoon();
+ },
+
+ _childNodeCountUpdated: function(event)
+ {
+ var treeElement = this._treeOutline.findTreeElement(event.data);
+ if (treeElement)
+ treeElement.hasChildren = event.data.hasChildNodes();
+ },
+
+ _inspectElementRequested: function(event)
+ {
+ var node = event.data;
+ WebInspector.updateFocusedNode(node.id);
+ },
+
+ _updateModifiedNodesSoon: function()
+ {
+ if (this._updateModifiedNodesTimeout)
+ return;
+ this._updateModifiedNodesTimeout = setTimeout(this._updateModifiedNodes.bind(this), 0);
+ },
+
+ _updateModifiedNodes: function()
+ {
+ if (this._updateModifiedNodesTimeout) {
+ clearTimeout(this._updateModifiedNodesTimeout);
+ delete this._updateModifiedNodesTimeout;
+ }
+
+ var updatedParentTreeElements = [];
+
+ for (var i = 0; i < this._recentlyModifiedNodes.length; ++i) {
+ var parent = this._recentlyModifiedNodes[i].parent;
+ var node = this._recentlyModifiedNodes[i].node;
+
+ if (this._recentlyModifiedNodes[i].updated) {
+ var nodeItem = this._treeOutline.findTreeElement(node);
+ if (nodeItem)
+ nodeItem.updateTitle();
+ continue;
+ }
+
+ if (!parent)
+ continue;
+
+ var parentNodeItem = this._treeOutline.findTreeElement(parent);
+ if (parentNodeItem && !parentNodeItem.alreadyUpdatedChildren) {
+ parentNodeItem.updateChildren();
+ parentNodeItem.alreadyUpdatedChildren = true;
+ updatedParentTreeElements.push(parentNodeItem);
+ }
+ }
+
+ for (var i = 0; i < updatedParentTreeElements.length; ++i)
+ delete updatedParentTreeElements[i].alreadyUpdatedChildren;
+
+ this._recentlyModifiedNodes = [];
+ },
+
+ _reset: function()
+ {
+ this._treeOutline.rootDOMNode = null;
+ this._treeOutline.selectDOMNode(null, false);
+ WebInspector.highlightDOMNode(0);
+ this._recentlyModifiedNodes = [];
+ }
+}
Modified: trunk/Source/WebCore/inspector/front-end/externs.js (96710 => 96711)
--- trunk/Source/WebCore/inspector/front-end/externs.js 2011-10-05 16:10:31 UTC (rev 96710)
+++ trunk/Source/WebCore/inspector/front-end/externs.js 2011-10-05 16:14:25 UTC (rev 96711)
@@ -108,10 +108,12 @@
/**
* @constructor
* @extends {TreeOutline}
+ * @param {boolean=} omitRootDOMNode
+ * @param {boolean=} selectEnabled
+ * @param {boolean=} showInElementsPanelEnabled
*/
-WebInspector.ElementsTreeOutline = function()
+WebInspector.ElementsTreeOutline = function(omitRootDOMNode, selectEnabled, showInElementsPanelEnabled)
{
- this.element = null;
}
/**
Modified: trunk/Source/WebCore/inspector/front-end/utilities.js (96710 => 96711)
--- trunk/Source/WebCore/inspector/front-end/utilities.js 2011-10-05 16:10:31 UTC (rev 96710)
+++ trunk/Source/WebCore/inspector/front-end/utilities.js 2011-10-05 16:14:25 UTC (rev 96711)
@@ -524,11 +524,6 @@
return this.parentNode;
}
-window.parentNode = function(node)
-{
- return node.parentNode;
-}
-
Number.constrain = function(num, min, max)
{
if (num < min)
