https://bugs.webkit.org/show_bug.cgi?id=148067
Reviewed by Timothy Hatcher.
TreeOutline now dispatches most events via WebInspector.Object. The onselect and
ondeselect callbacks are replaced by a SelectionDidChange event, which includes
both the selected and deselected elements in its event data. The onexpand and oncollapse
callbacks are replaced by an ElementDisclosureDidChange event. This is consistent with the
behavior of onhidden, which had no corresponding onvisible callback.
Alas, TimelineView and TreeOutlineDataGridSynchronizer depended on the order in which
TreeOutline.onselect callbacks were chained together. The synchronizer added its
callback after the timeline view, which ensured that the tree and grid were in sync
before the view handled onselect and dispatched a SelectionPathComponentsDidChange.
The change notification causes the view's path components to be read, and timeline
views need the grid selection to be in a valid state to build path components.
This is addressed by having timeline views dispatch SelectionPathComponentsDidChange
events when the grid selection changes, instead of the tree selection. The change
required that the synchronizer no longer suppress notifications when selecting grid nodes.
* UserInterface/Views/DebuggerSidebarPanel.js:
(WebInspector.DebuggerSidebarPanel):
(WebInspector.DebuggerSidebarPanel.prototype._treeSelectionDidChange):
(WebInspector.DebuggerSidebarPanel.prototype._updatePauseReasonSection):
* UserInterface/Views/NavigationSidebarPanel.js:
(WebInspector.NavigationSidebarPanel.prototype.createContentTreeOutline):
(WebInspector.NavigationSidebarPanel.prototype._treeElementAddedOrChanged):
* UserInterface/Views/NetworkGridContentView.js:
(WebInspector.NetworkGridContentView):
(WebInspector.NetworkGridContentView.prototype._treeSelectionDidChange):
* UserInterface/Views/ResourceSidebarPanel.js:
(WebInspector.ResourceSidebarPanel):
(WebInspector.ResourceSidebarPanel.prototype._treeSelectionDidChange):
(WebInspector.ResourceSidebarPanel.prototype._treeElementSelected): Deleted.
* UserInterface/Views/ScopeChainDetailsSidebarPanel.js:
(WebInspector.ScopeChainDetailsSidebarPanel.prototype._generateCallFramesSection):
(WebInspector.ScopeChainDetailsSidebarPanel.prototype._generateWatchExpressionsSection):
(WebInspector.ScopeChainDetailsSidebarPanel.prototype._treeElementAdded):
(WebInspector.ScopeChainDetailsSidebarPanel.prototype._treeElementDisclosureDidChange):
(WebInspector.ScopeChainDetailsSidebarPanel.prototype._objectTreeExpandHandler): Deleted.
(WebInspector.ScopeChainDetailsSidebarPanel.prototype._objectTreeCollapseHandler): Deleted.
* UserInterface/Views/SearchSidebarPanel.js:
(WebInspector.SearchSidebarPanel):
(WebInspector.SearchSidebarPanel.prototype._treeSelectionDidChange):
(WebInspector.SearchSidebarPanel.prototype._treeElementSelected): Deleted.
* UserInterface/Views/StorageSidebarPanel.js:
(WebInspector.StorageSidebarPanel):
(WebInspector.StorageSidebarPanel._treeSelectionDidChange):
* UserInterface/Views/TimelineDataGrid.js:
(WebInspector.TimelineDataGrid.prototype._createPopoverContent):
(WebInspector.TimelineDataGrid.prototype._popoverCallStackTreeSelectionDidChange):
(WebInspector.TimelineDataGrid):
* UserInterface/Views/TimelineSidebarPanel.js:
(WebInspector.TimelineSidebarPanel):
(WebInspector.TimelineSidebarPanel.prototype._recordingsTreeSelectionDidChange):
(WebInspector.TimelineSidebarPanel.prototype._timelinesTreeSelectionDidChange):
(WebInspector.TimelineSidebarPanel.prototype._timelinesTreeElementSelected): Deleted.
* UserInterface/Views/TimelineView.js:
(WebInspector.TimelineView):
(WebInspector.TimelineView.prototype._treeSelectionDidChange):
(WebInspector.TimelineView.prototype.treeElementSelected):
Don't dispatch SelectionPathComponentsDidChange. Timeline views already do this
in response to grid selection events.
* UserInterface/Views/TreeOutline.js:
(WebInspector.TreeOutline.prototype.appendChild):
(WebInspector.TreeOutline.prototype.insertChild):
(WebInspector.TreeOutline.prototype.removeChildAtIndex):
(WebInspector.TreeOutline.prototype.removeChildren):
(WebInspector.TreeOutline.prototype.removeChildrenRecursive):
(WebInspector.TreeOutline.prototype._treeElementDidChange):
(WebInspector.TreeElement.prototype.set hidden):
(WebInspector.TreeElement.prototype.collapse):
(WebInspector.TreeElement.prototype.expand):
(WebInspector.TreeElement.prototype.select):
(WebInspector.TreeElement.prototype.deselect):
(WebInspector.TreeElement.prototype.get childrenListElement): Deleted.
Removed dead code.
* UserInterface/Views/TreeOutlineDataGridSynchronizer.js:
(WebInspector.TreeOutlineDataGridSynchronizer):
(WebInspector.TreeOutlineDataGridSynchronizer.prototype._treeSelectionDidChange):
(WebInspector.TreeOutlineDataGridSynchronizer.prototype._treeElementAdded):
(WebInspector.TreeOutlineDataGridSynchronizer.prototype._treeElementRemoved):
(WebInspector.TreeOutlineDataGridSynchronizer.prototype._treeElementDisclosureDidChange):
(WebInspector.TreeOutlineDataGridSynchronizer.prototype._treeElementVisibilityDidChange):
(WebInspector.TreeOutlineDataGridSynchronizer.treeOutline.onadd): Deleted.
(WebInspector.TreeOutlineDataGridSynchronizer.treeOutline.onremove): Deleted.
(WebInspector.TreeOutlineDataGridSynchronizer.treeOutline.onexpand): Deleted.
(WebInspector.TreeOutlineDataGridSynchronizer.treeOutline.oncollapse): Deleted.
(WebInspector.TreeOutlineDataGridSynchronizer.treeOutline.onhidden): Deleted.
(WebInspector.TreeOutlineDataGridSynchronizer.treeOutline.onselect): Deleted.
(WebInspector.TreeOutlineDataGridSynchronizer.prototype._treeElementSelected): Deleted.
(WebInspector.TreeOutlineDataGridSynchronizer.prototype._treeElementExpanded): Deleted.
(WebInspector.TreeOutlineDataGridSynchronizer.prototype._treeElementCollapsed): Deleted.
(WebInspector.TreeOutlineDataGridSynchronizer.prototype._treeElementHiddenChanged): Deleted.
* UserInterface/Views/VisualStyleCommaSeparatedKeywordEditor.js:
(WebInspector.VisualStyleCommaSeparatedKeywordEditor):
(WebInspector.VisualStyleCommaSeparatedKeywordEditor.prototype._treeSelectionDidChange):
(WebInspector.VisualStyleCommaSeparatedKeywordEditor.prototype._treeElementSelected): Deleted.
git-svn-id: https://svn.webkit.org/repository/webkit/trunk@192936
268f45cc-cd09-0410-ab3c-
d52691b4dbfc
+2015-12-01 Matt Baker <mattbaker@apple.com>
+
+ Web Inspector: TreeOutline should just dispatch events via WebInspector.Object
+ https://bugs.webkit.org/show_bug.cgi?id=148067
+
+ Reviewed by Timothy Hatcher.
+
+ TreeOutline now dispatches most events via WebInspector.Object. The onselect and
+ ondeselect callbacks are replaced by a SelectionDidChange event, which includes
+ both the selected and deselected elements in its event data. The onexpand and oncollapse
+ callbacks are replaced by an ElementDisclosureDidChange event. This is consistent with the
+ behavior of onhidden, which had no corresponding onvisible callback.
+
+ Alas, TimelineView and TreeOutlineDataGridSynchronizer depended on the order in which
+ TreeOutline.onselect callbacks were chained together. The synchronizer added its
+ callback after the timeline view, which ensured that the tree and grid were in sync
+ before the view handled onselect and dispatched a SelectionPathComponentsDidChange.
+ The change notification causes the view's path components to be read, and timeline
+ views need the grid selection to be in a valid state to build path components.
+
+ This is addressed by having timeline views dispatch SelectionPathComponentsDidChange
+ events when the grid selection changes, instead of the tree selection. The change
+ required that the synchronizer no longer suppress notifications when selecting grid nodes.
+
+ * UserInterface/Views/DebuggerSidebarPanel.js:
+ (WebInspector.DebuggerSidebarPanel):
+ (WebInspector.DebuggerSidebarPanel.prototype._treeSelectionDidChange):
+ (WebInspector.DebuggerSidebarPanel.prototype._updatePauseReasonSection):
+
+ * UserInterface/Views/NavigationSidebarPanel.js:
+ (WebInspector.NavigationSidebarPanel.prototype.createContentTreeOutline):
+ (WebInspector.NavigationSidebarPanel.prototype._treeElementAddedOrChanged):
+
+ * UserInterface/Views/NetworkGridContentView.js:
+ (WebInspector.NetworkGridContentView):
+ (WebInspector.NetworkGridContentView.prototype._treeSelectionDidChange):
+
+ * UserInterface/Views/ResourceSidebarPanel.js:
+ (WebInspector.ResourceSidebarPanel):
+ (WebInspector.ResourceSidebarPanel.prototype._treeSelectionDidChange):
+ (WebInspector.ResourceSidebarPanel.prototype._treeElementSelected): Deleted.
+
+ * UserInterface/Views/ScopeChainDetailsSidebarPanel.js:
+ (WebInspector.ScopeChainDetailsSidebarPanel.prototype._generateCallFramesSection):
+ (WebInspector.ScopeChainDetailsSidebarPanel.prototype._generateWatchExpressionsSection):
+ (WebInspector.ScopeChainDetailsSidebarPanel.prototype._treeElementAdded):
+ (WebInspector.ScopeChainDetailsSidebarPanel.prototype._treeElementDisclosureDidChange):
+ (WebInspector.ScopeChainDetailsSidebarPanel.prototype._objectTreeExpandHandler): Deleted.
+ (WebInspector.ScopeChainDetailsSidebarPanel.prototype._objectTreeCollapseHandler): Deleted.
+
+ * UserInterface/Views/SearchSidebarPanel.js:
+ (WebInspector.SearchSidebarPanel):
+ (WebInspector.SearchSidebarPanel.prototype._treeSelectionDidChange):
+ (WebInspector.SearchSidebarPanel.prototype._treeElementSelected): Deleted.
+
+ * UserInterface/Views/StorageSidebarPanel.js:
+ (WebInspector.StorageSidebarPanel):
+ (WebInspector.StorageSidebarPanel._treeSelectionDidChange):
+
+ * UserInterface/Views/TimelineDataGrid.js:
+ (WebInspector.TimelineDataGrid.prototype._createPopoverContent):
+ (WebInspector.TimelineDataGrid.prototype._popoverCallStackTreeSelectionDidChange):
+ (WebInspector.TimelineDataGrid):
+
+ * UserInterface/Views/TimelineSidebarPanel.js:
+ (WebInspector.TimelineSidebarPanel):
+ (WebInspector.TimelineSidebarPanel.prototype._recordingsTreeSelectionDidChange):
+ (WebInspector.TimelineSidebarPanel.prototype._timelinesTreeSelectionDidChange):
+ (WebInspector.TimelineSidebarPanel.prototype._timelinesTreeElementSelected): Deleted.
+
+ * UserInterface/Views/TimelineView.js:
+ (WebInspector.TimelineView):
+ (WebInspector.TimelineView.prototype._treeSelectionDidChange):
+ (WebInspector.TimelineView.prototype.treeElementSelected):
+ Don't dispatch SelectionPathComponentsDidChange. Timeline views already do this
+ in response to grid selection events.
+
+ * UserInterface/Views/TreeOutline.js:
+ (WebInspector.TreeOutline.prototype.appendChild):
+ (WebInspector.TreeOutline.prototype.insertChild):
+ (WebInspector.TreeOutline.prototype.removeChildAtIndex):
+ (WebInspector.TreeOutline.prototype.removeChildren):
+ (WebInspector.TreeOutline.prototype.removeChildrenRecursive):
+ (WebInspector.TreeOutline.prototype._treeElementDidChange):
+ (WebInspector.TreeElement.prototype.set hidden):
+ (WebInspector.TreeElement.prototype.collapse):
+ (WebInspector.TreeElement.prototype.expand):
+ (WebInspector.TreeElement.prototype.select):
+ (WebInspector.TreeElement.prototype.deselect):
+ (WebInspector.TreeElement.prototype.get childrenListElement): Deleted.
+ Removed dead code.
+
+ * UserInterface/Views/TreeOutlineDataGridSynchronizer.js:
+ (WebInspector.TreeOutlineDataGridSynchronizer):
+ (WebInspector.TreeOutlineDataGridSynchronizer.prototype._treeSelectionDidChange):
+ (WebInspector.TreeOutlineDataGridSynchronizer.prototype._treeElementAdded):
+ (WebInspector.TreeOutlineDataGridSynchronizer.prototype._treeElementRemoved):
+ (WebInspector.TreeOutlineDataGridSynchronizer.prototype._treeElementDisclosureDidChange):
+ (WebInspector.TreeOutlineDataGridSynchronizer.prototype._treeElementVisibilityDidChange):
+ (WebInspector.TreeOutlineDataGridSynchronizer.treeOutline.onadd): Deleted.
+ (WebInspector.TreeOutlineDataGridSynchronizer.treeOutline.onremove): Deleted.
+ (WebInspector.TreeOutlineDataGridSynchronizer.treeOutline.onexpand): Deleted.
+ (WebInspector.TreeOutlineDataGridSynchronizer.treeOutline.oncollapse): Deleted.
+ (WebInspector.TreeOutlineDataGridSynchronizer.treeOutline.onhidden): Deleted.
+ (WebInspector.TreeOutlineDataGridSynchronizer.treeOutline.onselect): Deleted.
+ (WebInspector.TreeOutlineDataGridSynchronizer.prototype._treeElementSelected): Deleted.
+ (WebInspector.TreeOutlineDataGridSynchronizer.prototype._treeElementExpanded): Deleted.
+ (WebInspector.TreeOutlineDataGridSynchronizer.prototype._treeElementCollapsed): Deleted.
+ (WebInspector.TreeOutlineDataGridSynchronizer.prototype._treeElementHiddenChanged): Deleted.
+
+ * UserInterface/Views/VisualStyleCommaSeparatedKeywordEditor.js:
+ (WebInspector.VisualStyleCommaSeparatedKeywordEditor):
+ (WebInspector.VisualStyleCommaSeparatedKeywordEditor.prototype._treeSelectionDidChange):
+ (WebInspector.VisualStyleCommaSeparatedKeywordEditor.prototype._treeElementSelected): Deleted.
+
2015-12-01 Joseph Pecoraro <pecoraro@apple.com>
Web Inspector: Timestamp in Tooltip of Event Markers is incorrect
this.filterBar.addFilterBarButton("debugger-show-resources-with-issues-only", showResourcesWithIssuesOnlyFilterFunction, true, WebInspector.UIString("Show only resources with issues."), WebInspector.UIString("Show resources with and without issues."), "Images/Errors.svg", 15, 15);
this._breakpointsContentTreeOutline = this.contentTreeOutline;
- this._breakpointsContentTreeOutline.onselect = this._treeElementSelected.bind(this);
+ this._breakpointsContentTreeOutline.addEventListener(WebInspector.TreeOutline.Event.SelectionDidChange, this._treeSelectionDidChange, this);
this._breakpointsContentTreeOutline.ondelete = this._breakpointTreeOutlineDeleteTreeElement.bind(this);
this._breakpointsContentTreeOutline.oncontextmenu = this._breakpointTreeOutlineContextMenuTreeElement.bind(this);
this.contentElement.appendChild(breakpointsSection.element);
this._callStackContentTreeOutline = this.createContentTreeOutline(true, true);
- this._callStackContentTreeOutline.onselect = this._treeElementSelected.bind(this);
+ this._callStackContentTreeOutline.addEventListener(WebInspector.TreeOutline.Event.SelectionDidChange, this._treeSelectionDidChange, this);
this._callStackRow = new WebInspector.DetailsSectionRow(WebInspector.UIString("No Call Frames"));
this._callStackRow.showEmptyMessage();
contextMenu.appendItem(WebInspector.UIString("Delete Breakpoints"), removeAllResourceBreakpoints);
}
- _treeElementSelected(treeElement, selectedByUser)
+ _treeSelectionDidChange(event)
{
function deselectCallStackContentTreeElements()
{
selectedTreeElement.deselect();
}
+ let treeElement = event.data.selectedElement;
+ if (!treeElement)
+ return;
+
if (treeElement instanceof WebInspector.ResourceTreeElement || treeElement instanceof WebInspector.ScriptTreeElement) {
deselectCallStackContentTreeElements.call(this);
deselectPauseReasonContentTreeElements.call(this);
if (pauseData && pauseData.breakpointId) {
var breakpoint = WebInspector.debuggerManager.breakpointForIdentifier(pauseData.breakpointId);
var breakpointTreeOutline = this.createContentTreeOutline(true, true);
- breakpointTreeOutline.onselect = this._treeElementSelected.bind(this);
+ breakpointTreeOutline.addEventListener(WebInspector.TreeOutline.Event.SelectionDidChange, this._treeSelectionDidChange, this);
+
var breakpointTreeElement = new WebInspector.BreakpointTreeElement(breakpoint, WebInspector.DebuggerSidebarPanel.PausedBreakpointIconStyleClassName, WebInspector.UIString("Triggered Breakpoint"));
var breakpointDetailsSection = new WebInspector.DetailsSectionRow;
breakpointTreeOutline.appendChild(breakpointTreeElement);
contentTreeOutline.allowsRepeatSelection = true;
if (!suppressFiltering) {
- contentTreeOutline.onadd = this._treeElementAddedOrChanged.bind(this);
- contentTreeOutline.onchange = this._treeElementAddedOrChanged.bind(this);
- contentTreeOutline.onexpand = this._treeElementExpandedOrCollapsed.bind(this);
- contentTreeOutline.oncollapse = this._treeElementExpandedOrCollapsed.bind(this);
+ contentTreeOutline.addEventListener(WebInspector.TreeOutline.Event.ElementAdded, this._treeElementAddedOrChanged, this);
+ contentTreeOutline.addEventListener(WebInspector.TreeOutline.Event.ElementDidChange, this._treeElementAddedOrChanged, this);
+ contentTreeOutline.addEventListener(WebInspector.TreeOutline.Event.ElementDisclosureDidChanged, this._treeElementDisclosureDidChange, this);
}
if (dontHideByDefault)
}
}
- _treeElementAddedOrChanged(treeElement)
+ _treeElementAddedOrChanged(event)
{
// Don't populate if we don't have any active filters.
// We only need to populate when a filter needs to reveal.
var dontPopulate = !this._filterBar.hasActiveFilters() && !this.shouldFilterPopulate();
// Apply the filters to the tree element and its descendants.
- var currentTreeElement = treeElement;
+ let treeElement = event.data.element;
+ let currentTreeElement = treeElement;
while (currentTreeElement && !currentTreeElement.root) {
const currentTreeElementWasHidden = currentTreeElement.hidden;
this.applyFiltersToTreeElement(currentTreeElement);
this.treeElementAddedOrChanged(treeElement);
}
- _treeElementExpandedOrCollapsed(treeElement)
+ _treeElementDisclosureDidChange(event)
{
this._updateContentOverflowShadowVisibility();
}
this._networkSidebarPanel = extraArguments.networkSidebarPanel;
this._contentTreeOutline = this._networkSidebarPanel.contentTreeOutline;
- this._contentTreeOutline.onselect = this._treeElementSelected.bind(this);
+ this._contentTreeOutline.addEventListener(WebInspector.TreeOutline.Event.SelectionDidChange, this._treeSelectionDidChange, this);
var columns = {domain: {}, type: {}, method: {}, scheme: {}, statusCode: {}, cached: {}, size: {}, transferSize: {}, requestSent: {}, latency: {}, duration: {}};
dataGridNode.revealAndSelect();
}
- _treeElementSelected(treeElement, selectedByUser)
+ _treeSelectionDidChange(event)
{
this.dispatchEventToListeners(WebInspector.ContentView.Event.SelectionPathComponentsDidChange);
if (!this._networkSidebarPanel.canShowDifferentContentView())
return;
+ let treeElement = event.data.selectedElement;
if (treeElement instanceof WebInspector.ResourceTreeElement) {
WebInspector.showRepresentedObject(treeElement.representedObject);
return;
WebInspector.notifications.addEventListener(WebInspector.Notification.ExtraDomainsActivated, this._extraDomainsActivated, this);
- this.contentTreeOutline.onselect = this._treeElementSelected.bind(this);
+ this.contentTreeOutline.addEventListener(WebInspector.TreeOutline.Event.SelectionDidChange, this._treeSelectionDidChange, this);
this.contentTreeOutline.includeSourceMapResourceChildren = true;
if (WebInspector.debuggableType === WebInspector.DebuggableType.JavaScript)
}
}
- _treeElementSelected(treeElement, selectedByUser)
+ _treeSelectionDidChange(event)
{
- if (treeElement instanceof WebInspector.FolderTreeElement)
+ let treeElement = event.data.selectedElement;
+ if (!treeElement || treeElement instanceof WebInspector.FolderTreeElement)
return;
if (treeElement instanceof WebInspector.ResourceTreeElement
objectTree.appendExtraPropertyDescriptor(extraPropertyDescriptor);
let treeOutline = objectTree.treeOutline;
- treeOutline.onadd = this._objectTreeAddHandler.bind(this, detailsSectionIdentifier);
- treeOutline.onexpand = this._objectTreeExpandHandler.bind(this, detailsSectionIdentifier);
- treeOutline.oncollapse = this._objectTreeCollapseHandler.bind(this, detailsSectionIdentifier);
+ treeOutline.addEventListener(WebInspector.TreeOutline.Event.ElementAdded, this._treeElementAdded.bind(this, detailsSectionIdentifier), this);
+ treeOutline.addEventListener(WebInspector.TreeOutline.Event.ElementDisclosureDidChanged, this._treeElementDisclosureDidChange.bind(this, detailsSectionIdentifier), this);
let detailsSection = new WebInspector.DetailsSection(detailsSectionIdentifier, title, null, null, collapsedByDefault);
detailsSection.groups[0].rows = [new WebInspector.DetailsSectionPropertiesRow(objectTree)];
let treeOutline = objectTree.treeOutline;
const watchExpressionSectionIdentifier = "watch-expressions";
- treeOutline.onadd = this._objectTreeAddHandler.bind(this, watchExpressionSectionIdentifier);
- treeOutline.onexpand = this._objectTreeExpandHandler.bind(this, watchExpressionSectionIdentifier);
- treeOutline.oncollapse = this._objectTreeCollapseHandler.bind(this, watchExpressionSectionIdentifier);
+ treeOutline.addEventListener(WebInspector.TreeOutline.Event.ElementAdded, this._treeElementAdded.bind(this, watchExpressionSectionIdentifier), this);
+ treeOutline.addEventListener(WebInspector.TreeOutline.Event.ElementDisclosureDidChanged, this._treeElementDisclosureDidChange.bind(this, watchExpressionSectionIdentifier), this);
treeOutline.objectTreeElementAddContextMenuItems = this._objectTreeElementAddContextMenuItems.bind(this);
let promises = [];
return identifier + "-" + propertyPath.fullPath;
}
- _objectTreeAddHandler(identifier, treeElement)
+ _treeElementAdded(identifier, event)
{
+ let treeElement = event.data.element;
let propertyPathIdentifier = this._propertyPathIdentifierForTreeElement(identifier, treeElement);
if (!propertyPathIdentifier)
return;
treeElement.expand();
}
- _objectTreeExpandHandler(identifier, treeElement)
+ _treeElementDisclosureDidChange(identifier, event)
{
+ let treeElement = event.data.element;
let propertyPathIdentifier = this._propertyPathIdentifierForTreeElement(identifier, treeElement);
if (!propertyPathIdentifier)
return;
- WebInspector.ScopeChainDetailsSidebarPanel._autoExpandProperties.add(propertyPathIdentifier);
- }
-
- _objectTreeCollapseHandler(identifier, treeElement)
- {
- let propertyPathIdentifier = this._propertyPathIdentifierForTreeElement(identifier, treeElement);
- if (!propertyPathIdentifier)
- return;
-
- WebInspector.ScopeChainDetailsSidebarPanel._autoExpandProperties.delete(propertyPathIdentifier);
+ if (treeElement.expanded)
+ WebInspector.ScopeChainDetailsSidebarPanel._autoExpandProperties.add(propertyPathIdentifier);
+ else
+ WebInspector.ScopeChainDetailsSidebarPanel._autoExpandProperties.delete(propertyPathIdentifier);
}
_updateWatchExpressionsNavigationBar()
WebInspector.Frame.addEventListener(WebInspector.Frame.Event.MainResourceDidChange, this._mainResourceDidChange, this);
- this.contentTreeOutline.onselect = this._treeElementSelected.bind(this);
+ this.contentTreeOutline.addEventListener(WebInspector.TreeOutline.Event.SelectionDidChange, this._treeSelectionDidChange, this);
}
// Public
this.focusSearchField();
}
- _treeElementSelected(treeElement, selectedByUser)
+ _treeSelectionDidChange(event)
{
- if (treeElement instanceof WebInspector.FolderTreeElement)
+ let treeElement = event.data.selectedElement;
+ if (!treeElement || treeElement instanceof WebInspector.FolderTreeElement)
return;
if (treeElement instanceof WebInspector.ResourceTreeElement || treeElement instanceof WebInspector.ScriptTreeElement) {
WebInspector.applicationCacheManager.addEventListener(WebInspector.ApplicationCacheManager.Event.FrameManifestAdded, this._frameManifestAdded, this);
WebInspector.applicationCacheManager.addEventListener(WebInspector.ApplicationCacheManager.Event.FrameManifestRemoved, this._frameManifestRemoved, this);
- this.contentTreeOutline.onselect = this._treeElementSelected.bind(this);
+ this.contentTreeOutline.addEventListener(WebInspector.TreeOutline.Event.SelectionDidChange, this._treeSelectionDidChange, this);
for (var domStorageObject of WebInspector.storageManager.domStorageObjects)
this._addDOMStorageObject(domStorageObject);
// Private
- _treeElementSelected(treeElement, selectedByUser)
+ _treeSelectionDidChange(event)
{
+ let treeElement = event.data.selectedElement;
+ if (!treeElement)
+ return;
+
if (treeElement instanceof WebInspector.FolderTreeElement || treeElement instanceof WebInspector.DatabaseHostTreeElement ||
treeElement instanceof WebInspector.IndexedDatabaseHostTreeElement || treeElement instanceof WebInspector.IndexedDatabaseTreeElement
|| treeElement instanceof WebInspector.ApplicationCacheManifestTreeElement)
var contentElement = document.createElement("ol");
contentElement.classList.add("timeline-data-grid-tree-outline");
this._popoverCallStackTreeOutline = new WebInspector.TreeOutline(contentElement);
- this._popoverCallStackTreeOutline.onselect = this._popoverCallStackTreeElementSelected.bind(this);
+ this._popoverCallStackTreeOutline.addEventListener(WebInspector.TreeOutline.Event.SelectionDidChange, this._popoverCallStackTreeSelectionDidChange, this);
} else
this._popoverCallStackTreeOutline.removeChildren();
return content;
}
- _popoverCallStackTreeElementSelected(treeElement, selectedByUser)
+ _popoverCallStackTreeSelectionDidChange(event)
{
+ let treeElement = event.data.selectedElement;
+ if (!treeElement)
+ return;
+
this._popover.dismiss();
console.assert(treeElement instanceof WebInspector.CallFrameTreeElement, "TreeElements in TimelineDataGrid popover should always be CallFrameTreeElements");
this._recordingsTreeOutline = this.createContentTreeOutline(true, true);
this._recordingsTreeOutline.element.classList.add(WebInspector.NavigationSidebarPanel.HideDisclosureButtonsStyleClassName);
this._recordingsTreeOutline.element.classList.add(WebInspector.NavigationSidebarPanel.ContentTreeOutlineElementHiddenStyleClassName);
- this._recordingsTreeOutline.onselect = this._recordingsTreeElementSelected.bind(this);
+ this._recordingsTreeOutline.addEventListener(WebInspector.TreeOutline.Event.SelectionDidChange, this._recordingsTreeSelectionDidChange, this);
this._timelinesContentContainerElement.appendChild(this._recordingsTreeOutline.element);
// Maintain a tree outline with tree elements for each timeline of the selected recording.
this._timelinesTreeOutline = this.createContentTreeOutline(true, true);
this._timelinesTreeOutline.element.classList.add(WebInspector.NavigationSidebarPanel.HideDisclosureButtonsStyleClassName);
- this._timelinesTreeOutline.onselect = this._timelinesTreeElementSelected.bind(this);
+ this._timelinesTreeOutline.addEventListener(WebInspector.TreeOutline.Event.SelectionDidChange, this._timelinesTreeSelectionDidChange, this);
this._timelinesContentContainerElement.appendChild(this._timelinesTreeOutline.element);
this._timelineTreeElementMap = new Map;
this.showTimelineOverview();
}
- _recordingsTreeElementSelected(treeElement, selectedByUser)
+ _recordingsTreeSelectionDidChange(event)
{
+ let treeElement = event.data.selectedElement;
+ if (!treeElement)
+ return;
+
console.assert(treeElement.representedObject instanceof WebInspector.TimelineRecording);
this._recordingSelected(treeElement.representedObject);
this._refreshFrameSelectionChart();
}
- _timelinesTreeElementSelected(treeElement, selectedByUser)
+ _timelinesTreeSelectionDidChange(event)
{
+ let treeElement = event.data.selectedElement;
+ if (!treeElement)
+ return;
+
console.assert(this._timelineTreeElementMap.get(treeElement.representedObject) === treeElement, treeElement);
// If not selected by user, then this selection merely synced the tree element with the content view's contents.
+ let selectedByUser = event.data.selectedByUser;
if (!selectedByUser) {
console.assert(this._displayedContentView.currentTimelineView.representedObject === treeElement.representedObject);
return;
}
- var timeline = treeElement.representedObject;
+ let timeline = treeElement.representedObject;
console.assert(timeline instanceof WebInspector.Timeline, timeline);
console.assert(this._displayedRecording.timelines.get(timeline.type) === timeline, timeline);
this._timelineSidebarPanel = extraArguments.timelineSidebarPanel;
this._contentTreeOutline = this._timelineSidebarPanel.createContentTreeOutline();
- this._contentTreeOutline.onselect = this.treeElementSelected.bind(this);
- this._contentTreeOutline.ondeselect = this.treeElementDeselected.bind(this);
+ this._contentTreeOutline.addEventListener(WebInspector.TreeOutline.Event.SelectionDidChange, this._treeSelectionDidChange, this);
this._contentTreeOutline.__canShowContentViewForTreeElement = this.canShowContentViewForTreeElement.bind(this);
this.element.classList.add("timeline-view");
{
// Implemented by sub-classes if needed.
- this.dispatchEventToListeners(WebInspector.ContentView.Event.SelectionPathComponentsDidChange);
-
if (!this._timelineSidebarPanel.canShowDifferentContentView())
return;
this.showContentViewForTreeElement(treeElement);
}
+
+ // Private
+
+ _treeSelectionDidChange(event)
+ {
+ if (event.data.deselectedElement)
+ this.treeElementDeselected(event.data.deselectedElement);
+
+ if (event.data.selectedElement)
+ this.treeElementSelected(event.data.selectedElement, event.data.selectedByUser);
+ }
};
if (this._childrenListNode)
child._attach();
- if (this.treeOutline.onadd)
- this.treeOutline.onadd(child);
+ if (this.treeOutline)
+ this.treeOutline.dispatchEventToListeners(WebInspector.TreeOutline.Event.ElementAdded, {element: child});
if (isFirstChild && this.expanded)
this.expand();
if (this._childrenListNode)
child._attach();
- if (this.treeOutline.onadd)
- this.treeOutline.onadd(child);
+ if (this.treeOutline)
+ this.treeOutline.dispatchEventToListeners(WebInspector.TreeOutline.Event.ElementAdded, {element: child});
if (isFirstChild && this.expanded)
this.expand();
if (childIndex < 0 || childIndex >= this.children.length)
return;
- var child = this.children[childIndex];
+ let child = this.children[childIndex];
this.children.splice(childIndex, 1);
- var parent = child.parent;
+ let parent = child.parent;
if (child.deselect(suppressOnDeselect)) {
if (child.previousSibling && !suppressSelectSibling)
child.previousSibling.select(true, false);
if (child.nextSibling)
child.nextSibling.previousSibling = child.previousSibling;
- if (child.treeOutline) {
- child.treeOutline._forgetTreeElement(child);
- child.treeOutline._forgetChildrenRecursive(child);
+ let treeOutline = child.treeOutline;
+ if (treeOutline) {
+ treeOutline._forgetTreeElement(child);
+ treeOutline._forgetChildrenRecursive(child);
}
child._detach();
child.nextSibling = null;
child.previousSibling = null;
- if (this.treeOutline && this.treeOutline.onremove)
- this.treeOutline.onremove(child);
+ if (treeOutline)
+ treeOutline.dispatchEventToListeners(WebInspector.TreeOutline.Event.ElementRemoved, {element: child});
}
removeChild(child, suppressOnDeselect, suppressSelectSibling)
removeChildren(suppressOnDeselect)
{
- var treeOutline = this.treeOutline;
-
- for (var i = 0; i < this.children.length; ++i) {
- var child = this.children[i];
+ for (let child of this.children) {
child.deselect(suppressOnDeselect);
- if (child.treeOutline) {
- child.treeOutline._forgetTreeElement(child);
- child.treeOutline._forgetChildrenRecursive(child);
+ let treeOutline = child.treeOutline;
+ if (treeOutline) {
+ treeOutline._forgetTreeElement(child);
+ treeOutline._forgetChildrenRecursive(child);
}
child._detach();
child.nextSibling = null;
child.previousSibling = null;
- if (treeOutline && treeOutline.onremove)
- treeOutline.onremove(child);
+ if (treeOutline)
+ treeOutline.dispatchEventToListeners(WebInspector.TreeOutline.Event.ElementRemoved, {element: child});
}
this.children = [];
removeChildrenRecursive(suppressOnDeselect)
{
- var childrenToRemove = this.children;
-
- var treeOutline = this.treeOutline;
-
- var child = this.children[0];
+ let childrenToRemove = this.children;
+ let child = this.children[0];
while (child) {
if (child.children.length)
childrenToRemove = childrenToRemove.concat(child.children);
child = child.traverseNextTreeElement(false, this, true);
}
- for (var i = 0; i < childrenToRemove.length; ++i) {
+ for (let child of childrenToRemove) {
child = childrenToRemove[i];
child.deselect(suppressOnDeselect);
- if (child.treeOutline)
- child.treeOutline._forgetTreeElement(child);
+ let treeOutline = child.treeOutline;
+ if (treeOutline)
+ treeOutline._forgetTreeElement(child);
child._detach();
child.children = [];
child.nextSibling = null;
child.previousSibling = null;
- if (treeOutline && treeOutline.onremove)
- treeOutline.onremove(child);
+ if (treeOutline)
+ treeOutline.dispatchEventToListeners(WebInspector.TreeOutline.Event.ElementRemoved, {element: child});
}
this.children = [];
if (treeElement.treeOutline !== this)
return;
- if (this.onchange)
- this.onchange(treeElement);
+ this.dispatchEventToListeners(WebInspector.TreeOutline.Event.ElementDidChange, {element: treeElement});
}
treeElementFromNode(node)
}
};
+WebInspector.TreeOutline.Event = {
+ ElementAdded: Symbol("element-added"),
+ ElementDidChange: Symbol("element-did-change"),
+ ElementRemoved: Symbol("element-removed"),
+ ElementDisclosureDidChanged: Symbol("element-disclosure-did-change"),
+ ElementVisibilityDidChange: Symbol("element-visbility-did-change"),
+ SelectionDidChange: Symbol("selection-did-change")
+};
+
WebInspector.TreeOutline._knownTreeElementNextIdentifier = 1;
WebInspector.TreeElement = class TreeElement extends WebInspector.Object
return this._listItemNode;
}
- get childrenListElement()
- {
- return this._childrenListNode;
- }
-
get title()
{
return this._title;
this._childrenListNode.classList.remove("hidden");
}
- if (this.treeOutline && this.treeOutline.onhidden)
- this.treeOutline.onhidden(this, x);
+ if (this.treeOutline)
+ this.treeOutline.dispatchEventToListeners(WebInspector.TreeOutline.Event.ElementVisibilityDidChange, {element: this});
}
get shouldRefreshChildren()
if (this.oncollapse)
this.oncollapse(this);
- if (this.treeOutline && this.treeOutline.oncollapse)
- this.treeOutline.oncollapse(this);
+ if (this.treeOutline)
+ this.treeOutline.dispatchEventToListeners(WebInspector.TreeOutline.Event.ElementDisclosureDidChanged, {element: this});
}
collapseRecursively()
if (this.expanded && !this._shouldRefreshChildren && this._childrenListNode)
return;
- // Set this before onpopulate. Since onpopulate can add elements and call onadd, this makes
- // sure the expanded flag is true before calling those functions. This prevents the possibility
- // of an infinite loop if onpopulate or onadd were to call expand.
+ // Set this before onpopulate. Since onpopulate can add elements and dispatch an ElementAdded event,
+ // this makes sure the expanded flag is true before calling those functions. This prevents the
+ // possibility of an infinite loop if onpopulate or an event handler were to call expand.
this.expanded = true;
if (this.treeOutline)
if (this.onexpand)
this.onexpand(this);
- if (this.treeOutline && this.treeOutline.onexpand)
- this.treeOutline.onexpand(this);
+ if (this.treeOutline)
+ this.treeOutline.dispatchEventToListeners(WebInspector.TreeOutline.Event.ElementDisclosureDidChanged, {element: this});
}
expandRecursively(maxDepth)
this.treeOutline._childrenListNode.focus();
// Focusing on another node may detach "this" from tree.
- var treeOutline = this.treeOutline;
+ let treeOutline = this.treeOutline;
if (!treeOutline)
return;
treeOutline.processingSelectionChange = true;
+ // Prevent dispatching a SelectionDidChange event for the deselected element if
+ // it will be dispatched for the selected element. The event data includes both
+ // the selected and deselected elements, so one event is.
+ if (!suppressOnSelect)
+ suppressOnDeselect = true;
+
+ let deselectedElement = treeOutline.selectedTreeElement;
if (!this.selected) {
if (treeOutline.selectedTreeElement)
treeOutline.selectedTreeElement.deselect(suppressOnDeselect);
this._listItemNode.classList.add("selected");
}
- if (this.onselect && !suppressOnSelect)
- this.onselect(this, selectedByUser);
+ if (!suppressOnSelect) {
+ if (this.onselect)
+ this.onselect(this, selectedByUser);
- if (treeOutline.onselect && !suppressOnSelect)
- treeOutline.onselect(this, selectedByUser);
+ treeOutline.dispatchEventToListeners(WebInspector.TreeOutline.Event.SelectionDidChange, {selectedElement: this, deselectedElement, selectedByUser});
+ }
treeOutline.processingSelectionChange = false;
}
if (this._listItemNode)
this._listItemNode.classList.remove("selected");
- if (this.ondeselect && !suppressOnDeselect)
- this.ondeselect(this);
+ if (!suppressOnDeselect) {
+ if (this.ondeselect)
+ this.ondeselect(this);
- if (this.treeOutline.ondeselect && !suppressOnDeselect)
- this.treeOutline.ondeselect(this);
+ this.treeOutline.dispatchEventToListeners(WebInspector.TreeOutline.Event.SelectionDidChange, {deselectedElement: this});
+ }
return true;
}
this._treeOutline.element.addEventListener("focus", this._treeOutlineGainedFocus.bind(this));
this._treeOutline.element.addEventListener("blur", this._treeOutlineLostFocus.bind(this));
- // FIXME: This is a hack. TreeOutline should just dispatch events via WebInspector.Object.
- var existingOnAdd = treeOutline.onadd;
- var existingOnRemove = treeOutline.onremove;
- var existingOnExpand = treeOutline.onexpand;
- var existingOnCollapse = treeOutline.oncollapse;
- var existingOnHidden = treeOutline.onhidden;
- var existingOnSelect = treeOutline.onselect;
-
- treeOutline.onadd = function(element) {
- this._treeElementAdded(element);
- if (existingOnAdd)
- existingOnAdd.call(treeOutline, element);
- }.bind(this);
-
- treeOutline.onremove = function(element) {
- this._treeElementRemoved(element);
- if (existingOnRemove)
- existingOnRemove.call(treeOutline, element);
- }.bind(this);
-
- treeOutline.onexpand = function(element) {
- this._treeElementExpanded(element);
- if (existingOnExpand)
- existingOnExpand.call(treeOutline, element);
- }.bind(this);
-
- treeOutline.oncollapse = function(element) {
- this._treeElementCollapsed(element);
- if (existingOnCollapse)
- existingOnCollapse.call(treeOutline, element);
- }.bind(this);
-
- treeOutline.onhidden = function(element, hidden) {
- this._treeElementHiddenChanged(element, hidden);
- if (existingOnHidden)
- existingOnHidden.call(treeOutline, element, hidden);
- }.bind(this);
-
- treeOutline.onselect = function(element, selectedByUser) {
- this._treeElementSelected(element, selectedByUser);
- if (existingOnSelect)
- existingOnSelect.call(treeOutline, element, selectedByUser);
- }.bind(this);
+ treeOutline.addEventListener(WebInspector.TreeOutline.Event.ElementAdded, this._treeElementAdded, this);
+ treeOutline.addEventListener(WebInspector.TreeOutline.Event.ElementRemoved, this._treeElementRemoved, this);
+ treeOutline.addEventListener(WebInspector.TreeOutline.Event.ElementDisclosureDidChanged, this._treeElementDisclosureDidChange, this);
+ treeOutline.addEventListener(WebInspector.TreeOutline.Event.ElementVisibilityDidChange, this._treeElementVisibilityDidChange, this);
+ treeOutline.addEventListener(WebInspector.TreeOutline.Event.SelectionDidChange, this._treeSelectionDidChange, this);
}
// Public
this._dataGrid.element.classList.remove("force-focus");
}
- _treeElementSelected(treeElement, selectedByUser)
+ _treeSelectionDidChange(event)
{
if (!this._enabled)
return;
- var dataGridNode = treeElement.__dataGridNode;
+ let treeElement = event.data.selectedElement || event.data.deselectedElement;
+ console.assert(treeElement);
+ if (!treeElement)
+ return;
+
+ let dataGridNode = treeElement.__dataGridNode;
console.assert(dataGridNode);
- dataGridNode.select(true);
+ if (event.data.selectedElement)
+ dataGridNode.select();
+ else
+ dataGridNode.deselect();
}
- _treeElementAdded(treeElement)
+ _treeElementAdded(event)
{
if (!this._enabled)
return;
- var dataGridNode = this.dataGridNodeForTreeElement(treeElement);
+ let treeElement = event.data.element;
+ let dataGridNode = this.dataGridNodeForTreeElement(treeElement);
console.assert(dataGridNode);
var parentDataGridNode = treeElement.parent.__dataGridNode;
- console.assert(dataGridNode);
+ console.assert(parentDataGridNode);
var childIndex = treeElement.parent.children.indexOf(treeElement);
console.assert(childIndex !== -1);
parentDataGridNode.insertChild(dataGridNode, childIndex);
}
- _treeElementRemoved(treeElement)
+ _treeElementRemoved(event)
{
if (!this._enabled)
return;
- var dataGridNode = treeElement.__dataGridNode;
+ let treeElement = event.data.element;
+ let dataGridNode = treeElement.__dataGridNode;
console.assert(dataGridNode);
if (dataGridNode.parent)
dataGridNode.parent.removeChild(dataGridNode);
}
- _treeElementExpanded(treeElement)
+ _treeElementDisclosureDidChange(event)
{
if (!this._enabled)
return;
- var dataGridNode = treeElement.__dataGridNode;
+ let treeElement = event.data.element;
+ let dataGridNode = treeElement.__dataGridNode;
console.assert(dataGridNode);
- if (!dataGridNode.expanded)
+ if (treeElement.expanded)
dataGridNode.expand();
- }
-
- _treeElementCollapsed(treeElement)
- {
- if (!this._enabled)
- return;
-
- var dataGridNode = treeElement.__dataGridNode;
- console.assert(dataGridNode);
-
- if (dataGridNode.expanded)
+ else
dataGridNode.collapse();
}
- _treeElementHiddenChanged(treeElement, hidden)
+ _treeElementVisibilityDidChange(event)
{
if (!this._enabled)
return;
- var dataGridNode = treeElement.__dataGridNode;
+ let treeElement = event.data.element;
+ let dataGridNode = treeElement.__dataGridNode;
console.assert(dataGridNode);
- dataGridNode.element.classList.toggle("hidden", hidden);
+ dataGridNode.element.classList.toggle("hidden", treeElement.hidden);
}
};
this.contentElement.appendChild(listElement);
this._commaSeparatedKeywords = new WebInspector.TreeOutline(listElement);
- this._commaSeparatedKeywords.onselect = this._treeElementSelected.bind(this);
+ this._commaSeparatedKeywords.addEventListener(WebInspector.TreeOutline.Event.SelectionDidChange, this._treeSelectionDidChange, this);
let controlContainer = document.createElement("div");
controlContainer.classList.add("visual-style-comma-separated-keyword-controls");
this._removeSelectedCommaSeparatedKeyword();
}
- _treeElementSelected(item, selectedByUser)
+ _treeSelectionDidChange(event)
{
+ let treeElement = event.data.selectedElement;
+ if (!treeElement)
+ return;
+
this._removeEmptyCommaSeparatedKeywords();
- this.dispatchEventToListeners(WebInspector.VisualStyleCommaSeparatedKeywordEditor.Event.TreeItemSelected, {text: item.mainTitle});
+ this.dispatchEventToListeners(WebInspector.VisualStyleCommaSeparatedKeywordEditor.Event.TreeItemSelected, {text: treeElement.mainTitle});
}
_treeElementIsEmpty(item)
git://git.webkit.org / WebKit-https.git / commitdiff