From: 7PH <benjamin.raymond@sonarsource.com>
Date: Thu, 15 Aug 2024 09:36:36 +0000 (+0200)
Subject: SONAR-22287 Fix a11y issues on Issue Detail page
X-Git-Tag: 10.7.0.96327~225
X-Git-Url: https://source.dussan.org/?a=commitdiff_plain;h=5d06156e16cd6b0242072ca5e932854baa7c3c78;p=sonarqube.git

SONAR-22287 Fix a11y issues on Issue Detail page
---

diff --git a/server/sonar-web/src/main/js/apps/issues/__tests__/IssuesSourceViewer-it.tsx b/server/sonar-web/src/main/js/apps/issues/__tests__/IssuesSourceViewer-it.tsx
index 1cac63aa8ba..b24d7b21e0d 100644
--- a/server/sonar-web/src/main/js/apps/issues/__tests__/IssuesSourceViewer-it.tsx
+++ b/server/sonar-web/src/main/js/apps/issues/__tests__/IssuesSourceViewer-it.tsx
@@ -104,8 +104,8 @@ describe('issues source viewer', () => {
     renderProjectIssuesApp('project/issues?issues=issue101&open=issue101&id=myproject');
     await waitOnDataLoaded();
 
-    expect(screen.getByRole('separator', { name: 'test1.js' })).toBeInTheDocument();
-    expect(screen.getByRole('separator', { name: 'test2.js' })).toBeInTheDocument();
+    expect(screen.getByLabelText('test1.js')).toBeInTheDocument();
+    expect(screen.getByLabelText('test2.js')).toBeInTheDocument();
 
     // Both line 1 of test1.js and test2.js should be rendered after expanding lines above snippet in test2.js
     expect(ui.line1.getAll()).toHaveLength(1);
diff --git a/server/sonar-web/src/main/js/apps/issues/crossComponentSourceViewer/IssueSourceViewerHeader.tsx b/server/sonar-web/src/main/js/apps/issues/crossComponentSourceViewer/IssueSourceViewerHeader.tsx
index 0d7464ba00a..528712bb163 100644
--- a/server/sonar-web/src/main/js/apps/issues/crossComponentSourceViewer/IssueSourceViewerHeader.tsx
+++ b/server/sonar-web/src/main/js/apps/issues/crossComponentSourceViewer/IssueSourceViewerHeader.tsx
@@ -89,7 +89,7 @@ export function IssueSourceViewerHeader(props: Readonly<Props>) {
 
   const borderColor = themeColor('codeLineBorder')({ theme });
 
-  const IssueSourceViewerStyle = styled.div`
+  const IssueSourceViewerStyle = styled.section`
     border: 1px solid ${borderColor};
     border-bottom: none;
   `;
@@ -113,7 +113,6 @@ export function IssueSourceViewerHeader(props: Readonly<Props>) {
         'sw-flex sw-justify-space-between sw-items-center sw-px-4 sw-py-3 sw-text-sm',
         className,
       )}
-      role="separator"
     >
       <div className="sw-flex-1">
         {displayProjectName && (