Class Assertable<T>

Assertable wraps Cypress.Chainable so that your tests are as decoupled as possible from Cypress. By using the Assertable class, you can use the same assertions in your tests, regardless of the testing framework you use. All you need to do if you wish to replace Cypress with another testing framework and keep your tests, is to replace the implementation of the Assertable class. You can also add assertions of your own, by extending Assertable class.

Example

import { Assertable, CypressHelper, then } from "@shellygo/cypress-test-utils";

class MyAssertable<T> extends Assertable<T> {
  private styleFromWindow = (win: Window) => {
    const styleItem = win.localStorage.getItem(`style`);
    return JSON.parse(styleItem || "");
  };

  public shouldEqualToStoredStyle = () =>
    then(
      new CypressHelper().get.window().then((win) => {
         const style = styleFromWindow(win);
         then(this.chainable).shouldDeepNestedInclude(style);
      })
    );
}

class Driver {
 public given = {
 .
 .
 };
 public when = {
 .
 .
 };
 public get = {
 .
 .
 };
 public then = (chainable: Cypress.Chainable<any>) => new MyAssertable(chainable);
}

Type Parameters

Hierarchy

Assertable

Index

Constructors

constructor

Properties

chainable

Constructors

constructor

new Assertable<T>(chainable): Assertable<T>
Type Parameters
- T
Parameters
- chainable: Chainable<T>
Returns Assertable<T>

Properties

`Protected` `Readonly` chainable

chainable: Chainable<T>

Methods

should

should(chainer, ...rest): Chainable<T>
Parameters
- chainer: string
- Rest ...rest: any[]
Returns Chainable<T>

shouldBeChecked

shouldBeChecked(): Chainable<T>
Assert that at least one element of the selection is checked, using .is(':checked').

Returns Chainable<T>
Example
```
   then(get.elementByTestId("checkbox-selector")).shouldBeChecked()
```

shouldBeDisabled

shouldBeDisabled(): Chainable<T>
Assert that at least one element of the selection is disabled, using .is(':disabled').

Returns Chainable<T>
Example
```
   then(get.elementByTestId("selector")).shouldBeDisabled()
```

shouldBeEnabled

shouldBeEnabled(): Chainable<T>
Assert that at least one element of the selection is enabled, using .is(':enabled').

Returns Chainable<T>
Example
```
   then(get.elementByTestId("selector")).shouldBeEnabled()
```

shouldBeFocused

shouldBeFocused(): Chainable<T>
Assert that at least one element of the selection is focused.

Returns Chainable<T>
Example
```
then(get.elementByTestId("selector")).shouldBeFocused()
```

shouldBeGreaterThan

shouldBeGreaterThan(value): Chainable<T>
Asserts that the target is a number or a date greater than the given number or date n respectively. However, it's often best to assert that the target is equal to its expected value.
Parameters
- value: number
Returns Chainable<T>
Example
```
   then(get.numberOfElements("radio")).shouldBeGreaterThan(5);
```

shouldBeGreaterThanOrEqual

shouldBeGreaterThanOrEqual(value): Chainable<T>
Asserts that the target is a number or a date greater than or equal to the given number or date n respectively. However, it's often best to assert that the target is equal to its expected value.
Parameters
- value: number
Returns Chainable<T>
Example
```
  then(get.numberOfElements("radio")).shouldBeGreaterThanOrEqual(5);
```

shouldBeLessThan

shouldBeLessThan(value): Chainable<T>
Asserts that the target is a number or a n date less than or equal to the given number or date n respectively. However, it's often best to assert that the target is equal to its expected value.
Parameters
- value: number
Returns Chainable<T>
Example
```
   then(get.numberOfElements("radio")).shouldBeLessThen(5);
```

shouldBeLessThanOrEqual

shouldBeLessThanOrEqual(value): Chainable<T>
Asserts that the target is a number or a date less than or equal to the given number or date n respectively. However, it's often best to assert that the target is equal to its expected value.
Parameters
- value: number
Returns Chainable<T>
Example
```
then(get.numberOfElements('list-item')).shouldBeLessThanOrEqual(5)
```

