Hide navigation sidebar
Hide table of contents sidebar
Back to top
Toggle table of contents sidebar

# CSS

This domain exposes CSS read/write operations. All CSS objects (stylesheets, rules, and styles) have an associated `id` used in subsequent operations on the related object. Each object type has a specific `id` structure, and those are not interchangeable between objects of different kinds. CSS objects can be loaded using the `get*ForNode()` calls (which accept a DOM node id). A client can also keep track of stylesheets via the `styleSheetAdded`/`styleSheetRemoved` events and subsequently load the required stylesheet contents using the `getStyleSheet[Text]()` methods.

This CDP domain is experimental.

- Types

- Commands

- Events

## Types

Generally, you do not need to instantiate CDP types yourself. Instead, the API creates objects for you as return values from commands, and then you can use those objects as arguments to other commands.

class StyleSheetId

class StyleSheetOrigin(value, names=None, *, module=None, qualname=None, type=None, start=1, boundary=None)

  Stylesheet type: “injected” for stylesheets injected via extension, “user-agent” for user-agent stylesheets, “inspector” for stylesheets created by the inspector (i.e. those holding the “via inspector” rules), “regular” for regular stylesheets.

  INJECTED = 'injected'
  USER_AGENT = 'user-agent'
  INSPECTOR = 'inspector'
  REGULAR = 'regular'

class PseudoElementMatches(pseudo_type, matches, pseudo_identifier=None)

  CSS rule collection for a single pseudo style.

  pseudo_type: `PseudoType`

    Pseudo element type.

  matches: `List`[`RuleMatch`]

    Matches of CSS rules applicable to the pseudo style.

  pseudo_identifier: `Optional`[`str`] = None

    Pseudo element custom ident.

class CSSAnimationStyle(style, name=None)

  CSS style coming from animations with the name of the animation.

  style: `CSSStyle`

    The style coming from the animation.

  name: `Optional`[`str`] = None

    The name of the animation.

class InheritedStyleEntry(matched_css_rules, inline_style=None)

  Inherited CSS rule collection from ancestor node.

  matched_css_rules: `List`[`RuleMatch`]

    Matches of CSS rules matching the ancestor node in the style inheritance chain.

  inline_style: `Optional`[`CSSStyle`] = None

    The ancestor node’s inline style, if any, in the style inheritance chain.

class InheritedAnimatedStyleEntry(animation_styles=None, transitions_style=None)

  Inherited CSS style collection for animated styles from ancestor node.

  animation_styles: `Optional`[`List`[`CSSAnimationStyle`]] = None

    Styles coming from the animations of the ancestor, if any, in the style inheritance chain.

  transitions_style: `Optional`[`CSSStyle`] = None

    The style coming from the transitions of the ancestor, if any, in the style inheritance chain.

class InheritedPseudoElementMatches(pseudo_elements)

  Inherited pseudo element matches from pseudos of an ancestor node.

  pseudo_elements: `List`[`PseudoElementMatches`]

    Matches of pseudo styles from the pseudos of an ancestor node.

class RuleMatch(rule, matching_selectors)

  Match data for a CSS rule.

  rule: `CSSRule`

    CSS rule in the match.

  matching_selectors: `List`[`int`]

    Matching selector indices in the rule’s selectorList selectors (0-based).

class Value(text, range_=None, specificity=None)

  Data for a simple selector (these are delimited by commas in a selector list).

  text: `str`

    Value text.

  range_: `Optional`[`SourceRange`] = None

    Value range in the underlying resource (if available).

  specificity: `Optional`[`Specificity`] = None

    Specificity of the selector.

class Specificity(a, b, c)

  Specificity: https://drafts.csswg.org/selectors/#specificity-rules

  a: `int`

    The a component, which represents the number of ID selectors.

  b: `int`

    The b component, which represents the number of class selectors, attributes selectors, and pseudo-classes.

  c: `int`

    The c component, which represents the number of type selectors and pseudo-elements.

class SelectorList(selectors, text)

  Selector list data.

  selectors: `List`[`Value`]

    Selectors in the list.

  text: `str`

    Rule selector text.

class CSSStyleSheetHeader(style_sheet_id, frame_id, source_url, origin, title, disabled, is_inline, is_mutable, is_constructed, start_line, start_column, length, end_line, end_column, source_map_url=None, owner_node=None, has_source_url=None, loading_failed=None)

  CSS stylesheet metainformation.

  style_sheet_id: `StyleSheetId`

    The stylesheet identifier.

  frame_id: `FrameId`

    Owner frame identifier.

  source_url: `str`

    Stylesheet resource URL. Empty if this is a constructed stylesheet created using new CSSStyleSheet() (but non-empty if this is a constructed stylesheet imported as a CSS module script).

  origin: `StyleSheetOrigin`

    Stylesheet origin.

  title: `str`

    Stylesheet title.

  disabled: `bool`

    Denotes whether the stylesheet is disabled.

  is_inline: `bool`

    Whether this stylesheet is created for STYLE tag by parser. This flag is not set for document.written STYLE tags.

  is_mutable: `bool`

    Whether this stylesheet is mutable. Inline stylesheets become mutable after they have been modified via CSSOM API. `<link>` element’s stylesheets become mutable only if DevTools modifies them. Constructed stylesheets (new CSSStyleSheet()) are mutable immediately after creation.

  is_constructed: `bool`

    True if this stylesheet is created through new CSSStyleSheet() or imported as a CSS module script.

  start_line: `float`

    Line offset of the stylesheet within the resource (zero based).

  start_column: `float`

    Column offset of the stylesheet within the resource (zero based).

  length: `float`

    Size of the content (in characters).

  end_line: `float`

    Line offset of the end of the stylesheet within the resource (zero based).

  end_column: `float`

    Column offset of the end of the stylesheet within the resource (zero based).

  source_map_url: `Optional`[`str`] = None

    URL of source map associated with the stylesheet (if any).

  owner_node: `Optional`[`BackendNodeId`] = None

    The backend id for the owner node of the stylesheet.

  has_source_url: `Optional`[`bool`] = None

    Whether the sourceURL field value comes from the sourceURL comment.

  loading_failed: `Optional`[`bool`] = None

    If the style sheet was loaded from a network resource, this indicates when the resource failed to load

