Options
All
  • Public
  • Public/Protected
  • All
Menu

@interactors/material-ui - v4.1.0

Index

Type aliases

GetElementType

GetElementType<I>: I extends InteractorConstructor<infer E, any, any, any> ? E : unknown

Type parameters

InteractorSpecification

InteractorSpecification<E, F, A>: { actions?: A; filters?: F; locator?: LocatorFn<E>; selector?: string }

Type parameters

  • E: Element

  • F: Filters<E>

  • A: Actions<E>

Type declaration

  • Optional actions?: A
  • Optional filters?: F
  • Optional locator?: LocatorFn<E>

    A function which returns a string value for a matched element, which can be used to locate a specific instance of this interactor. The value parameter of an InteractorConstructor must match the value returned from the locator function.

  • Optional selector?: string

    The CSS selector that this interactor uses to find matching elements

SliderOrientation

SliderOrientation: "horizontal" | "vertical"

Interactor Variables

Accordion

Accordion: InteractorConstructor<HTMLElement, MergeObjects<MergeObjects<EmptyObject, { classList?: MaybeMatcher<string[]>; className?: MaybeMatcher<string>; focused?: MaybeMatcher<boolean>; id?: MaybeMatcher<string>; text?: MaybeMatcher<string>; title?: MaybeMatcher<string>; visible?: MaybeMatcher<boolean> }>, { disabled: MaybeMatcher<undefined | boolean>; expanded: undefined | MaybeMatcher<boolean> }>, MergeObjects<MergeObjects<EmptyObject, FilterMethods<HTMLElement, { text: (element?: HTMLElement) => string; visible: { apply: (elem: HTMLElement) => boolean; default: boolean }; classList: any; className: any; focused: any; id: any; title: any }>>, FilterMethods<HTMLElement, { disabled: { apply: (element: HTMLElement) => undefined | boolean; default: boolean }; expanded: (element: HTMLElement) => boolean }>>, MergeObjects<MergeObjects<EmptyObject, ActionMethods<HTMLElement, { blur: any; click: any; focus: any }>>, ActionMethods<HTMLElement, { collapse: (interactor: Interactor<HTMLElement, EmptyObject>) => Promise<void>; expand: (interactor: Interactor<HTMLElement, EmptyObject>) => Promise<void>; toggle: (interactor: Interactor<HTMLElement, EmptyObject>) => Interaction<void> }>>> = AccordionInteractor

Call this InteractorConstructor to initialize a accordion Interactor. The accordion interactor can be used to interact with accordions on the page and to assert on their state.

The accordion is located by the aria-label attribute or visible text on the accordion's summary in otherwise.

Example

await Accordion('Overview').toggle();
await Accordion('Overview').is({ expanded: true });
await Accordion({ id: 'overview-accordion', disabled: true }).exists();

Filters

  • title: string – Filter by title
  • id: string – Filter by id
  • visible: boolean – Filter by visibility. Defaults to true. See isVisible.
  • disabled: boolean – Filter by whether the accordion is disabled. Defaults to false.
  • expanded: boolean – Filter by whether the accordion is expanded.

Actions

BottomNavigation

BottomNavigation: InteractorConstructor<HTMLElement, MergeObjects<EmptyObject, { value: undefined | MaybeMatcher<string> }>, MergeObjects<EmptyObject, FilterMethods<HTMLElement, { value: (element: HTMLElement) => string }>>, MergeObjects<EmptyObject, ActionMethods<HTMLElement, { navigate: (interactor: Interactor<HTMLElement, EmptyObject>, value: string) => Interaction<void> }>>> = BottomNavigationInteractor

Call this InteractorConstructor to initialize a bottom navigation Interactor. The bottom navigation interactor can be used to interact with bottom navigation on the page and to assert on their state.

The bottom navigation can be located by value filter.

Example

await BottomNavigation().navigate('Favorites');
await BottomNavigation().has({ value: 'Recents' });
await BottomNavigation({ value: 'Nearby' }).exists();

Filters

  • value: string – Filter by value

Actions

  • navigate(value: string): Interaction – Navigate to new destination

Button

Button: InteractorConstructor<HTMLButtonElement | HTMLLinkElement, MergeObjects<MergeObjects<EmptyObject, { classList?: MaybeMatcher<string[]>; className?: MaybeMatcher<string>; focused?: MaybeMatcher<boolean>; id?: MaybeMatcher<string>; text?: MaybeMatcher<string>; title?: MaybeMatcher<string>; visible?: MaybeMatcher<boolean> }>, { disabled: undefined | MaybeMatcher<boolean>; href: undefined | MaybeMatcher<null | string> }>, MergeObjects<MergeObjects<EmptyObject, FilterMethods<HTMLElement, { text: (element?: HTMLElement) => string; visible: { apply: (elem: HTMLElement) => boolean; default: boolean }; classList: any; className: any; focused: any; id: any; title: any }>>, FilterMethods<HTMLButtonElement | HTMLLinkElement, { disabled: { apply: (element: HTMLButtonElement | HTMLLinkElement) => boolean; default: boolean }; href: (element: HTMLButtonElement | HTMLLinkElement) => null | string }>>, MergeObjects<EmptyObject, ActionMethods<HTMLElement, { blur: any; click: any; focus: any }>>> = ButtonInteractor

Call this InteractorConstructor to initialize a button Interactor. The button interactor can be used to interact with buttons on the page and to assert on their state.

The button is located by the aria-label attribute or the visible text on the button in otherwise.

Example

await Button('Submit').click();
await Button('Submit').is({ disabled: true });
await Button({ id: 'submit-button', disabled: true }).exists();

Filters

  • title: string – Filter by title
  • id: string – Filter by id
  • visible: boolean – Filter by visibility. Defaults to true. See isVisible.
  • disabled: boolean – Filter by whether the button is disabled. Defaults to false.
  • focused: boolean – Filter by whether the button is focused. See focused.
  • href: string - Filter by href if it's button link

Actions

Calendar

Calendar: InteractorConstructor<HTMLElement, MergeObjects<EmptyObject, { day: MaybeMatcher<undefined | number>; month: MaybeMatcher<undefined | string>; title: MaybeMatcher<undefined | string>; weekDay: MaybeMatcher<undefined | string>; year: MaybeMatcher<undefined | number> }>, MergeObjects<EmptyObject, FilterMethods<HTMLElement, { day: (element: HTMLElement) => undefined | number; month: (element: HTMLElement) => undefined | string; title: (element: HTMLElement) => undefined | string; weekDay: (element: HTMLElement) => undefined | string; year: (element: HTMLElement) => undefined | number }>>, MergeObjects<EmptyObject, ActionMethods<HTMLElement, { nextMonth: <T>(__namedParameters: Interactor<HTMLElement, T>) => Interaction<void>; prevMonth: <T>(__namedParameters: Interactor<HTMLElement, T>) => Interaction<void>; setDay: <T>(interactor: Interactor<HTMLElement, T>, day: number) => Promise<void>; setMonth: <T>(interactor: Interactor<HTMLElement, T>, targetMonth: string) => Promise<void>; setYear: <T>(interactor: Interactor<HTMLElement, T>, targetYear: number) => Promise<void> }>>> = CalendarInteractor

Call this InteractorConstructor to initialize a calendar Interactor. The calendar interactor can be used to interact with calendars on the page and to assert on their state.

The calendar is located by selected day and title text divided by space (ex. '18 August 2014').

Example

await Calendar('18 August 2014').setDay(13);
await Calendar('18 August 2014').has({ weekDay: 'Mo' });
await Calendar({ title: 'August 2014', day: 18 }).exists();

Filters

  • title: string – Filter by title
  • year: number – Filter by year
  • month: string – Filter by month
  • day: number – Filter by day
  • weekDay: string – Filter by weekDay

Actions

  • nextMonth(): Interaction – Switch calendar view to the next month
  • prevMonth(): Interaction – Switch calendar view to the previous month
  • setYear(value: number): Interaction – Switch calendar view to the target year
  • setMonth(value: string): Interaction – Switch calendar view to the target month
  • setDay(value: number): Interaction – Set a new date for calendar with previously selected year and month

Checkbox

Checkbox: InteractorConstructor<HTMLInputElement, MergeObjects<MergeObjects<MergeObjects<MergeObjects<EmptyObject, { classList?: MaybeMatcher<string[]>; className?: MaybeMatcher<string>; focused?: MaybeMatcher<boolean>; id?: MaybeMatcher<string>; text?: MaybeMatcher<string>; title?: MaybeMatcher<string>; visible?: MaybeMatcher<boolean> }>, { disabled?: MaybeMatcher<boolean>; valid?: MaybeMatcher<boolean> }>, { checked?: MaybeMatcher<boolean>; indeterminate?: MaybeMatcher<boolean>; visible?: MaybeMatcher<null | boolean> }>, { indeterminate: undefined | MaybeMatcher<boolean>; visible: undefined | MaybeMatcher<null | boolean> }>, MergeObjects<MergeObjects<MergeObjects<MergeObjects<EmptyObject, FilterMethods<HTMLElement, { text: (element?: HTMLElement) => string; visible: { apply: (elem: HTMLElement) => boolean; default: boolean }; classList: any; className: any; focused: any; id: any; title: any }>>, FilterMethods<HTMLInputElement | HTMLSelectElement | HTMLTextAreaElement, { disabled: { default: boolean; apply: any }; valid: any }>>, FilterMethods<HTMLInputElement, { visible: { default: boolean; apply: any }; checked: any; indeterminate: any }>>, FilterMethods<HTMLInputElement, { indeterminate: (element: HTMLInputElement) => boolean; visible: { apply: (element: HTMLInputElement) => null | boolean; default: boolean } }>>, MergeObjects<MergeObjects<MergeObjects<EmptyObject, ActionMethods<HTMLElement, { blur: any; click: any; focus: any }>>, ActionMethods<HTMLInputElement, { check: any; toggle: any; uncheck: any }>>, ActionMethods<HTMLInputElement, { click: (__namedParameters: Interactor<HTMLInputElement, EmptyObject>) => Interaction<void> }>>> = CheckboxInteractor

