feature #48696 [WebProfilerBundle] Add a title and img role to svg of the web debug toolbar (Monet Emilien)

fabpot · fabpot · commit 5ae4dc408f98 · 2022-12-19T08:35:14.000+01:00
This PR was squashed before being merged into the 6.3 branch. Discussion ---------- [WebProfilerBundle] Add a title and img role to svg of the web debug toolbar | Q | A | ------------- | --- | Branch? | 6.3 | Bug fix? | no | New feature? | no | Deprecations? | no | Tickets | - | License | MIT This changes improves the accessibility for blind/low vision developpers. This have not visible effect for not impaired developpers. Commits ------- ef6a182 [WebProfilerBundle] Add a title and img role to svg of the web debug toolbar
diff --git a/src/Symfony/Bundle/SecurityBundle/CHANGELOG.md b/src/Symfony/Bundle/SecurityBundle/CHANGELOG.md
@@ -7,6 +7,7 @@ CHANGELOG
  * Deprecate enabling bundle and not configuring it
  * Add `_stateless` attribute to the request when firewall is stateless
  * Add `StatelessAuthenticatorFactoryInterface` for authenticators targeting `stateless` firewalls only and that don't require a user provider
+ * Modify "icon.svg" to improve accessibility for blind/low vision users
 
 6.2
 ---
diff --git a/src/Symfony/Bundle/SecurityBundle/Resources/views/Collector/icon.svg b/src/Symfony/Bundle/SecurityBundle/Resources/views/Collector/icon.svg
@@ -1,4 +1,5 @@
-<svg xmlns="http://www.w3.org/2000/svg" data-icon-name="icon-tabler-user" width="24" height="24" viewBox="0 0 24 24" stroke-width="1.5" stroke="currentColor" fill="none" stroke-linecap="round" stroke-linejoin="round">
+<svg xmlns="http://www.w3.org/2000/svg" data-icon-name="icon-tabler-user" width="24" height="24" viewBox="0 0 24 24" stroke-width="1.5" stroke="currentColor" fill="none" stroke-linecap="round" stroke-linejoin="round"  role="img">
+    <title>Security</title>
     <path stroke="none" d="M0 0h24v24H0z" fill="none"></path>
     <circle cx="12" cy="7" r="4"></circle>
     <path d="M6 21v-2a4 4 0 0 1 4 -4h4a4 4 0 0 1 4 4v2"></path>
diff --git a/src/Symfony/Bundle/WebProfilerBundle/CHANGELOG.md b/src/Symfony/Bundle/WebProfilerBundle/CHANGELOG.md
@@ -1,6 +1,12 @@
 CHANGELOG
 =========
 
+6.3
+---
+
+ * Add a "role=img" and an explicit title in the .svg file used by the web debug toolbar
+   to improve accessibility with screen readers for blind users
+
 6.1
 ---
 
diff --git a/src/Symfony/Bundle/WebProfilerBundle/Resources/views/Icon/cache.svg b/src/Symfony/Bundle/WebProfilerBundle/Resources/views/Icon/cache.svg
@@ -1,4 +1,5 @@
-<svg xmlns="http://www.w3.org/2000/svg" data-icon-name="icon-tabler-stack-2" width="24" height="24" viewBox="0 0 24 24" stroke-width="1.5" stroke="currentColor" fill="none" stroke-linecap="round" stroke-linejoin="round">
+<svg xmlns="http://www.w3.org/2000/svg" data-icon-name="icon-tabler-stack-2" width="24" height="24" viewBox="0 0 24 24" stroke-width="1.5" stroke="currentColor" fill="none" stroke-linecap="round" stroke-linejoin="round" role="img">
+    <title>Cache</title>
     <path stroke="none" d="M0 0h24v24H0z" fill="none"></path>
     <polyline points="12 4 4 8 12 12 20 8 12 4"></polyline>
     <polyline points="4 12 12 16 20 12"></polyline>
diff --git a/src/Symfony/Bundle/WebProfilerBundle/Resources/views/Icon/config.svg b/src/Symfony/Bundle/WebProfilerBundle/Resources/views/Icon/config.svg
@@ -1,4 +1,5 @@
-<svg xmlns="http://www.w3.org/2000/svg" data-icon-name="icon-tabler-adjustments" width="24" height="24" viewBox="0 0 24 24" stroke-width="1.5" stroke="currentColor" fill="none" stroke-linecap="round" stroke-linejoin="round">
+<svg xmlns="http://www.w3.org/2000/svg" data-icon-name="icon-tabler-adjustments" width="24" height="24" viewBox="0 0 24 24" stroke-width="1.5" stroke="currentColor" fill="none" stroke-linecap="round" stroke-linejoin="round" role="img">
+    <title>Config</title>
     <path stroke="none" d="M0 0h24v24H0z" fill="none"></path>
     <circle cx="6" cy="10" r="2"></circle>
     <line x1="6" y1="4" x2="6" y2="8"></line>
