How to Press Keys in Playwright: Quick Guide

This quick guide will show you how to press keys in Playwright using the keyboard.press() method. You’ll learn how to simulate keyboard actions like Enter, Tab, Arrow keys, and custom key combinations with easy-to-follow examples.

If you’re looking to press keys in Playwright for simulating real user interactions, the press() method is your go-to solution. Whether you want to press Enter, Spacebar, Tab, Arrow keys, or Escape, Playwright makes it easy to automate keyboard input and enhance your end-to-end testing scripts.

You can use the press() method to press keys in Playwright and simulate real user keyboard interactions during automation testing. In this guide, you’ll learn how to press various keyboard keys like Enter, Tab, Arrow keys, and more in your Playwright scripts.

Press Different Keys in Playwright

Let us see how to press different keys in Playwright automation testing.

Press the Enter Key on the Input Element In Playwright

To press the Enter key in Playwright, use the press() method with the “Enter” key as the argument.

Here is a complete example on how to press the Enter key in a playwright automation test.

const { test, expect } = require('@playwright/test');

test('Example: Press Enter key using press() method in playwright.', async ({ page }) => {
  await page.goto('http://only-testing-blog.blogspot.com/2015/03/chart.html');

  //Locate textbox and press Enter key.
  await page.locator('#tooltip-1').press('Enter');
  await page.waitForTimeout(5000);
});

Code Breakdown

await page.locator('#tooltip-1').press('Enter');

• It will locate the textbox web element with id tooltip-1.
• The press() method with the “Enter” argument will simulate pressing the Enter key in Playwright.

Press the Alphabet Keys in Playwright

To press alphabet keys in Playwright, pass the desired letter as an argument to the press() method, as shown in the example below.

await page.locator('#tooltip-1').press('A');
await page.locator('#tooltip-1').press('B');
await page.locator('#tooltip-1').press('C');

Press the Number Keys in Playwright

You can pass numbers as an argument with the press() method to simulate the number key pressing action as given below.

await page.locator('#tooltip-1').press('1');
await page.locator('#tooltip-1').press('2');
await page.locator('#tooltip-1').press('3');

Press the Spacebar Key in Playwright

To press the spacebar key, you can pass the Space argument with the press() method. Here is an example to press the spacebar key in the Playwright automation framework.

await page.locator('#tooltip-1').press('H');
await page.locator('#tooltip-1').press('Space');
await page.locator('#tooltip-1').press('P');

Press the Left, Right, Down, and Up Arrow keys in Playwright

In Playwright automation, you can simulate arrow key presses using the press() method. Use ArrowDown for the down arrow, ArrowUp for the up arrow, ArrowLeft for the left arrow, and ArrowRight for the right arrow key actions.

Syntax to press the Left key

await page.locator('#elementid').press('ArrowLeft')

Syntax to press the Right key

await page.locator('#elementid').press('ArrowRight')

Syntax to press the Up key

await page.locator('#elementid').press('ArrowUp')

Syntax to press the Down key

await page.locator('#elementid').press('ArrowDown')

Press the Tab Key in Playwright

To navigate between input fields in Playwright, use the press() method with the Tab key to simulate tabbing through elements.

await page.locator('#elementid').press('Tab')

Press the Escape Key in Playwright

To simulate an Escape key press in Playwright, use the press() method with the Escape argument. This is useful for closing popups, modals, or canceling actions.

await page.locator('#elementid').press('Escape')

Press Other Keys in Playwright

To press function keys in Playwright, use the press() method with the function key name like F1, F2, etc. You can also use keys like Shift, Control, Alt, Home, End, PageDown, and PageUp to simulate their respective keyboard actions.

Use the following key names as arguments with the press() method in Playwright to simulate different keyboard key presses.

The table above lists all key arguments used with the press() method in Playwright to simulate various key press actions during automation testing.

Final Thoughts

Simulating key presses is an essential part of browser automation testing, especially for forms, navigation, and keyboard interactions. Playwright makes this easy with the press() method, allowing you to simulate everything from simple character inputs to complex combinations like function keys, modifiers, and navigation keys. Use the key arguments listed above to create robust and realistic test cases.

Related Articles

• How to Focus on an Element Using Playwright
• Hover Over Element in Playwright With Example
• How to Wait for an Element to Be Enabled in Playwright

Aravind

Hi, I’m Aravind, a seasoned Automation Test Engineer with 17+ years of industry experience. I specialize in tools like Selenium, JMeter, Appium, and Excel automation. Through this blog, I share practical tutorials, tips, and real-world insights to help testers and developers sharpen their automation skills.