class CSSRule(selector_list, origin, style, style_sheet_id=None, nesting_selectors=None, media=None, container_queries=None, supports=None, layers=None, scopes=None, rule_types=None, starting_styles=None)

  CSS rule representation.

  selector_list: `SelectorList`

    Rule selector data.

  origin: `StyleSheetOrigin`

    Parent stylesheet’s origin.

  style: `CSSStyle`

    Associated style declaration.

  style_sheet_id: `Optional`[`StyleSheetId`] = None

    The css style sheet identifier (absent for user agent stylesheet and user-specified stylesheet rules) this rule came from.

  nesting_selectors: `Optional`[`List`[`str`]] = None

    Array of selectors from ancestor style rules, sorted by distance from the current rule.

  media: `Optional`[`List`[`CSSMedia`]] = None

    Media list array (for rules involving media queries). The array enumerates media queries starting with the innermost one, going outwards.

  container_queries: `Optional`[`List`[`CSSContainerQuery`]] = None

    Container query list array (for rules involving container queries). The array enumerates container queries starting with the innermost one, going outwards.

  supports: `Optional`[`List`[`CSSSupports`]] = None

    @supports CSS at-rule array. The array enumerates @supports at-rules starting with the innermost one, going outwards.

  layers: `Optional`[`List`[`CSSLayer`]] = None

    Cascade layer array. Contains the layer hierarchy that this rule belongs to starting with the innermost layer and going outwards.

  scopes: `Optional`[`List`[`CSSScope`]] = None

    @scope CSS at-rule array. The array enumerates @scope at-rules starting with the innermost one, going outwards.

  rule_types: `Optional`[`List`[`CSSRuleType`]] = None

    The array keeps the types of ancestor CSSRules from the innermost going outwards.

  starting_styles: `Optional`[`List`[`CSSStartingStyle`]] = None

    @starting-style CSS at-rule array. The array enumerates @starting-style at-rules starting with the innermost one, going outwards.

class CSSRuleType(value, names=None, *, module=None, qualname=None, type=None, start=1, boundary=None)

  Enum indicating the type of a CSS rule, used to represent the order of a style rule’s ancestors. This list only contains rule types that are collected during the ancestor rule collection.

  MEDIA_RULE = 'MediaRule'
  SUPPORTS_RULE = 'SupportsRule'
  CONTAINER_RULE = 'ContainerRule'
  LAYER_RULE = 'LayerRule'
  SCOPE_RULE = 'ScopeRule'
  STYLE_RULE = 'StyleRule'
  STARTING_STYLE_RULE = 'StartingStyleRule'

class RuleUsage(style_sheet_id, start_offset, end_offset, used)

  CSS coverage information.

  style_sheet_id: `StyleSheetId`

    The css style sheet identifier (absent for user agent stylesheet and user-specified stylesheet rules) this rule came from.

  start_offset: `float`

    Offset of the start of the rule (including selector) from the beginning of the stylesheet.

  end_offset: `float`

    Offset of the end of the rule body from the beginning of the stylesheet.

  used: `bool`

    Indicates whether the rule was actually used by some element in the page.

class SourceRange(start_line, start_column, end_line, end_column)

  Text range within a resource. All numbers are zero-based.

  start_line: `int`

    Start line of range.

  start_column: `int`

    Start column of range (inclusive).

  end_line: `int`

    End line of range

  end_column: `int`

    End column of range (exclusive).

class ShorthandEntry(name, value, important=None)
  name: `str`

    Shorthand name.

  value: `str`

    Shorthand value.

  important: `Optional`[`bool`] = None

    Whether the property has “!important” annotation (implies `false` if absent).

class CSSComputedStyleProperty(name, value)
  name: `str`

    Computed style property name.

  value: `str`

    Computed style property value.

class ComputedStyleExtraFields(is_appearance_base)
  is_appearance_base: `bool`

    Returns whether or not this node is being rendered with base appearance, which happens when it has its appearance property set to base/base-select or it is in the subtree of an element being rendered with base appearance.

class CSSStyle(css_properties, shorthand_entries, style_sheet_id=None, css_text=None, range_=None)

  CSS style representation.

  css_properties: `List`[`CSSProperty`]

    CSS properties in the style.

  shorthand_entries: `List`[`ShorthandEntry`]

    Computed values for all shorthands found in the style.

  style_sheet_id: `Optional`[`StyleSheetId`] = None

    The css style sheet identifier (absent for user agent stylesheet and user-specified stylesheet rules) this rule came from.

  css_text: `Optional`[`str`] = None

    Style declaration text (if available).

  range_: `Optional`[`SourceRange`] = None

    Style declaration range in the enclosing stylesheet (if available).

