diff --git a/packages/html-reporter/src/headerView.spec.tsx b/packages/html-reporter/src/headerView.spec.tsx
index 3131ae645d..f783a33c1d 100644
--- a/packages/html-reporter/src/headerView.spec.tsx
+++ b/packages/html-reporter/src/headerView.spec.tsx
@@ -33,6 +33,11 @@ test('should render counters', async ({ mount }) => {
await expect(component.locator('a', { hasText: 'Failed' }).locator('.counter')).toHaveText('31');
await expect(component.locator('a', { hasText: 'Flaky' }).locator('.counter')).toHaveText('17');
await expect(component.locator('a', { hasText: 'Skipped' }).locator('.counter')).toHaveText('10');
+ await expect(component).toMatchAriaSnapshot(`
+ - navigation:
+ - link "All 90"
+ - text: Passed 42 Failed 31 Flaky 17 Skipped 10
+ `);
});
test('should toggle filters', async ({ page, mount }) => {
diff --git a/packages/playwright-core/src/server/injected/ariaSnapshot.ts b/packages/playwright-core/src/server/injected/ariaSnapshot.ts
index 2d9f635410..ad09becd68 100644
--- a/packages/playwright-core/src/server/injected/ariaSnapshot.ts
+++ b/packages/playwright-core/src/server/injected/ariaSnapshot.ts
@@ -141,6 +141,9 @@ function toAriaNode(element: Element): AriaNode | null {
if (roleUtils.kAriaSelectedRoles.includes(role))
result.selected = roleUtils.getAriaSelected(element);
+ if (element instanceof HTMLInputElement || element instanceof HTMLTextAreaElement)
+ result.children = [element.value];
+
return result;
}
diff --git a/tests/page/page-aria-snapshot.spec.ts b/tests/page/page-aria-snapshot.spec.ts
index 435508dab9..d458c37f06 100644
--- a/tests/page/page-aria-snapshot.spec.ts
+++ b/tests/page/page-aria-snapshot.spec.ts
@@ -411,3 +411,13 @@ it('should ignore presentation and none roles', async ({ page }) => {
- list: hello world
`);
});
+
+it('should treat input value as text in templates', async ({ page }) => {
+ await page.setContent(`
+
+ `);
+
+ await checkAndMatchSnapshot(page.locator('body'), `
+ - textbox: hello world
+ `);
+});
diff --git a/tests/playwright-test/update-aria-snapshot.spec.ts b/tests/playwright-test/update-aria-snapshot.spec.ts
index 3c68788d4f..24b417c744 100644
--- a/tests/playwright-test/update-aria-snapshot.spec.ts
+++ b/tests/playwright-test/update-aria-snapshot.spec.ts
@@ -270,3 +270,32 @@ test('should update multiple files', async ({ runInlineTest }, testInfo) => {
`);
});
+
+test('should generate baseline for input values', async ({ runInlineTest }, testInfo) => {
+ const result = await runInlineTest({
+ 'a.spec.ts': `
+ import { test, expect } from '@playwright/test';
+ test('test', async ({ page }) => {
+ await page.setContent(\`\`);
+ await expect(page.locator('body')).toMatchAriaSnapshot(\`\`);
+ });
+ `
+ });
+
+ expect(result.exitCode).toBe(0);
+ const patchPath = testInfo.outputPath('test-results/rebaselines.patch');
+ const data = fs.readFileSync(patchPath, 'utf-8');
+ expect(data).toBe(`--- a/a.spec.ts
++++ b/a.spec.ts
+@@ -2,6 +2,8 @@
+ import { test, expect } from '@playwright/test';
+ test('test', async ({ page }) => {
+ await page.setContent(\`\`);
+- await expect(page.locator('body')).toMatchAriaSnapshot(\`\`);
++ await expect(page.locator('body')).toMatchAriaSnapshot(\`
++ - textbox: hello world
++ \`);
+ });
+
+`);
+});