From 24e5674fcd6bab15f4aea2c4ccb7498c9d0e0b59 Mon Sep 17 00:00:00 2001
From: MTRNord <mtrnord1@gmail.com>
Date: Fri, 19 Apr 2024 19:20:10 +0200
Subject: [PATCH] Add accessibility tests for the ecosystem subpages and fix
 some heading semantics

---
 templates/macros/sdks.html                 |  2 +-
 templates/shortcodes/all_integrations.html |  2 +-
 tests/metadata.spec.ts                     | 64 ++++++++++++++++++++--
 3 files changed, 61 insertions(+), 7 deletions(-)

diff --git a/templates/macros/sdks.html b/templates/macros/sdks.html
index 19490f493..c29126440 100644
--- a/templates/macros/sdks.html
+++ b/templates/macros/sdks.html
@@ -85,7 +85,7 @@
             <div
                 class="project-card maturity-{{ sdk.maturity | lower }} licence-{{ sdk.licence | slugify }} language-{{ sdk.language | slugify }}">
                 <div class="title-row">
-                    <h3>{{ sdk.name }}</h3>
+                    <h2>{{ sdk.name }}</h2>
                     <div class="maturity {{ sdk.maturity | lower }}">{{ sdk.maturity }}</div>
                 </div>
                 <div class="author">{{ sdk.maintainer }}</div>
diff --git a/templates/shortcodes/all_integrations.html b/templates/shortcodes/all_integrations.html
index 646255254..c403f6bed 100644
--- a/templates/shortcodes/all_integrations.html
+++ b/templates/shortcodes/all_integrations.html
@@ -2,7 +2,7 @@
 <div class="projects-card-deck">
     {% for integration in integrations_data.integrations %}
     <div class="project-card">
-        <h3>{{ integration.name }}</h3>
+        <h2>{{ integration.name }}</h2>
         <span>{{ integration.description | safe }}</span>
         <div class="server-links">
             {% if integration.repository %}
diff --git a/tests/metadata.spec.ts b/tests/metadata.spec.ts
index cc02c1d66..846520223 100644
--- a/tests/metadata.spec.ts
+++ b/tests/metadata.spec.ts
@@ -34,12 +34,66 @@ test.describe('accessibility', () => {
         expect(accessibilityScanResults.violations).toEqual([]);
     });
 
-    // This fails to various contrast related issues - https://dequeuniversity.com/rules/axe/4.9/color-contrast
-    test.fixme('ecosystem should not have any automatically detectable accessibility issues', async ({ page }) => {
-        await page.goto('/ecosystem');
+    test.describe('Ecosystem', () => {
+        // This fails to various contrast related issues - https://dequeuniversity.com/rules/axe/4.9/color-contrast
+        test.fixme('ecosystem should not have any automatically detectable accessibility issues', async ({ page }) => {
+            await page.goto('/ecosystem');
 
-        const accessibilityScanResults = await new AxeBuilder({ page }).analyze();
+            const accessibilityScanResults = await new AxeBuilder({ page }).analyze();
 
-        expect(accessibilityScanResults.violations).toEqual([]);
+            expect(accessibilityScanResults.violations).toEqual([]);
+        });
+
+        test('ecosystem/clients should not have any automatically detectable accessibility issues', async ({ page }) => {
+            await page.goto('/ecosystem/clients');
+
+            const accessibilityScanResults = await new AxeBuilder({ page }).analyze();
+
+            expect(accessibilityScanResults.violations).toEqual([]);
+        });
+
+        // This fails to various contrast related issues - https://dequeuniversity.com/rules/axe/4.9/color-contrast
+        test.fixme('ecosystem/bridges should not have any automatically detectable accessibility issues', async ({ page }) => {
+            await page.goto('/ecosystem/bridges');
+
+            const accessibilityScanResults = await new AxeBuilder({ page }).analyze();
+
+            expect(accessibilityScanResults.violations).toEqual([]);
+        });
+
+        // This fails to various contrast related issues - https://dequeuniversity.com/rules/axe/4.9/color-contrast
+        test.fixme('ecosystem/servers should not have any automatically detectable accessibility issues', async ({ page }) => {
+            await page.goto('/ecosystem/servers');
+
+            const accessibilityScanResults = await new AxeBuilder({ page }).analyze();
+
+            expect(accessibilityScanResults.violations).toEqual([]);
+        });
+
+        test('ecosystem/integrations should not have any automatically detectable accessibility issues', async ({ page }) => {
+            await page.goto('/ecosystem/integrations');
+
+            const accessibilityScanResults = await new AxeBuilder({ page }).analyze();
+
+            expect(accessibilityScanResults.violations).toEqual([]);
+        });
+
+        // This fails to various contrast related issues - https://dequeuniversity.com/rules/axe/4.9/color-contrast
+        test.fixme('ecosystem/sdks should not have any automatically detectable accessibility issues', async ({ page }) => {
+            await page.goto('/ecosystem/sdks');
+
+            const accessibilityScanResults = await new AxeBuilder({ page }).analyze();
+
+            expect(accessibilityScanResults.violations).toEqual([]);
+        });
+
+        // This fails to various contrast related issues - https://dequeuniversity.com/rules/axe/4.9/color-contrast
+        test.fixme('ecosystem/hosting should not have any automatically detectable accessibility issues', async ({ page }) => {
+            await page.goto('/ecosystem/hosting');
+
+            const accessibilityScanResults = await new AxeBuilder({ page }).analyze();
+
+            expect(accessibilityScanResults.violations).toEqual([]);
+        });
     });
 });