diff --git a/src/Symfony/Bundle/WebProfilerBundle/Resources/views/Icon/exception.svg b/src/Symfony/Bundle/WebProfilerBundle/Resources/views/Icon/exception.svg
@@ -1,4 +1,5 @@
-<svg xmlns="http://www.w3.org/2000/svg" data-icon-name="icon-tabler-ghost" width="24" height="24" viewBox="0 0 24 24" stroke-width="1.5" stroke="currentColor" fill="none" stroke-linecap="round" stroke-linejoin="round">
+<svg xmlns="http://www.w3.org/2000/svg" data-icon-name="icon-tabler-ghost" width="24" height="24" viewBox="0 0 24 24" stroke-width="1.5" stroke="currentColor" fill="none" stroke-linecap="round" stroke-linejoin="round" role="img">
+    <title>Exception</title>
     <path stroke="none" d="M0 0h24v24H0z" fill="none"></path>
     <path d="M5 11a7 7 0 0 1 14 0v7a1.78 1.78 0 0 1 -3.1 1.4a1.65 1.65 0 0 0 -2.6 0a1.65 1.65 0 0 1 -2.6 0a1.65 1.65 0 0 0 -2.6 0a1.78 1.78 0 0 1 -3.1 -1.4v-7"></path>
     <line x1="10" y1="10" x2="10.01" y2="10"></line>
diff --git a/src/Symfony/Bundle/WebProfilerBundle/Resources/views/Icon/form.svg b/src/Symfony/Bundle/WebProfilerBundle/Resources/views/Icon/form.svg
@@ -1,4 +1,5 @@
-<svg xmlns="http://www.w3.org/2000/svg" data-icon-name="icon-tabler-forms" width="24" height="24" viewBox="0 0 24 24" stroke-width="1.5" stroke="currentColor" fill="none" stroke-linecap="round" stroke-linejoin="round">
+<svg xmlns="http://www.w3.org/2000/svg" data-icon-name="icon-tabler-forms" width="24" height="24" viewBox="0 0 24 24" stroke-width="1.5" stroke="currentColor" fill="none" stroke-linecap="round" stroke-linejoin="round" role="img">
+    <title>Cache</title>
     <path stroke="none" d="M0 0h24v24H0z" fill="none"></path>
     <path d="M12 3a3 3 0 0 0 -3 3v12a3 3 0 0 0 3 3"></path>
     <path d="M6 3a3 3 0 0 1 3 3v12a3 3 0 0 1 -3 3"></path>
diff --git a/src/Symfony/Bundle/WebProfilerBundle/Resources/views/Icon/logger.svg b/src/Symfony/Bundle/WebProfilerBundle/Resources/views/Icon/logger.svg
@@ -1,4 +1,5 @@
-<svg xmlns="http://www.w3.org/2000/svg" data-icon-name="icon-tabler-file-alert" width="24" height="24" viewBox="0 0 24 24" stroke-width="1.5" stroke="currentColor" fill="none" stroke-linecap="round" stroke-linejoin="round">
+<svg xmlns="http://www.w3.org/2000/svg" data-icon-name="icon-tabler-file-alert" width="24" height="24" viewBox="0 0 24 24" stroke-width="1.5" stroke="currentColor" fill="none" stroke-linecap="round" stroke-linejoin="round" role="img">
+    <title>Logger</title>
     <path stroke="none" d="M0 0h24v24H0z" fill="none"></path>
     <path d="M14 3v4a1 1 0 0 0 1 1h4"></path>
     <path d="M17 21h-10a2 2 0 0 1 -2 -2v-14a2 2 0 0 1 2 -2h7l5 5v11a2 2 0 0 1 -2 2z"></path>
diff --git a/src/Symfony/Bundle/WebProfilerBundle/Resources/views/Icon/memory.svg b/src/Symfony/Bundle/WebProfilerBundle/Resources/views/Icon/memory.svg
@@ -1,4 +1,5 @@
-<svg xmlns="http://www.w3.org/2000/svg" data-icon-name="icon-tabler-cpu" width="24" height="24" viewBox="0 0 24 24" stroke-width="1.5" stroke="currentColor" fill="none" stroke-linecap="round" stroke-linejoin="round">
+<svg xmlns="http://www.w3.org/2000/svg" data-icon-name="icon-tabler-cpu" width="24" height="24" viewBox="0 0 24 24" stroke-width="1.5" stroke="currentColor" fill="none" stroke-linecap="round" stroke-linejoin="round" role="img">
+    <title>Memory</title>
     <path stroke="none" d="M0 0h24v24H0z" fill="none"></path>
     <rect x="5" y="5" width="14" height="14" rx="1"></rect>
     <path d="M9 9h6v6h-6z"></path>
