chore: fix webkit visibility check in aria matcher (#33102)

microsoft · Oct 14, 2024 · 2c05d29 · 2c05d29
1 parent a38ff6e
commit 2c05d29
Show file tree

Hide file tree

Showing 2 changed files with 15 additions and 7 deletions.
diff --git a/packages/playwright-core/src/server/injected/ariaSnapshot.ts b/packages/playwright-core/src/server/injected/ariaSnapshot.ts
@@ -16,7 +16,7 @@
 
 import { escapeWithQuotes } from '@isomorphic/stringUtils';
 import { beginAriaCaches, endAriaCaches, getAriaRole, getElementAccessibleName, isElementIgnoredForAria } from './roleUtils';
-import { isElementVisible } from './domUtils';
+import { isElementVisible, isElementStyleVisibilityVisible } from './domUtils';
 
 type AriaNode = {
   role: string;
@@ -59,11 +59,7 @@ export function generateAriaTree(rootElement: Element): AriaNode {
       return;
 
     const visible = isElementVisible(element);
-    const hasVisibleChildren = element.checkVisibility({
-      opacityProperty: true,
-      visibilityProperty: true,
-      contentVisibilityAuto: true
-    });
+    const hasVisibleChildren = isElementStyleVisibilityVisible(element);
 
     if (!hasVisibleChildren)
       return;

diff --git a/tests/page/to-match-aria-snapshot.spec.ts b/tests/page/to-match-aria-snapshot.spec.ts
@@ -94,8 +94,20 @@ test('should allow text nodes', async ({ page }) => {
   `);
 });
 
+test('details visibility', async ({ page, browserName }) => {
+  await page.setContent(`
+    <details>
+      <summary>Summary</summary>
+      <div>Details</div>
+    </details>
+  `);
+
+  await expect(page.locator('body')).toMatchAriaSnapshot(`
+    - group: Summary
+  `);
+});
+
 test('integration test', async ({ page, browserName }) => {
-  test.fixme(browserName === 'webkit');
   await page.setContent(`
     <h1>Microsoft</h1>
     <div>Open source projects and samples from Microsoft</div>