Fill Node

Browser Node

Type text into input fields and text areas

Overview

The Fill node allows you to enter text into input fields, text areas, and other editable elements on a web page. It's one of the most commonly used nodes for form automation and data entry tasks.

Replace or Append

By default Fill clears any existing content before typing (Clear Field First is on). Turn Clear Field First off to append your text to what's already in the field.

Parameters

Configuration options for this node

Element Selector

Selector Input

Required

The input field or text area you want to fill. Use the crosshair button to pick an element visually, or enter a CSS selector manually.

Example: #email, input[name='username'], getByLabel('Email')

Text

Text Input

Required

The text to type into the input field. Supports variables using {{variableName}} syntax for dynamic content.

Example: user@example.com, {{email}}

Typing Delay (ms)

Number Input

Delay in milliseconds between each keystroke to simulate human typing. Useful for sites that validate input character-by-character.

Default: 0

Clear Field First

Toggle

Clear the field before typing. Turn off to append to the existing content.

Default: On

Timeout (ms)

Number Input

Maximum time to wait for the field before failing.

Default: 30000

Force

Toggle

When on, bypasses visibility and actionability checks. Use only when the input is valid but hidden or obstructed.

Default: Off

Auto-fallback

Checkbox

Shown when the selector has more than one option (e.g. from the Selector Picker). When checked, if the first selector fails, the node automatically tries the next ones in order.

Default: Checked (enabled)

Usage Examples

Example 1: Fill a Login Form

Enter email and password into login fields

Selector:input[type="email"]

Text:user@example.com

Example 2: Using Variables

Fill form with dynamic data from workflow variables

Selector:getByLabel("Full Name")

Text:{{userName}}

Example 3: Simulating Human Typing

Add delay between keystrokes for more natural input

Selector:textarea#message

Text:Hello, this is an automated message.

Delay: 50ms

Best Practices

Tip: Wait for Element First

Fill already waits up to its Timeout for the field to appear. If the input shows up later than that (e.g., after a slow modal opens), raise the Timeout or add a Wait for Element node before the Fill node.

Tip: Use Playwright Locators

Playwright locators like getByLabel() and getByPlaceholder() are more reliable than CSS selectors because they find elements by their accessible properties.

Warning: Sensitive Data

Never hardcode passwords or sensitive information in your workflows.

Troubleshooting

Common Issues

Element Not Editable

The fill operation fails because the element is disabled or read-only.

Check if the element has a disabled attribute
Wait for any loading states to complete
Ensure you're targeting the correct input element

Text Not Appearing

The fill completes but text doesn't show in the field.

Some inputs require specific key events - try a Typing Delay, or Type Keys after focusing the field
Check for JavaScript validation that may clear the input
Try clicking the input first before filling

Input Gets Cleared

The text is entered but then gets cleared by the page.

The page may have validation that clears invalid input
Try adding a delay between keystrokes
Use a Dispatch Event node to trigger blur/change events after filling

Fill Node

Browser Node

Type text into input fields and text areas

Overview

The Fill node allows you to enter text into input fields, text areas, and other editable elements on a web page. It's one of the most commonly used nodes for form automation and data entry tasks.

Replace or Append

By default Fill clears any existing content before typing (Clear Field First is on). Turn Clear Field First off to append your text to what's already in the field.

Parameters

Configuration options for this node

Element Selector

Selector Input

Required

The input field or text area you want to fill. Use the crosshair button to pick an element visually, or enter a CSS selector manually.

Example: #email, input[name='username'], getByLabel('Email')

Text

Text Input

Required

The text to type into the input field. Supports variables using {{variableName}} syntax for dynamic content.

Example: user@example.com, {{email}}

Typing Delay (ms)

Number Input

Delay in milliseconds between each keystroke to simulate human typing. Useful for sites that validate input character-by-character.

Default: 0

Clear Field First

Toggle

Clear the field before typing. Turn off to append to the existing content.

Default: On

Timeout (ms)

Number Input

Maximum time to wait for the field before failing.

Default: 30000

Force

Toggle

When on, bypasses visibility and actionability checks. Use only when the input is valid but hidden or obstructed.

Default: Off

Auto-fallback

Checkbox

Shown when the selector has more than one option (e.g. from the Selector Picker). When checked, if the first selector fails, the node automatically tries the next ones in order.

Default: Checked (enabled)

Usage Examples

Example 1: Fill a Login Form

Enter email and password into login fields

Selector:input[type="email"]

Text:user@example.com

Example 2: Using Variables

Fill form with dynamic data from workflow variables

Selector:getByLabel("Full Name")

Text:{{userName}}

Example 3: Simulating Human Typing

Add delay between keystrokes for more natural input

Selector:textarea#message

Text:Hello, this is an automated message.

Delay: 50ms

Best Practices

Tip: Wait for Element First

Tip: Use Playwright Locators

Playwright locators like getByLabel() and getByPlaceholder() are more reliable than CSS selectors because they find elements by their accessible properties.

Warning: Sensitive Data

Never hardcode passwords or sensitive information in your workflows.

Troubleshooting

Common Issues

Element Not Editable

The fill operation fails because the element is disabled or read-only.

Check if the element has a disabled attribute
Wait for any loading states to complete
Ensure you're targeting the correct input element

Text Not Appearing

The fill completes but text doesn't show in the field.

Some inputs require specific key events - try a Typing Delay, or Type Keys after focusing the field
Check for JavaScript validation that may clear the input
Try clicking the input first before filling

Input Gets Cleared

The text is entered but then gets cleared by the page.

The page may have validation that clears invalid input
Try adding a delay between keystrokes
Use a Dispatch Event node to trigger blur/change events after filling

Fill Node

Overview

Replace or Append

Usage Examples

Best Practices

Tip: Wait for Element First

Tip: Use Playwright Locators

Warning: Sensitive Data

Troubleshooting

Element Not Editable

Text Not Appearing

Input Gets Cleared

Related Documentation

Click Node

Select Option Node

Selectors Guide

Fill Node

Overview

Replace or Append

Usage Examples

Best Practices

Tip: Wait for Element First

Tip: Use Playwright Locators

Warning: Sensitive Data

Troubleshooting

Element Not Editable

Text Not Appearing

Input Gets Cleared

Related Documentation

Click Node

Select Option Node

Selectors Guide