diff --git a/src/Symfony/Bundle/WebProfilerBundle/Resources/views/Icon/menu.svg b/src/Symfony/Bundle/WebProfilerBundle/Resources/views/Icon/menu.svg
@@ -1,4 +1,5 @@
-<svg xmlns="http://www.w3.org/2000/svg" data-icon-name="icon-tabler-menu-2" width="24" height="24" viewBox="0 0 24 24" stroke-width="1.5" stroke="currentColor" fill="none" stroke-linecap="round" stroke-linejoin="round">
+<svg xmlns="http://www.w3.org/2000/svg" data-icon-name="icon-tabler-menu-2" width="24" height="24" viewBox="0 0 24 24" stroke-width="1.5" stroke="currentColor" fill="none" stroke-linecap="round" stroke-linejoin="round" role="img">
+    <title>Menu</title>
     <path stroke="none" d="M0 0h24v24H0z" fill="none"></path>
     <line x1="4" y1="6" x2="20" y2="6"></line>
     <line x1="4" y1="12" x2="20" y2="12"></line>
diff --git a/src/Symfony/Bundle/WebProfilerBundle/Resources/views/Icon/redirect.svg b/src/Symfony/Bundle/WebProfilerBundle/Resources/views/Icon/redirect.svg
@@ -1,4 +1,5 @@
-<svg xmlns="http://www.w3.org/2000/svg" data-icon-name="icon-tabler-corner-down-right" width="24" height="24" viewBox="0 0 24 24" stroke-width="1.5" stroke="currentColor" fill="none" stroke-linecap="round" stroke-linejoin="round">
+<svg xmlns="http://www.w3.org/2000/svg" data-icon-name="icon-tabler-corner-down-right" width="24" height="24" viewBox="0 0 24 24" stroke-width="1.5" stroke="currentColor" fill="none" stroke-linecap="round" stroke-linejoin="round" role="img">
+    <title>Redirect</title>
     <path stroke="none" d="M0 0h24v24H0z" fill="none"></path>
     <path d="M6 6v6a3 3 0 0 0 3 3h10l-4 -4m0 8l4 -4"></path>
 </svg>
diff --git a/src/Symfony/Bundle/WebProfilerBundle/Resources/views/Icon/time.svg b/src/Symfony/Bundle/WebProfilerBundle/Resources/views/Icon/time.svg
@@ -1,4 +1,5 @@
-<svg xmlns="http://www.w3.org/2000/svg" data-icon-name="icon-tabler-chart-infographic" width="24" height="24" viewBox="0 0 24 24" stroke-width="1.5" stroke="currentColor" fill="none" stroke-linecap="round" stroke-linejoin="round">
+<svg xmlns="http://www.w3.org/2000/svg" data-icon-name="icon-tabler-chart-infographic" width="24" height="24" viewBox="0 0 24 24" stroke-width="1.5" stroke="currentColor" fill="none" stroke-linecap="round" stroke-linejoin="round" role="img">
+    <title>Time</title>
     <path stroke="none" d="M0 0h24v24H0z" fill="none"></path>
     <circle cx="7" cy="7" r="4"></circle>
     <path d="M7 3v4h4"></path>
diff --git a/src/Symfony/Bundle/WebProfilerBundle/Resources/views/Icon/twig.svg b/src/Symfony/Bundle/WebProfilerBundle/Resources/views/Icon/twig.svg
@@ -1,4 +1,5 @@
-<svg xmlns="http://www.w3.org/2000/svg" data-icon-name="icon-tabler-seeding" width="24" height="24" viewBox="0 0 24 24" stroke-width="1.5" stroke="currentColor" fill="none" stroke-linecap="round" stroke-linejoin="round">
+<svg xmlns="http://www.w3.org/2000/svg" data-icon-name="icon-tabler-seeding" width="24" height="24" viewBox="0 0 24 24" stroke-width="1.5" stroke="currentColor" fill="none" stroke-linecap="round" stroke-linejoin="round" role="img">
+    <title>Twig</title>
     <path stroke="none" d="M0 0h24v24H0z" fill="none"></path>
     <path d="M12 10a6 6 0 0 0 -6 -6h-3v2a6 6 0 0 0 6 6h3"></path>
     <path d="M12 14a6 6 0 0 1 6 -6h3v1a6 6 0 0 1 -6 6h-3"></path>
