Playwright Example >> TextBox

2022-03-23 Playwright

Table of Contents

In this article, we will use Playwright (Python version) to fill textbox in the web form. And get the text value of text box.

Playwright Textbox

Fill the Textbox

We will use DemoQA.com to test our code.
There are four Textbox elements on the page as shown below.
Playwright Textbox

From the source code of web page, we can know the element id of the four Textbox elements.

  • userName
  • userEmail
  • currentAddress
  • permanentAddress

Fill single line Textbox

We can use locator() method of page object to find the element and use fill() method to enter the content.

# Fill #userName
page.locator("#userName").fill("Your Name")

Fill multiline Textbox

For mutiple lines Textbox, we can use \n to concatenate multiline string.

# Fill #currentAddress
page.locator("#currentAddress").fill("Your current address\nYour current address 2\nYour current address 3")

This is the complete code as shown below.

from playwright.sync_api import Playwright, sync_playwright, expect

def run(playwright: Playwright) -> None:
    browser = playwright.chromium.launch(headless=False)
    context = browser.new_context()

    # Open new page
    page = context.new_page()

    # Go to https://demoqa.com/text-box
    page.goto("https://demoqa.com/text-box")

    # Fill #userName
    page.locator("#userName").fill("Your Name")

    # Fill #userEmail
    page.locator("#userEmail").fill("your.name@yourdomain.com")

    # Fill #currentAddress
    page.locator("#currentAddress").fill("Your current address\nYour current address 2\nYour current address 3")

    # Fill #permanentAddress
    page.locator("#permanentAddress").fill("Your permanent address 1\nYour permanent address 2\nYour permanent address 3")

    # ---------------------
    context.close()
    browser.close()


with sync_playwright() as playwright:
    run(playwright)

We execute the code above. The four Textbox elements will be filled as below.
Playwright Textbox

Get the value of Textbox

We can get the input value of Textbox by using input_value() method of locator object.

print(page.locator("#userName").input_value())

print(page.locator("#currentAddress").input_value())

The execution result will be like this.
Playwright Textbox

Conclusion

We can use Playwright to simply fill all the Textbox on the web page automatically. (locator(), fill())
We can also get the input value of the Textbox simply.(locator(), input_value())

If you want to learn the basic usage of Playwright, you can read the article below.

Playwright » Basic Usage
https://thats-it-code.com/playwright/playwright__basic-usage/

You can read the articles below to create a programming environment in your PC.

Let’s Create a Programming Environment
https://thats-it-code.com/programming/lets-create-a-programming-environment/

How to Create Python Virtual Environment
https://thats-it-code.com/programming/how-to-create-python-virtual-environment/

Subscribe and be the FIRST reader of our latest articles

* indicates required

Contact us