Type Text

Types the specified text into an input element.

t.typeText( selector, text [, options] )
Parameter Type Description
selector Function | String | Selector | Snapshot | Promise Identifies the webpage element that will receive input focus. See Selecting Target Elements.
text String The text to be typed into the specified webpage element.
options (optional) Object A set of options that provide additional parameters for the action. See Typing Action Options. If this parameter is omitted, TestCafe sets the cursor to the end of the text before typing, thus preserving the text that is already in the input box.

The t.typeText action clicks the specified element before text is typed if this element is not focused. If the target element is not focused after the click, t.typeText does not type text.

Use the t.selectText and t.pressKey actions to implement operations such as selecting or deleting text.

The following example shows how to use t.typeText with and without options.

import { Selector } from 'testcafe';

const nameInput = Selector('#developer-name');

fixture `My fixture`
    .page `http://www.example.com/`;

test('Type and Replace', async t => {
    await t
        .typeText(nameInput, 'Peter')
        .typeText(nameInput, 'Paker', { replace: true })
        .typeText(nameInput, 'r', { caretPos: 2 })

Typing Into DateTime, Color and Range Inputs

There are certain types of HTML5 inputs, like DateTime, Color or Range, that require entering values in a specific format.

The following table lists value formats expected by these inputs.

Input type Pattern Example
Date yyyy-mm-dd '2017-12-23'
Week yyyy-Www '2017-W03'
Month yyyy-mm '2017-08'
DateTime yyyy-mm-ddThh:mm '2017-11-03T05:00'
Time hh:mm '15:30'
Color #rrggbb '#003000'
Range n '45'