Rayrun

How do I retrieve the current value of an input element using Playwright?

Answer

To retrieve the current value of an input element using @playwright/test, you can use the locator.inputValue() method. This method returns a Promise that resolves to a string representing the input element's value. If the input element is empty, the string will be empty as well.

Here's an example using TypeScript:

import { test, expect } from '@playwright/test';

test('Get input value', async ({ page }) => {
  await page.goto('https://ray.run/');

  // Locate the input element
  const inputLocator = page.locator('input[type="text"]');

  // Get the input value
  const inputValue = await inputLocator.inputValue();

  // Perform assertions or further actions
  console.log(inputValue);
});

You can also pass an optional options object to locator.inputValue(). This object allows you to specify a timeout for how long Playwright should wait for the input element's value to change before returning it. By default, there is no timeout, and Playwright returns immediately with the current value.

const inputValue = await inputLocator.inputValue({ timeout: 1000 });

In addition to getting input values, Playwright provides methods for setting values and interacting with other types of elements. For example, use locator.setChecked() to check or uncheck checkboxes and radio buttons, or locator.selectOption() to select options from dropdown menus.

Thank you!
Was this helpful?
Still have questions?

If you still have questions, please ask a question and I will try to answer it.

TwitterGitHubLinkedIn
AboutQuestionsDiscord ForumBrowser ExtensionTagsQA Jobs

Rayrun is a community for QA engineers. I am constantly looking for new ways to add value to people learning Playwright and other browser automation frameworks. If you have feedback, email luc@ray.run.