shouldBeSelected

shouldBeSelected(): Chainable<T>
Assert that at least one element of the selection is selected, using .is(':selected').

Returns Chainable<T>
Example
```
then(get.elementByTestId("selector")).shouldBeSelected()
```

shouldBeVisible

shouldBeVisible(): Chainable<T>
Assert that at least one element of the selection is visible, using .is(':visible').

Returns Chainable<T>
Example
```
then(get.elementByTestId("selector")).shouldBeVisible()
```

shouldContainText

shouldContainText(text): Chainable<T>
Assert that the text of the first element of the selection partially contains the given text, using .text().
Parameters
- text: string
Returns Chainable<T>
Example
```
then(get.elementByTestId("selector")).shouldContainText("test")
```

shouldDeepEqual

shouldDeepEqual(value): Chainable<T>
Causes all .equal, .include, .members, .keys, and .property assertions that follow in the chain to use deep equality instead of strict (===) equality. See the deep-eql project page for info on the deep equality algorithm: https://github.com/chaijs/deep-eql.
Parameters
- value: any
Returns Chainable<T>
Example
```
then(
  get.fixture("user")).shouldDeepEqual({
    name: "Jane Doe",
    id: "1234"
})
```

shouldDeepNestedInclude

shouldDeepNestedInclude(value): Chainable<T>

Asserts that the target has a property with the given key name.

Parameters

value: any

Returns Chainable<T>

Example

then(
  get.fixture("user")).shouldDeepNestedInclude({
    name: "Jane Doe",
    id: "1234",
    nested: {
      attr1: "something",
      attr2: "the other thing"
  }
})

shouldEndWith

shouldEndWith(value): Chainable<string>
Asserts that text ends with value
Parameters
- value: string
Returns Chainable<string>
Example
```
  then(helper.get.elementsText('selector)).shouldEndWith('test')
```

shouldEqual

shouldEqual(value): Chainable<T>
Asserts that the target is strictly (===) equal to the given val.
Parameters
- value: any
Returns Chainable<T>
Example
```
   then(get.inputValue("name-input")).shouldEqual("John")
```

shouldExist

shouldExist(): Chainable<T>
Assert that the selection is not empty. Note that this overrides the built-in chai assertion. If the object asserted against is not a jQuery object, the original implementation will be called.

Returns Chainable<T>
Example
```
  then(get.elementByTestId("selector")).shouldExist()
```

shouldHaveAttribute

shouldHaveAttribute(attribute, expectedValue): Chainable<T>
Assert that the first element of the selection has the given attribute, using .attr(). Optionally, assert a particular value as well. The return value is available for chaining.
Parameters
- attribute: string
- expectedValue: string
Returns Chainable<T>
Example
```
 then(get.elementByTestId("selector")).shouldHaveAttribute("test")
```

shouldHaveBeenCalled

shouldHaveBeenCalled(): Chainable<T>
Asserts spy was called ate least once

Returns Chainable<T>
Example
```
then(get.spy("onSomething")).shouldHaveBeenCalled()
```

shouldHaveBeenCalledOnce

shouldHaveBeenCalledOnce(): Chainable<T>

Asserts spy was called exactly once

Returns Chainable<T>

Example

then(get.spy("onSomething")).shouldHaveBeenCalledOnce()

shouldHaveBeenCalledThrice

shouldHaveBeenCalledThrice(): Chainable<T>

Asserts spy was called exactly thrice

Returns Chainable<T>

Example

then(get.spy("onSomething")).shouldHaveBeenCalledThrice()

shouldHaveBeenCalledTimes

shouldHaveBeenCalledTimes(n): Chainable<T>
Asserts spy was called exactly n times
Parameters
- n: number
  
  number of times spy should have been called
Returns Chainable<T>
Example
```
then(get.spy("onSomething")).shouldHaveBeenCalledTimes(5)
```

shouldHaveBeenCalledTwice

