Skip to main content

externalSearchInput <NET>

Interaction object representing a text search input with a clear affordance.

A SearchInput is composed into views that support text-based filtering (e.g. ScenariosView, ConsistencyView, ErrorsView). Like FilterBar, it is not instantiated directly by integration tests — views expose delegating methods such as find() at the view level. The SearchInput instance is accessible for component tests that exercise the input widget in isolation.

Instantiation (within a parent interaction object)

import { SearchInput } from '@serenity-js/html-reporter/serenity';
import { By } from '@serenity-js/web';

export class MyView<NET> extends InteractionObject<NET> {
  readonly searchInput = new SearchInput(this.child(By.css('[data-testid="search-input"]')));
}

Usage in a component test

await actor.attemptsTo(
  searchInput.enter('checkout'),
  Ensure.that(searchInput.value(), equals('checkout')),
  Ensure.that(searchInput.isClearable(), equals(true)),

  searchInput.clear(),
  Ensure.that(searchInput.value(), equals('')),
);

Hierarchy

Index

Constructors

Methods

Constructors

externalconstructor

Methods

externalisPresent

  • Checks whether the interaction object's root element is present in the DOM.

    Since InteractionObject implements Optional, you can assert on presence directly:

    Ensure.that(view, isPresent())

    Returns Answerable<boolean>

externalvalue

  • The current value of the search input field.

    Returns the text the user has typed (or that was programmatically filled), even if filtering hasn't yet updated the results.

    Example

    await actor.attemptsTo(
      searchInput.enter('checkout'),
      Ensure.that(searchInput.value(), equals('checkout')),
    );

    Returns QuestionAdapter<string>

externalplaceholder

  • The placeholder text of the search input (e.g. 'Search scenarios...').

    Example

    await actor.attemptsTo(
      Ensure.that(searchInput.placeholder(), equals('Search scenarios...')),
    );

    Returns QuestionAdapter<string>

externallabel

  • The aria-label attribute of the search input, describing its purpose to assistive technology.

    Example

    await actor.attemptsTo(
      Ensure.that(searchInput.label(), equals('Search test scenarios')),
    );

    Returns QuestionAdapter<string>

externalisClearable

  • isClearable(): Question<Promise<boolean>>

  • Whether the clear button is present in the DOM.

    The clear button typically appears only when the input contains text, providing a one-click way to reset the search.

    Example

    await actor.attemptsTo(
      searchInput.enter('checkout'),
      Ensure.that(searchInput.isClearable(), equals(true)),

      searchInput.clear(),
      Ensure.that(searchInput.isClearable(), equals(false)),
    );

    Returns Question<Promise<boolean>>

externalenter

  • Types text into the search input field, triggering the view's text-based filtering.

    Example

    await actor.attemptsTo(
      searchInput.enter('expired card'),
      Ensure.that(searchInput.value(), equals('expired card')),
    );

    Parameters

    • externalsearchTerm: Answerable<string>

      Text to type into the search field

    Returns Task

externalclear

  • Clicks the clear button to reset the search input to empty.

    Example

    await actor.attemptsTo(
      searchInput.enter('checkout'),
      searchInput.clear(),
      Ensure.that(searchInput.value(), equals('')),
    );

    Returns Task

Page Options