Call this InteractorConstructor to initialize a checkbox Interactor. The checkbox interactor can be used to interact with checkboxes on the page and to assert on their state.

The checkbox is located by the text of its label or by aria-label attribute.

Example

await CheckBox('Accept').check();
await CheckBox('Accept').is({ disabled: true });
await CheckBox({ id: 'accept', disabled: true }).exists();

Filters

  • title: string – Filter by title
  • id: string – Filter by id
  • visible: boolean – Filter by visibility. Defaults to true. See isVisible.
  • valid: boolean – Filter by whether the checkbox is valid.
  • checked: boolean – Filter by whether the checkbox is checked.
  • indeterminate: boolean - Filter by whether the checkbox has indeterminate state.
  • disabled: boolean – Filter by whether the checkbox is disabled. Defaults to false.
  • focused: boolean – Filter by whether the checkbox is focused. See focused.

Actions

DateField

DateField: InteractorConstructor<HTMLInputElement, MergeObjects<MergeObjects<MergeObjects<MergeObjects<EmptyObject, { classList?: MaybeMatcher<string[]>; className?: MaybeMatcher<string>; focused?: MaybeMatcher<boolean>; id?: MaybeMatcher<string>; text?: MaybeMatcher<string>; title?: MaybeMatcher<string>; visible?: MaybeMatcher<boolean> }>, { disabled?: MaybeMatcher<boolean>; valid?: MaybeMatcher<boolean> }>, { placeholder?: MaybeMatcher<string>; value?: MaybeMatcher<string> }>, { date: undefined | MaybeMatcher<null | Date>; timestamp: undefined | MaybeMatcher<number> }>, MergeObjects<MergeObjects<MergeObjects<MergeObjects<EmptyObject, FilterMethods<HTMLElement, { text: (element?: HTMLElement) => string; visible: { apply: (elem: HTMLElement) => boolean; default: boolean }; classList: any; className: any; focused: any; id: any; title: any }>>, FilterMethods<HTMLInputElement | HTMLSelectElement | HTMLTextAreaElement, { disabled: { default: boolean; apply: any }; valid: any }>>, FilterMethods<HTMLInputElement | HTMLTextAreaElement, { placeholder: any; value: any }>>, FilterMethods<HTMLInputElement, { date: (element: HTMLInputElement) => null | Date; timestamp: (element: HTMLInputElement) => number }>>, MergeObjects<MergeObjects<MergeObjects<EmptyObject, ActionMethods<HTMLElement, { blur: any; click: any; focus: any }>>, ActionMethods<HTMLInputElement | HTMLTextAreaElement, { fillIn: any }>>, ActionMethods<HTMLInputElement, { fillIn: (__namedParameters: Interactor<HTMLInputElement, EmptyObject>, value: string | Date) => Interaction<void> }>>> = DateFieldInteractor

Call this InteractorConstructor to initialize a date field Interactor. The date field interactor can be used to interact with date fields on the page and to assert on their state. A date field is the date type input tag with a text-like interface.

The date field is located by the text of its label.

Example

await DateField('Date of birth').fillIn('2012-06-13');
await DateField('Date of birth').has({ value: '2014-08-18' });
await DateField({ id: 'birth-date', disabled: true }).exists();

Filters

  • title: string – Filter by title
  • id: string – Filter by id
  • visible: boolean – Filter by visibility. Defaults to true. See isVisible.
  • value: string – Filter by the date field's current value in ISO format.
  • date: Date | null – Filter by the date field's current value as date.
  • timestamp: number – Filter by the date field's current value as timestamp.
  • placeholder: string – Filter by the date field's placeholder attribute.
  • valid: boolean – Filter by whether the date field is valid.
  • disabled: boolean – Filter by whether the date field is disabled. Defaults to false.
  • focused: boolean – Filter by whether the date field is focused. See focused.

Actions

  • click(): Interaction – Click on the date field
  • focus(): Interaction – Move focus to the date field
  • blur(): Interaction – Move focus away from the date field
  • fillIn(value: string): Interaction – Fill in the date field with the given value. See fillIn.

DateTimeField

DateTimeField: InteractorConstructor<HTMLInputElement, MergeObjects<MergeObjects<MergeObjects<MergeObjects<EmptyObject, { classList?: MaybeMatcher<string[]>; className?: MaybeMatcher<string>; focused?: MaybeMatcher<boolean>; id?: MaybeMatcher<string>; text?: MaybeMatcher<string>; title?: MaybeMatcher<string>; visible?: MaybeMatcher<boolean> }>, { disabled?: MaybeMatcher<boolean>; valid?: MaybeMatcher<boolean> }>, { placeholder?: MaybeMatcher<string>; value?: MaybeMatcher<string> }>, { timestamp: undefined | MaybeMatcher<number> }>, MergeObjects<MergeObjects<MergeObjects<MergeObjects<EmptyObject, FilterMethods<HTMLElement, { text: (element?: HTMLElement) => string; visible: { apply: (elem: HTMLElement) => boolean; default: boolean }; classList: any; className: any; focused: any; id: any; title: any }>>, FilterMethods<HTMLInputElement | HTMLSelectElement | HTMLTextAreaElement, { disabled: { default: boolean; apply: any }; valid: any }>>, FilterMethods<HTMLInputElement | HTMLTextAreaElement, { placeholder: any; value: any }>>, FilterMethods<HTMLInputElement, { timestamp: (element: HTMLInputElement) => number }>>, MergeObjects<MergeObjects<MergeObjects<EmptyObject, ActionMethods<HTMLElement, { blur: any; click: any; focus: any }>>, ActionMethods<HTMLInputElement | HTMLTextAreaElement, { fillIn: any }>>, ActionMethods<HTMLInputElement, { fillIn: (__namedParameters: Interactor<HTMLInputElement, EmptyObject>, value: string | Date) => Interaction<void> }>>> = DateTimeFieldInteractor

Call this InteractorConstructor to initialize a date-time field Interactor. The date-time field interactor can be used to interact with date fields on the page and to assert on their state. A date-time field is the date-time type input tag with a text-like interface.

The date-time field is located by the text of its label.

Example

await DateTimeField('Appointment').fillIn('2012-06-13T09:13');
await DateTimeField('Appointment').has({ value: '2014-08-18T09:13' });
await DateTimeField({ id: 'appointment', disabled: true }).exists();

Filters

  • title: string – Filter by title
  • id: string – Filter by id
  • visible: boolean – Filter by visibility. Defaults to true. See isVisible.
  • value: string – Filter by the date-time field's current value in ISO format.
  • timestamp: number – Filter by the date-time field's current value as timestamp.
  • placeholder: string – Filter by the date-time field's placeholder attribute.
  • valid: boolean – Filter by whether the date-time field is valid.
  • disabled: boolean – Filter by whether the date-time field is disabled. Defaults to false.
  • focused: boolean – Filter by whether the date-time field is focused. See focused.

Actions

  • click(): Interaction – Click on the date-time field
  • focus(): Interaction – Move focus to the date-time field
  • blur(): Interaction – Move focus away from the date-time field
  • fillIn(value: string): Interaction – Fill in the date-time field with the given value. See fillIn.

Dialog

Dialog: InteractorConstructor<HTMLElement, MergeObjects<EmptyObject, { classList?: MaybeMatcher<string[]>; className?: MaybeMatcher<string>; focused?: MaybeMatcher<boolean>; id?: MaybeMatcher<string>; text?: MaybeMatcher<string>; title?: MaybeMatcher<string>; visible?: MaybeMatcher<boolean> }>, MergeObjects<EmptyObject, FilterMethods<HTMLElement, { text: (element?: HTMLElement) => string; visible: { apply: (elem: HTMLElement) => boolean; default: boolean }; classList: any; className: any; focused: any; id: any; title: any }>>, MergeObjects<MergeObjects<EmptyObject, ActionMethods<HTMLElement, { blur: any; click: any; focus: any }>>, ActionMethods<HTMLElement, { close: (__namedParameters: Interactor<HTMLElement, EmptyObject>) => Interaction<void> }>>> = DialogInteractor

Call this InteractorConstructor to initialize a dialog Interactor. The dialog interactor can be used to interact with dialog windows on the page and to assert on their state.

The dialog is located by the text of its label or by title text content.

Example

await Dialog('Login').close();
await Dialog({ id: 'login-modal' }).exists();

Filters

  • id: string – Filter by id
  • visible: boolean – Filter by visibility. Defaults to true. See isVisible.

Actions

Fab

Fab: InteractorConstructor<HTMLButtonElement | HTMLInputElement, MergeObjects<MergeObjects<MergeObjects<EmptyObject, { classList?: MaybeMatcher<string[]>; className?: MaybeMatcher<string>; focused?: MaybeMatcher<boolean>; id?: MaybeMatcher<string>; text?: MaybeMatcher<string>; title?: MaybeMatcher<string>; visible?: MaybeMatcher<boolean> }>, { disabled?: MaybeMatcher<boolean> }>, { svgIcon: undefined | MaybeMatcher<boolean> }>, MergeObjects<MergeObjects<MergeObjects<EmptyObject, FilterMethods<HTMLElement, { text: (element?: HTMLElement) => string; visible: { apply: (elem: HTMLElement) => boolean; default: boolean }; classList: any; className: any; focused: any; id: any; title: any }>>, FilterMethods<HTMLButtonElement | HTMLInputElement, { disabled: { default: boolean; apply: any } }>>, FilterMethods<HTMLButtonElement | HTMLInputElement, { svgIcon: (element: HTMLButtonElement | HTMLInputElement) => boolean }>>, MergeObjects<EmptyObject, ActionMethods<HTMLElement, { blur: any; click: any; focus: any }>>> = FabInteractor

Call this InteractorConstructor to initialize a floating action button Interactor. The fab interactor can be used to interact with fabs on the page and to assert on their state.

The fab is located by the aria-label attribute or the visible text on the fab in otherwise.

Example

await Fab('add').click();
await Fab('add').is({ disabled: true });
await Fab({ id: 'add-button', disabled: true }).exists();