shouldHaveBeenCalledTwice(): Chainable<T>

Asserts spy was called exactly twice

Returns Chainable<T>

Example

then(get.spy("onSomething")).shouldHaveBeenCalledTwice()

shouldHaveBeenCalledWith

shouldHaveBeenCalledWith(...args): Chainable<T>
Assert spy was called at least once with the provided arguments.
Parameters
- Rest ...args: any[]
Returns Chainable<T>
Example
```
then(get.spy("onSomething")).shouldHaveBeenCalledWith({ id: 1 })
```

shouldHaveBeenCalledWithMatch

shouldHaveBeenCalledWithMatch(...args): Chainable<T>

Assert spy was called with matching arguments (and possibly others).

Parameters

Rest ...args: any[]

Returns Chainable<T>

Example

then(get.spy("onSomething")).shouldHaveBeenCalledWithMatch(match({ id: 1 }))

Example

 it('should call the get method of the HTTP client with a URL with query param filter = status', () => {
  healthService.fetchHealthResults(status);
  then(get.mock.httpClientService().get).shouldHaveBeenCalledWith(
    match(baseURL),
    match.hasNested(
      'params.updates[0]',
      match({ param: 'filter', value: `status eq ${status}` })
    )
  );
});

shouldHaveClass

shouldHaveClass(value): Chainable<T>
Assert that the selection has the given CSS class.
Parameters
- value: string
Returns Chainable<T>
Example
```
  then(get.elementByTestId("selector")).shouldHaveClass("test")
```

shouldHaveCss

shouldHaveCss(property, expectedValue): Chainable<T>
Assert that an element has a css property with the given value.
Parameters
- property: string
- expectedValue: string
Returns Chainable<T>
Example
```
then(get.elementByTestId("selector")).shouldHaveCss("color", "rgb(102, 102, 102)"")
```

shouldHaveLength

shouldHaveLength(length): Chainable<T>
Asserts that the target's length property is equal to the given number n..
Parameters
- length: number
Returns Chainable<T>
Example
```
   then(get.elementByTestId("selector")).shouldHaveLength(3)
```

shouldHaveText

shouldHaveText(value): Chainable<T>
Assert that the text of the first element of the selection is equal to the given text, using .text().
Parameters
- value: string
Returns Chainable<T>
Example
```
 then(get.elementByTestId("selector")).shouldHaveText("test")
```

shouldHaveValue

shouldHaveValue(value): Chainable<T>
Assert that the first element of the selection has the given value, using .val().
Parameters
- value: string
Returns Chainable<T>
Example
```
then(get.elementByTestId("selector")).shouldHaveValue("test")
```

shouldInclude

shouldInclude(value): Chainable<T>
When the target is a string, .include asserts that the given string val is a substring of the target.
Parameters
- value: any
Returns Chainable<T>
Example
```
   then(helper.get.elementsText('selector)).shouldContain('test')
```

shouldNotBeChecked

shouldNotBeChecked(): Chainable<T>
Assert that at least one element of the selection is not checked, using .is(':checked').

Returns Chainable<T>
Example
```
  then(get.elementByTestId("checkbox-selector")).shouldNotBeChecked()
```

shouldNotBeFocused

shouldNotBeFocused(): Chainable<T>
Assert that no element of the selection is focused.

Returns Chainable<T>
Example
```
then(get.elementByTestId("selector")).shouldNotBeFocused()
```

shouldNotBeSelected

shouldNotBeSelected(): Chainable<T>
Assert that at least one element of the selection is not selected, using .is(':selected').

Returns Chainable<T>
Example
```
then(get.elementByTestId("selector")).shouldNotBeSelected()
```

shouldNotBeVisible

shouldNotBeVisible(): Chainable<T>
Assert that at least one element of the selection is not visible, using .is(':visible').

Returns Chainable<T>
Example
```
then(get.elementByTestId("selector")).shouldNotBeVisible()
```

shouldNotExist

