stable (1.2) latest (tip-of-tree) v8-inspector (node) Home Domains Accessibility Animation ApplicationCache Audits Browser CSS CacheStorage Console DOM DOMDebugger DOMSnapshot DOMStorage Database Debugger DeviceOrientation Emulation HeapProfiler IO IndexedDB Input Inspector LayerTree Log Memory Network Overlay Page Performance Profiler Runtime Schema Security ServiceWorker Storage SystemInfo Target Tethering Tracing
Chrome DevTools Protocol Viewer - latest (tip-of-tree)

Overlay Domain

This domain provides various functionality related to drawing atop the inspected page.

Experimental

Methods

Overlay.enable

Enables domain notifications.

Overlay.disable

Disables domain notifications.

Overlay.setShowPaintRects

Requests that backend shows paint rectangles

Parameters
result
boolean True for showing paint rectangles

Overlay.setShowDebugBorders

Requests that backend shows debug borders on layers

Parameters
show
boolean True for showing debug borders

Overlay.setShowFPSCounter

Requests that backend shows the FPS counter

Parameters
show
boolean True for showing the FPS counter

Overlay.setShowScrollBottleneckRects

Requests that backend shows scroll bottleneck rects

Parameters
show
boolean True for showing scroll bottleneck rects

Overlay.setShowViewportSizeOnResize

Paints viewport size upon main frame resize.

Parameters
show
boolean Whether to paint size or not.

Overlay.setPausedInDebuggerMessage

Parameters
message
string The message to display, also triggers resume and step over controls.

Overlay.setSuspended

Parameters
suspended
boolean Whether overlay should be suspended and not consume any resources until resumed.

Overlay.setInspectMode

Enters the 'inspect' mode. In this mode, elements that user is hovering over are highlighted. Backend then generates 'inspectNodeRequested' event upon element selection.

Parameters
mode
InspectMode Set an inspection mode.
highlightConfig
HighlightConfig A descriptor for the highlight appearance of hovered-over nodes. May be omitted if enabled == false.

Overlay.highlightRect

Highlights given rectangle. Coordinates are absolute with respect to the main frame viewport.

Parameters
x
integer X coordinate
y
integer Y coordinate
width
integer Rectangle width
height
integer Rectangle height
color
DOM.RGBA The highlight fill color (default: transparent).
outlineColor
DOM.RGBA The highlight outline color (default: transparent).

Overlay.highlightQuad

Highlights given quad. Coordinates are absolute with respect to the main frame viewport.

Parameters
quad
DOM.Quad Quad to highlight
color
DOM.RGBA The highlight fill color (default: transparent).
outlineColor
DOM.RGBA The highlight outline color (default: transparent).

Overlay.highlightNode

Highlights DOM node with given id or with the given JavaScript object wrapper. Either nodeId or objectId must be specified.

Parameters
highlightConfig
HighlightConfig A descriptor for the highlight appearance.
nodeId
DOM.NodeId Identifier of the node to highlight.
backendNodeId
DOM.BackendNodeId Identifier of the backend node to highlight.
objectId
Runtime.RemoteObjectId JavaScript object id of the node to be highlighted.

Overlay.highlightFrame

Highlights owner element of the frame with given id.

Parameters
frameId
Page.FrameId Identifier of the frame to highlight.
contentColor
DOM.RGBA The content box highlight fill color (default: transparent).
contentOutlineColor
DOM.RGBA The content box highlight outline color (default: transparent).

Overlay.hideHighlight

Hides any highlight.

Overlay.getHighlightObjectForTest

For testing.

Parameters
nodeId
DOM.NodeId Id of the node to get highlight object for.
Return object
highlight
object Highlight data for the node.

Events

Overlay.nodeHighlightRequested

Fired when the node should be highlighted. This happens after call to setInspectMode.

Parameters
nodeId
DOM.NodeId

Overlay.inspectNodeRequested

Fired when the node should be inspected. This happens after call to setInspectMode or when user manually inspects an element.

Parameters
backendNodeId
DOM.BackendNodeId Id of the node to inspect.

Overlay.screenshotRequested

Fired when user asks to capture screenshot of some area on the page.

Parameters
viewport
Page.Viewport Viewport to capture, in CSS.

Types

HighlightConfig

Configuration data for the highlighting of page elements.

Type: object

Properties
showInfo
boolean Whether the node info tooltip should be shown (default: false).
showRulers
boolean Whether the rulers should be shown (default: false).
showExtensionLines
boolean Whether the extension lines from node to the rulers should be shown (default: false).
displayAsMaterial
boolean
contentColor
DOM.RGBA The content box highlight fill color (default: transparent).
paddingColor
DOM.RGBA The padding highlight fill color (default: transparent).
borderColor
DOM.RGBA The border highlight fill color (default: transparent).
marginColor
DOM.RGBA The margin highlight fill color (default: transparent).
eventTargetColor
DOM.RGBA The event target element highlight fill color (default: transparent).
shapeColor
DOM.RGBA The shape outside fill color (default: transparent).
shapeMarginColor
DOM.RGBA The shape margin fill color (default: transparent).
selectorList
string Selectors to highlight relevant nodes.
cssGridColor
DOM.RGBA The grid layout color (default: transparent).

InspectMode

Type: string

Allowed values

searchForNode, searchForUAShadowDOM, none.