Filters

  • title: string – Filter by title
  • id: string – Filter by id
  • visible: boolean – Filter by visibility. Defaults to true. See isVisible.
  • disabled: boolean – Filter by whether the fab is disabled. Defaults to false.
  • focused: boolean – Filter by whether the fab is focused. See focused.
  • svgIcon: boolean - Filter by whether the fab has icon.

Actions

FormControl

FormControl: InteractorConstructor<HTMLElement, MergeObjects<MergeObjects<EmptyObject, { classList?: MaybeMatcher<string[]>; className?: MaybeMatcher<string>; focused?: MaybeMatcher<boolean>; id?: MaybeMatcher<string>; text?: MaybeMatcher<string>; title?: MaybeMatcher<string>; visible?: MaybeMatcher<boolean> }>, { description: undefined | MaybeMatcher<string>; valid: undefined | MaybeMatcher<boolean> }>, MergeObjects<MergeObjects<EmptyObject, FilterMethods<HTMLElement, { text: (element?: HTMLElement) => string; visible: { apply: (elem: HTMLElement) => boolean; default: boolean }; classList: any; className: any; focused: any; id: any; title: any }>>, FilterMethods<HTMLElement, { description: (element: HTMLElement) => string; valid: (element: HTMLElement) => boolean }>>, MergeObjects<EmptyObject, ActionMethods<HTMLElement, { blur: any; click: any; focus: any }>>> = FormControlInteractor

Call this InteractorConstructor to initialize a form control Interactor. The form control interactor can be used to assert on form fields state.

The form control is located by the text of its label.

Example

await FormControl('Email').has({ description: 'Email for newsletters' });
await FormControl({ id: 'email-field', valid: true }).exists();

Filters

  • id: string – Filter by id
  • visible: boolean – Filter by visibility. Defaults to true. See isVisible.
  • valid: boolean – Filter by whether the form field is valid.
  • description: string – Filter by the form's field description text.
  • disabled: boolean – Filter by whether the form field is disabled. Defaults to false.

FormField

FormField: InteractorConstructor

Use this InteractorConstructor as a base for creating interactors which work with form fields. This allows you to use field labels as locators, and also provides some basic filters which are convenient for most form fields.

Locates the form field by its label.

Example

const PasswordField = FormField.extend<HTMLInputElement>('password field')
.selector('input[type=password'])
.filters({
value: (element) => element.value,
placeholder: (element) => element.placeholder,
})

Filters

  • title: string – Filter by title
  • id: string – Filter by id
  • visible: boolean – Filter by visibility. Defaults to true. See isVisible.
  • focused: boolean – Filter by whether the form field is focused. See focused.
  • valid: boolean – Filter by whether the form field is valid.
  • disabled: boolean – Filter by whether the form field is disabled. Defaults to false.

Actions

HTML

HTML: InteractorConstructor

Use this InteractorConstructor as a base for creating interactors which work with HTML elements. This provides some basic functionality which is convenient for most HTML elements.

Example

const Link = HTML.extend<HTMLLinkElement>('link')
.selector('a[href]')
.filters({
href: (element) => element.href
})

Filters

  • classList: string[] — Filter by the list of classes found in element's className
  • className: string — Filter by element's className
  • title: string – Filter by title
  • id: string – Filter by id
  • text: string – Filter by the text content of this element.
  • visible: boolean – Filter by visibility. Defaults to true. See isVisible.
  • focused: boolean – Filter by whether the element is focused. See focused.

Actions

HTMLButton

HTMLButton: InteractorConstructor

Call this InteractorConstructor to initialize a button Interactor. The button interactor can be used to interact with buttons on the page and to assert on their state.

The button is located by the visible text on the button.

Example

await Button('Submit').click();
await Button('Submit').is({ disabled: true });
await Button({ id: 'submit-button', disabled: true }).exists();

Filters

  • title: string – Filter by title
  • id: string – Filter by id
  • visible: boolean – Filter by visibility. Defaults to true. See isVisible.
  • disabled: boolean – Filter by whether the button is disabled. Defaults to false.
  • focused: boolean – Filter by whether the button is focused. See focused.

Actions

HTMLCheckbox

HTMLCheckbox: InteractorConstructor

Call this InteractorConstructor to initialize a checkbox Interactor. The checkbox interactor can be used to interact with checkboxes on the page and to assert on their state.

The checkbox is located by the text of its label.

Example

await CheckBox('Accept').check();
await CheckBox('Accept').is({ disabled: true });
await CheckBox({ id: 'accept', disabled: true }).exists();

Filters

  • title: string – Filter by title
  • id: string – Filter by id
  • visible: boolean – Filter by visibility. Defaults to true. See isVisible.
  • valid: boolean – Filter by whether the checkbox is valid.
  • checked: boolean – Filter by whether the checkbox is checked.
  • indeterminate: boolean - Filter by whether the checkbox has indeterminate state.
  • disabled: boolean – Filter by whether the checkbox is disabled. Defaults to false.
  • focused: boolean – Filter by whether the checkbox is focused. See focused.

Actions

HTMLLink

HTMLLink: InteractorConstructor

Call this InteractorConstructor to initialize a link Interactor. The link interactor can be used to interact with links on the page and to assert on their state.

The link is located by its text.

Example

await Link('Home').click();
await Link('Home').has({ href: '/' });
await Link({ id: 'home-link', href: '/' }).exists();

Filters

  • title: string – Filter by title
  • id: string – Filter by id
  • href: string – The value of the href attribute that the link points to
  • visible: boolean – Filter by visibility. Defaults to true. See isVisible.
  • focused: boolean – Filter by whether the link is focused. See focused.

Actions

HTMLMultiSelect

HTMLMultiSelect: InteractorConstructor

Call this InteractorConstructor to initialize an Interactor for select boxes with multiple select. The multi select interactor can be used to interact with select boxes with the multiple attribute and to assert on their state.

See Select for an interactor for single select boxes.

The multi select is located by the text of its label.

Example

await MultiSelect('Language').select('English');
await MultiSelect('Language').select('German');
await MultiSelect('Language').deselect('Swedish');
await MultiSelect('Language').has({ values: ['English', 'German'] });

Filters

  • title: string – Filter by title
  • id: string – Filter by id
  • valid: boolean – Filter by whether the select box is valid.
  • values: string[] – Filter by the text of the selected options.
  • visible: boolean – Filter by visibility. Defaults to true. See isVisible.
  • disabled: boolean – Filter by whether the select box is disabled. Defaults to false.
  • focused: boolean – Filter by whether the select box is focused. See focused.

Actions

  • click(): Interaction – Click on the multi select
  • focus(): Interaction – Move focus to the multi select
  • blur(): Interaction – Move focus away from the multi select
  • choose(text: string): Interaction – Choose the option with the given text from the multi select. Will deselect all other selected options.
  • select(text: string): Interaction – Add the option with the given text to the selection.
  • deselect(text: string): Interaction – Remove the option with the given text from the selection.

HTMLRadio

HTMLRadio: InteractorConstructor

Call this InteractorConstructor to initialize a radio button Interactor. The radio button interactor can be used to interact with radio buttons on the page and to assert on their state.

The radio button is located by the text of its label.

Example

await RadioButton('Public').click();
await RadioButton('Private').is({ disabled: true });
await RadioButton({ id: 'privacy-public', disabled: true }).exists();

Filters

  • title: string – Filter by title
  • id: string – Filter by id
  • visible: boolean – Filter by visibility. Defaults to true. See isVisible.
  • valid: boolean – Filter by whether the radio button is valid.
  • checked: boolean – Filter by whether the radio button is checked.
  • disabled: boolean – Filter by whether the radio button is disabled. Defaults to false.
  • focused: boolean – Filter by whether the radio button is focused. See focused.

Actions

HTMLSelect

HTMLSelect: InteractorConstructor

Call this InteractorConstructor to initialize an Interactor for select boxes. The select interactor can be used to interact with select boxes and to assert on their state.

For interacting with multiple select boxes, see MultiSelect.

The select box is located by the text of its label.

Example

await Select('Language').select('English');
await Select('Language').has({ value: 'English' });

Filters

  • title: string – Filter by title
  • id: string – Filter by id
  • valid: boolean – Filter by whether the select box is valid.
  • value: string – Filter by the text of the selected option.
  • visible: boolean – Filter by visibility. Defaults to true. See isVisible.
  • disabled: boolean – Filter by whether the select box is disabled. Defaults to false.
  • focused: boolean – Filter by whether the select box is focused. See focused.

Actions

  • click(): Interaction – Click on the select box
  • focus(): Interaction – Move focus to the select box
  • blur(): Interaction – Move focus away from the select box
  • choose(text: string): Interaction – Choose the option with the given text from the select box.

HTMLTextField

HTMLTextField: InteractorConstructor

Call this InteractorConstructor to initialize a text field Interactor. The text field interactor can be used to interact with text fields on the page and to assert on their state. A text field is any input tag with a text-like interface, so input fields with e.g. email or number types are also considered text fields, as is any input field with an unknown type.

The text field is located by the text of its label.

Example

await TextField('Email').fillIn('jonas@example.com');
await TextField('Email').has({ value: 'jonas@example.com' });
await TextField({ id: 'email-field', disabled: true }).exists();

Filters

  • title: string – Filter by title
  • id: string – Filter by id
  • visible: boolean – Filter by visibility. Defaults to true. See isVisible.
  • value: string – Filter by the text field's current value.
  • placeholder: string – Filter by the text field's placeholder attribute.
  • valid: boolean – Filter by whether the text field is valid.
  • disabled: boolean – Filter by whether the text field is disabled. Defaults to false.
  • focused: boolean – Filter by whether the text field is focused. See focused.

Actions

  • click(): Interaction – Click on the text field
  • focus(): Interaction – Move focus to the text field
  • blur(): Interaction – Move focus away from the text field
  • fillIn(value: string): Interaction – Fill in the text field with the given value. See fillIn.

Heading

Heading: InteractorConstructor

Call this InteractorConstructor to initialize a heading Interactor. The heading interactor can be used to assert on the state of headings on the page, represented by the h1 through h6 tags.

Example

await Heading('Welcome!').exists();

Filters

  • level: number – The level of the heading, for example, the level of h3 is 3.
  • visible: boolean – Filter by visibility. Defaults to true. See isVisible.

Link