shouldNotExist(): Chainable<T>
Assert that the selection is empty. Note that this overrides the built-in chai assertion. If the object asserted against is not a jQuery object, the original implementation will be called.

Returns Chainable<T>
Example
```
   then(get.elementByTestId("selector")).shouldNotExist()
```

shouldNotHaveBeenCalled

shouldNotHaveBeenCalled(): Chainable<T>

Asserts spy was not called

Returns Chainable<T>

Example

then(get.spy("onSomething")).shouldNotHaveBeenCalled()

shouldNotHaveBeenCalledTimes

shouldNotHaveBeenCalledTimes(n): Chainable<T>
Asserts spy was NOT called exactly n times
Parameters
- n: number
  
  number of times spy should NOT have been called
Returns Chainable<T>
Example
```
then(get.spy("onSomething")).shouldNotHaveBeenCalledTimes(5)
```

shouldNotInclude

shouldNotInclude(value): Chainable<T>
When the target is a string, not.include asserts that the given string val is not a substring of the target.
Parameters
- value: any
Returns Chainable<T>
Example
```
   then(helper.get.elementsText('selector)).shouldNotContain('test')
```

shouldNotThrow

shouldNotThrow(value?): Chainable<T>
When no arguments are provided, shouldThrow invokes the target function and asserts that no error is thrown. When one argument is provided, and it's a string, shouldThrow invokes the target function and asserts that no error is thrown with a message that contains that string.
Parameters
- Optional value: string | RegExp
Returns Chainable<T>
Example
```
function badFn() { console.log('Illegal salmon!') }
then(() => badFn()).shouldNotThrow()
then(() => badFn()).shouldNotThrow('salmon')
then(() => badFn()).shouldNotThrow(/salmon/)
```

shouldStartWith

shouldStartWith(value): Chainable<string>
Asserts that text starts with value
Parameters
- value: string
Returns Chainable<string>
Example
```
  then(helper.get.elementsText('selector)).shouldStartWith('test')
```

shouldThrow

shouldThrow(value?): Chainable<T>
When no arguments are provided, shouldThrow invokes the target function and asserts that an error is thrown. When one argument is provided, and it's a string, shouldThrow invokes the target function and asserts that an error is thrown with a message that contains that string.
Parameters
- Optional value: string | RegExp
Returns Chainable<T>
Example
```
function badFn() { throw new TypeError('Illegal salmon!') }
then(() => badFn()).shouldThrow()
then(() => badFn()).shouldThrow('salmon')
then(() => badFn()).shouldThrow(/salmon/)
```

Class Assertable<T>

Example

Type Parameters

T

Hierarchy

Index

Constructors

Properties

Methods

Constructors

constructor

Type Parameters

T

Parameters

chainable: Chainable<T>

Returns Assertable<T>

Properties

Protected Readonly chainable

Methods

should

Parameters

chainer: string

Rest ...rest: any[]

Returns Chainable<T>

shouldBeChecked

Returns Chainable<T>

Example

shouldBeDisabled

Returns Chainable<T>

Example

shouldBeEnabled

Returns Chainable<T>

Example

shouldBeFocused

Returns Chainable<T>

Example

shouldBeGreaterThan

Parameters

value: number

Returns Chainable<T>

Example

shouldBeGreaterThanOrEqual

Parameters

value: number

Returns Chainable<T>

Example

shouldBeLessThan

Parameters

value: number

Returns Chainable<T>

Example

shouldBeLessThanOrEqual

Parameters

value: number

Returns Chainable<T>

Example

shouldBeSelected

Returns Chainable<T>

Example

shouldBeVisible

Returns Chainable<T>

Example

shouldContainText

Parameters

text: string

Returns Chainable<T>

Example

shouldDeepEqual

Parameters

value: any

Returns Chainable<T>

Example

shouldDeepNestedInclude

Parameters

value: any

Returns Chainable<T>

Example

shouldEndWith

Parameters

value: string

`Protected` `Readonly` chainable

`Rest` ...rest: any[]

`Rest` ...args: any[]

`Rest` ...args: any[]