class CSSProperty(name, value, important=None, implicit=None, text=None, parsed_ok=None, disabled=None, range_=None, longhand_properties=None)

  CSS property declaration data.

  name: `str`

    The property name.

  value: `str`

    The property value.

  important: `Optional`[`bool`] = None

    Whether the property has “!important” annotation (implies `false` if absent).

  implicit: `Optional`[`bool`] = None

    Whether the property is implicit (implies `false` if absent).

  text: `Optional`[`str`] = None

    The full property text as specified in the style.

  parsed_ok: `Optional`[`bool`] = None

    Whether the property is understood by the browser (implies `true` if absent).

  disabled: `Optional`[`bool`] = None

    Whether the property is disabled by the user (present for source-based properties only).

  range_: `Optional`[`SourceRange`] = None

    The entire property range in the enclosing style declaration (if available).

  longhand_properties: `Optional`[`List`[`CSSProperty`]] = None

    Parsed longhand components of this property if it is a shorthand. This field will be empty if the given property is not a shorthand.

class CSSMedia(text, source, source_url=None, range_=None, style_sheet_id=None, media_list=None)

  CSS media rule descriptor.

  text: `str`

    Media query text.

  source: `str`

    “mediaRule” if specified by a @media rule, “importRule” if specified by an @import rule, “linkedSheet” if specified by a “media” attribute in a linked stylesheet’s LINK tag, “inlineSheet” if specified by a “media” attribute in an inline stylesheet’s STYLE tag.

    Type:

      Source of the media query

  source_url: `Optional`[`str`] = None

    URL of the document containing the media query description.

  range_: `Optional`[`SourceRange`] = None

    The associated rule (@media or @import) header range in the enclosing stylesheet (if available).

  style_sheet_id: `Optional`[`StyleSheetId`] = None

    Identifier of the stylesheet containing this object (if exists).

  media_list: `Optional`[`List`[`MediaQuery`]] = None

    Array of media queries.

class MediaQuery(expressions, active)

  Media query descriptor.

  expressions: `List`[`MediaQueryExpression`]

    Array of media query expressions.

  active: `bool`

    Whether the media query condition is satisfied.

class MediaQueryExpression(value, unit, feature, value_range=None, computed_length=None)

  Media query expression descriptor.

  value: `float`

    Media query expression value.

  unit: `str`

    Media query expression units.

  feature: `str`

    Media query expression feature.

  value_range: `Optional`[`SourceRange`] = None

    The associated range of the value text in the enclosing stylesheet (if available).

  computed_length: `Optional`[`float`] = None

    Computed length of media query expression (if applicable).

class CSSContainerQuery(text, range_=None, style_sheet_id=None, name=None, physical_axes=None, logical_axes=None, queries_scroll_state=None, queries_anchored=None)

  CSS container query rule descriptor.

  text: `str`

    Container query text.

  range_: `Optional`[`SourceRange`] = None

    The associated rule header range in the enclosing stylesheet (if available).

  style_sheet_id: `Optional`[`StyleSheetId`] = None

    Identifier of the stylesheet containing this object (if exists).

  name: `Optional`[`str`] = None

    Optional name for the container.

  physical_axes: `Optional`[`PhysicalAxes`] = None

    Optional physical axes queried for the container.

  logical_axes: `Optional`[`LogicalAxes`] = None

    Optional logical axes queried for the container.

  queries_scroll_state: `Optional`[`bool`] = None

    true if the query contains scroll-state() queries.

  queries_anchored: `Optional`[`bool`] = None

    true if the query contains anchored() queries.

class CSSSupports(text, active, range_=None, style_sheet_id=None)

  CSS Supports at-rule descriptor.

  text: `str`

    Supports rule text.

  active: `bool`

    Whether the supports condition is satisfied.

  range_: `Optional`[`SourceRange`] = None

    The associated rule header range in the enclosing stylesheet (if available).

  style_sheet_id: `Optional`[`StyleSheetId`] = None

    Identifier of the stylesheet containing this object (if exists).

class CSSScope(text, range_=None, style_sheet_id=None)

  CSS Scope at-rule descriptor.

  text: `str`

    Scope rule text.

  range_: `Optional`[`SourceRange`] = None

    The associated rule header range in the enclosing stylesheet (if available).

  style_sheet_id: `Optional`[`StyleSheetId`] = None

    Identifier of the stylesheet containing this object (if exists).

class CSSLayer(text, range_=None, style_sheet_id=None)

  CSS Layer at-rule descriptor.

  text: `str`

    Layer name.

  range_: `Optional`[`SourceRange`] = None

    The associated rule header range in the enclosing stylesheet (if available).

  style_sheet_id: `Optional`[`StyleSheetId`] = None

    Identifier of the stylesheet containing this object (if exists).

class CSSStartingStyle(range_=None, style_sheet_id=None)

  CSS Starting Style at-rule descriptor.

  range_: `Optional`[`SourceRange`] = None

    The associated rule header range in the enclosing stylesheet (if available).

  style_sheet_id: `Optional`[`StyleSheetId`] = None

    Identifier of the stylesheet containing this object (if exists).

class CSSLayerData(name, order, sub_layers=None)

  CSS Layer data.

  name: `str`

    Layer name.

  order: `float`

    Layer order. The order determines the order of the layer in the cascade order. A higher number has higher priority in the cascade order.

  sub_layers: `Optional`[`List`[`CSSLayerData`]] = None

    Direct sub-layers