Link: InteractorConstructor<HTMLLinkElement, MergeObjects<MergeObjects<EmptyObject, { classList?: MaybeMatcher<string[]>; className?: MaybeMatcher<string>; focused?: MaybeMatcher<boolean>; id?: MaybeMatcher<string>; text?: MaybeMatcher<string>; title?: MaybeMatcher<string>; visible?: MaybeMatcher<boolean> }>, { href?: MaybeMatcher<string> }>, MergeObjects<MergeObjects<EmptyObject, FilterMethods<HTMLElement, { text: (element?: HTMLElement) => string; visible: { apply: (elem: HTMLElement) => boolean; default: boolean }; classList: any; className: any; focused: any; id: any; title: any }>>, FilterMethods<HTMLLinkElement, { href: any }>>, MergeObjects<EmptyObject, ActionMethods<HTMLElement, { blur: any; click: any; focus: any }>>> = LinkInteractor

Call this InteractorConstructor to initialize a link Interactor. The link interactor can be used to interact with links on the page and to assert on their state.

The link is located by its text.

Example

await Link('Home').click();
await Link('Home').has({ href: '/' });
await Link({ id: 'home-link', href: '/' }).exists();

Filters

  • title: string – Filter by title
  • id: string – Filter by id
  • href: string – The value of the href attribute that the link points to
  • visible: boolean – Filter by visibility. Defaults to true. See isVisible.
  • focused: boolean – Filter by whether the link is focused. See focused.

Actions

List

List: InteractorConstructor<HTMLElement, MergeObjects<EmptyObject, { classList?: MaybeMatcher<string[]>; className?: MaybeMatcher<string>; focused?: MaybeMatcher<boolean>; id?: MaybeMatcher<string>; text?: MaybeMatcher<string>; title?: MaybeMatcher<string>; visible?: MaybeMatcher<boolean> }>, MergeObjects<EmptyObject, FilterMethods<HTMLElement, { text: (element?: HTMLElement) => string; visible: { apply: (elem: HTMLElement) => boolean; default: boolean }; classList: any; className: any; focused: any; id: any; title: any }>>, MergeObjects<EmptyObject, ActionMethods<HTMLElement, { blur: any; click: any; focus: any }>>> = ListInteractor

Call this InteractorConstructor to initialize a list Interactor. The list interactor can be used to assert on lists state.

The list is located by the aria-label attribute or by text content.

Example

await List('ToDos').exists();

Filters

  • id: string – Filter by id
  • visible: boolean – Filter by visibility. Defaults to true. See isVisible.

ListItem

ListItem: InteractorConstructor<HTMLElement, MergeObjects<MergeObjects<EmptyObject, { classList?: MaybeMatcher<string[]>; className?: MaybeMatcher<string>; focused?: MaybeMatcher<boolean>; id?: MaybeMatcher<string>; text?: MaybeMatcher<string>; title?: MaybeMatcher<string>; visible?: MaybeMatcher<boolean> }>, { disabled: undefined | MaybeMatcher<boolean>; index: undefined | MaybeMatcher<number> }>, MergeObjects<MergeObjects<EmptyObject, FilterMethods<HTMLElement, { text: (element?: HTMLElement) => string; visible: { apply: (elem: HTMLElement) => boolean; default: boolean }; classList: any; className: any; focused: any; id: any; title: any }>>, FilterMethods<HTMLElement, { disabled: { apply: (element: HTMLElement) => boolean; default: boolean }; index: (element: HTMLElement) => number }>>, MergeObjects<EmptyObject, ActionMethods<HTMLElement, { blur: any; click: any; focus: any }>>> = ListItemInteractor

Call this InteractorConstructor to initialize a list item Interactor. The list item interactor can be used to interact with items on the page and to assert on their state.

The list item is located by the visible text on the item.

Example

await ListItem('Install `@interactors/material-ui`').click();
await ListItem({ index: 2, disabled: true }).exists();

Filters

  • title: string – Filter by title
  • id: string – Filter by id
  • visible: boolean – Filter by visibility. Defaults to true. See isVisible.
  • disabled: boolean – Filter by whether the item is disabled. Defaults to false.
  • index: number - Filter by the item's zero-based index position in a list.

Actions

Menu

Menu: InteractorConstructor<HTMLButtonElement | HTMLLinkElement, MergeObjects<MergeObjects<EmptyObject, { classList?: MaybeMatcher<string[]>; className?: MaybeMatcher<string>; focused?: MaybeMatcher<boolean>; id?: MaybeMatcher<string>; text?: MaybeMatcher<string>; title?: MaybeMatcher<string>; visible?: MaybeMatcher<boolean> }>, { disabled: undefined | MaybeMatcher<boolean>; href: undefined | MaybeMatcher<null | string> }>, MergeObjects<MergeObjects<EmptyObject, FilterMethods<HTMLElement, { text: (element?: HTMLElement) => string; visible: { apply: (elem: HTMLElement) => boolean; default: boolean }; classList: any; className: any; focused: any; id: any; title: any }>>, FilterMethods<HTMLButtonElement | HTMLLinkElement, { disabled: { apply: (element: HTMLButtonElement | HTMLLinkElement) => boolean; default: boolean }; href: (element: HTMLButtonElement | HTMLLinkElement) => null | string }>>, MergeObjects<MergeObjects<EmptyObject, ActionMethods<HTMLElement, { blur: any; click: any; focus: any }>>, ActionMethods<HTMLButtonElement | HTMLLinkElement, { click: (interactor: Interactor<HTMLButtonElement | HTMLLinkElement, EmptyObject>, value: string) => Promise<void>; open: (__namedParameters: Interactor<HTMLButtonElement | HTMLLinkElement, EmptyObject>) => Promise<void> }>>> = MenuInteractor

Call this InteractorConstructor to initialize a menu Interactor. The menu interactor can be used to interact with menus on the page and to assert on their state.

The menu is located by the aria-label attribute or the visible text on the menu in otherwise.

Example

await Menu('Options').open();
await Menu('Options').is({ disabled: true });
await Menu({ id: 'options', disabled: true }).exists();

Filters

  • title: string – Filter by title
  • id: string – Filter by id
  • visible: boolean – Filter by visibility. Defaults to true. See isVisible.
  • disabled: boolean – Filter by whether the menu is disabled. Defaults to false.
  • focused: boolean – Filter by whether the menu is focused. See focused.

Actions

MenuItem

MenuItem: InteractorConstructor<HTMLElement, MergeObjects<MergeObjects<EmptyObject, { classList?: MaybeMatcher<string[]>; className?: MaybeMatcher<string>; focused?: MaybeMatcher<boolean>; id?: MaybeMatcher<string>; text?: MaybeMatcher<string>; title?: MaybeMatcher<string>; visible?: MaybeMatcher<boolean> }>, { disabled: MaybeMatcher<undefined | boolean> }>, MergeObjects<MergeObjects<EmptyObject, FilterMethods<HTMLElement, { text: (element?: HTMLElement) => string; visible: { apply: (elem: HTMLElement) => boolean; default: boolean }; classList: any; className: any; focused: any; id: any; title: any }>>, FilterMethods<HTMLElement, { disabled: { apply: { <T>(element: T): boolean; <T>(element?: null | T): boolean | undefined }; default: boolean } }>>, MergeObjects<MergeObjects<EmptyObject, ActionMethods<HTMLElement, { blur: any; click: any; focus: any }>>, ActionMethods<HTMLElement, { click: (__namedParameters: Interactor<HTMLElement, EmptyObject>) => Interaction<void> }>>> = MenuItemInteractor

Call this InteractorConstructor to initialize a menu item Interactor. The menu item interactor can be used to interact with items on the page and to assert on their state.

The menu item is located by the visible text on the item.

Example

await MenuItem('Edit').click();
await MenuItem({ id: 'edit', disabled: true }).exists();

Filters

  • title: string – Filter by title
  • id: string – Filter by id
  • visible: boolean – Filter by visibility. Defaults to true. See isVisible.
  • disabled: boolean – Filter by whether the item is disabled. Defaults to false.

Actions

MultiSelect

MultiSelect: InteractorConstructor<HTMLInputElement, MergeObjects<MergeObjects<EmptyObject, { classList: undefined | MaybeMatcher<string[]>; className: undefined | MaybeMatcher<string>; disabled: MaybeMatcher<undefined | boolean>; id: MaybeMatcher<undefined | string>; valid: undefined | MaybeMatcher<boolean>; description?: any; required?: any }>, { values: undefined | MaybeMatcher<string[]> }>, MergeObjects<MergeObjects<EmptyObject, FilterMethods<HTMLInputElement, { classList: (element: HTMLInputElement) => string[]; className: (element: HTMLInputElement) => string; disabled: { apply: (element: HTMLInputElement) => undefined | boolean; default: boolean }; id: (element: HTMLInputElement) => undefined | string; valid: (element: HTMLInputElement) => boolean; description: any; required: any }>>, FilterMethods<HTMLInputElement, { values: (element: HTMLInputElement) => string[] }>>, MergeObjects<MergeObjects<EmptyObject, ActionMethods<HTMLInputElement, { open: (__namedParameters: Interactor<HTMLInputElement, EmptyObject>) => Interaction<void> }>>, ActionMethods<HTMLInputElement, { choose: (interactor: Interactor<HTMLInputElement, EmptyObject>, value: string) => Promise<void>; deselect: (interactor: Interactor<HTMLInputElement, EmptyObject>, value: string) => Promise<void>; select: (interactor: Interactor<HTMLInputElement, EmptyObject>, value: string) => Promise<void> }>>> = MultiSelectInteractor

Call this InteractorConstructor to initialize a select Interactor. The select interactor can be used to interact with selects with the multiple attribute and to assert on their state.

See Select for an interactor for single select.

The multi select is located by the text of its label.

Example

await MultiSelect('Language').select('English');
await MultiSelect('Language').select('German');
await MultiSelect('Language').deselect('Swedish');
await MultiSelect('Language').has({ values: ['English', 'German'] });

Filters

  • id: string – Filter by id
  • valid: boolean – Filter by whether the select is valid.
  • required: boolean – Filter by whether the select is required.
  • description: string – Filter by description.
  • value: string – Filter by the text of the selected option.
  • disabled: boolean – Filter by whether the select is disabled. Defaults to false.

