Add accessibility tests for the ecosystem subpages and fix some headi…

…ng semantics
matrix-org · Apr 19, 2024 · 24e5674 · 24e5674
1 parent 253970d
commit 24e5674
Show file tree

Hide file tree

Showing 3 changed files with 61 additions and 7 deletions.
diff --git 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
@@ -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
@@ -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([]);
+        });
     });
 });