Class Element

Get a specified state for locator. A mode operator must be prepended.

Hierarchy

  • Question<boolean>
    • Element

Properties

abilityAlias? callStack?

Accessors

not

Methods - Factory

of

Methods - Other

addToCallStack setCallStackInitializeCalledWith withAbilityAlias

Methods - called internally

answeredBy

Methods - mode operators

checked containText editable enabled focused haveAttribute haveCSS haveCount haveScreenshot haveText haveValue inViewport visible

Properties

Optional abilityAlias

abilityAlias?: string

Optional callStack

callStack?: CallStackInfo[]

Accessors

not

  • get not(): this

  • make the verifying for the negative.

    Returns this

    this Element instance

    Example

    Verify with Element class

    actor.asks(
     Element.of(page.getByRole("heading")).not.visible()
    );

Methods - Factory

Static of

Methods - Other

addToCallStack

  • addToCallStack(entry): void

  • Parameters

    • entry: CallStackInfo

    Returns void

setCallStackInitializeCalledWith

  • setCallStackInitializeCalledWith(calledWith): void

  • Parameters

    • calledWith: CallStackCalledWith

    Returns void

withAbilityAlias

  • withAbilityAlias(alias): this

  • Set the alias which is used for an underlying ability

    Parameters

    • alias: undefined | string

      with which an ability was initialized

    Returns this

    current action

Methods - called internally

answeredBy

  • answeredBy(actor): Promise<boolean>

  • Verify if an element has the specified state.

    Parameters

    • actor: Actor

      the actor

    Returns Promise<boolean>

    true if the element has the specified state, false otherwise.

Methods - mode operators

checked

  • checked(options?): Element

  • Verify if an element is checked.

    Parameters

    • Optional options: {
          checked?: boolean;
          timeout?: number;
      }

      (optional) options for assertions.

      • Optional checked?: boolean
      • Optional timeout?: number

        Time to retry the assertion for in milliseconds. Defaults to timeout in TestConfig.expect.

    Returns Element

    this Element instance

    Example

    simple call with just locator or with options

    Element.of(
      page.locator('myLocator')
    ).checked();

    with options

    Element.of(
      page.locator('myLocator'),
    ).not.checked({ timeout: 1000 });

containText

  • containText(text, options?): Element

  • Verify if an element contains the given text.

    Parameters

    • text: string | RegExp | (string | RegExp)[]

      the text to check.

    • Optional options: {
          ignoreCase?: boolean;
          timeout?: number;
          useInnerText?: boolean;
      }

      (optional) options for assertions.

      • Optional ignoreCase?: boolean

        Whether to perform case-insensitive match. ignoreCase option takes precedence over the corresponding regular expression flag if specified.

      • Optional timeout?: number

        Time to retry the assertion for in milliseconds. Defaults to timeout in TestConfig.expect.

      • Optional useInnerText?: boolean

        Whether to use element.innerText instead of element.textContent when retrieving DOM node text.

    Returns Element

    this Element instance

editable

  • editable(options?): Element

  • Verify if an element is editable.

    Parameters

    • Optional options: {
          editable?: boolean;
          timeout?: number;
      }

      (optional) options for assertions.

      • Optional editable?: boolean
      • Optional timeout?: number

        Time to retry the assertion for in milliseconds. Defaults to timeout in TestConfig.expect.

    Returns Element

    this Element instance

    Example

    simple call with just locator or with options

    Element.of(
      page.locator('myLocator')
    ).editable();

    with options

    Element.of(
      page.locator('myLocator'),
    ).not.editable({ timeout: 1000 });

enabled

  • enabled(options?): Element

  • Verify if an element is enabled.

    Parameters

    • Optional options: {
          enabled?: boolean;
          timeout?: number;
      }

      (optional) options for assertions.

      • Optional enabled?: boolean
      • Optional timeout?: number

        Time to retry the assertion for in milliseconds. Defaults to timeout in TestConfig.expect.

    Returns Element

    this Element instance

    Example

    simple call with just locator or with options 

    Element.of(page.locator("myLocator"))
      .not.enabled();

    with options

    Element.of(page.locator("myLocator"))
      .enabled({timeout: 1000});

