How to Read Textbox Values in Playwright Tests

Playwright encourages using locator methods to select elements on your web pages. To read textbox values, you can use the inputValue() method on a locator pointing to the textbox. Here's how:

Copied!

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

test('Read textbox value', async ({ page }) => {
  await page.goto('https://yourwebsite.com');

  const textboxLocator = page.locator('#myTextbox');

  const textboxValue = await textboxLocator.inputValue();

  console.log(textboxValue);
});

You can also combine getting and verifying the value of a textbox in a single step like this:

Copied!

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

test('Read textbox value', async ({ page }) => {
  await page.goto('https://yourwebsite.com');

  const textboxLocator = page.locator('#myTextbox');

  await expect(textboxLocator).toHaveValue('my_value');
});

Thanks for reading, and happy coding!