Actions

  • click(): Interaction – Click on the multi select
  • focus(): Interaction – Move focus to the multi select
  • blur(): Interaction – Move focus away from the multi select
  • choose(text: string): Interaction – Choose the option with the given text from the multi select. Will deselect all other selected options.
  • select(text: string): Interaction – Add the option with the given text to the selection.
  • deselect(text: string): Interaction – Remove the option with the given text from the selection.

NativeMultiSelect

NativeMultiSelect: InteractorConstructor<HTMLSelectElement, MergeObjects<MergeObjects<MergeObjects<MergeObjects<EmptyObject, { classList?: MaybeMatcher<string[]>; className?: MaybeMatcher<string>; focused?: MaybeMatcher<boolean>; id?: MaybeMatcher<string>; text?: MaybeMatcher<string>; title?: MaybeMatcher<string>; visible?: MaybeMatcher<boolean> }>, { disabled?: MaybeMatcher<boolean>; valid?: MaybeMatcher<boolean> }>, { values?: MaybeMatcher<string[]> }>, { description?: any; required?: any; valid?: any }>, MergeObjects<MergeObjects<MergeObjects<MergeObjects<EmptyObject, FilterMethods<HTMLElement, { text: (element?: HTMLElement) => string; visible: { apply: (elem: HTMLElement) => boolean; default: boolean }; classList: any; className: any; focused: any; id: any; title: any }>>, FilterMethods<HTMLInputElement | HTMLSelectElement | HTMLTextAreaElement, { disabled: { default: boolean; apply: any }; valid: any }>>, FilterMethods<HTMLSelectElement, { values: any }>>, FilterMethods<HTMLSelectElement, { description: any; required: any; valid: any }>>, MergeObjects<MergeObjects<EmptyObject, ActionMethods<HTMLElement, { blur: any; click: any; focus: any }>>, ActionMethods<HTMLSelectElement, { choose: any; deselect: any; select: any }>>> = NativeMultiSelectInteractor

Call this InteractorConstructor to initialize a select Interactor. The select interactor can be used to interact with selects with the multiple attribute and to assert on their state.

See Select for an interactor for single select.

The multi select is located by the text of its label.

Example

await MultiSelect('Language').select('English');
await MultiSelect('Language').select('German');
await MultiSelect('Language').deselect('Swedish');
await MultiSelect('Language').has({ values: ['English', 'German'] });

Filters

  • title: string – Filter by title
  • id: string – Filter by id
  • valid: boolean – Filter by whether the select is valid.
  • required: boolean – Filter by whether the select is required.
  • description: string – Filter by description.
  • value: string – Filter by the text of the selected option.
  • visible: boolean – Filter by visibility. Defaults to true. See isVisible.
  • disabled: boolean – Filter by whether the select is disabled. Defaults to false.
  • focused: boolean – Filter by whether the select is focused. See focused.

Actions

  • click(): Interaction – Click on the multi select
  • focus(): Interaction – Move focus to the multi select
  • blur(): Interaction – Move focus away from the multi select
  • choose(text: string): Interaction – Choose the option with the given text from the multi select. Will deselect all other selected options.
  • select(text: string): Interaction – Add the option with the given text to the selection.
  • deselect(text: string): Interaction – Remove the option with the given text from the selection.

NativeSelect

NativeSelect: InteractorConstructor<HTMLSelectElement, MergeObjects<MergeObjects<MergeObjects<MergeObjects<EmptyObject, { classList?: MaybeMatcher<string[]>; className?: MaybeMatcher<string>; focused?: MaybeMatcher<boolean>; id?: MaybeMatcher<string>; text?: MaybeMatcher<string>; title?: MaybeMatcher<string>; visible?: MaybeMatcher<boolean> }>, { disabled?: MaybeMatcher<boolean>; valid?: MaybeMatcher<boolean> }>, { value?: MaybeMatcher<string> }>, { description?: any; required?: any; valid?: any }>, MergeObjects<MergeObjects<MergeObjects<MergeObjects<EmptyObject, FilterMethods<HTMLElement, { text: (element?: HTMLElement) => string; visible: { apply: (elem: HTMLElement) => boolean; default: boolean }; classList: any; className: any; focused: any; id: any; title: any }>>, FilterMethods<HTMLInputElement | HTMLSelectElement | HTMLTextAreaElement, { disabled: { default: boolean; apply: any }; valid: any }>>, FilterMethods<HTMLSelectElement, { value: any }>>, FilterMethods<HTMLSelectElement, { description: any; required: any; valid: any }>>, MergeObjects<MergeObjects<EmptyObject, ActionMethods<HTMLElement, { blur: any; click: any; focus: any }>>, ActionMethods<HTMLSelectElement, { choose: any }>>> = NativeSelectInteractor

Call this InteractorConstructor to initialize a select Interactor. The select interactor can be used to interact with selects and to assert on their state.

For interacting with multiple selects, see MultiSelect.

The select is located by the text of its label.

Example

await Select('Language').select('English');
await Select('Language').has({ value: 'English' });

Filters

  • title: string – Filter by title
  • id: string – Filter by id
  • valid: boolean – Filter by whether the select is valid.
  • required: boolean – Filter by whether the select is required.
  • description: string – Filter by description.
  • value: string – Filter by the text of the selected option.
  • visible: boolean – Filter by visibility. Defaults to true. See isVisible.
  • disabled: boolean – Filter by whether the select is disabled. Defaults to false.
  • focused: boolean – Filter by whether the select is focused. See focused.

Actions

  • click(): Interaction – Click on the select
  • focus(): Interaction – Move focus to the select
  • blur(): Interaction – Move focus away from the select
  • choose(text: string): Interaction – Choose the option with the given text from the select.

Page

Page: Interactor & FilterMethods & Omit<EmptyObject, "title" | "url"> & EmptyObject & { visit: any }

This Interactor can be used to assert on global properties of the page. When using the BigTest test runner, it can also be used for interacting with the page itself, for example through nagivation.

Example

await Page.has({ title: 'Welcome to my app!' });

Navigation, for BigTest test runner only:

await Page.visit('/archive');

Filters

  • title: string – the title of the document
  • url: string – the URL of the document

Actions

  • visit(path: string): Interaction – visit the given path in the test frame, BigTest runner only.

Popover

Popover: InteractorConstructor<HTMLElement, MergeObjects<EmptyObject, { classList?: MaybeMatcher<string[]>; className?: MaybeMatcher<string>; focused?: MaybeMatcher<boolean>; id?: MaybeMatcher<string>; text?: MaybeMatcher<string>; title?: MaybeMatcher<string>; visible?: MaybeMatcher<boolean> }>, MergeObjects<EmptyObject, FilterMethods<HTMLElement, { text: (element?: HTMLElement) => string; visible: { apply: (elem: HTMLElement) => boolean; default: boolean }; classList: any; className: any; focused: any; id: any; title: any }>>, MergeObjects<MergeObjects<EmptyObject, ActionMethods<HTMLElement, { blur: any; click: any; focus: any }>>, ActionMethods<HTMLElement, { close: (__namedParameters: Interactor<HTMLElement, EmptyObject>) => Interaction<void> }>>> = PopoverInteractor

Call this InteractorConstructor to initialize a popover Interactor. The popover interactor can be used to interact with popover on the page and to assert on their state.

The popover is located by the text of its label or by title text content.

Example

await Popover().close();

Filters

  • visible: boolean – Filter by visibility. Defaults to true. See isVisible.

Actions

Radio

Radio: InteractorConstructor<HTMLInputElement, MergeObjects<MergeObjects<MergeObjects<MergeObjects<EmptyObject, { classList?: MaybeMatcher<string[]>; className?: MaybeMatcher<string>; focused?: MaybeMatcher<boolean>; id?: MaybeMatcher<string>; text?: MaybeMatcher<string>; title?: MaybeMatcher<string>; visible?: MaybeMatcher<boolean> }>, { disabled?: MaybeMatcher<boolean>; valid?: MaybeMatcher<boolean> }>, { checked?: MaybeMatcher<boolean>; visible?: MaybeMatcher<null | boolean> }>, { visible: undefined | MaybeMatcher<boolean> }>, MergeObjects<MergeObjects<MergeObjects<MergeObjects<EmptyObject, FilterMethods<HTMLElement, { text: (element?: HTMLElement) => string; visible: { apply: (elem: HTMLElement) => boolean; default: boolean }; classList: any; className: any; focused: any; id: any; title: any }>>, FilterMethods<HTMLInputElement | HTMLSelectElement | HTMLTextAreaElement, { disabled: { default: boolean; apply: any }; valid: any }>>, FilterMethods<HTMLInputElement, { visible: { default: boolean; apply: any }; checked: any }>>, FilterMethods<HTMLInputElement, { visible: { apply: (element: HTMLInputElement) => boolean; default: boolean } }>>, MergeObjects<MergeObjects<EmptyObject, ActionMethods<HTMLElement, { blur: any; click: any; focus: any }>>, ActionMethods<HTMLInputElement, { choose: any }>>> = RadioInteractor

Call this InteractorConstructor to initialize a radio button Interactor. The radio button interactor can be used to interact with radio buttons on the page and to assert on their state.

The radio button is located by the text of its label.

Example

await RadioButton('Public').click();
await RadioButton('Private').is({ disabled: true });
await RadioButton({ id: 'privacy-public', disabled: true }).exists();

Filters

  • title: string – Filter by title
  • id: string – Filter by id
  • visible: boolean – Filter by visibility. Defaults to true. See isVisible.
  • valid: boolean – Filter by whether the radio button is valid.
  • checked: boolean – Filter by whether the radio button is checked.
  • disabled: boolean – Filter by whether the radio button is disabled. Defaults to false.
  • focused: boolean – Filter by whether the radio button is focused. See focused.

Actions

Select

