Implementation:Getgauge Taiko TextWrapper

Knowledge Sources	Getgauge_Taiko
Domains	Browser_Automation, Element_Selection
Last Updated	2026-02-12 03:00 GMT

Overview

Concrete tool for selecting HTML text-related input elements and contenteditable elements by their label text provided by the Taiko browser automation library.

Description

`TextWrapper` is a specialized subclass of `ElementWrapper` that locates HTML elements associated with text content. Unlike most other wrappers that target a single tag, `TextWrapper` covers a broad range of text-oriented elements:

`input[type="text"]` -- Standard text input fields
`input[type="password"]` -- Password input fields
`input[type="search"]` -- Search input fields
`input[type="number"]` -- Numeric input fields
`input[type="email"]` -- Email input fields
`input[type="tel"]` -- Telephone input fields
`input[type="url"]` -- URL input fields
`input` (no type attribute) -- Inputs that default to text behavior
`textarea` -- Multi-line text areas
`*[contenteditable="true"]` -- Any element with contenteditable enabled

The constructor passes `"Element"` as the element type and `"text"` as the query type to the parent `ElementWrapper`. The `_get` method uses the `match()` function from `elementSearch` with a wildcard tag (`"*"`) to find elements matching the label text, then filters the results through `handleRelativeSearch()` to apply any proximity-based constraints from the `selector.args`.

Usage

Use `TextWrapper` (via the `text()` selector in Taiko) when you need to locate text-related elements on a page by their associated label. This is the appropriate selector for identifying text inputs, password fields, search boxes, textareas, or contenteditable regions by the label text that describes them.

Code Reference

Source Location

Repository: Getgauge_Taiko
File: lib/elementWrapper/textWrapper.js
Lines: 1-31

Signature

class TextWrapper extends ElementWrapper {
  constructor(attrValuePairs, _options, ...args) {
    super('Element', 'text', attrValuePairs, _options, ...args);
    this._get = async () => {
      return await handleRelativeSearch(
        await match(this.selector.label, this._options).elements('*', 0, 0),
        this.selector.args,
      );
    };
  }
}

Import

const { text } = require('taiko');

I/O Contract

Inputs

Name	Type	Required	Description
attrValuePairs	string / Object / RegExp	No	A label string to match against the text element's associated label, an attribute-value pair object for CSS attribute matching, or a regular expression. The `match()` function resolves the label against form labels, placeholder text, and surrounding text.
_options	Object	No	Options object passed through to the parent `ElementWrapper`.
...args	RelativeSearchElement[]	No	Zero or more relative search elements (e.g., `toRightOf()`, `near()`) used for proximity-based filtering of results.

Outputs

Name	Type	Description
TextWrapper	TextWrapper	An `ElementWrapper` instance representing all matched text elements. Delegates to the first match for actions like `exists()`, `text()`, and `isVisible()`.

Supported Element Types

Selector	HTML Element	Description
`input[type="text"]`	`<input type="text">`	Standard single-line text input
`input[type="password"]`	`<input type="password">`	Password entry field (masked input)
`input[type="search"]`	`<input type="search">`	Search query input
`input[type="number"]`	`<input type="number">`	Numeric value input
`input[type="email"]`	`<input type="email">`	Email address input
`input[type="tel"]`	`<input type="tel">`	Telephone number input
`input[type="url"]`	`<input type="url">`	URL input
`input` (no type)	`<input>`	Defaults to text input behavior
`textarea`	`<textarea>`	Multi-line text area
`*[contenteditable="true"]`	Any element	Contenteditable element

Usage Examples

Basic Usage

const { openBrowser, goto, text, closeBrowser } = require('taiko');

(async () => {
  await openBrowser();
  await goto('https://example.com');
  const hasUsername = await text('Username').exists();
  console.log('Username text element exists:', hasUsername);
  await closeBrowser();
})();

Reading Text Content

const { openBrowser, goto, text, closeBrowser } = require('taiko');

(async () => {
  await openBrowser();
  await goto('https://example.com');
  const content = await text('Welcome').text();
  console.log('Text content:', content);
  await closeBrowser();
})();

With Proximity Selectors

const { openBrowser, goto, text, near, closeBrowser } = require('taiko');

(async () => {
  await openBrowser();
  await goto('https://example.com');
  const labelText = await text('Status', near('Order #1234')).text();
  console.log('Status:', labelText);
  await closeBrowser();
})();

Related Pages

Page Connections

Double-click a node to navigate. Hold to expand connections.

Principle

Implementation

Heuristic

Environment