| # Copyright 2017 The Chromium Authors |
| # Use of this source code is governed by a BSD-style license that can be |
| # found in the LICENSE file. |
| # |
| # Contributing to Chrome DevTools Protocol: https://goo.gle/devtools-contribution-guide-cdp |
| |
| # This domain provides various functionality related to drawing atop the inspected page. |
| experimental domain Overlay |
| depends on DOM |
| depends on Page |
| depends on Runtime |
| |
| # Configuration data for drawing the source order of an elements children. |
| type SourceOrderConfig extends object |
| properties |
| # the color to outline the given element in. |
| DOM.RGBA parentOutlineColor |
| # the color to outline the child elements in. |
| DOM.RGBA childOutlineColor |
| |
| # Configuration data for the highlighting of Grid elements. |
| type GridHighlightConfig extends object |
| properties |
| # Whether the extension lines from grid cells to the rulers should be shown (default: false). |
| optional boolean showGridExtensionLines |
| # Show Positive line number labels (default: false). |
| optional boolean showPositiveLineNumbers |
| # Show Negative line number labels (default: false). |
| optional boolean showNegativeLineNumbers |
| # Show area name labels (default: false). |
| optional boolean showAreaNames |
| # Show line name labels (default: false). |
| optional boolean showLineNames |
| # Show track size labels (default: false). |
| optional boolean showTrackSizes |
| # The grid container border highlight color (default: transparent). |
| optional DOM.RGBA gridBorderColor |
| # The cell border color (default: transparent). Deprecated, please use rowLineColor and columnLineColor instead. |
| deprecated optional DOM.RGBA cellBorderColor |
| # The row line color (default: transparent). |
| optional DOM.RGBA rowLineColor |
| # The column line color (default: transparent). |
| optional DOM.RGBA columnLineColor |
| # Whether the grid border is dashed (default: false). |
| optional boolean gridBorderDash |
| # Whether the cell border is dashed (default: false). Deprecated, please us rowLineDash and columnLineDash instead. |
| deprecated optional boolean cellBorderDash |
| # Whether row lines are dashed (default: false). |
| optional boolean rowLineDash |
| # Whether column lines are dashed (default: false). |
| optional boolean columnLineDash |
| # The row gap highlight fill color (default: transparent). |
| optional DOM.RGBA rowGapColor |
| # The row gap hatching fill color (default: transparent). |
| optional DOM.RGBA rowHatchColor |
| # The column gap highlight fill color (default: transparent). |
| optional DOM.RGBA columnGapColor |
| # The column gap hatching fill color (default: transparent). |
| optional DOM.RGBA columnHatchColor |
| # The named grid areas border color (Default: transparent). |
| optional DOM.RGBA areaBorderColor |
| # The grid container background color (Default: transparent). |
| optional DOM.RGBA gridBackgroundColor |
| |
| # Configuration data for the highlighting of Flex container elements. |
| type FlexContainerHighlightConfig extends object |
| properties |
| # The style of the container border |
| optional LineStyle containerBorder |
| # The style of the separator between lines |
| optional LineStyle lineSeparator |
| # The style of the separator between items |
| optional LineStyle itemSeparator |
| # Style of content-distribution space on the main axis (justify-content). |
| optional BoxStyle mainDistributedSpace |
| # Style of content-distribution space on the cross axis (align-content). |
| optional BoxStyle crossDistributedSpace |
| # Style of empty space caused by row gaps (gap/row-gap). |
| optional BoxStyle rowGapSpace |
| # Style of empty space caused by columns gaps (gap/column-gap). |
| optional BoxStyle columnGapSpace |
| # Style of the self-alignment line (align-items). |
| optional LineStyle crossAlignment |
| |
| # Configuration data for the highlighting of Flex item elements. |
| type FlexItemHighlightConfig extends object |
| properties |
| # Style of the box representing the item's base size |
| optional BoxStyle baseSizeBox |
| # Style of the border around the box representing the item's base size |
| optional LineStyle baseSizeBorder |
| # Style of the arrow representing if the item grew or shrank |
| optional LineStyle flexibilityArrow |
| |
| # Style information for drawing a line. |
| type LineStyle extends object |
| properties |
| # The color of the line (default: transparent) |
| optional DOM.RGBA color |
| # The line pattern (default: solid) |
| optional enum pattern |
| dashed |
| dotted |
| |
| # Style information for drawing a box. |
| type BoxStyle extends object |
| properties |
| # The background color for the box (default: transparent) |
| optional DOM.RGBA fillColor |
| # The hatching color for the box (default: transparent) |
| optional DOM.RGBA hatchColor |
| |
| type ContrastAlgorithm extends string |
| enum |
| aa |
| aaa |
| apca |
| |
| # Configuration data for the highlighting of page elements. |
| type HighlightConfig extends object |
| properties |
| # Whether the node info tooltip should be shown (default: false). |
| optional boolean showInfo |
| # Whether the node styles in the tooltip (default: false). |
| optional boolean showStyles |
| # Whether the rulers should be shown (default: false). |
| optional boolean showRulers |
| # Whether the a11y info should be shown (default: true). |
| optional boolean showAccessibilityInfo |
| # Whether the extension lines from node to the rulers should be shown (default: false). |
| optional boolean showExtensionLines |
| # The content box highlight fill color (default: transparent). |
| optional DOM.RGBA contentColor |
| # The padding highlight fill color (default: transparent). |
| optional DOM.RGBA paddingColor |
| # The border highlight fill color (default: transparent). |
| optional DOM.RGBA borderColor |
| # The margin highlight fill color (default: transparent). |
| optional DOM.RGBA marginColor |
| # The event target element highlight fill color (default: transparent). |
| optional DOM.RGBA eventTargetColor |
| # The shape outside fill color (default: transparent). |
| optional DOM.RGBA shapeColor |
| # The shape margin fill color (default: transparent). |
| optional DOM.RGBA shapeMarginColor |
| # The grid layout color (default: transparent). |
| optional DOM.RGBA cssGridColor |
| # The color format used to format color styles (default: hex). |
| optional ColorFormat colorFormat |
| # The grid layout highlight configuration (default: all transparent). |
| optional GridHighlightConfig gridHighlightConfig |
| # The flex container highlight configuration (default: all transparent). |
| optional FlexContainerHighlightConfig flexContainerHighlightConfig |
| # The flex item highlight configuration (default: all transparent). |
| optional FlexItemHighlightConfig flexItemHighlightConfig |
| # The contrast algorithm to use for the contrast ratio (default: aa). |
| optional ContrastAlgorithm contrastAlgorithm |
| # The container query container highlight configuration (default: all transparent). |
| optional ContainerQueryContainerHighlightConfig containerQueryContainerHighlightConfig |
| |
| type ColorFormat extends string |
| enum |
| rgb |
| hsl |
| hwb |
| hex |
| |
| # Configurations for Persistent Grid Highlight |
| type GridNodeHighlightConfig extends object |
| properties |
| # A descriptor for the highlight appearance. |
| GridHighlightConfig gridHighlightConfig |
| # Identifier of the node to highlight. |
| DOM.NodeId nodeId |
| |
| type FlexNodeHighlightConfig extends object |
| properties |
| # A descriptor for the highlight appearance of flex containers. |
| FlexContainerHighlightConfig flexContainerHighlightConfig |
| # Identifier of the node to highlight. |
| DOM.NodeId nodeId |
| |
| type ScrollSnapContainerHighlightConfig extends object |
| properties |
| # The style of the snapport border (default: transparent) |
| optional LineStyle snapportBorder |
| # The style of the snap area border (default: transparent) |
| optional LineStyle snapAreaBorder |
| # The margin highlight fill color (default: transparent). |
| optional DOM.RGBA scrollMarginColor |
| # The padding highlight fill color (default: transparent). |
| optional DOM.RGBA scrollPaddingColor |
| |
| type ScrollSnapHighlightConfig extends object |
| properties |
| # A descriptor for the highlight appearance of scroll snap containers. |
| ScrollSnapContainerHighlightConfig scrollSnapContainerHighlightConfig |
| # Identifier of the node to highlight. |
| DOM.NodeId nodeId |
| |
| # Configuration for dual screen hinge |
| type HingeConfig extends object |
| properties |
| # A rectangle represent hinge |
| DOM.Rect rect |
| # The content box highlight fill color (default: a dark color). |
| optional DOM.RGBA contentColor |
| # The content box highlight outline color (default: transparent). |
| optional DOM.RGBA outlineColor |
| |
| # Configuration for Window Controls Overlay |
| type WindowControlsOverlayConfig extends object |
| properties |
| # Whether the title bar CSS should be shown when emulating the Window Controls Overlay. |
| boolean showCSS |
| # Selected platforms to show the overlay. |
| string selectedPlatform |
| # The theme color defined in app manifest. |
| string themeColor |
| |
| type ContainerQueryHighlightConfig extends object |
| properties |
| # A descriptor for the highlight appearance of container query containers. |
| ContainerQueryContainerHighlightConfig containerQueryContainerHighlightConfig |
| # Identifier of the container node to highlight. |
| DOM.NodeId nodeId |
| |
| type ContainerQueryContainerHighlightConfig extends object |
| properties |
| # The style of the container border. |
| optional LineStyle containerBorder |
| # The style of the descendants' borders. |
| optional LineStyle descendantBorder |
| |
| type IsolatedElementHighlightConfig extends object |
| properties |
| # A descriptor for the highlight appearance of an element in isolation mode. |
| IsolationModeHighlightConfig isolationModeHighlightConfig |
| # Identifier of the isolated element to highlight. |
| DOM.NodeId nodeId |
| |
| type IsolationModeHighlightConfig extends object |
| properties |
| # The fill color of the resizers (default: transparent). |
| optional DOM.RGBA resizerColor |
| # The fill color for resizer handles (default: transparent). |
| optional DOM.RGBA resizerHandleColor |
| # The fill color for the mask covering non-isolated elements (default: transparent). |
| optional DOM.RGBA maskColor |
| |
| type InspectMode extends string |
| enum |
| searchForNode |
| searchForUAShadowDOM |
| captureAreaScreenshot |
| none |
| |
| # Disables domain notifications. |
| command disable |
| |
| # Enables domain notifications. |
| command enable |
| |
| # For testing. |
| command getHighlightObjectForTest |
| parameters |
| # Id of the node to get highlight object for. |
| DOM.NodeId nodeId |
| # Whether to include distance info. |
| optional boolean includeDistance |
| # Whether to include style info. |
| optional boolean includeStyle |
| # The color format to get config with (default: hex). |
| optional ColorFormat colorFormat |
| # Whether to show accessibility info (default: true). |
| optional boolean showAccessibilityInfo |
| returns |
| # Highlight data for the node. |
| object highlight |
| |
| # For Persistent Grid testing. |
| command getGridHighlightObjectsForTest |
| parameters |
| # Ids of the node to get highlight object for. |
| array of DOM.NodeId nodeIds |
| returns |
| # Grid Highlight data for the node ids provided. |
| object highlights |
| |
| # For Source Order Viewer testing. |
| command getSourceOrderHighlightObjectForTest |
| parameters |
| # Id of the node to highlight. |
| DOM.NodeId nodeId |
| returns |
| # Source order highlight data for the node id provided. |
| object highlight |
| |
| # Hides any highlight. |
| command hideHighlight |
| |
| # Highlights owner element of the frame with given id. |
| # Deprecated: Doesn't work reliably and cannot be fixed due to process |
| # separation (the owner node might be in a different process). Determine |
| # the owner node in the client and use highlightNode. |
| deprecated command highlightFrame |
| parameters |
| # Identifier of the frame to highlight. |
| Page.FrameId frameId |
| # The content box highlight fill color (default: transparent). |
| optional DOM.RGBA contentColor |
| # The content box highlight outline color (default: transparent). |
| optional DOM.RGBA contentOutlineColor |
| |
| # Highlights DOM node with given id or with the given JavaScript object wrapper. Either nodeId or |
| # objectId must be specified. |
| command highlightNode |
| parameters |
| # A descriptor for the highlight appearance. |
| HighlightConfig highlightConfig |
| # Identifier of the node to highlight. |
| optional DOM.NodeId nodeId |
| # Identifier of the backend node to highlight. |
| optional DOM.BackendNodeId backendNodeId |
| # JavaScript object id of the node to be highlighted. |
| optional Runtime.RemoteObjectId objectId |
| # Selectors to highlight relevant nodes. |
| optional string selector |
| |
| # Highlights given quad. Coordinates are absolute with respect to the main frame viewport. |
| command highlightQuad |
| parameters |
| # Quad to highlight |
| DOM.Quad quad |
| # The highlight fill color (default: transparent). |
| optional DOM.RGBA color |
| # The highlight outline color (default: transparent). |
| optional DOM.RGBA outlineColor |
| |
| # Highlights given rectangle. Coordinates are absolute with respect to the main frame viewport. |
| # Issue: the method does not handle device pixel ratio (DPR) correctly. |
| # The coordinates currently have to be adjusted by the client |
| # if DPR is not 1 (see crbug.com/437807128). |
| command highlightRect |
| parameters |
| # X coordinate |
| integer x |
| # Y coordinate |
| integer y |
| # Rectangle width |
| integer width |
| # Rectangle height |
| integer height |
| # The highlight fill color (default: transparent). |
| optional DOM.RGBA color |
| # The highlight outline color (default: transparent). |
| optional DOM.RGBA outlineColor |
| |
| # Highlights the source order of the children of the DOM node with given id or with the given |
| # JavaScript object wrapper. Either nodeId or objectId must be specified. |
| command highlightSourceOrder |
| parameters |
| # A descriptor for the appearance of the overlay drawing. |
| SourceOrderConfig sourceOrderConfig |
| # Identifier of the node to highlight. |
| optional DOM.NodeId nodeId |
| # Identifier of the backend node to highlight. |
| optional DOM.BackendNodeId backendNodeId |
| # JavaScript object id of the node to be highlighted. |
| optional Runtime.RemoteObjectId objectId |
| |
| # Enters the 'inspect' mode. In this mode, elements that user is hovering over are highlighted. |
| # Backend then generates 'inspectNodeRequested' event upon element selection. |
| command setInspectMode |
| parameters |
| # Set an inspection mode. |
| InspectMode mode |
| # A descriptor for the highlight appearance of hovered-over nodes. May be omitted if `enabled |
| # == false`. |
| optional HighlightConfig highlightConfig |
| |
| # Highlights owner element of all frames detected to be ads. |
| command setShowAdHighlights |
| parameters |
| # True for showing ad highlights |
| boolean show |
| |
| command setPausedInDebuggerMessage |
| parameters |
| # The message to display, also triggers resume and step over controls. |
| optional string message |
| |
| # Requests that backend shows debug borders on layers |
| command setShowDebugBorders |
| parameters |
| # True for showing debug borders |
| boolean show |
| |
| # Requests that backend shows the FPS counter |
| command setShowFPSCounter |
| parameters |
| # True for showing the FPS counter |
| boolean show |
| |
| # Highlight multiple elements with the CSS Grid overlay. |
| command setShowGridOverlays |
| parameters |
| # An array of node identifiers and descriptors for the highlight appearance. |
| array of GridNodeHighlightConfig gridNodeHighlightConfigs |
| |
| command setShowFlexOverlays |
| parameters |
| # An array of node identifiers and descriptors for the highlight appearance. |
| array of FlexNodeHighlightConfig flexNodeHighlightConfigs |
| |
| command setShowScrollSnapOverlays |
| parameters |
| # An array of node identifiers and descriptors for the highlight appearance. |
| array of ScrollSnapHighlightConfig scrollSnapHighlightConfigs |
| |
| command setShowContainerQueryOverlays |
| parameters |
| # An array of node identifiers and descriptors for the highlight appearance. |
| array of ContainerQueryHighlightConfig containerQueryHighlightConfigs |
| |
| # Requests that backend shows paint rectangles |
| command setShowPaintRects |
| parameters |
| # True for showing paint rectangles |
| boolean result |
| |
| # Requests that backend shows layout shift regions |
| command setShowLayoutShiftRegions |
| parameters |
| # True for showing layout shift regions |
| boolean result |
| |
| # Requests that backend shows scroll bottleneck rects |
| command setShowScrollBottleneckRects |
| parameters |
| # True for showing scroll bottleneck rects |
| boolean show |
| |
| # Deprecated, no longer has any effect. |
| deprecated command setShowHitTestBorders |
| parameters |
| # True for showing hit-test borders |
| boolean show |
| |
| # Deprecated, no longer has any effect. |
| deprecated command setShowWebVitals |
| parameters |
| boolean show |
| |
| # Paints viewport size upon main frame resize. |
| command setShowViewportSizeOnResize |
| parameters |
| # Whether to paint size or not. |
| boolean show |
| |
| # Add a dual screen device hinge |
| command setShowHinge |
| parameters |
| # hinge data, null means hideHinge |
| optional HingeConfig hingeConfig |
| |
| # Show elements in isolation mode with overlays. |
| command setShowIsolatedElements |
| parameters |
| # An array of node identifiers and descriptors for the highlight appearance. |
| array of IsolatedElementHighlightConfig isolatedElementHighlightConfigs |
| |
| # Show Window Controls Overlay for PWA |
| command setShowWindowControlsOverlay |
| parameters |
| # Window Controls Overlay data, null means hide Window Controls Overlay |
| optional WindowControlsOverlayConfig windowControlsOverlayConfig |
| |
| # Fired when the node should be inspected. This happens after call to `setInspectMode` or when |
| # user manually inspects an element. |
| event inspectNodeRequested |
| parameters |
| # Id of the node to inspect. |
| DOM.BackendNodeId backendNodeId |
| |
| # Fired when the node should be highlighted. This happens after call to `setInspectMode`. |
| event nodeHighlightRequested |
| parameters |
| DOM.NodeId nodeId |
| |
| # Fired when user asks to capture screenshot of some area on the page. |
| event screenshotRequested |
| parameters |
| # Viewport to capture, in device independent pixels (dip). |
| Page.Viewport viewport |
| |
| # Fired when user cancels the inspect mode. |
| event inspectModeCanceled |