Select: InteractorConstructor<HTMLInputElement, MergeObjects<MergeObjects<EmptyObject, { classList: undefined | MaybeMatcher<string[]>; className: undefined | MaybeMatcher<string>; disabled: MaybeMatcher<undefined | boolean>; id: MaybeMatcher<undefined | string>; valid: undefined | MaybeMatcher<boolean>; description?: any; required?: any }>, { value: undefined | MaybeMatcher<string> }>, MergeObjects<MergeObjects<EmptyObject, FilterMethods<HTMLInputElement, { classList: (element: HTMLInputElement) => string[]; className: (element: HTMLInputElement) => string; disabled: { apply: (element: HTMLInputElement) => undefined | boolean; default: boolean }; id: (element: HTMLInputElement) => undefined | string; valid: (element: HTMLInputElement) => boolean; description: any; required: any }>>, FilterMethods<HTMLInputElement, { value: (element: HTMLInputElement) => string }>>, MergeObjects<MergeObjects<EmptyObject, ActionMethods<HTMLInputElement, { open: (__namedParameters: Interactor<HTMLInputElement, EmptyObject>) => Interaction<void> }>>, ActionMethods<HTMLInputElement, { choose: (interactor: Interactor<HTMLInputElement, EmptyObject>, value: string) => Promise<void> }>>> = SelectInteractor

Call this InteractorConstructor to initialize a select Interactor. The select interactor can be used to interact with selects and to assert on their state.

For interacting with multiple selects, see MultiSelect.

The select is located by the text of its label.

Example

await Select('Language').select('English');
await Select('Language').has({ value: 'English' });

Filters

  • id: string – Filter by id
  • valid: boolean – Filter by whether the select is valid.
  • required: boolean – Filter by whether the select is required.
  • description: string – Filter by description.
  • value: string – Filter by the text of the selected option.
  • disabled: boolean – Filter by whether the select is disabled. Defaults to false.

Actions

  • click(): Interaction – Click on the select
  • focus(): Interaction – Move focus to the select
  • blur(): Interaction – Move focus away from the select
  • choose(text: string): Interaction – Choose the option with the given text from the select.

Slider

Slider: InteractorConstructor<HTMLElement, MergeObjects<MergeObjects<EmptyObject, { classList?: MaybeMatcher<string[]>; className?: MaybeMatcher<string>; focused?: MaybeMatcher<boolean>; id?: MaybeMatcher<string>; text?: MaybeMatcher<string>; title?: MaybeMatcher<string>; visible?: MaybeMatcher<boolean> }>, { disabled: undefined | MaybeMatcher<boolean>; horizontal: undefined | MaybeMatcher<boolean>; max: undefined | MaybeMatcher<boolean>; maxValue: MaybeMatcher<undefined | number>; min: undefined | MaybeMatcher<boolean>; minValue: MaybeMatcher<undefined | number>; orientation: undefined | MaybeMatcher<null | SliderOrientation>; textValue: MaybeMatcher<undefined | null | string | string[]>; value: MaybeMatcher<undefined | number | number[]>; vertical: undefined | MaybeMatcher<boolean> }>, MergeObjects<MergeObjects<EmptyObject, FilterMethods<HTMLElement, { text: (element?: HTMLElement) => string; visible: { apply: (elem: HTMLElement) => boolean; default: boolean }; classList: any; className: any; focused: any; id: any; title: any }>>, FilterMethods<HTMLElement, { disabled: { apply: (element: Element) => boolean; default: boolean }; horizontal: (element: HTMLElement) => boolean; max: (element: HTMLElement) => boolean; maxValue: (element: HTMLElement) => undefined | number; min: (element: HTMLElement) => boolean; minValue: (element: HTMLElement) => undefined | number; orientation: (element: HTMLElement) => null | SliderOrientation; textValue: (element: HTMLElement) => undefined | null | string | string[]; value: (element: HTMLElement) => undefined | number | number[]; vertical: (element: HTMLElement) => boolean }>>, MergeObjects<MergeObjects<EmptyObject, ActionMethods<HTMLElement, { blur: any; click: any; focus: any }>>, ActionMethods<HTMLElement, { decrease: (__namedParameters: Interactor<HTMLElement, EmptyObject>, steps?: any) => Interaction<void>; increase: (__namedParameters: Interactor<HTMLElement, EmptyObject>, steps?: any) => Interaction<void>; setMax: (__namedParameters: Interactor<HTMLElement, EmptyObject>) => Interaction<void>; setMin: (__namedParameters: Interactor<HTMLElement, EmptyObject>) => Interaction<void>; setValue: (__namedParameters: Interactor<HTMLElement, EmptyObject>, value: number) => Interaction<void> }>>> = SliderInteractor

Call this InteractorConstructor to initialize a slider Interactor. The slider interactor can be used to interact with sliders on the page and to assert on their state.

The slider is located by the label or the aria-label attribute.

Example

await Slider('Submit').click();
await Slider('Submit').is({ disabled: true });
await Slider({ id: 'submit-slider', disabled: true }).exists();

Filters

  • id: string – Filter by id
  • visible: boolean – Filter by visibility. Defaults to true. See isVisible.
  • disabled: boolean – Filter by whether the slider is disabled. Defaults to false.
  • orientation: horizontal | vertical - Filter by orientation
  • horizontal: boolean - Filter by whether the slider has horizontal orientation
  • vertical: boolean - Filter by whether the slider has vertical orientation
  • minValue: number - Filter by the least possible value
  • maxValue: number - Filter by the greatest possible value
  • value: number - Filter by the current value
  • textValue: string - Filter by the text representation of current value
  • min: boolean - Filter by whether the slider value is equal minValue
  • max: boolean - Filter by whether the slider value is equal maxValue

Actions

  • focus(): Interaction – Move focus to the slider
  • blur(): Interaction – Move focus away from the slider
  • decrease(steps: number = 1): Interaction – Decrease slider value by specific steps
  • increase(steps: number = 1): Interaction – Increase slider value by specific steps
  • setMin(): Interaction - Set value to the least possible
  • setMax(): Interaction – Set value to the greatest possible
  • setValue(value: number): Interaction – Set current value

Snackbar

Snackbar: InteractorConstructor<HTMLElement, MergeObjects<EmptyObject, { classList?: MaybeMatcher<string[]>; className?: MaybeMatcher<string>; focused?: MaybeMatcher<boolean>; id?: MaybeMatcher<string>; text?: MaybeMatcher<string>; title?: MaybeMatcher<string>; visible?: MaybeMatcher<boolean> }>, MergeObjects<EmptyObject, FilterMethods<HTMLElement, { text: (element?: HTMLElement) => string; visible: { apply: (elem: HTMLElement) => boolean; default: boolean }; classList: any; className: any; focused: any; id: any; title: any }>>, MergeObjects<EmptyObject, ActionMethods<HTMLElement, { blur: any; click: any; focus: any }>>> = SnackbarInteractor

Call this InteractorConstructor to initialize a snackbar Interactor. The snackbar interactor can be used to assert on snackbars state.

The snackbar is located by the visible text of content message.

Example

await Snackbar('I love snacks').exists();

Filters

  • id: string – Filter by id
  • visible: boolean – Filter by visibility. Defaults to true. See isVisible.

Switch

Switch: InteractorConstructor<HTMLInputElement, MergeObjects<MergeObjects<MergeObjects<MergeObjects<EmptyObject, { classList?: MaybeMatcher<string[]>; className?: MaybeMatcher<string>; focused?: MaybeMatcher<boolean>; id?: MaybeMatcher<string>; text?: MaybeMatcher<string>; title?: MaybeMatcher<string>; visible?: MaybeMatcher<boolean> }>, { disabled?: MaybeMatcher<boolean>; valid?: MaybeMatcher<boolean> }>, { checked?: MaybeMatcher<boolean>; indeterminate?: MaybeMatcher<boolean>; visible?: MaybeMatcher<null | boolean> }>, { indeterminate: undefined | MaybeMatcher<boolean>; visible: undefined | MaybeMatcher<null | boolean> }>, MergeObjects<MergeObjects<MergeObjects<MergeObjects<EmptyObject, FilterMethods<HTMLElement, { text: (element?: HTMLElement) => string; visible: { apply: (elem: HTMLElement) => boolean; default: boolean }; classList: any; className: any; focused: any; id: any; title: any }>>, FilterMethods<HTMLInputElement | HTMLSelectElement | HTMLTextAreaElement, { disabled: { default: boolean; apply: any }; valid: any }>>, FilterMethods<HTMLInputElement, { visible: { default: boolean; apply: any }; checked: any; indeterminate: any }>>, FilterMethods<HTMLInputElement, { indeterminate: (element: HTMLInputElement) => boolean; visible: { apply: (element: HTMLInputElement) => null | boolean; default: boolean } }>>, MergeObjects<MergeObjects<MergeObjects<EmptyObject, ActionMethods<HTMLElement, { blur: any; click: any; focus: any }>>, ActionMethods<HTMLInputElement, { check: any; toggle: any; uncheck: any }>>, ActionMethods<HTMLInputElement, { click: (__namedParameters: Interactor<HTMLInputElement, EmptyObject>) => Interaction<void> }>>> = SwitchInteractor

Call this InteractorConstructor to initialize a switch Interactor. The switch interactor can be used to interact with switches on the page and to assert on their state.

The switch is located by the text of its label or by aria-label attribute.

Example

await Switch('Theme').toggle();
await Switch('Theme').is({ disabled: true });
await Switch({ id: 'theme-toggler', disabled: true }).exists();

Filters

  • title: string – Filter by title
  • id: string – Filter by id
  • visible: boolean – Filter by visibility. Defaults to true. See isVisible.
  • valid: boolean – Filter by whether the switch is valid.
  • checked: boolean – Filter by whether the switch is checked..
  • disabled: boolean – Filter by whether the switch is disabled. Defaults to false.
  • focused: boolean – Filter by whether the switch is focused. See focused.

Actions

Tab