focused

  • focused(options?): Element

  • Verify if an element is focused.

    Parameters

    • Optional options: {
          timeout?: number;
      }

      (optional) options for assertions.

      • Optional timeout?: number

        Time to retry the assertion for in milliseconds. Defaults to timeout in TestConfig.expect.

    Returns Element

    this Element instance

    Example

    simple call with just locator or with options

    Element.of(
      page.locator('myLocator')
    ).focused();

    with options

    Element.of(
      page.locator('myLocator'),
    ).not.focused({ timeout: 1000});

haveAttribute

  • haveAttribute(name, options?): Element

  • Verify if an element has the given attribute.

    Parameters

    • name: string

      the attribute name.

    • Optional options: {
          ignoreCase?: boolean;
          timeout?: number;
      }

      (optional) options for assertions.

      • Optional ignoreCase?: boolean

        Whether to perform case-insensitive match. ignoreCase option takes precedence over the corresponding regular expression flag if specified.

      • Optional timeout?: number

        Time to retry the assertion for in milliseconds. Defaults to timeout in TestConfig.expect.

    Returns Element

    this Element instance

  • haveAttribute(name, value, options?): Element

  • Verify if an element has the given attribute with value.

    Parameters

    • name: string

      the attribute name.

    • value: string | RegExp

      the attribute value.

    • Optional options: {
          ignoreCase?: boolean;
          timeout?: number;
      }

      (optional) options for assertions.

      • Optional ignoreCase?: boolean

        Whether to perform case-insensitive match. ignoreCase option takes precedence over the corresponding regular expression flag if specified.

      • Optional timeout?: number

        Time to retry the assertion for in milliseconds. Defaults to timeout in TestConfig.expect.

    Returns Element

    this Element instance

haveCSS

  • haveCSS(name, value, options?): Element

  • Verify if an element has the given style.

    Parameters

    • name: string

      the style name.

    • value: string | RegExp

      the style value.

    • Optional options: {
          timeout?: number;
      }

      (optional) options for assertions.

      • Optional timeout?: number

        Time to retry the assertion for in milliseconds. Defaults to timeout in TestConfig.expect.

    Returns Element

    this Element instance

haveCount

  • haveCount(count, options?): Element

  • Verify if an element has exact number of DOM node.

    Parameters

    • count: number

      the value to check.

    • Optional options: {
          timeout?: number;
      }

      (optional) options for assertions.

      • Optional timeout?: number

        Time to retry the assertion for in milliseconds. Defaults to timeout in TestConfig.expect.

    Returns Element

    this Element instance

haveScreenshot

  • haveScreenshot(name, options?): Element

  • Verify if an element has the given screenshot.

    Parameters

    • name: string

      the screenshot name.

    • Optional options: {
          animations?: "disabled" | "allow";
          caret?: "hide" | "initial";
          mask?: Locator[];
          maskColor?: string;
          maxDiffPixelRatio?: number;
          maxDiffPixels?: number;
          omitBackground?: boolean;
          scale?: "css" | "device";
          threshold?: number;
          timeout?: number;
      }
      • Optional animations?: "disabled" | "allow"

        When set to "disabled", stops CSS animations, CSS transitions and Web Animations. Animations get different treatment depending on their duration:

        • finite animations are fast-forwarded to completion, so they'll fire transitionend event.
        • infinite animations are canceled to initial state, and then played over after the screenshot.

        Defaults to "disabled" that disables animations.

      • Optional caret?: "hide" | "initial"

        When set to "hide", screenshot will hide text caret. When set to "initial", text caret behavior will not be changed. Defaults to "hide".

      • Optional mask?: Locator[]

        Specify locators that should be masked when the screenshot is taken. Masked elements will be overlaid with a pink box #FF00FF (customized by maskColor) that completely covers its bounding box.

      • Optional maskColor?: string

        Specify the color of the overlay box for masked elements, in CSS color format. Default color is pink #FF00FF.

      • Optional maxDiffPixelRatio?: number

        An acceptable ratio of pixels that are different to the total amount of pixels, between 0 and 1. Default is configurable with TestConfig.expect. Unset by default.

      • Optional maxDiffPixels?: number

        An acceptable amount of pixels that could be different. Default is configurable with TestConfig.expect. Unset by default.

      • Optional omitBackground?: boolean

        Hides default white background and allows capturing screenshots with transparency. Not applicable to jpeg images. Defaults to false.

      • Optional scale?: "css" | "device"

        When set to "css", screenshot will have a single pixel per each css pixel on the page. For high-dpi devices, this will keep screenshots small. Using "device" option will produce a single pixel per each device pixel, so screenshots of high-dpi devices will be twice as large or even larger.

        Defaults to "css".

      • Optional threshold?: number

        An acceptable perceived color difference in the YIQ color space between the same pixel in compared images, between zero (strict) and one (lax), default is configurable with TestConfig.expect. Defaults to 0.2.

      • Optional timeout?: number

        Time to retry the assertion for in milliseconds. Defaults to timeout in TestConfig.expect.

    Returns Element

