Check settings

CheckSettings generates a screenshot of the current page and adds it to the Applitools Eyes Test.

Syntax

eyes.check(check_settings)

Holds the checkpoint's configuration. This is defined using a fluent API, starting with Target.

Page screenshot

• To take a viewport screenshot, call Target.window().
• To take a full page screenshot, call Target.window().fully().

Region screenshot

To take a region screenshot, you can specify either a selector or the element representation itself. For example:

# region by selector
eyes.check(Target.region(".banner"))

# region by locator
locator = page.locator(".banner")
eyes.check(Target.region(locator))

# region by element
element = page.locator(".banner").element_handle()
eyes.check(Target.region(element))

You can specify the absolute coordinates for the required region:

from applitools.playwright import Region

# region by coordinates
eyes.check(Target.region(Region(10, 20, 200, 80)))

For all the above options, you can take the entire content of an element that can be scrolled using .fully().

Frames

For taking screenshots of elements inside iframes, you can specify the frame using the Target.frame fluent API. For example:

# element inside frame
eyes.check(Target.frame("frame-1").region(".element-inside frame"))

To take a screenshot of the entire frame:

# entire frame
eyes.check(Target.frame("frame-1").fully())

To create a "frame chain" with multiple calls:

# element inside nested frames
eyes.check(
  Target.frame("frame-1").frame("frame-1-1").region(".nested-element")
)

Ignore regions

The test will not report any mismatches in an ignore region. This is useful for example for areas on the screen whose content is different on every run such as a time of day field.

# single region
eyes.check(
    "viewport screenshot with ignore region",
    Target.window()
        .ignore(".dynamic-content-here")
)

# multiple regions
eyes.check(
    "viewport screenshot with ignore region",
    Target.window()
        .ignore(".dynamic-content-here")
        .ignore(page.locator("selector")) # some Locator
        .ignore(page.locator("selector").elementHandle()) # some ElementHandle
        .ignore(Region(10, 20, 30, 40))
)

Possible input types:

• string (interpreted as css selector)
• locator
• element
• coordinates (Region(left, top, width, height))

Floating regions

In a Floating Region, the position of a region may move without reporting a mismatch.

# viewport screenshot with floating region
eyes.check(
    Target.window().floating(".floating-area", 10, 10, 10, 10) # up, down, left, right
)

# multiple regions
eyes.check(
    Target
        .window()
        .floating(page.locator(".floating-area"), 10, 10, 10, 10) # Playwright Locator
        .floating(10, ".floating-area")
        .floating(10, page.locator(".floating-area")) # up, down, left, right all equal to 10
        .floating(10, page.locator(".floating-area").elementHandle()) # up, down, left, right all equal to 10
        .floating(10, Region(10, 20, 30, 40))
        .floating(Region(10, 20, 30, 40), 10, 10, 10, 10)
)

Possible input types:

• string (interpreted as css selector)
• locator
• element
• coordinates (Region(left, top, width, height))

Region match levels

You can set the following match levels for a region:

• Strict: Detect any mismatch visible to the human eye.
• Ignore colors: Similar to the strict match level but ignores changes in colors.
• Layout: Check only the layout and ignore actual text and graphics.

# viewport screenshot with strict region
eyes.check(Target.window().strict(".some-element"))

# viewport screenshot with ignore colors region
eyes.check(Target.window().ignoreColors(".some-element"))

# viewport screenshot with layout region
eyes.check(Target.window().layout(".some-element"))

# multiple regions
Target.window().ignoreColors(region1).ignoreColors(region2).ignoreColors(region3)
Target.window().strict(region1).strict(region2).strict(region3)
Target.window().layout(region1).layout(region2).layout(region3)

Possible input types:

• string (interpreted as css selector)
• locator
• element
• coordinates (Region(left, top, width, height))

Accessibility regions

Defines an accessibility region and its type. The type can be IgnoreContrast, RegularText, LargeText, BoldText, or GraphicalObject.

from applitools.playwright import AccessibilityRegionType

# viewport screenshot with accessibility region
eyes.check(
    Target.window().accessibility(".some-element", AccessibilityRegionType.LargeText)
)

# multiple regions is done by chaining the same method
eyes.check(
    Target.window()
        .accessibility(".element-1", AccessibilityRegionType.LargeText)
        .accessibility(".element-2", AccessibilityRegionType.IgnoreContrast)
        .accessibility(".element-3", AccessibilityRegionType.BoldText)
)

Possible input types:

• string (interpreted as css selector)
• locator
• element
• coordinates (Region(left, top, width, height))

Scroll root element

Normally, Eyes selects the most appropriate element to scroll to execute the Fully keyword. You can use the scroll_root_element element to specify the element to scroll explicitly.

# full page with custom scroll root element
eyes.check(
    Target.window().fully().scroll_root_element(".main-content")
)

Possible input types:

• string (interpreted as css selector)
• locator
• element

Before capture screenshot

Script that runs after the page is loaded but before capturing the screenshot.

eyes.check(
    Target.window().before_render_screenshot_hook("document.getElementsByTagName('body')[0].style.rotate = '90deg'")
)

Tag (with_name)

Defines a name for the checkpoint in the Eyes Test Manager. The name may be any string and serves to identify the step to the user in the Test manager.

You can change the tag value without impacting testing in any way since Eyes does not use the tag to identify the baseline step that corresponds to the checkpoint; Eyes matches steps based on their content and position in the sequences of images of the test. See How Eyes compares checkpoints and baseline images for details.

# Tag
eyes.check(Target.window().with_name("Main page"));

Lazy loading (lazy_load)

You can use the SDK to scroll the entire page, or a specific length of the page, to make sure all lazily loaded assets are on the page before performing a check.

# lazy loads with sensible defaults
eyes.check(Target.window().lazy_load())

# lazy loads with options specified
eyes.check(
    Target.window().lazy_load(
        scroll_length=500,         # amount of pixels to use for each scroll attempt
        waiting_time=500,          # milliseconds to wait in-between each scroll attempt
        max_amount_to_scroll=10000 # total pixels of the page to be scrolled
    )
)

Possible input types:

• nothing (enables sensible defaults)
• keyword arguments (scroll_length, waiting_time and max_amount_to_scroll)

Other details:

• If an option is omitted, the sensible default for that value will be used
• The SDK will repeatedly scroll the page using the scroll_length until either the page cannot be scrolled further or the max_amount_to_scroll has been reached (whichever happens first)
• If more time is needed for additional content to load, then increase the waiting_time to a value higher than 500 milliseconds. If better performance is desired and additional content lazily loads faster than the default waiting_time, then reduce it to a value below 500 milliseconds

Other checkSettings configuration

• hide_scrollbars
• hide_caret
• ignore_displacements
• use_dom
• enable_patterns_