Tab: InteractorConstructor<HTMLElement, MergeObjects<MergeObjects<EmptyObject, { classList?: MaybeMatcher<string[]>; className?: MaybeMatcher<string>; focused?: MaybeMatcher<boolean>; id?: MaybeMatcher<string>; text?: MaybeMatcher<string>; title?: MaybeMatcher<string>; visible?: MaybeMatcher<boolean> }>, { active: undefined | MaybeMatcher<boolean>; disabled: MaybeMatcher<undefined | boolean> }>, MergeObjects<MergeObjects<EmptyObject, FilterMethods<HTMLElement, { text: (element?: HTMLElement) => string; visible: { apply: (elem: HTMLElement) => boolean; default: boolean }; classList: any; className: any; focused: any; id: any; title: any }>>, FilterMethods<HTMLElement, { active: (element: HTMLElement) => boolean; disabled: { apply: { <T>(element: T): boolean; <T>(element?: null | T): boolean | undefined }; default: boolean } }>>, MergeObjects<EmptyObject, ActionMethods<HTMLElement, { blur: any; click: any; focus: any }>>> = TabInteractor

Call this InteractorConstructor to initialize a tab Interactor. The tab interactor can be used to interact with tabs on the page and to assert on their state.

The tab is located by the text of its label or by text content.

Example

await Tab('Preview').click();
await Tab({ id: 'preview-tab' }).exists();

Filters

  • id: string – Filter by id
  • visible: boolean – Filter by visibility. Defaults to true. See isVisible.
  • disabled: boolean – Filter by whether the tab is disabled. Defaults to false.
  • active: boolean – Filter by whether the tab is active.

Actions

Tabs

Tabs: InteractorConstructor<HTMLElement, MergeObjects<MergeObjects<EmptyObject, { classList?: MaybeMatcher<string[]>; className?: MaybeMatcher<string>; focused?: MaybeMatcher<boolean>; id?: MaybeMatcher<string>; text?: MaybeMatcher<string>; title?: MaybeMatcher<string>; visible?: MaybeMatcher<boolean> }>, { value: undefined | MaybeMatcher<string> }>, MergeObjects<MergeObjects<EmptyObject, FilterMethods<HTMLElement, { text: (element?: HTMLElement) => string; visible: { apply: (elem: HTMLElement) => boolean; default: boolean }; classList: any; className: any; focused: any; id: any; title: any }>>, FilterMethods<HTMLElement, { value: (element: HTMLElement) => string }>>, MergeObjects<MergeObjects<EmptyObject, ActionMethods<HTMLElement, { blur: any; click: any; focus: any }>>, ActionMethods<HTMLElement, { click: (interactor: Interactor<HTMLElement, EmptyObject>, value: string) => Interaction<void> }>>> = TabsInteractor

Call this InteractorConstructor to initialize a tabs Interactor. The tabs interactor can be used to interact with tabs containers on the page and to assert on their state.

The tabs is located by the aria-label attribute.

Example

await Tab('View modes').click();
await Tab({ value: 'preview' }).exists();

Filters

  • id: string – Filter by id
  • visible: boolean – Filter by visibility. Defaults to true. See isVisible.
  • disabled: boolean – Filter by whether the tabs are disabled. Defaults to false.
  • value: string – Filter by the active tab.

Actions

  • click(value: string): Interaction – Click on the specific tab

TextField

TextField: InteractorConstructor<HTMLInputElement | HTMLTextAreaElement, MergeObjects<MergeObjects<MergeObjects<MergeObjects<EmptyObject, { classList?: MaybeMatcher<string[]>; className?: MaybeMatcher<string>; focused?: MaybeMatcher<boolean>; id?: MaybeMatcher<string>; text?: MaybeMatcher<string>; title?: MaybeMatcher<string>; visible?: MaybeMatcher<boolean> }>, { disabled?: MaybeMatcher<boolean>; valid?: MaybeMatcher<boolean> }>, { placeholder?: MaybeMatcher<string>; value?: MaybeMatcher<string> }>, { description?: any; required?: any; valid?: any }>, MergeObjects<MergeObjects<MergeObjects<MergeObjects<EmptyObject, FilterMethods<HTMLElement, { text: (element?: HTMLElement) => string; visible: { apply: (elem: HTMLElement) => boolean; default: boolean }; classList: any; className: any; focused: any; id: any; title: any }>>, FilterMethods<HTMLInputElement | HTMLSelectElement | HTMLTextAreaElement, { disabled: { default: boolean; apply: any }; valid: any }>>, FilterMethods<HTMLInputElement | HTMLTextAreaElement, { placeholder: any; value: any }>>, FilterMethods<HTMLInputElement | HTMLTextAreaElement, { description: any; required: any; valid: any }>>, MergeObjects<MergeObjects<EmptyObject, ActionMethods<HTMLElement, { blur: any; click: any; focus: any }>>, ActionMethods<HTMLInputElement | HTMLTextAreaElement, { fillIn: any }>>> = TextFieldInteractor

Call this InteractorConstructor to initialize a text field Interactor. The text field interactor can be used to interact with text fields on the page and to assert on their state. A text field is any input tag with a text-like interface, so input fields with e.g. email or number types are also considered text fields, as is any input field with an unknown type.

The text field is located by the text of its label or placeholder.

Example

await TextField('Email').fillIn('jonas@example.com');
await TextField('Email').has({ value: 'jonas@example.com' });
await TextField({ id: 'email-field', disabled: true }).exists();

Filters

  • title: string – Filter by title
  • id: string – Filter by id
  • visible: boolean – Filter by visibility. Defaults to true. See isVisible.
  • value: string – Filter by the text field's current value.
  • placeholder: string – Filter by the text field's placeholder attribute.
  • description: string – Filter by the text field's description attribute.
  • valid: boolean – Filter by whether the text field is valid.
  • required: boolean – Filter by whether the text field is required.
  • disabled: boolean – Filter by whether the text field is disabled. Defaults to false.
  • focused: boolean – Filter by whether the text field is focused. See focused.

Actions

  • click(): Interaction – Click on the text field
  • focus(): Interaction – Move focus to the text field
  • blur(): Interaction – Move focus away from the text field
  • fillIn(value: string): Interaction – Fill in the text field with the given value. See fillIn.

TimeField

TimeField: InteractorConstructor<HTMLInputElement, MergeObjects<MergeObjects<MergeObjects<MergeObjects<EmptyObject, { classList?: MaybeMatcher<string[]>; className?: MaybeMatcher<string>; focused?: MaybeMatcher<boolean>; id?: MaybeMatcher<string>; text?: MaybeMatcher<string>; title?: MaybeMatcher<string>; visible?: MaybeMatcher<boolean> }>, { disabled?: MaybeMatcher<boolean>; valid?: MaybeMatcher<boolean> }>, { placeholder?: MaybeMatcher<string>; value?: MaybeMatcher<string> }>, { date: undefined | MaybeMatcher<null | Date>; timestamp: undefined | MaybeMatcher<number> }>, MergeObjects<MergeObjects<MergeObjects<MergeObjects<EmptyObject, FilterMethods<HTMLElement, { text: (element?: HTMLElement) => string; visible: { apply: (elem: HTMLElement) => boolean; default: boolean }; classList: any; className: any; focused: any; id: any; title: any }>>, FilterMethods<HTMLInputElement | HTMLSelectElement | HTMLTextAreaElement, { disabled: { default: boolean; apply: any }; valid: any }>>, FilterMethods<HTMLInputElement | HTMLTextAreaElement, { placeholder: any; value: any }>>, FilterMethods<HTMLInputElement, { date: (element: HTMLInputElement) => null | Date; timestamp: (element: HTMLInputElement) => number }>>, MergeObjects<MergeObjects<MergeObjects<EmptyObject, ActionMethods<HTMLElement, { blur: any; click: any; focus: any }>>, ActionMethods<HTMLInputElement | HTMLTextAreaElement, { fillIn: any }>>, ActionMethods<HTMLInputElement, { fillIn: (__namedParameters: Interactor<HTMLInputElement, EmptyObject>, value: string | Date) => Interaction<void> }>>> = TimeFieldInteractor

Call this InteractorConstructor to initialize a time field Interactor. The time field interactor can be used to interact with date fields on the page and to assert on their state. A time field is the time type input tag with a text-like interface.

The time field is located by the text of its label.

Example

await DateTimeField('Alarm').fillIn('09:13');
await DateTimeField('Alarm').has({ value: '09:13' });
await DateTimeField({ id: 'alarm', disabled: true }).exists();

Filters

  • title: string – Filter by title
  • id: string – Filter by id
  • visible: boolean – Filter by visibility. Defaults to true. See isVisible.
  • value: string – Filter by the time field's current value in ISO format.
  • date: Date | null – Filter by the time field's current value as date.
  • timestamp: number – Filter by the time field's current value as timestamp.
  • placeholder: string – Filter by the time field's placeholder attribute.
  • valid: boolean – Filter by whether the time field is valid.
  • disabled: boolean – Filter by whether the time field is disabled. Defaults to false.
  • focused: boolean – Filter by whether the time field is focused. See focused.

Actions

  • click(): Interaction – Click on the time field
  • focus(): Interaction – Move focus to the time field
  • blur(): Interaction – Move focus away from the time field
  • fillIn(value: string): Interaction – Fill in the time field with the given value. See fillIn.

Other Variables

MenuList

MenuList: InteractorConstructor<HTMLElement, EmptyObject, EmptyObject, EmptyObject> = MenuListInteractor

SelectOption

SelectOption: InteractorConstructor<HTMLLIElement, MergeObjects<MergeObjects<EmptyObject, { classList?: MaybeMatcher<string[]>; className?: MaybeMatcher<string>; focused?: MaybeMatcher<boolean>; id?: MaybeMatcher<string>; text?: MaybeMatcher<string>; title?: MaybeMatcher<string>; visible?: MaybeMatcher<boolean> }>, { disabled: MaybeMatcher<undefined | boolean>; selected: undefined | MaybeMatcher<boolean> }>, MergeObjects<MergeObjects<EmptyObject, FilterMethods<HTMLElement, { text: (element?: HTMLElement) => string; visible: { apply: (elem: HTMLElement) => boolean; default: boolean }; classList: any; className: any; focused: any; id: any; title: any }>>, FilterMethods<HTMLLIElement, { disabled: { apply: { <T>(element: T): boolean; <T>(element?: null | T): boolean | undefined }; default: boolean }; selected: (element: HTMLLIElement) => boolean }>>, MergeObjects<MergeObjects<EmptyObject, ActionMethods<HTMLElement, { blur: any; click: any; focus: any }>>, ActionMethods<HTMLLIElement, { choose: (__namedParameters: Interactor<HTMLLIElement, EmptyObject>) => Interaction<void> }>>> = ...