class PlatformFontUsage(family_name, post_script_name, is_custom_font, glyph_count)

  Information about amount of glyphs that were rendered with given font.

  family_name: `str`

    Font’s family name reported by platform.

  post_script_name: `str`

    Font’s PostScript name reported by platform.

  is_custom_font: `bool`

    Indicates if the font was downloaded or resolved locally.

  glyph_count: `float`

    Amount of glyphs that were rendered with this font.

class FontVariationAxis(tag, name, min_value, max_value, default_value)

  Information about font variation axes for variable fonts

  tag: `str`

    The font-variation-setting tag (a.k.a. “axis tag”).

  name: `str`

    Human-readable variation name in the default language (normally, “en”).

  min_value: `float`

    The minimum value (inclusive) the font supports for this tag.

  max_value: `float`

    The maximum value (inclusive) the font supports for this tag.

  default_value: `float`

    The default value.

class FontFace(font_family, font_style, font_variant, font_weight, font_stretch, font_display, unicode_range, src, platform_font_family, font_variation_axes=None)

  Properties of a web font: https://www.w3.org/TR/2008/REC-CSS2-20080411/fonts.html#font-descriptions and additional information such as platformFontFamily and fontVariationAxes.

  font_family: `str`

    The font-family.

  font_style: `str`

    The font-style.

  font_variant: `str`

    The font-variant.

  font_weight: `str`

    The font-weight.

  font_stretch: `str`

    The font-stretch.

  font_display: `str`

    The font-display.

  unicode_range: `str`

    The unicode-range.

  src: `str`

    The src.

  platform_font_family: `str`

    The resolved platform font family

  font_variation_axes: `Optional`[`List`[`FontVariationAxis`]] = None

    Available variation settings (a.k.a. “axes”).

class CSSTryRule(origin, style, style_sheet_id=None)

  CSS try rule representation.

  origin: `StyleSheetOrigin`

    Parent stylesheet’s origin.

  style: `CSSStyle`

    Associated style declaration.

  style_sheet_id: `Optional`[`StyleSheetId`] = None

    The css style sheet identifier (absent for user agent stylesheet and user-specified stylesheet rules) this rule came from.

class CSSPositionTryRule(name, origin, style, active, style_sheet_id=None)

  CSS @position-try rule representation.

  name: `Value`

    The prelude dashed-ident name

  origin: `StyleSheetOrigin`

    Parent stylesheet’s origin.

  style: `CSSStyle`

    Associated style declaration.

  active: `bool`
  style_sheet_id: `Optional`[`StyleSheetId`] = None

    The css style sheet identifier (absent for user agent stylesheet and user-specified stylesheet rules) this rule came from.

class CSSKeyframesRule(animation_name, keyframes)

  CSS keyframes rule representation.

  animation_name: `Value`

    Animation name.

  keyframes: `List`[`CSSKeyframeRule`]

    List of keyframes.

class CSSPropertyRegistration(property_name, inherits, syntax, initial_value=None)

  Representation of a custom property registration through CSS.registerProperty

  property_name: `str`
  inherits: `bool`
  syntax: `str`
  initial_value: `Optional`[`Value`] = None

class CSSFontPaletteValuesRule(origin, font_palette_name, style, style_sheet_id=None)

  CSS font-palette-values rule representation.

  origin: `StyleSheetOrigin`

    Parent stylesheet’s origin.

  font_palette_name: `Value`

    Associated font palette name.

  style: `CSSStyle`

    Associated style declaration.

  style_sheet_id: `Optional`[`StyleSheetId`] = None

    The css style sheet identifier (absent for user agent stylesheet and user-specified stylesheet rules) this rule came from.

class CSSPropertyRule(origin, property_name, style, style_sheet_id=None)

  CSS property at-rule representation.

  origin: `StyleSheetOrigin`

    Parent stylesheet’s origin.

  property_name: `Value`

    Associated property name.

  style: `CSSStyle`

    Associated style declaration.

  style_sheet_id: `Optional`[`StyleSheetId`] = None

    The css style sheet identifier (absent for user agent stylesheet and user-specified stylesheet rules) this rule came from.

class CSSFunctionParameter(name, type_)

  CSS function argument representation.

  name: `str`

    The parameter name.

  type_: `str`

    The parameter type.

class CSSFunctionConditionNode(children, condition_text, media=None, container_queries=None, supports=None)

  CSS function conditional block representation.

  children: `List`[`CSSFunctionNode`]

    Block body.

  condition_text: `str`

    The condition text.

  media: `Optional`[`CSSMedia`] = None

    Media query for this conditional block. Only one type of condition should be set.

  container_queries: `Optional`[`CSSContainerQuery`] = None

    Container query for this conditional block. Only one type of condition should be set.

  supports: `Optional`[`CSSSupports`] = None

    @supports CSS at-rule condition. Only one type of condition should be set.

class CSSFunctionNode(condition=None, style=None)

  Section of the body of a CSS function rule.

  condition: `Optional`[`CSSFunctionConditionNode`] = None

    A conditional block. If set, style should not be set.

  style: `Optional`[`CSSStyle`] = None

    Values set by this node. If set, condition should not be set.

class CSSFunctionRule(name, origin, parameters, children, style_sheet_id=None)

  CSS function at-rule representation.

  name: `Value`

    Name of the function.

  origin: `StyleSheetOrigin`

    Parent stylesheet’s origin.

  parameters: `List`[`CSSFunctionParameter`]

    List of parameters.

  children: `List`[`CSSFunctionNode`]

    Function body.

  style_sheet_id: `Optional`[`StyleSheetId`] = None

    The css style sheet identifier (absent for user agent stylesheet and user-specified stylesheet rules) this rule came from.

