From ad365c3bc3ca2ce1120b22e51ed2829f0f9d95b4 Mon Sep 17 00:00:00 2001
From: Pavel Feldman <pavel.feldman@gmail.com>
Date: Mon, 13 Jan 2025 18:25:41 -0800
Subject: [PATCH] chore: include child nodes when parsing snapshot (#34318)

---
 .../src/utils/isomorphic/ariaSnapshot.ts             |  3 ++-
 packages/trace-viewer/src/ui/inspectorTab.tsx        |  1 +
 tests/page/to-match-aria-snapshot.spec.ts            | 12 ++++++++++++
 3 files changed, 15 insertions(+), 1 deletion(-)

diff --git a/packages/playwright-core/src/utils/isomorphic/ariaSnapshot.ts b/packages/playwright-core/src/utils/isomorphic/ariaSnapshot.ts
index 165cf1c92a795..7ffe9b4de9f3e 100644
--- a/packages/playwright-core/src/utils/isomorphic/ariaSnapshot.ts
+++ b/packages/playwright-core/src/utils/isomorphic/ariaSnapshot.ts
@@ -180,8 +180,9 @@ export function parseAriaSnapshot(yaml: YamlLibrary, text: string, options: yaml
 
       // - role "name":
       //   - child
-      const valueIsSequence = value instanceof yaml.YAMLSeq ;
+      const valueIsSequence = value instanceof yaml.YAMLSeq;
       if (valueIsSequence) {
+        container.children.push(childNode);
         convertSeq(childNode, value as yamlTypes.YAMLSeq);
         continue;
       }
diff --git a/packages/trace-viewer/src/ui/inspectorTab.tsx b/packages/trace-viewer/src/ui/inspectorTab.tsx
index 8656e4a9f8493..b6882a6a042e9 100644
--- a/packages/trace-viewer/src/ui/inspectorTab.tsx
+++ b/packages/trace-viewer/src/ui/inspectorTab.tsx
@@ -60,6 +60,7 @@ export const InspectorTab: React.FunctionComponent<{
     <div style={{ margin: '0 10px 10px', flex: 'auto' }}>
       <CodeMirrorWrapper
         text={highlightedElement.ariaSnapshot || ''}
+        language='yaml'
         wrapLines={false}
         highlight={ariaSnapshotErrors}
         onChange={onAriaEditorChange} />
diff --git a/tests/page/to-match-aria-snapshot.spec.ts b/tests/page/to-match-aria-snapshot.spec.ts
index ac94909741dae..2f7ff203a57a6 100644
--- a/tests/page/to-match-aria-snapshot.spec.ts
+++ b/tests/page/to-match-aria-snapshot.spec.ts
@@ -670,3 +670,15 @@ test('should not unshift actual template text', async ({ page }) => {
     - heading "title" [level=1]
 - heading "title 2" [level=1]`);
 });
+
+test('should not match what is not matched', async ({ page }) => {
+  await page.setContent(`<p>Text</p>`);
+  const error = await expect(page.locator('body')).toMatchAriaSnapshot(`
+    - paragraph:
+      - button "bogus"
+  `).catch(e => e);
+  expect(stripAnsi(error.message)).toContain(`
+- - paragraph:
+-   - button "bogus"
++ - paragraph: Text`);
+});