Add e2e tests for accessibility issues on interactive content in <summary>.

dbaron · Devtools-frontend LUCI CQ · commit bd26195b4fd4 · 2025-07-02T21:29:29.000-07:00
Bug: 427172874 Change-Id: Icc5e5cfb8a503e32fc1d9282ce02e163d2642790 Reviewed-on: https://chromium-review.googlesource.com/c/devtools/devtools-frontend/+/6667583 Commit-Queue: Simon Zünd <szuend@chromium.org> Reviewed-by: Changhao Han <changhaohan@chromium.org> Reviewed-by: Simon Zünd <szuend@chromium.org> Auto-Submit: David Baron <dbaron@chromium.org>
diff --git a/test/e2e/host/user-metrics_test.ts b/test/e2e/host/user-metrics_test.ts
@@ -594,6 +594,19 @@ describe('User Metrics for Issue Panel', () => {
       },
     ]);
   });
+
+  it('dispatches an event when a ElementAccessibility InteractiveContentSummaryDescendant issue is created',
+     async () => {
+       await goToResource('issues/summary-element-accessibility-issue-InteractiveContentSummaryDescendant.html');
+       await waitFor('.issue');
+
+       await assertHistogramEventsInclude([
+         {
+           actionName: 'DevTools.IssueCreated',
+           actionCode: 113,  // ElementAccessibilityIssue::InteractiveContentSummaryDescendant
+         },
+       ]);
+     });
 });
 
 describe('User Metrics for CSS custom properties in the Styles pane', () => {
diff --git a/test/e2e/issues/select-element-accessibility-issues_test.ts b/test/e2e/issues/select-element-accessibility-issues_test.ts
@@ -97,4 +97,18 @@ describe('Select element accessibility issues test', () => {
        ];
        await waitForTableFromResourceSectionContents(section.content, expectedTableRows);
      });
+
+  it('should display issue when there is an interactive element as a descendant of a summary element', async () => {
+    await goToResource('issues/summary-element-accessibility-issue-InteractiveContentSummaryDescendant.html');
+    await navigateToIssuesTab();
+    const issueElement = await getAndExpandSpecificIssueByTitle('Interactive element inside of a <summary> element');
+    assertNotNullOrUndefined(issueElement);
+
+    const section = await getResourcesElement('1 element', issueElement);
+    await ensureResourceSectionIsExpanded(section);
+    const expectedTableRows = [
+      ['Disallowed descendant'],
+    ];
+    await waitForTableFromResourceSectionContents(section.content, expectedTableRows);
+  });
 });
diff --git a/test/e2e/resources/issues/BUILD.gn b/test/e2e/resources/issues/BUILD.gn
@@ -26,6 +26,7 @@ copy_to_gen("issues") {
     "select-element-accessibility-issue-InteractiveContentLegendChild.html",
     "select-element-accessibility-issue-InteractiveContentOptionChild.html",
     "select-element-accessibility-issue-NonPhrasingContentOptionChild.html",
+    "summary-element-accessibility-issue-InteractiveContentSummaryDescendant.html",
     "wasm-co-iframe.html",
     "wasm-co-sharing.html",
   ]
diff --git a/test/e2e/resources/issues/summary-element-accessibility-issue-InteractiveContentSummaryDescendant.html b/test/e2e/resources/issues/summary-element-accessibility-issue-InteractiveContentSummaryDescendant.html
@@ -0,0 +1,7 @@
+<!DOCTYPE html>
+
+<details>
+  <summary>This is <a href="https://example.com/">a link</a> in a summary.</summary>
+
+  <p>More details.</p>
+</details>

Original file line number	Diff line number	Diff line change
`@@ -26,6 +26,7 @@ copy_to_gen("issues") {`
`26`	`26`	`"select-element-accessibility-issue-InteractiveContentLegendChild.html",`
`27`	`27`	`"select-element-accessibility-issue-InteractiveContentOptionChild.html",`
`28`	`28`	`"select-element-accessibility-issue-NonPhrasingContentOptionChild.html",`
	`29`	`+ "summary-element-accessibility-issue-InteractiveContentSummaryDescendant.html",`
`29`	`30`	`"wasm-co-iframe.html",`
`30`	`31`	`"wasm-co-sharing.html",`
`31`	`32`	`]`