class CSSKeyframeRule(origin, key_text, style, style_sheet_id=None)

  CSS keyframe rule representation.

  origin: `StyleSheetOrigin`

    Parent stylesheet’s origin.

  key_text: `Value`

    Associated key text.

  style: `CSSStyle`

    Associated style declaration.

  style_sheet_id: `Optional`[`StyleSheetId`] = None

    The css style sheet identifier (absent for user agent stylesheet and user-specified stylesheet rules) this rule came from.

class StyleDeclarationEdit(style_sheet_id, range_, text)

  A descriptor of operation to mutate style declaration text.

  style_sheet_id: `StyleSheetId`

    The css style sheet identifier.

  range_: `SourceRange`

    The range of the style text in the enclosing stylesheet.

  text: `str`

    New style text.

## Commands

Each command is a generator function. The return type `Generator[x, y, z]` indicates that the generator yields arguments of type `x`, it must be resumed with an argument of type `y`, and it returns type `z`. In this library, types `x` and `y` are the same for all commands, and `z` is the return type you should pay attention to. For more information, see Getting Started: Commands.

add_rule(style_sheet_id, rule_text, location, node_for_property_syntax_validation=None)

  Inserts a new rule with the given `ruleText` in a stylesheet with given `styleSheetId`, at the position specified by `location`.

  Parameters:

    - style_sheet_id (`StyleSheetId`) – The css style sheet identifier where a new rule should be inserted.

    - rule_text (`str`) – The text of a new rule.

    - location (`SourceRange`) – Text position of a new rule in the target style sheet.

    - node_for_property_syntax_validation (`Optional`[`NodeId`]) – (EXPERIMENTAL) (Optional) NodeId for the DOM node in whose context custom property declarations for registered properties should be validated. If omitted, declarations in the new rule text can only be validated statically, which may produce incorrect results if the declaration contains a var() for example.

  Return type:

    `Generator`[`Dict`[`str`, `Any`], `Dict`[`str`, `Any`], `CSSRule`]

  Returns:

    The newly created rule.

collect_class_names(style_sheet_id)

  Returns all class names from specified stylesheet.

  Parameters:

    style_sheet_id (`StyleSheetId`) –

  Return type:

    `Generator`[`Dict`[`str`, `Any`], `Dict`[`str`, `Any`], `List`[`str`]]

  Returns:

    Class name list.

create_style_sheet(frame_id, force=None)

  Creates a new special “via-inspector” stylesheet in the frame with given `frameId`.

  Parameters:

    - frame_id (`FrameId`) – Identifier of the frame where “via-inspector” stylesheet should be created.

    - force (`Optional`[`bool`]) – (Optional) If true, creates a new stylesheet for every call. If false, returns a stylesheet previously created by a call with force=false for the frame’s document if it exists or creates a new stylesheet (default: false).

  Return type:

    `Generator`[`Dict`[`str`, `Any`], `Dict`[`str`, `Any`], `StyleSheetId`]

  Returns:

    Identifier of the created “via-inspector” stylesheet.

disable()

  Disables the CSS agent for the given page.

  Return type:

    `Generator`[`Dict`[`str`, `Any`], `Dict`[`str`, `Any`], `None`]

enable()

  Enables the CSS agent for the given page. Clients should not assume that the CSS agent has been enabled until the result of this command is received.

  Return type:

    `Generator`[`Dict`[`str`, `Any`], `Dict`[`str`, `Any`], `None`]

force_pseudo_state(node_id, forced_pseudo_classes)

  Ensures that the given node will have specified pseudo-classes whenever its style is computed by the browser.

  Parameters:

    - node_id (`NodeId`) – The element id for which to force the pseudo state.

    - forced_pseudo_classes (`List`[`str`]) – Element pseudo classes to force when computing the element’s style.

  Return type:

    `Generator`[`Dict`[`str`, `Any`], `Dict`[`str`, `Any`], `None`]

force_starting_style(node_id, forced)

  Ensures that the given node is in its starting-style state.

  Parameters:

    - node_id (`NodeId`) – The element id for which to force the starting-style state.

    - forced (`bool`) – Boolean indicating if this is on or off.

  Return type:

    `Generator`[`Dict`[`str`, `Any`], `Dict`[`str`, `Any`], `None`]

get_animated_styles_for_node(node_id)

  Returns the styles coming from animations & transitions including the animation & transition styles coming from inheritance chain.

  EXPERIMENTAL

  Parameters:

    node_id (`NodeId`) –

  Return type:

    `Generator`[`Dict`[`str`, `Any`], `Dict`[`str`, `Any`], `Tuple`[`Optional`[`List`[`CSSAnimationStyle`]], `Optional`[`CSSStyle`], `Optional`[`List`[`InheritedAnimatedStyleEntry`]]]]

  Returns:

    A tuple with the following items:

    0. animationStyles - (Optional) Styles coming from animations.

    1. transitionsStyle - (Optional) Style coming from transitions.

    2. inherited - (Optional) Inherited style entries for animationsStyle and transitionsStyle from the inheritance chain of the element.

