Actions

As seen in the configuration options of a test file, you are able to run some actions, before the screenshot will be taken.

This is useful to bring the page into a specific state, you want to capture.
For example: opening a dropdown, typing something in an input or waiting for an animation to be completed.

The currently available actions are wait, click, type, scroll, forcePseudoState and function. They may be configured like this.

info

All actions may be configured with the optional @ key. It configures the sizes this action is run on.
If @ is not present, the action runs on all sizes.

Action Types

Wait

Options:

• timeout: The number of ms to wait, before executing the next action or taking the screenshot.

Example:

YAML

- "@": ["xxl"]
  action: "wait"
  timeout: 2000

---

Click

Options:

• selector: A css selector of an element which should be clicked. If the selector evaluates to multiple elements, only the first one is clicked.

Example:

YAML

- "@": ["xxl"]
  action: "click"
  selector: "#id-to-click"

---

Type

Options:

• selector: A css selector of an element which should be typed in. If the selector evaluates to multiple elements, the first one will be used.
• text: The text to type into the element

Example:

YAML

- "@": ["xxl"]
  action: "type"
  selector: "#search"
  text: "some searchword"

Scroll

Options:

• selector: A css selector of an element which should scrolled into view. If the selector evaluates to multiple elements, only the first one will be scrolled to.
• px: The number of px the page should be scrolled by

Example:

YAML

- "@": ["xxl"]
  action: "scroll"
  px: 200

- "@": ["l"]
  action: "scroll"
  selector: ".button"

Force Pseudo State (Hover, Focus, ...)

Options:

• selector: A css selector of the element which should recieve the forced pseudo state. If the selector evaluates to multiple elements, only the first one will be used.
• active: true if the active pseudo state should be forced
• hover: true if the hover pseudo state should be forced
• focus: true if the focus pseudo state should be forced
• visited: true if the visited pseudo state should be forced

Example:

YAML

- action: forcePseudoState
  selector: .button
  hover: true

- action: forcePseudoState
  selector: .button
  focus: true
  visited: true

Function

Options:

• name: The name of the function to be executed

Example:

YAML

- action: function
  name: accept_cookies