blob: 5dec7d40be8da31847f238d1fa3c8c6c0de0cd8e [file] [log] [blame]
/*
* Copyright (C) 2013, 2015 Apple Inc. All rights reserved.
*
* Redistribution and use in source and binary forms, with or without
* modification, are permitted provided that the following conditions
* are met:
* 1. Redistributions of source code must retain the above copyright
* notice, this list of conditions and the following disclaimer.
* 2. Redistributions in binary form must reproduce the above copyright
* notice, this list of conditions and the following disclaimer in the
* documentation and/or other materials provided with the distribution.
*
* THIS SOFTWARE IS PROVIDED BY APPLE INC. AND ITS CONTRIBUTORS ``AS IS''
* AND ANY EXPRESS OR IMPLIED WARRANTIES, INCLUDING, BUT NOT LIMITED TO,
* THE IMPLIED WARRANTIES OF MERCHANTABILITY AND FITNESS FOR A PARTICULAR
* PURPOSE ARE DISCLAIMED. IN NO EVENT SHALL APPLE INC. OR ITS CONTRIBUTORS
* BE LIABLE FOR ANY DIRECT, INDIRECT, INCIDENTAL, SPECIAL, EXEMPLARY, OR
* CONSEQUENTIAL DAMAGES (INCLUDING, BUT NOT LIMITED TO, PROCUREMENT OF
* SUBSTITUTE GOODS OR SERVICES; LOSS OF USE, DATA, OR PROFITS; OR BUSINESS
* INTERRUPTION) HOWEVER CAUSED AND ON ANY THEORY OF LIABILITY, WHETHER IN
* CONTRACT, STRICT LIABILITY, OR TORT (INCLUDING NEGLIGENCE OR OTHERWISE)
* ARISING IN ANY WAY OUT OF THE USE OF THIS SOFTWARE, EVEN IF ADVISED OF
* THE POSSIBILITY OF SUCH DAMAGE.
*/
WI.DOMTreeContentView = class DOMTreeContentView extends WI.ContentView
{
constructor(representedObject)
{
console.assert(representedObject);
super(representedObject);
this._compositingBordersButtonNavigationItem = new WI.ActivateButtonNavigationItem("layer-borders", WI.UIString("Show compositing borders"), WI.UIString("Hide compositing borders"), "Images/LayerBorders.svg", 13, 13);
this._compositingBordersButtonNavigationItem.addEventListener(WI.ButtonNavigationItem.Event.Clicked, this._toggleCompositingBorders, this);
this._compositingBordersButtonNavigationItem.enabled = InspectorBackend.hasDomain("Page");
this._compositingBordersButtonNavigationItem.visibilityPriority = WI.NavigationItem.VisibilityPriority.Low;
// COMPATIBILITY (iOS 9)
WI.settings.showPaintRects.addEventListener(WI.Setting.Event.Changed, this._showPaintRectsSettingChanged, this);
this._paintFlashingButtonNavigationItem = new WI.ActivateButtonNavigationItem("paint-flashing", WI.UIString("Enable paint flashing"), WI.UIString("Disable paint flashing"), "Images/Paint.svg", 16, 16);
this._paintFlashingButtonNavigationItem.addEventListener(WI.ButtonNavigationItem.Event.Clicked, this._togglePaintFlashing, this);
this._paintFlashingButtonNavigationItem.enabled = InspectorBackend.hasCommand("Page.setShowPaintRects");
this._paintFlashingButtonNavigationItem.activated = this._paintFlashingButtonNavigationItem.enabled && WI.settings.showPaintRects.value;
this._paintFlashingButtonNavigationItem.visibilityPriority = WI.NavigationItem.VisibilityPriority.Low;
WI.settings.showShadowDOM.addEventListener(WI.Setting.Event.Changed, this._showShadowDOMSettingChanged, this);
this._showsShadowDOMButtonNavigationItem = new WI.ActivateButtonNavigationItem("shows-shadow-DOM", WI.UIString("Show shadow DOM nodes"), WI.UIString("Hide shadow DOM nodes"), "Images/ShadowDOM.svg", 13, 13);
this._showsShadowDOMButtonNavigationItem.addEventListener(WI.ButtonNavigationItem.Event.Clicked, this._toggleShowsShadowDOMSetting, this);
this._showsShadowDOMButtonNavigationItem.visibilityPriority = WI.NavigationItem.VisibilityPriority.Low;
this._showShadowDOMSettingChanged();
this._showPrintStylesButtonNavigationItem = new WI.ActivateButtonNavigationItem("print-styles", WI.UIString("Force print media styles"), WI.UIString("Use default media styles"), "Images/Printer.svg", 16, 16);
this._showPrintStylesButtonNavigationItem.addEventListener(WI.ButtonNavigationItem.Event.Clicked, this._togglePrintStyles, this);
this._showPrintStylesButtonNavigationItem.enabled = InspectorBackend.hasDomain("Page");
this._showPrintStylesButtonNavigationItem.visibilityPriority = WI.NavigationItem.VisibilityPriority.Low;
this._showPrintStylesChanged();
// COMPATIBILITY (iOS 12)
WI.settings.showRulers.addEventListener(WI.Setting.Event.Changed, this._showRulersChanged, this);
this._showRulersButtonNavigationItem = new WI.ActivateButtonNavigationItem("show-rulers", WI.UIString("Show rulers"), WI.UIString("Hide rulers"), "Images/Rulers.svg", 16, 16);
this._showRulersButtonNavigationItem.addEventListener(WI.ButtonNavigationItem.Event.Clicked, this._toggleShowRulers, this);
this._showRulersButtonNavigationItem.enabled = InspectorBackend.hasCommand("Page.setShowRulers");
this._showRulersButtonNavigationItem.visibilityPriority = WI.NavigationItem.VisibilityPriority.Low;
this._showRulersChanged();
this.element.classList.add("dom-tree");
this.element.addEventListener("click", this._mouseWasClicked.bind(this), false);
this._domTreeOutline = new WI.DOMTreeOutline({omitRootDOMNode: true, excludeRevealElementContextMenu: true, showInspectedNode: true});
this._domTreeOutline.allowsEmptySelection = false;
this._domTreeOutline.allowsMultipleSelection = true;
this._domTreeOutline.addEventListener(WI.TreeOutline.Event.ElementAdded, this._domTreeElementAdded, this);
this._domTreeOutline.addEventListener(WI.TreeOutline.Event.SelectionDidChange, this._domTreeSelectionDidChange, this);
this._domTreeOutline.addEventListener(WI.DOMTreeOutline.Event.SelectedNodeChanged, this._selectedNodeDidChange, this);
this._domTreeOutline.wireToDomAgent();
this._domTreeOutline.editable = true;
this.element.appendChild(this._domTreeOutline.element);
WI.domManager.addEventListener(WI.DOMManager.Event.AttributeModified, this._domNodeChanged, this);
WI.domManager.addEventListener(WI.DOMManager.Event.AttributeRemoved, this._domNodeChanged, this);
WI.domManager.addEventListener(WI.DOMManager.Event.CharacterDataModified, this._domNodeChanged, this);
WI.cssManager.addEventListener(WI.CSSManager.Event.DefaultAppearanceDidChange, this._defaultAppearanceDidChange, this);
this._lastSelectedNodePathSetting = new WI.Setting("last-selected-node-path", null);
this._numberOfSearchResults = null;
this._breakpointGutterEnabled = false;
this._pendingBreakpointNodeIdentifiers = new Set;
this._defaultAppearanceDidChange();
if (WI.domDebuggerManager.supported) {
WI.debuggerManager.addEventListener(WI.DebuggerManager.Event.BreakpointsEnabledDidChange, this._breakpointsEnabledDidChange, this);
WI.domDebuggerManager.addEventListener(WI.DOMDebuggerManager.Event.DOMBreakpointAdded, this._domBreakpointAddedOrRemoved, this);
WI.domDebuggerManager.addEventListener(WI.DOMDebuggerManager.Event.DOMBreakpointRemoved, this._domBreakpointAddedOrRemoved, this);
WI.DOMBreakpoint.addEventListener(WI.DOMBreakpoint.Event.DisabledStateChanged, this._handleDOMBreakpointDisabledStateChanged, this);
WI.DOMBreakpoint.addEventListener(WI.DOMBreakpoint.Event.DOMNodeChanged, this._handleDOMBreakpointDOMNodeChanged, this);
this._breakpointsEnabledDidChange();
}
}
// Public
get navigationItems()
{
return [
this._showRulersButtonNavigationItem,
this._showPrintStylesButtonNavigationItem,
this._forceAppearanceButtonNavigationItem,
this._compositingBordersButtonNavigationItem,
this._paintFlashingButtonNavigationItem,
this._showsShadowDOMButtonNavigationItem,
];
}
get domTreeOutline()
{
return this._domTreeOutline;
}
get scrollableElements()
{
return [this.element];
}
get breakpointGutterEnabled()
{
return this._breakpointGutterEnabled;
}
set breakpointGutterEnabled(flag)
{
if (this._breakpointGutterEnabled === flag)
return;
this._breakpointGutterEnabled = flag;
this.element.classList.toggle("show-gutter", this._breakpointGutterEnabled);
}
shown()
{
super.shown();
this._domTreeOutline.setVisible(true, WI.isConsoleFocused());
this._updateCompositingBordersButtonToMatchPageSettings();
if (!this._domTreeOutline.rootDOMNode)
return;
this._restoreBreakpointsAfterUpdate();
}
hidden()
{
super.hidden();
WI.domManager.hideDOMNodeHighlight();
this._domTreeOutline.setVisible(false);
}
closed()
{
super.closed();
WI.settings.showPaintRects.removeEventListener(null, null, this);
WI.settings.showShadowDOM.removeEventListener(null, null, this);
WI.settings.showRulers.removeEventListener(null, null, this);
WI.debuggerManager.removeEventListener(null, null, this);
WI.domManager.removeEventListener(null, null, this);
WI.domDebuggerManager.removeEventListener(null, null, this);
WI.DOMBreakpoint.removeEventListener(null, null, this);
this._domTreeOutline.close();
this._pendingBreakpointNodeIdentifiers.clear();
}
get selectionPathComponents()
{
var treeElement = this._domTreeOutline.selectedTreeElement;
var pathComponents = [];
while (treeElement && !treeElement.root) {
// The close tag is contained within the element it closes. So skip it since we don't want to
// show the same node twice in the hierarchy.
if (treeElement.isCloseTag()) {
treeElement = treeElement.parent;
continue;
}
var pathComponent = new WI.DOMTreeElementPathComponent(treeElement, treeElement.representedObject);
pathComponent.addEventListener(WI.HierarchicalPathComponent.Event.Clicked, this._pathComponentSelected, this);
pathComponents.unshift(pathComponent);
treeElement = treeElement.parent;
}
return pathComponents;
}
restoreFromCookie(cookie)
{
if (!cookie || !cookie.nodeToSelect)
return;
this.selectAndRevealDOMNode(cookie.nodeToSelect);
// Because nodeToSelect is ephemeral, we don't want to keep
// it around in the back-forward history entries.
cookie.nodeToSelect = undefined;
}
selectAndRevealDOMNode(domNode, preventFocusChange)
{
this._domTreeOutline.selectDOMNode(domNode, !preventFocusChange);
}
async handleCopyEvent(event)
{
let promises = [];
for (let treeElement of this._domTreeOutline.selectedTreeElements) {
if (treeElement.representedObject instanceof WI.DOMNode)
promises.push(treeElement.representedObject.getOuterHTML());
}
if (!promises.length)
return;
event.clipboardData.clearData();
event.preventDefault();
let outerHTMLs = await Promise.all(promises);
InspectorFrontendHost.copyText(outerHTMLs.join("\n"));
}
handlePasteEvent(event)
{
let selectedDOMNode = this._domTreeOutline.selectedDOMNode();
if (!selectedDOMNode)
return;
let text = event.clipboardData.getData("text/plain");
if (!text)
return;
selectedDOMNode.insertAdjacentHTML("afterend", text);
}
get supportsSave()
{
return WI.canArchiveMainFrame();
}
get saveData()
{
return {customSaveHandler: () => { WI.archiveMainFrame(); }};
}
get supportsSearch()
{
return true;
}
get numberOfSearchResults()
{
return this._numberOfSearchResults;
}
get hasPerformedSearch()
{
return this._numberOfSearchResults !== null;
}
set automaticallyRevealFirstSearchResult(reveal)
{
this._automaticallyRevealFirstSearchResult = reveal;
// If we haven't shown a search result yet, reveal one now.
if (this._automaticallyRevealFirstSearchResult && this._numberOfSearchResults > 0) {
if (this._currentSearchResultIndex === -1)
this.revealNextSearchResult();
}
}
performSearch(query)
{
if (this._searchQuery === query)
return;
let target = WI.assumingMainTarget();
if (this._searchIdentifier) {
target.DOMAgent.discardSearchResults(this._searchIdentifier);
this._hideSearchHighlights();
}
this._searchQuery = query;
this._searchIdentifier = null;
this._numberOfSearchResults = null;
this._currentSearchResultIndex = -1;
function searchResultsReady(error, searchIdentifier, resultsCount)
{
if (error)
return;
this._searchIdentifier = searchIdentifier;
this._numberOfSearchResults = resultsCount;
this.dispatchEventToListeners(WI.ContentView.Event.NumberOfSearchResultsDidChange);
this._showSearchHighlights();
if (this._automaticallyRevealFirstSearchResult)
this.revealNextSearchResult();
}
function contextNodesReady(nodeIds)
{
if (this._searchQuery !== query)
return;
let commandArguments = {
query: this._searchQuery,
nodeIds,
caseSensitive: WI.SearchUtilities.defaultSettings.caseSensitive.value,
};
target.DOMAgent.performSearch.invoke(commandArguments, searchResultsReady.bind(this));
}
this.getSearchContextNodes(contextNodesReady.bind(this));
}
getSearchContextNodes(callback)
{
// Overwrite this to limit the search to just a subtree.
// Passing undefined will make DOM.performSearch search through all the documents.
callback(undefined);
}
searchCleared()
{
if (this._searchIdentifier) {
let target = WI.assumingMainTarget();
target.DOMAgent.discardSearchResults(this._searchIdentifier);
this._hideSearchHighlights();
}
this._searchQuery = null;
this._searchIdentifier = null;
this._numberOfSearchResults = null;
this._currentSearchResultIndex = -1;
}
revealPreviousSearchResult(changeFocus)
{
if (!this._numberOfSearchResults)
return;
if (this._currentSearchResultIndex > 0)
--this._currentSearchResultIndex;
else
this._currentSearchResultIndex = this._numberOfSearchResults - 1;
this._revealSearchResult(this._currentSearchResultIndex, changeFocus);
}
revealNextSearchResult(changeFocus)
{
if (!this._numberOfSearchResults)
return;
if (this._currentSearchResultIndex + 1 < this._numberOfSearchResults)
++this._currentSearchResultIndex;
else
this._currentSearchResultIndex = 0;
this._revealSearchResult(this._currentSearchResultIndex, changeFocus);
}
// Protected
sizeDidChange()
{
super.sizeDidChange();
this._domTreeOutline.selectDOMNode(this._domTreeOutline.selectedDOMNode());
}
layout()
{
super.layout();
this._domTreeOutline.updateSelectionArea();
}
// Private
_revealSearchResult(index, changeFocus)
{
console.assert(this._searchIdentifier);
var searchIdentifier = this._searchIdentifier;
function revealResult(error, nodeIdentifiers)
{
if (error)
return;
// Bail if the searchIdentifier changed since we started.
if (this._searchIdentifier !== searchIdentifier)
return;
console.assert(nodeIdentifiers.length === 1);
var domNode = WI.domManager.nodeForId(nodeIdentifiers[0]);
console.assert(domNode);
if (!domNode)
return;
this._domTreeOutline.selectDOMNode(domNode, changeFocus);
var selectedTreeElement = this._domTreeOutline.selectedTreeElement;
if (selectedTreeElement)
selectedTreeElement.emphasizeSearchHighlight();
}
let target = WI.assumingMainTarget();
target.DOMAgent.getSearchResults(this._searchIdentifier, index, index + 1, revealResult.bind(this));
}
_restoreSelectedNodeAfterUpdate(documentURL, defaultNode)
{
if (!WI.domManager.restoreSelectedNodeIsAllowed)
return;
function selectNode(lastSelectedNode)
{
var nodeToFocus = lastSelectedNode;
if (!nodeToFocus)
nodeToFocus = defaultNode;
if (!nodeToFocus)
return;
this._dontSetLastSelectedNodePath = true;
this.selectAndRevealDOMNode(nodeToFocus, WI.isConsoleFocused());
this._dontSetLastSelectedNodePath = false;
// If this wasn't the last selected node, then expand it.
if (!lastSelectedNode && this._domTreeOutline.selectedTreeElement)
this._domTreeOutline.selectedTreeElement.expand();
}
function selectLastSelectedNode(nodeId)
{
if (!WI.domManager.restoreSelectedNodeIsAllowed)
return;
selectNode.call(this, WI.domManager.nodeForId(nodeId));
}
if (documentURL && this._lastSelectedNodePathSetting.value && this._lastSelectedNodePathSetting.value.path && this._lastSelectedNodePathSetting.value.url === documentURL.hash)
WI.domManager.pushNodeByPathToFrontend(this._lastSelectedNodePathSetting.value.path, selectLastSelectedNode.bind(this));
else
selectNode.call(this);
}
_domTreeElementAdded(event)
{
if (!this._pendingBreakpointNodeIdentifiers.size)
return;
let treeElement = event.data.element;
let node = treeElement.representedObject;
console.assert(node instanceof WI.DOMNode);
if (!(node instanceof WI.DOMNode))
return;
if (!this._pendingBreakpointNodeIdentifiers.delete(node.id))
return;
this._updateBreakpointStatus(node.id);
}
_domTreeSelectionDidChange(event)
{
let treeElement = this._domTreeOutline.selectedTreeElement;
let domNode = treeElement ? treeElement.representedObject : null;
let selectedByUser = event.data.selectedByUser;
this._domTreeOutline.suppressRevealAndSelect = true;
this._domTreeOutline.selectDOMNode(domNode, selectedByUser);
if (domNode && selectedByUser)
WI.domManager.highlightDOMNode(domNode.id);
this._domTreeOutline.updateSelectionArea();
this._domTreeOutline.suppressRevealAndSelect = false;
}
_selectedNodeDidChange(event)
{
var selectedDOMNode = this._domTreeOutline.selectedDOMNode();
if (selectedDOMNode && !this._dontSetLastSelectedNodePath)
this._lastSelectedNodePathSetting.value = {url: WI.networkManager.mainFrame.url.hash, path: selectedDOMNode.path()};
if (selectedDOMNode)
WI.domManager.setInspectedNode(selectedDOMNode);
this.dispatchEventToListeners(WI.ContentView.Event.SelectionPathComponentsDidChange);
}
_pathComponentSelected(event)
{
if (!event.data.pathComponent)
return;
console.assert(event.data.pathComponent instanceof WI.DOMTreeElementPathComponent);
console.assert(event.data.pathComponent.domTreeElement instanceof WI.DOMTreeElement);
this._domTreeOutline.selectDOMNode(event.data.pathComponent.domTreeElement.representedObject, true);
}
_domNodeChanged(event)
{
var selectedDOMNode = this._domTreeOutline.selectedDOMNode();
if (selectedDOMNode !== event.data.node)
return;
this.dispatchEventToListeners(WI.ContentView.Event.SelectionPathComponentsDidChange);
}
_mouseWasClicked(event)
{
var anchorElement = event.target.closest("a");
if (!anchorElement || !anchorElement.href)
return;
// Prevent the link from navigating, since we don't do any navigation by following links normally.
event.preventDefault();
event.stopPropagation();
if (WI.isBeingEdited(anchorElement)) {
// Don't follow the link when it is being edited.
return;
}
// Cancel any pending link navigation.
if (this._followLinkTimeoutIdentifier) {
clearTimeout(this._followLinkTimeoutIdentifier);
delete this._followLinkTimeoutIdentifier;
}
// If this is a double-click (or multiple-click), return early.
if (event.detail > 1)
return;
function followLink()
{
// Since followLink is delayed, the call to WI.openURL can't look at window.event
// to see if the command key is down like it normally would. So we need to do that check
// before calling WI.openURL.
const options = {
alwaysOpenExternally: event ? event.metaKey : false,
lineNumber: anchorElement.lineNumber,
ignoreNetworkTab: true,
ignoreSearchTab: true,
};
WI.openURL(anchorElement.href, this._frame, options);
}
// Start a timeout since this is a single click, if the timeout is canceled before it fires,
// then a double-click happened or another link was clicked.
// FIXME: The duration might be longer or shorter than the user's configured double click speed.
this._followLinkTimeoutIdentifier = setTimeout(followLink.bind(this), 333);
}
_toggleCompositingBorders(event)
{
var activated = !this._compositingBordersButtonNavigationItem.activated;
this._compositingBordersButtonNavigationItem.activated = activated;
for (let target of WI.targets) {
if (target.hasDomain("Page"))
target.PageAgent.setCompositingBordersVisible(activated);
}
}
_togglePaintFlashing(event)
{
WI.settings.showPaintRects.value = !WI.settings.showPaintRects.value;
}
_updateCompositingBordersButtonToMatchPageSettings()
{
if (!WI.targetsAvailable()) {
WI.whenTargetsAvailable().then(() => {
this._updateCompositingBordersButtonToMatchPageSettings();
});
return;
}
var button = this._compositingBordersButtonNavigationItem;
// We need to sync with the page settings since these can be controlled
// in a different way than just using the navigation bar button.
let target = WI.assumingMainTarget();
target.PageAgent.getCompositingBordersVisible(function(error, compositingBordersVisible) {
button.activated = error ? false : compositingBordersVisible;
button.enabled = error !== "unsupported";
});
}
_showPaintRectsSettingChanged(event)
{
let activated = WI.settings.showPaintRects.value;
this._paintFlashingButtonNavigationItem.activated = activated;
for (let target of WI.targets) {
if (target.hasCommand("Page.setShowPaintRects"))
target.PageAgent.setShowPaintRects(activated);
}
}
_showShadowDOMSettingChanged(event)
{
this._showsShadowDOMButtonNavigationItem.activated = WI.settings.showShadowDOM.value;
}
_toggleShowsShadowDOMSetting(event)
{
WI.settings.showShadowDOM.value = !WI.settings.showShadowDOM.value;
}
_showPrintStylesChanged()
{
this._showPrintStylesButtonNavigationItem.activated = WI.printStylesEnabled;
let mediaType = WI.printStylesEnabled ? "print" : "";
for (let target of WI.targets) {
if (target.hasDomain("Page"))
target.PageAgent.setEmulatedMedia(mediaType);
}
WI.cssManager.mediaTypeChanged();
}
_togglePrintStyles(event)
{
WI.printStylesEnabled = !WI.printStylesEnabled;
this._showPrintStylesChanged();
}
_defaultAppearanceDidChange()
{
// Don't update the navigation item if there is currently a forced appearance.
// The user will need to toggle it off to update it based on the new default appearance.
if (WI.cssManager.forcedAppearance)
return;
this._forceAppearanceButtonNavigationItem = null;
let defaultAppearance = WI.cssManager.defaultAppearance;
switch (defaultAppearance) {
case WI.CSSManager.Appearance.Light:
case null: // if there is no default appearance, the navigation item will be disabled
this._forceAppearanceButtonNavigationItem = new WI.ActivateButtonNavigationItem("appearance", WI.UIString("Force Dark Appearance"), WI.UIString("Use Default Appearance"), "Images/Appearance.svg", 16, 16);
break;
case WI.CSSManager.Appearance.Dark:
this._forceAppearanceButtonNavigationItem = new WI.ActivateButtonNavigationItem("appearance", WI.UIString("Force Light Appearance"), WI.UIString("Use Default Appearance"), "Images/Appearance.svg", 16, 16);
break;
}
this._lastKnownDefaultAppearance = defaultAppearance;
this._forceAppearanceButtonNavigationItem.addEventListener(WI.ButtonNavigationItem.Event.Clicked, this._toggleAppearance, this);
this._forceAppearanceButtonNavigationItem.visibilityPriority = WI.NavigationItem.VisibilityPriority.Low;
this._forceAppearanceButtonNavigationItem.enabled = WI.cssManager.canForceAppearance();
this._forceAppearanceButtonNavigationItem.activated = !!WI.cssManager.forcedAppearance;
this.dispatchEventToListeners(WI.ContentView.Event.NavigationItemsDidChange);
}
_toggleAppearance(event)
{
console.assert(WI.cssManager.canForceAppearance());
// Use the last known default appearance, since that is the appearance this navigation item was generated for.
let appearanceToForce = null;
switch (this._lastKnownDefaultAppearance) {
case WI.CSSManager.Appearance.Light:
appearanceToForce = WI.CSSManager.Appearance.Dark;
break;
case WI.CSSManager.Appearance.Dark:
appearanceToForce = WI.CSSManager.Appearance.Light;
break;
}
console.assert(appearanceToForce);
WI.cssManager.forcedAppearance = WI.cssManager.forcedAppearance === appearanceToForce ? null : appearanceToForce;
// When no longer forcing an appearance, if the last known default appearance is different than the current
// default appearance, then update the navigation button now. Otherwise just toggle the activated state.
if (!WI.cssManager.forcedAppearance && this._lastKnownDefaultAppearance !== WI.cssManager.defaultAppearance)
this._defaultAppearanceDidChange();
else
this._forceAppearanceButtonNavigationItem.activated = !!WI.cssManager.forcedAppearance;
}
_showRulersChanged()
{
let activated = WI.settings.showRulers.value;
this._showRulersButtonNavigationItem.activated = activated;
for (let target of WI.targets) {
if (target.hasCommand("Page.setShowRulers"))
target.PageAgent.setShowRulers(activated);
}
}
_toggleShowRulers(event)
{
WI.settings.showRulers.value = !WI.settings.showRulers.value;
this._showRulersChanged();
}
_showSearchHighlights()
{
console.assert(this._searchIdentifier);
this._searchResultNodes = [];
var searchIdentifier = this._searchIdentifier;
let target = WI.assumingMainTarget();
target.DOMAgent.getSearchResults(this._searchIdentifier, 0, this._numberOfSearchResults, function(error, nodeIdentifiers) {
if (error)
return;
if (this._searchIdentifier !== searchIdentifier)
return;
console.assert(nodeIdentifiers.length === this._numberOfSearchResults);
for (var i = 0; i < nodeIdentifiers.length; ++i) {
var domNode = WI.domManager.nodeForId(nodeIdentifiers[i]);
console.assert(domNode);
if (!domNode)
continue;
this._searchResultNodes.push(domNode);
var treeElement = this._domTreeOutline.findTreeElement(domNode);
console.assert(treeElement);
if (treeElement)
treeElement.highlightSearchResults(this._searchQuery);
}
}.bind(this));
}
_hideSearchHighlights()
{
if (!this._searchResultNodes)
return;
for (var domNode of this._searchResultNodes) {
var treeElement = this._domTreeOutline.findTreeElement(domNode);
if (treeElement)
treeElement.hideSearchHighlights();
}
delete this._searchResultNodes;
}
_domBreakpointAddedOrRemoved(event)
{
let breakpoint = event.data.breakpoint;
this._updateBreakpointStatus(breakpoint.domNodeIdentifier);
}
_handleDOMBreakpointDisabledStateChanged(event)
{
let breakpoint = event.target;
this._updateBreakpointStatus(breakpoint.domNodeIdentifier);
}
_handleDOMBreakpointDOMNodeChanged(event)
{
let breakpoint = event.target;
let nodeIdentifier = breakpoint.domNodeIdentifier || event.data.oldNodeIdentifier;
this._updateBreakpointStatus(nodeIdentifier);
}
_updateBreakpointStatus(nodeIdentifier)
{
let domNode = WI.domManager.nodeForId(nodeIdentifier);
if (!domNode)
return;
let treeElement = this._domTreeOutline.findTreeElement(domNode);
if (!treeElement) {
this._pendingBreakpointNodeIdentifiers.add(nodeIdentifier);
return;
}
let breakpoints = WI.domDebuggerManager.domBreakpointsForNode(domNode);
if (breakpoints.length) {
if (breakpoints.some((item) => item.disabled))
treeElement.breakpointStatus = WI.DOMTreeElement.BreakpointStatus.DisabledBreakpoint;
else
treeElement.breakpointStatus = WI.DOMTreeElement.BreakpointStatus.Breakpoint;
} else
treeElement.breakpointStatus = WI.DOMTreeElement.BreakpointStatus.None;
this.breakpointGutterEnabled = this._domTreeOutline.children.some((child) => child.hasBreakpoint);
}
_restoreBreakpointsAfterUpdate()
{
this._pendingBreakpointNodeIdentifiers.clear();
this.breakpointGutterEnabled = false;
let updatedNodes = new Set;
for (let breakpoint of WI.domDebuggerManager.domBreakpoints) {
if (updatedNodes.has(breakpoint.domNodeIdentifier))
continue;
this._updateBreakpointStatus(breakpoint.domNodeIdentifier);
}
}
_breakpointsEnabledDidChange(event)
{
this._domTreeOutline.element.classList.toggle("breakpoints-disabled", !WI.debuggerManager.breakpointsEnabled);
}
};