release notes
release notes
Published 5/12/2022
MinorContains new featuresPlaywright Test can now test your React, Vue.js or Svelte components. You can use all the features of Playwright Test (such as parallelization, emulation & debugging) while running components in real browsers.
Here is what a typical component test looks like:
// App.spec.tsx
import { test, expect } from '@playwright/experimental-ct-react';
import App from './App';
// Let's test component in a dark scheme!
test.use({ colorScheme: 'dark' });
test('should render', async ({ mount }) => {
const component = await mount(<App></App>);
// As with any Playwright test, assert locator text.
await expect(component).toContainText('React');
// Or do a screenshot 🚀
await expect(component).toHaveScreenshot();
// Or use any Playwright method
await component.click();
});
Read more in our documentation.
Role selectors allow selecting elements by their ARIA role, ARIA attributes and accessible name.
// Click a button with accessible name "log in"
await page.click('role=button[name="log in"]')
Read more in our documentation.
New locator.filter([options]) API to filter an existing locator
const buttons = page.locator('role=button');
// ...
const submitButton = buttons.filter({ hasText: 'Submit' });
await submitButton.click();
New web-first assertions expect(page).toHaveScreenshot() and expect(locator).toHaveScreenshot() that wait for screenshot stabilization and enhances test reliability.
The new assertions has screenshot-specific defaults, such as:
await page.goto('https://playwright.dev');
await expect(page).toHaveScreenshot();
The new expect(page).toHaveScreenshot() saves screenshots at the same location as expect(screenshot).toMatchSnapshot().
This version was also tested against the following stable channels:
release notes
Published 5/12/2022
MinorContains new featuresPlaywright Test can now test your React, Vue.js or Svelte components. You can use all the features of Playwright Test (such as parallelization, emulation & debugging) while running components in real browsers.
Here is what a typical component test looks like:
// App.spec.tsx
import { test, expect } from '@playwright/experimental-ct-react';
import App from './App';
// Let's test component in a dark scheme!
test.use({ colorScheme: 'dark' });
test('should render', async ({ mount }) => {
const component = await mount(<App></App>);
// As with any Playwright test, assert locator text.
await expect(component).toContainText('React');
// Or do a screenshot 🚀
await expect(component).toHaveScreenshot();
// Or use any Playwright method
await component.click();
});
Read more in our documentation.
Role selectors allow selecting elements by their ARIA role, ARIA attributes and accessible name.
// Click a button with accessible name "log in"
await page.click('role=button[name="log in"]')
Read more in our documentation.
New locator.filter([options]) API to filter an existing locator
const buttons = page.locator('role=button');
// ...
const submitButton = buttons.filter({ hasText: 'Submit' });
await submitButton.click();
New web-first assertions expect(page).toHaveScreenshot() and expect(locator).toHaveScreenshot() that wait for screenshot stabilization and enhances test reliability.
The new assertions has screenshot-specific defaults, such as:
await page.goto('https://playwright.dev');
await expect(page).toHaveScreenshot();
The new expect(page).toHaveScreenshot() saves screenshots at the same location as expect(screenshot).toMatchSnapshot().
This version was also tested against the following stable channels:
Playwright is a framework for Web Testing and Automation. It allows testing Chromium, Firefox and WebKit with a single API.