get_background_colors(node_id)
  Parameters:

    node_id (`NodeId`) – Id of the node to get background colors for.

  Return type:

    `Generator`[`Dict`[`str`, `Any`], `Dict`[`str`, `Any`], `Tuple`[`Optional`[`List`[`str`]], `Optional`[`str`], `Optional`[`str`]]]

  Returns:

    A tuple with the following items:

    0. backgroundColors - (Optional) The range of background colors behind this element, if it contains any visible text. If no visible text is present, this will be undefined. In the case of a flat background color, this will consist of simply that color. In the case of a gradient, this will consist of each of the color stops. For anything more complicated, this will be an empty array. Images will be ignored (as if the image had failed to load).

    1. computedFontSize - (Optional) The computed font size for this node, as a CSS computed value string (e.g. ‘12px’).

    2. computedFontWeight - (Optional) The computed font weight for this node, as a CSS computed value string (e.g. ‘normal’ or ‘100’).

get_computed_style_for_node(node_id)

  Returns the computed style for a DOM node identified by `nodeId`.

  Parameters:

    node_id (`NodeId`) –

  Return type:

    `Generator`[`Dict`[`str`, `Any`], `Dict`[`str`, `Any`], `Tuple`[`List`[`CSSComputedStyleProperty`], `ComputedStyleExtraFields`]]

  Returns:

    A tuple with the following items:

    0. computedStyle - Computed style for the specified DOM node.

    1. extraFields - A list of non-standard “extra fields” which blink stores alongside each computed style.

get_environment_variables()

  Returns the values of the default UA-defined environment variables used in env()

  EXPERIMENTAL

  Return type:

    `Generator`[`Dict`[`str`, `Any`], `Dict`[`str`, `Any`], `dict`]

  Returns:

get_inline_styles_for_node(node_id)

  Returns the styles defined inline (explicitly in the “style” attribute and implicitly, using DOM attributes) for a DOM node identified by `nodeId`.

  Parameters:

    node_id (`NodeId`) –

  Return type:

    `Generator`[`Dict`[`str`, `Any`], `Dict`[`str`, `Any`], `Tuple`[`Optional`[`CSSStyle`], `Optional`[`CSSStyle`]]]

  Returns:

    A tuple with the following items:

    0. inlineStyle - (Optional) Inline style for the specified DOM node.

    1. attributesStyle - (Optional) Attribute-defined element style (e.g. resulting from “width=20 height=100%”).

get_layers_for_node(node_id)

  Returns all layers parsed by the rendering engine for the tree scope of a node. Given a DOM element identified by nodeId, getLayersForNode returns the root layer for the nearest ancestor document or shadow root. The layer root contains the full layer tree for the tree scope and their ordering.

  EXPERIMENTAL

  Parameters:

    node_id (`NodeId`) –

  Return type:

    `Generator`[`Dict`[`str`, `Any`], `Dict`[`str`, `Any`], `CSSLayerData`]

  Returns:

get_location_for_selector(style_sheet_id, selector_text)

  Given a CSS selector text and a style sheet ID, getLocationForSelector returns an array of locations of the CSS selector in the style sheet.

  EXPERIMENTAL

  Parameters:

    - style_sheet_id (`StyleSheetId`) –

    - selector_text (`str`) –

  Return type:

    `Generator`[`Dict`[`str`, `Any`], `Dict`[`str`, `Any`], `List`[`SourceRange`]]

  Returns:

get_longhand_properties(shorthand_name, value)

  EXPERIMENTAL

  Parameters:

    - shorthand_name (`str`) –

    - value (`str`) –

  Return type:

    `Generator`[`Dict`[`str`, `Any`], `Dict`[`str`, `Any`], `List`[`CSSProperty`]]

  Returns:

get_matched_styles_for_node(node_id)

  Returns requested styles for a DOM node identified by `nodeId`.

  Parameters:

    node_id (`NodeId`) –

  Return type:

    `Generator`[`Dict`[`str`, `Any`], `Dict`[`str`, `Any`], `Tuple`[`Optional`[`CSSStyle`], `Optional`[`CSSStyle`], `Optional`[`List`[`RuleMatch`]], `Optional`[`List`[`PseudoElementMatches`]], `Optional`[`List`[`InheritedStyleEntry`]], `Optional`[`List`[`InheritedPseudoElementMatches`]], `Optional`[`List`[`CSSKeyframesRule`]], `Optional`[`List`[`CSSPositionTryRule`]], `Optional`[`int`], `Optional`[`List`[`CSSPropertyRule`]], `Optional`[`List`[`CSSPropertyRegistration`]], `Optional`[`CSSFontPaletteValuesRule`], `Optional`[`NodeId`], `Optional`[`List`[`CSSFunctionRule`]]]]

  Returns:

    A tuple with the following items:

    0. inlineStyle - (Optional) Inline style for the specified DOM node.

    1. attributesStyle - (Optional) Attribute-defined element style (e.g. resulting from “width=20 height=100%”).

    2. matchedCSSRules - (Optional) CSS rules matching this node, from all applicable stylesheets.

    3. pseudoElements - (Optional) Pseudo style matches for this node.

    4. inherited - (Optional) A chain of inherited styles (from the immediate node parent up to the DOM tree root).

    5. inheritedPseudoElements - (Optional) A chain of inherited pseudo element styles (from the immediate node parent up to the DOM tree root).

    6. cssKeyframesRules - (Optional) A list of CSS keyframed animations matching this node.

    7. cssPositionTryRules - (Optional) A list of CSS @position-try rules matching this node, based on the position-try-fallbacks property.

    8. activePositionFallbackIndex - (Optional) Index of the active fallback in the applied position-try-fallback property, will not be set if there is no active position-try fallback.

    9. cssPropertyRules - (Optional) A list of CSS at-property rules matching this node.

    10. cssPropertyRegistrations - (Optional) A list of CSS property registrations matching this node.

    11. cssFontPaletteValuesRule - (Optional) A font-palette-values rule matching this node.

    12. parentLayoutNodeId - (Optional) Id of the first parent element that does not have display: contents.

    13. cssFunctionRules - (Optional) A list of CSS at-function rules referenced by styles of this node.