Thumb

Thumb: InteractorConstructor<HTMLElement, MergeObjects<MergeObjects<EmptyObject, { classList?: MaybeMatcher<string[]>; className?: MaybeMatcher<string>; focused?: MaybeMatcher<boolean>; id?: MaybeMatcher<string>; text?: MaybeMatcher<string>; title?: MaybeMatcher<string>; visible?: MaybeMatcher<boolean> }>, { disabled: undefined | MaybeMatcher<boolean>; index: MaybeMatcher<undefined | number>; max: undefined | MaybeMatcher<boolean>; min: undefined | MaybeMatcher<boolean>; textValue: undefined | MaybeMatcher<null | string>; value: MaybeMatcher<undefined | number> }>, MergeObjects<MergeObjects<EmptyObject, FilterMethods<HTMLElement, { text: (element?: HTMLElement) => string; visible: { apply: (elem: HTMLElement) => boolean; default: boolean }; classList: any; className: any; focused: any; id: any; title: any }>>, FilterMethods<HTMLElement, { disabled: { apply: (element: Element) => boolean; default: boolean }; index: (element: HTMLElement) => undefined | number; max: (element: HTMLElement) => boolean; min: (element: HTMLElement) => boolean; textValue: (element: HTMLElement) => null | string; value: (element: HTMLElement) => undefined | number }>>, MergeObjects<MergeObjects<EmptyObject, ActionMethods<HTMLElement, { blur: any; click: any; focus: any }>>, ActionMethods<HTMLElement, { decrease: (__namedParameters: Interactor<HTMLElement, EmptyObject>, steps?: any) => Interaction<void>; increase: (__namedParameters: Interactor<HTMLElement, EmptyObject>, steps?: any) => Interaction<void>; setMax: (__namedParameters: Interactor<HTMLElement, EmptyObject>) => Interaction<void>; setMin: (__namedParameters: Interactor<HTMLElement, EmptyObject>) => Interaction<void>; setValue: (__namedParameters: Interactor<HTMLElement, EmptyObject>, value: number) => Interaction<void> }>>> = ...

Functions

and

  • and<T>(...args: MaybeMatcher<T>[]): Matcher<T>
  • Type parameters

    • T

    Parameters

    • Rest ...args: MaybeMatcher<T>[]

    Returns Matcher<T>

blur

  • blur<E>(interactor: Interactor<E, any>): Promise<void>
  • Helper function for blur action, performs element.blur() on the selected element.

    Can be used with object property value shorthand in your interactor actions.

    actions: {
    focus,
    }

    Type parameters

    • E: HTMLElement

    Parameters

    Returns Promise<void>

createCalendar

  • createCalendar(utils: DatePickerUtils): InteractorConstructor<HTMLElement, MergeObjects<MergeObjects<EmptyObject, { day: MaybeMatcher<undefined | number>; month: MaybeMatcher<undefined | string>; title: MaybeMatcher<undefined | string>; weekDay: MaybeMatcher<undefined | string>; year: MaybeMatcher<undefined | number> }>, { date: undefined | MaybeMatcher<Date> }>, MergeObjects<MergeObjects<EmptyObject, FilterMethods<HTMLElement, { day: (element: HTMLElement) => undefined | number; month: (element: HTMLElement) => undefined | string; title: (element: HTMLElement) => undefined | string; weekDay: (element: HTMLElement) => undefined | string; year: (element: HTMLElement) => undefined | number }>>, FilterMethods<HTMLElement, { date: (element: HTMLElement) => Date }>>, MergeObjects<MergeObjects<EmptyObject, ActionMethods<HTMLElement, { nextMonth: <T>(__namedParameters: Interactor<HTMLElement, T>) => Interaction<void>; prevMonth: <T>(__namedParameters: Interactor<HTMLElement, T>) => Interaction<void>; setDay: <T>(interactor: Interactor<HTMLElement, T>, day: number) => Promise<void>; setMonth: <T>(interactor: Interactor<HTMLElement, T>, targetMonth: string) => Promise<void>; setYear: <T>(interactor: Interactor<HTMLElement, T>, targetYear: number) => Promise<void> }>>, ActionMethods<HTMLElement, { setMonth: <T>(interactor: Interactor<HTMLElement, T>, targetMonth: string) => Promise<void> }>>>
  • Parameters

    Returns InteractorConstructor<HTMLElement, MergeObjects<MergeObjects<EmptyObject, { day: MaybeMatcher<undefined | number>; month: MaybeMatcher<undefined | string>; title: MaybeMatcher<undefined | string>; weekDay: MaybeMatcher<undefined | string>; year: MaybeMatcher<undefined | number> }>, { date: undefined | MaybeMatcher<Date> }>, MergeObjects<MergeObjects<EmptyObject, FilterMethods<HTMLElement, { day: (element: HTMLElement) => undefined | number; month: (element: HTMLElement) => undefined | string; title: (element: HTMLElement) => undefined | string; weekDay: (element: HTMLElement) => undefined | string; year: (element: HTMLElement) => undefined | number }>>, FilterMethods<HTMLElement, { date: (element: HTMLElement) => Date }>>, MergeObjects<MergeObjects<EmptyObject, ActionMethods<HTMLElement, { nextMonth: <T>(__namedParameters: Interactor<HTMLElement, T>) => Interaction<void>; prevMonth: <T>(__namedParameters: Interactor<HTMLElement, T>) => Interaction<void>; setDay: <T>(interactor: Interactor<HTMLElement, T>, day: number) => Promise<void>; setMonth: <T>(interactor: Interactor<HTMLElement, T>, targetMonth: string) => Promise<void>; setYear: <T>(interactor: Interactor<HTMLElement, T>, targetYear: number) => Promise<void> }>>, ActionMethods<HTMLElement, { setMonth: <T>(interactor: Interactor<HTMLElement, T>, targetMonth: string) => Promise<void> }>>>

createInspector

  • createInspector<IC>(constructor: IC, parentElement?: Element): Inspector<IC>
  • Type parameters

    Parameters

    • constructor: IC
    • Optional parentElement: Element

    Returns Inspector<IC>

createInteractor

  • Create a custom interactor with the given name.

    Creating a simple interactor

    let Paragraph = createInteractor('paragraph').selector('p');
    

    Note the double function call!

    Type parameters

    • E: Element

      The type of DOM Element that this interactor operates on. By specifying the element type, actions and filters defined for the interactor can be type checked against the actual element type.

    Parameters

    • name: string

    Returns InteractorConstructor<E, EmptyObject, EmptyObject, EmptyObject>

    You will need to call the returned builder to create an interactor.

every

  • every<T>(expected: MaybeMatcher<T>): Matcher<Iterable<T>>
  • Type parameters

    • T

    Parameters

    • expected: MaybeMatcher<T>

    Returns Matcher<Iterable<T>>

fillIn

  • fillIn(element: TextFieldElement, value: string): void
  • Fill in text into an element by emulating how a user would do it, first focusing the element, then filling in the text letter by letter, generating the appropriate keyboard events.

    Parameters

    • element: TextFieldElement

      The element to fill in text in

    • value: string

      The text value to fill in

    Returns void

focus

  • focus<E>(interactor: Interactor<E, any>): Promise<void>
  • Helper function for focus action, performs element.focus() on the selected element.

    Can be used with object property value shorthand in your interactor actions.

    actions: {
    focus,
    }

    Type parameters

    • E: HTMLElement

    Parameters

    Returns Promise<void>

focused

  • focused(element: Element): boolean
  • Helper function for focused filters, returns whether the given element is focused.

    Parameters

    • element: Element

    Returns boolean

Const getDay

  • getDay(element: HTMLElement): undefined | number
  • Parameters

    • element: HTMLElement

    Returns undefined | number

Const getMonth

  • getMonth(element: HTMLElement): undefined | string
  • Parameters

    • element: HTMLElement

    Returns undefined | string

Const getYear

  • getYear(element: HTMLElement): undefined | number
  • Parameters

    • element: HTMLElement

    Returns undefined | number

including

  • including(subString: string): Matcher<string>
  • Parameters

    • subString: string

    Returns Matcher<string>

isInteraction

  • Parameters

    • x: unknown

    Returns x is Interaction<unknown>

isVisible

  • isVisible(elem: HTMLElement): boolean
  • Parameters

    • elem: HTMLElement

    Returns boolean

matching

  • matching(regexp: RegExp): Matcher<string>
  • Parameters

    • regexp: RegExp

    Returns Matcher<string>

not

  • not<T>(matcher: MaybeMatcher<T>): Matcher<T>
  • Type parameters

    • T

    Parameters

    • matcher: MaybeMatcher<T>

    Returns Matcher<T>

or

  • or<T>(...args: MaybeMatcher<T>[]): Matcher<T>
  • Type parameters

    • T

    Parameters

    • Rest ...args: MaybeMatcher<T>[]

    Returns Matcher<T>

perform

  • perform<E, F, T>(fn: (element: E, ...args: T) => void): (interactor: Interactor<E, F>, ...args: T) => Promise<void>
  • Type parameters

    • E: Element

    • F: {}

    • T: unknown[]

    Parameters

    • fn: (element: E, ...args: T) => void
        • (element: E, ...args: T): void
        • Parameters

          • element: E
          • Rest ...args: T

          Returns void

    Returns (interactor: Interactor<E, F>, ...args: T) => Promise<void>

      • (interactor: Interactor<E, F>, ...args: T): Promise<void>
      • Parameters

        Returns Promise<void>

Const read

  • read<E, F>(interactor: Interactor<E, F>, field: keyof F): Promise<FilterReturn<F>>
  • Type parameters

    • E: Element

    • F: EmptyObject

    Parameters

    Returns Promise<FilterReturn<F>>

some

  • some<T>(expected: MaybeMatcher<T>): Matcher<Iterable<T>>
  • Type parameters

    • T

    Parameters

    • expected: MaybeMatcher<T>

    Returns Matcher<Iterable<T>>

Generated using TypeDoc