haveText

  • haveText(text, options?): Element

  • Verify if an element has the given text.

    Parameters

    • text: string | RegExp | (string | RegExp)[]

      the text to check.

    • Optional options: {
          ignoreCase?: boolean;
          timeout?: number;
          useInnerText?: boolean;
      }

      (optional) options for assertions.

      • Optional ignoreCase?: boolean

        Whether to perform case-insensitive match. ignoreCase option takes precedence over the corresponding regular expression flag if specified.

      • Optional timeout?: number

        Time to retry the assertion for in milliseconds. Defaults to timeout in TestConfig.expect.

      • Optional useInnerText?: boolean

        Whether to use element.innerText instead of element.textContent when retrieving DOM node text.

    Returns Element

    this Element instance

haveValue

  • haveValue(value, options?): Element

  • Verify if an element has the given value.

    Parameters

    • value: string | RegExp

      the value to check.

    • Optional options: {
          timeout?: number;
      }

      (optional) options for assertions.

      • Optional timeout?: number

        Time to retry the assertion for in milliseconds. Defaults to timeout in TestConfig.expect.

    Returns Element

    this Element instance

inViewport

  • inViewport(options?): Element

  • Verify if an element intersects viewport.

    Parameters

    • Optional options: {
          ratio?: number;
          timeout?: number;
      }

      (optional) options for assertions.

      • Optional ratio?: number

        The minimal ratio of the element to intersect viewport. If equals to 0, then element should intersect viewport at any positive ratio. Defaults to 0.

      • Optional timeout?: number

        Time to retry the assertion for in milliseconds. Defaults to timeout in TestConfig.expect.

    Returns Element

    this Element instance

    Example

    simple call with just locator or with options

    Element.of(
      page.locator('myLocator')
    ).inViewport();

    with options

    Element.of(
      page.locator('myLocator'),
    ).not.inViewport({ timeout: 1000});

visible

  • visible(options?): Element

  • Verify if an element is visible.

    Parameters

    • Optional options: {
          timeout?: number;
          visible?: boolean;
      }

      (optional) options for assertions.

      • Optional timeout?: number

        Time to retry the assertion for in milliseconds. Defaults to timeout in TestConfig.expect.

      • Optional visible?: boolean

    Returns Element

    this Element instance

    Example

    simple call with just locator or with options.

    Element.of(page.locator("myLocator"))
      .visible();

    with options

    Element.of(page.locator("myLocator"))
      .not.visible({ timeout: 1000 });

Settings

Member Visibility

Theme

On This Page

abilityAliascallStacknotofaddToCallStacksetCallStackInitializeCalledWithwithAbilityAliasansweredBycheckedcontainTexteditableenabledfocusedhaveAttributehaveCSShaveCounthaveScreenshothaveTexthaveValueinViewportvisible