get_media_queries()

  Returns all media queries parsed by the rendering engine.

  Return type:

    `Generator`[`Dict`[`str`, `Any`], `Dict`[`str`, `Any`], `List`[`CSSMedia`]]

  Returns:

get_platform_fonts_for_node(node_id)

  Requests information about platform fonts which we used to render child TextNodes in the given node.

  Parameters:

    node_id (`NodeId`) –

  Return type:

    `Generator`[`Dict`[`str`, `Any`], `Dict`[`str`, `Any`], `List`[`PlatformFontUsage`]]

  Returns:

    Usage statistics for every employed platform font.

get_style_sheet_text(style_sheet_id)

  Returns the current textual content for a stylesheet.

  Parameters:

    style_sheet_id (`StyleSheetId`) –

  Return type:

    `Generator`[`Dict`[`str`, `Any`], `Dict`[`str`, `Any`], `str`]

  Returns:

    The stylesheet text.

resolve_values(values, node_id, property_name=None, pseudo_type=None, pseudo_identifier=None)

  Resolve the specified values in the context of the provided element. For example, a value of ‘1em’ is evaluated according to the computed ‘font-size’ of the element and a value ‘calc(1px + 2px)’ will be resolved to ‘3px’. If the `propertyName` was specified the `values` are resolved as if they were property’s declaration. If a value cannot be parsed according to the provided property syntax, the value is parsed using combined syntax as if null `propertyName` was provided. If the value cannot be resolved even then, return the provided value without any changes.

  EXPERIMENTAL

  Parameters:

    - values (`List`[`str`]) – Cascade-dependent keywords (revert/revert-layer) do not work.

    - node_id (`NodeId`) – Id of the node in whose context the expression is evaluated

    - property_name (`Optional`[`str`]) – (Optional) Only longhands and custom property names are accepted.

    - pseudo_type (`Optional`[`PseudoType`]) – (Optional) Pseudo element type, only works for pseudo elements that generate elements in the tree, such as ::before and ::after.

    - pseudo_identifier (`Optional`[`str`]) – (Optional) Pseudo element custom ident.

  Return type:

    `Generator`[`Dict`[`str`, `Any`], `Dict`[`str`, `Any`], `List`[`str`]]

  Returns:

set_container_query_text(style_sheet_id, range_, text)

  Modifies the expression of a container query.

  EXPERIMENTAL

  Parameters:

    - style_sheet_id (`StyleSheetId`) –

    - range –

    - text (`str`) –

  Return type:

    `Generator`[`Dict`[`str`, `Any`], `Dict`[`str`, `Any`], `CSSContainerQuery`]

  Returns:

    The resulting CSS container query rule after modification.

set_effective_property_value_for_node(node_id, property_name, value)

  Find a rule with the given active property for the given node and set the new value for this property

  Parameters:

    - node_id (`NodeId`) – The element id for which to set property.

    - property_name (`str`) –

    - value (`str`) –

  Return type:

    `Generator`[`Dict`[`str`, `Any`], `Dict`[`str`, `Any`], `None`]

set_keyframe_key(style_sheet_id, range_, key_text)

  Modifies the keyframe rule key text.

  Parameters:

    - style_sheet_id (`StyleSheetId`) –

    - range –

    - key_text (`str`) –

  Return type:

    `Generator`[`Dict`[`str`, `Any`], `Dict`[`str`, `Any`], `Value`]

  Returns:

    The resulting key text after modification.

set_local_fonts_enabled(enabled)

  Enables/disables rendering of local CSS fonts (enabled by default).

  EXPERIMENTAL

  Parameters:

    enabled (`bool`) – Whether rendering of local fonts is enabled.

  Return type:

    `Generator`[`Dict`[`str`, `Any`], `Dict`[`str`, `Any`], `None`]

set_media_text(style_sheet_id, range_, text)

  Modifies the rule selector.

  Parameters:

    - style_sheet_id (`StyleSheetId`) –

    - range –

    - text (`str`) –

  Return type:

    `Generator`[`Dict`[`str`, `Any`], `Dict`[`str`, `Any`], `CSSMedia`]

  Returns:

    The resulting CSS media rule after modification.

set_property_rule_property_name(style_sheet_id, range_, property_name)

  Modifies the property rule property name.

  Parameters:

    - style_sheet_id (`StyleSheetId`) –

    - range –

    - property_name (`str`) –

  Return type:

    `Generator`[`Dict`[`str`, `Any`], `Dict`[`str`, `Any`], `Value`]

  Returns:

    The resulting key text after modification.

set_rule_selector(style_sheet_id, range_, selector)

  Modifies the rule selector.

  Parameters:

    - style_sheet_id (`StyleSheetId`) –

    - range –

    - selector (`str`) –

  Return type:

    `Generator`[`Dict`[`str`, `Any`], `Dict`[`str`, `Any`], `SelectorList`]

  Returns:

    The resulting selector list after modification.

