← Back to library
Playwrightvisualintermediatev1.20+
Screenshot a single element
Capture a specific component rather than the whole page for focused visual tests.
1test('hero banner matches baseline', async ({ page }) => {
2 await page.goto('/');
3
4 const hero = page.getByTestId('hero-banner');
5 await hero.scrollIntoViewIfNeeded();
6
7 await expect(hero).toHaveScreenshot('hero-banner.png', {
8 maxDiffPixelRatio: 0.01,
9 });
10});#screenshot#element#component#locator