What are the updates and improvements mentioned in the provided links for Playwright version 1.17?

Answer

Playwright 1.17 Updates and Improvements

Frame Locators

In version 1.17, Playwright introduced frame locators, which simplify working with iframes. You can now locate elements within iframes using the frameLocator method:

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

test('Frame locators example', async ({ page }) => {
  await page.goto('https://ray.run/');
  const frameLocator = page.locator('iframe').first();
  await frameLocator.locator('button').click();
});

getByTitle Method

The new getByTitle method allows you to locate elements by their title attribute:

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

test('getByTitle example', async ({ page }) => {
  await page.goto('https://ray.run/');
  await page.getByTitle('Submit').click();
});

Locator and Screenshot Improvements

Playwright 1.17 enhances locators by providing better error messages and improving the screenshot functionality. You can now take screenshots of specific elements using locators:

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

test('Screenshot example', async ({ page }) => {
  await page.goto('https://ray.run/');
  const buttonLocator = page.locator('button');
  await buttonLocator.screenshot({ path: 'button.png' });
});

Playwright Codegen Updates

Playwright Codegen now generates locators and frame locators, making it easier to work with iframes and elements in your tests.

Breaking Change in Playwright Test Global Setup

A potentially breaking change affects users who previously configured tests using environment variables. Make sure to update your configuration accordingly.

For more information on Playwright updates and best practices, check out Ray.run's blog.