set_scope_text(style_sheet_id, range_, text)

  Modifies the expression of a scope at-rule.

  EXPERIMENTAL

  Parameters:

    - style_sheet_id (`StyleSheetId`) –

    - range –

    - text (`str`) –

  Return type:

    `Generator`[`Dict`[`str`, `Any`], `Dict`[`str`, `Any`], `CSSScope`]

  Returns:

    The resulting CSS Scope rule after modification.

set_style_sheet_text(style_sheet_id, text)

  Sets the new stylesheet text.

  Parameters:

    - style_sheet_id (`StyleSheetId`) –

    - text (`str`) –

  Return type:

    `Generator`[`Dict`[`str`, `Any`], `Dict`[`str`, `Any`], `Optional`[`str`]]

  Returns:

    (Optional) URL of source map associated with script (if any).

set_style_texts(edits, node_for_property_syntax_validation=None)

  Applies specified style edits one after another in the given order.

  Parameters:

    - edits (`List`[`StyleDeclarationEdit`]) –

    - node_for_property_syntax_validation (`Optional`[`NodeId`]) – (EXPERIMENTAL) (Optional) NodeId for the DOM node in whose context custom property declarations for registered properties should be validated. If omitted, declarations in the new rule text can only be validated statically, which may produce incorrect results if the declaration contains a var() for example.

  Return type:

    `Generator`[`Dict`[`str`, `Any`], `Dict`[`str`, `Any`], `List`[`CSSStyle`]]

  Returns:

    The resulting styles after modification.

set_supports_text(style_sheet_id, range_, text)

  Modifies the expression of a supports at-rule.

  EXPERIMENTAL

  Parameters:

    - style_sheet_id (`StyleSheetId`) –

    - range –

    - text (`str`) –

  Return type:

    `Generator`[`Dict`[`str`, `Any`], `Dict`[`str`, `Any`], `CSSSupports`]

  Returns:

    The resulting CSS Supports rule after modification.

start_rule_usage_tracking()

  Enables the selector recording.

  Return type:

    `Generator`[`Dict`[`str`, `Any`], `Dict`[`str`, `Any`], `None`]

stop_rule_usage_tracking()

  Stop tracking rule usage and return the list of rules that were used since last call to `takeCoverageDelta` (or since start of coverage instrumentation).

  Return type:

    `Generator`[`Dict`[`str`, `Any`], `Dict`[`str`, `Any`], `List`[`RuleUsage`]]

  Returns:

take_computed_style_updates()

  Polls the next batch of computed style updates.

  EXPERIMENTAL

  Return type:

    `Generator`[`Dict`[`str`, `Any`], `Dict`[`str`, `Any`], `List`[`NodeId`]]

  Returns:

    The list of node Ids that have their tracked computed styles updated.

take_coverage_delta()

  Obtain list of rules that became used since last call to this method (or since start of coverage instrumentation).

  Return type:

    `Generator`[`Dict`[`str`, `Any`], `Dict`[`str`, `Any`], `Tuple`[`List`[`RuleUsage`], `float`]]

  Returns:

    A tuple with the following items:

    0. coverage -

    1. timestamp - Monotonically increasing time, in seconds.

track_computed_style_updates(properties_to_track)

  Starts tracking the given computed styles for updates. The specified array of properties replaces the one previously specified. Pass empty array to disable tracking. Use takeComputedStyleUpdates to retrieve the list of nodes that had properties modified. The changes to computed style properties are only tracked for nodes pushed to the front-end by the DOM agent. If no changes to the tracked properties occur after the node has been pushed to the front-end, no updates will be issued for the node.

  EXPERIMENTAL

  Parameters:

    properties_to_track (`List`[`CSSComputedStyleProperty`]) –

  Return type:

    `Generator`[`Dict`[`str`, `Any`], `Dict`[`str`, `Any`], `None`]

track_computed_style_updates_for_node(node_id=None)

  Starts tracking the given node for the computed style updates and whenever the computed style is updated for node, it queues a `computedStyleUpdated` event with throttling. There can only be 1 node tracked for computed style updates so passing a new node id removes tracking from the previous node. Pass `undefined` to disable tracking.

  EXPERIMENTAL

  Parameters:

    node_id (`Optional`[`NodeId`]) – (Optional)

  Return type:

    `Generator`[`Dict`[`str`, `Any`], `Dict`[`str`, `Any`], `None`]

## Events

Generally, you do not need to instantiate CDP events yourself. Instead, the API creates events for you and then you use the event’s attributes.

class FontsUpdated(font)

  Fires whenever a web font is updated. A non-empty font parameter indicates a successfully loaded web font.

  font: `Optional`[`FontFace`]

    The web font that has loaded.

class MediaQueryResultChanged

  Fires whenever a MediaQuery result changes (for example, after a browser window has been resized.) The current implementation considers only viewport-dependent media features.

class StyleSheetAdded(header)

  Fired whenever an active document stylesheet is added.

  header: `CSSStyleSheetHeader`

    Added stylesheet metainfo.

class StyleSheetChanged(style_sheet_id)

  Fired whenever a stylesheet is changed as a result of the client operation.

  style_sheet_id: `StyleSheetId`

class StyleSheetRemoved(style_sheet_id)

  Fired whenever an active document stylesheet is removed.

  style_sheet_id: `StyleSheetId`

    Identifier of the removed stylesheet.

class ComputedStyleUpdated(node_id)

  EXPERIMENTAL

  node_id: `NodeId`

    The node id that has updated computed styles.