Fragment

Fragment

Class representing a group of related HTML elements to test and perform actions against.

Constructor

new Fragment(fragmentsopt)

Source:
Parameters:
Name Type Attributes Description
fragments Array.<Fragment> <optional>
 Optionally nested fragments that can be grouped hierarchically.
Examples

An example Fragment class from the README. This Fragment sets an associated HTML element when instantiated and performs the default tests to ensure the image is on the page. It is used in the example Sequence below.

import { IMG_SELECTOR } from '../constants'
import { Fragment } from 'test-automation'

export default class GoogleFragment extends Fragment {
  constructor(fragments) {
    super(fragments)
    this.setElement(IMG_SELECTOR)
  }
}

A slightly more complex example Fragment class from the starter kit. This Fragment is responsible for the Google search form. It overrides the `testElements` method to perform the default tests and also perform each of the remaining tests: `testText`, `testAttribute`, and `testState`.

import { TERMS_SELECTOR, FORM_SELECTOR, INPUT_SELECTOR } from '../constants'
import { Fragment } from 'test-automation'

export default class PageFragment extends Fragment {
  constructor (fragments) {
    super(fragments)

    this.setElement(TERMS_SELECTOR)
    this.setElement(FORM_SELECTOR)
    this.setElement(INPUT_SELECTOR)
  }

  async testElements () {
    await super.testElements()

    await this.testText(TERMS_SELECTOR, 'Terms')
    await this.testAttribute(INPUT_SELECTOR, 'type', 'text')
    await this.testState(INPUT_SELECTOR, ['displayed', 'enabled'])
  }
}

Methods

(async) elementClear(selector) → {Promise}

[`async`] Action method used to clear the any value set on an associated HTML element.
Source:
Parameters:
Name Type Description
selector string The CSS selector associated with the desired HTML element to test.
Returns:
Type:
Promise
The results of the `clear` method on the element.

(async) elementClick(selector) → {Promise}

[`async`] Action method used to simulate a click on an associated HTML element.
Source:
Parameters:
Name Type Description
selector string The CSS selector associated with the desired HTML element to test.
Returns:
Type:
Promise
The results of the `click` method on the element.

(async) elementSendKeys(selector, keys) → {Promise}

[`async`] Action method used to simulate keyboard user input on an associated HTML element.
Source:
Parameters:
Name Type Description
selector string The CSS selector associated with the desired HTML element to test.
keys string | Array.<string> The keys you wish to simulate.
Returns:
Type:
Promise
The results of the `sendKeys` method on the element.

(async) elementSubmit(selector) → {Promise}

[`async`] Action method used to simulate submitting an associated HTML form.
Source:
Parameters:
Name Type Description
selector string The CSS selector associated with the desired HTML element to test.
Returns:
Type:
Promise
The results of the `submit` method on the element.

getElement(selector) → {Object}

Gets the HTML element(s) referenced by the selector passed.
Source:
Parameters:
Name Type Description
selector string The CSS selector associated with the HTML element(s).
Returns:
Type:
Object
The associated HTML element(s).

setElement(selector, allopt) → {Object}

Sets the HTML element(s) referenced by the selector passed.
Source:
Parameters:
Name Type Attributes Default Description
selector string The CSS selector associated with the HTML element(s).
all boolean <optional>
 false The optional parameter to specify whether to select all matching HTML elements.
Returns:
Type:
Object
The associated HTML element(s).

(async) testAttribute(selector, attribute, text) → {Promise}

[`async`] Test method that tests the desired attribute of an associated HTML element.
Source:
Parameters:
Name Type Description
selector string The CSS selector associated with the desired HTML element to test.
attribute string The desired HTML attribute you want to test.
text string The expected text to test against the HTML attribute.
Returns:
Type:
Promise
The results of the test attribute assertion.

(async) testElements() → {Promise}

[`async`] Test method that provides the minimal test pass capabilities, which are calling `testElements` on all of its associated Fragments and checking if all of its associated HTML elements exist. This should be overridden by classes extending Fragment to define the desired tests on your Fragment.
Source:
Returns:
Type:
Promise
The results of the `testExists` method.

(async) testExists() → {Promise}

[`async`] Test method that checks for the existence of all the HTML elements associated with the Fragment.
Source:
Returns:
Type:
Promise
The results of all the `isPresent` assertions on HTML elements.

(async) testState(selector, state) → {Promise}

[`async`] Test method that tests the state of an associated HTML element.
Source:
Parameters:
Name Type Description
selector string The CSS selector associated with the desired HTML element to test.
state string | Array.<string> The desired states you wish to test. Currently, the supported states are: `displayed`, `enabled`, and `selected`.
Returns:
Type:
Promise
The results of the test state assertion(s).

(async) testText(selector, text) → {Promise}

[`async`] Test method that tests the text value of an associated HTML element.
Source:
Parameters:
Name Type Description
selector string The CSS selector associated with the desired HTML element to test.
text string The text to test the HTML element's content against.
Returns:
Type:
Promise
The results of the test text assertion.