From e65a376fbfec2de99c98bd30b9881c287d69248c Mon Sep 17 00:00:00 2001
From: Brynanders <37368581+Brynanders@users.noreply.github.com>
Date: Wed, 6 Feb 2019 16:39:41 +0000
Subject: [PATCH 01/53] Create SVG-image-has-name
---
_rules/SVG-image-has-name | 103 ++++++++++++++++++++++++++++++++++++++
1 file changed, 103 insertions(+)
create mode 100644 _rules/SVG-image-has-name
diff --git a/_rules/SVG-image-has-name b/_rules/SVG-image-has-name
new file mode 100644
index 0000000000..dc20643b50
--- /dev/null
+++ b/_rules/SVG-image-has-name
@@ -0,0 +1,103 @@
+---
+name: SVG image has name
+description: |
+ This rule checks that each SVG image element that is not marked as decorative, has an accessible name.
+
+success_criterion:
+- 1.1.1 # Non-Text Content
+
+test_aspects:
+- DOM Tree
+- CSS Styling
+
+authors:
+- Bryn Anderson
+---
+
+## Test procedure
+
+### Applicability
+
+The rule applies to any `SVG` `image` element, or any `SVG` element with the [semantic role](#semantic-role) of `img` that is [included in the accessibility tree](#included-in-the-accessibility-tree)
+
+### Expectation
+
+Each target element has a non-empty accessible name.
+
+## Assumptions
+
+*There are currently no assumptions*
+
+## Accessibility support
+
+ *There are no major accessibility support issues known for this rule.*
+
+## Background
+
+- [Understanding Success Criterion 1.1.1: Non-text Content](https://www.w3.org/WAI/WCAG21/Understanding/non-text-content.html)
+- [F30: Failure of Success Criterion 1.1.1 and 1.2.1 due to using text alternatives that are not alternatives (e.g., filenames or placeholder text)](https://www.w3.org/WAI/WCAG21/Techniques/failures/F30)
+- https://www.w3.org/TR/svg-aam-1.0/#mapping_general
+- https://www.w3.org/TR/svg-aam-1.0/#mapping_role_table
+- https://www.w3.org/TR/svg-aam-1.0/#include_elements
+
+
+## Test Cases
+
+### Passed
+
+#### Pass example 1
+
+_description..._
+
+```html
+
+```
+
+#### Pass example 2
+
+_description..._
+
+```html
+
+```
+
+### Falied
+
+#### Falied example 1
+
+_description..._
+
+```html
+
+```
+
+#### Falied example 2
+
+_description..._
+
+```html
+
+```
+
+#### Falied example 3
+
+_description..._
+
+```html
+
+```
+
+### Inapplicable
+
+#### Inapplicable example 1
+
+_description..._
+```html
+
+```
+#### Inapplicable example 2
+
+_description..._
+```html
+
+```
From 0935c3f51e179369116caa0bde48fc9715b4fb44 Mon Sep 17 00:00:00 2001
From: Brynanders <37368581+Brynanders@users.noreply.github.com>
Date: Tue, 26 Feb 2019 15:29:01 +0100
Subject: [PATCH 02/53] Update SVG-image-has-name
Updated description
Updated applicability
---
_rules/SVG-image-has-name | 6 +++---
1 file changed, 3 insertions(+), 3 deletions(-)
diff --git a/_rules/SVG-image-has-name b/_rules/SVG-image-has-name
index dc20643b50..87685bfbba 100644
--- a/_rules/SVG-image-has-name
+++ b/_rules/SVG-image-has-name
@@ -1,7 +1,7 @@
---
name: SVG image has name
description: |
- This rule checks that each SVG image element that is not marked as decorative, has an accessible name.
+ This rule checks that each SVG image element that is included in the accessibility tree has an accessible name.
success_criterion:
- 1.1.1 # Non-Text Content
@@ -18,7 +18,7 @@ authors:
### Applicability
-The rule applies to any `SVG` `image` element, or any `SVG` element with the [semantic role](#semantic-role) of `img` that is [included in the accessibility tree](#included-in-the-accessibility-tree)
+The rule applies to any `SVG` element that is [included in the accessibility tree](#included-in-the-accessibility-tree).
### Expectation
@@ -30,7 +30,7 @@ Each target element has a non-empty accessible name.
## Accessibility support
- *There are no major accessibility support issues known for this rule.*
+Browser and assitive technology support for SVG `title` and `desc` elements is currently inconsistent. Providing suplimentedary information using WAI ARIA is recommended.
## Background
From 0311bb6f11c904d17431ea7921e7e8f3b264146b Mon Sep 17 00:00:00 2001
From: Brynanders <37368581+Brynanders@users.noreply.github.com>
Date: Fri, 8 Mar 2019 15:19:53 +0000
Subject: [PATCH 03/53] Update SVG-image-has-name
Added test cases
---
_rules/SVG-image-has-name | 76 ++++++++++++++++++++++++++++++---------
1 file changed, 59 insertions(+), 17 deletions(-)
diff --git a/_rules/SVG-image-has-name b/_rules/SVG-image-has-name
index 87685bfbba..78d5fc136f 100644
--- a/_rules/SVG-image-has-name
+++ b/_rules/SVG-image-has-name
@@ -30,7 +30,7 @@ Each target element has a non-empty accessible name.
## Accessibility support
-Browser and assitive technology support for SVG `title` and `desc` elements is currently inconsistent. Providing suplimentedary information using WAI ARIA is recommended.
+Browser and assitive technology support for SVG `title` and `desc` elements is currently inconsistent. Using WAI ARIA in combination with the `img` role for non-decorative `svg` elements significantly.
## Background
@@ -40,64 +40,106 @@ Browser and assitive technology support for SVG `title` and `desc` elements is c
- https://www.w3.org/TR/svg-aam-1.0/#mapping_role_table
- https://www.w3.org/TR/svg-aam-1.0/#include_elements
-
## Test Cases
### Passed
#### Pass example 1
-_description..._
+The populated `svg` `text` element contains text content which serves as the accessible name
```html
+
+
+ A yellow circle
+
```
#### Pass example 2
-_description..._
+The poulated `svg` `title` element includes the `svg` in the accessibility tree and serves as the accessible name.
```html
+
+ A yellow circle
+
+
+```
+
+#### Pass example 3
+
+The `svg` element's populated `aria-label` includes the `svg` in the accessibility tree and serves as the accessible name.
+```html
+
+
+
```
-### Falied
+### Failed
-#### Falied example 1
+#### Failed example 1
-_description..._
+The `svg` `text` element is included in the accessibility tree but has no text content or accessible name.
```html
-
+
+
+
+
```
-#### Falied example 2
+#### Failed example 2
-_description..._
+The `svg` element is included in the accessibility tree using `img` role but the element does not have an accessible name.
```html
-
+
+
+
```
-#### Falied example 3
+#### Failed example 3
-_description..._
+The `svg` element is included in the accessibility tree using a valid `tabindex` integer but does not have an accessible name.
```html
-
+
+
+
```
### Inapplicable
#### Inapplicable example 1
-_description..._
-```html
+The `svg` element is not included in the accessibility tree
+```html
+
+
+
```
+
#### Inapplicable example 2
-_description..._
+The `svg` element has an accessible name using the `title` element but is excluded from the accessibility tree using the `aria-hidden` attribute.
+
```html
+
+ A yellow circle
+
+
+```
+
+#### Inapplicable example 3
+The `svg` element is not included in the accessibility tree because the `title` element is empty.
+
+```html
+
+
+
+
```
From 5ed1eb0b2a5092a1c12c3b814e67eca330af9917 Mon Sep 17 00:00:00 2001
From: Brynanders <37368581+Brynanders@users.noreply.github.com>
Date: Tue, 12 Mar 2019 18:05:23 +0000
Subject: [PATCH 04/53] Update SVG-image-has-name
---
_rules/SVG-image-has-name | 2 +-
1 file changed, 1 insertion(+), 1 deletion(-)
diff --git a/_rules/SVG-image-has-name b/_rules/SVG-image-has-name
index 78d5fc136f..ca53b5666c 100644
--- a/_rules/SVG-image-has-name
+++ b/_rules/SVG-image-has-name
@@ -22,7 +22,7 @@ The rule applies to any `SVG` element that is [included in the accessibility tre
### Expectation
-Each target element has a non-empty accessible name.
+Each target element has a [non-empty](#non-empty) accessible name.
## Assumptions
From f20c21516595d2c6fbd7d78586f0520aafa62d56 Mon Sep 17 00:00:00 2001
From: Brynanders <37368581+Brynanders@users.noreply.github.com>
Date: Tue, 12 Mar 2019 18:12:14 +0000
Subject: [PATCH 05/53] Update SVG-image-has-name
---
_rules/SVG-image-has-name | 2 +-
1 file changed, 1 insertion(+), 1 deletion(-)
diff --git a/_rules/SVG-image-has-name b/_rules/SVG-image-has-name
index ca53b5666c..6c64dddc97 100644
--- a/_rules/SVG-image-has-name
+++ b/_rules/SVG-image-has-name
@@ -30,7 +30,7 @@ Each target element has a [non-empty](#non-empty) accessible name.
## Accessibility support
-Browser and assitive technology support for SVG `title` and `desc` elements is currently inconsistent. Using WAI ARIA in combination with the `img` role for non-decorative `svg` elements significantly.
+Browser and assitive technology support for SVG `title` and `desc` elements is currently inconsistent. Using WAI ARIA in combination with the `img` role for non-decorative `svg` elements significantly improves accessibility brwoser support.
## Background
From 55dfa2ae1935e4f247915bdabf936fe6e2011948 Mon Sep 17 00:00:00 2001
From: Brynanders <37368581+Brynanders@users.noreply.github.com>
Date: Wed, 20 Mar 2019 11:56:22 +0000
Subject: [PATCH 06/53] Update SVG-image-has-name
reworked applicability and test cases
---
_rules/SVG-image-has-name | 75 +++++++++++++++++++--------------------
1 file changed, 36 insertions(+), 39 deletions(-)
diff --git a/_rules/SVG-image-has-name b/_rules/SVG-image-has-name
index 6c64dddc97..2bd5cf4341 100644
--- a/_rules/SVG-image-has-name
+++ b/_rules/SVG-image-has-name
@@ -18,7 +18,7 @@ authors:
### Applicability
-The rule applies to any `SVG` element that is [included in the accessibility tree](#included-in-the-accessibility-tree).
+The rule applies to any `SVG` element with the rle of `img` or `graphics-document`, that is [included in the accessibility tree](#included-in-the-accessibility-tree).
### Expectation
@@ -46,67 +46,75 @@ Browser and assitive technology support for SVG `title` and `desc` elements is c
#### Pass example 1
-The populated `svg` `text` element contains text content which serves as the accessible name
+The `svg` has a role of `img` which takes it's accessible name from it's `
` element.
```html
-
+
+ A yellow circle
- A yellow circle
-
```
#### Pass example 2
-The poulated `svg` `title` element includes the `svg` in the accessibility tree and serves as the accessible name.
+The `svg` has a role of `img` and an `aria-label` containing the accessible name.
```html
-
- A yellow circle
+
```
#### Pass example 3
-The `svg` element's populated `aria-label` includes the `svg` in the accessibility tree and serves as the accessible name.
+The `svg` has the role of `img` which takes it's accessible name from it's child content, the `` element.
```html
-
+
+ A yellow circle
```
-### Failed
-
-#### Failed example 1
+#### Pass example 4
-The `svg` `text` element is included in the accessibility tree but has no text content or accessible name.
+The `svg` has the role of `graphics-document` which takes it's accessible name from it's child content, the `` element.
```html
-
+
+
+ 3 circles
+ 3 yellow circles with a green stroke horizontally adjacent to each other
+
+
-
+
+
+
```
-#### Failed example 2
+### Failed
-The `svg` element is included in the accessibility tree using `img` role but the element does not have an accessible name.
+#### Failed example 1
+
+The `svg` has a rle of `img` but has no accessible name.
```html
-
-
+
+
```
-#### Failed example 3
+#### Failed example 2
-The `svg` element is included in the accessibility tree using a valid `tabindex` integer but does not have an accessible name.
+The `svg` element has an empty `title`.
```html
-
-
+
+
+
```
@@ -114,7 +122,7 @@ The `svg` element is included in the accessibility tree using a valid `tabindex`
#### Inapplicable example 1
-The `svg` element is not included in the accessibility tree
+The `svg` element does nott have a role of `img` or `graphics-document`.
```html
@@ -124,22 +132,11 @@ The `svg` element is not included in the accessibility tree
#### Inapplicable example 2
-The `svg` element has an accessible name using the `title` element but is excluded from the accessibility tree using the `aria-hidden` attribute.
+The `svg` element is not included in the accessibility tree.
```html
-
- A yellow circle
-
+
+
```
-#### Inapplicable example 3
-
-The `svg` element is not included in the accessibility tree because the `title` element is empty.
-
-```html
-
-
-
-
-```
From bf23111016378b9731b8a405f5c28503b920eecc Mon Sep 17 00:00:00 2001
From: Brynanders <37368581+Brynanders@users.noreply.github.com>
Date: Wed, 20 Mar 2019 12:12:26 +0000
Subject: [PATCH 07/53] Update SVG-image-has-name
---
_rules/SVG-image-has-name | 11 ++++++-----
1 file changed, 6 insertions(+), 5 deletions(-)
diff --git a/_rules/SVG-image-has-name b/_rules/SVG-image-has-name
index 2bd5cf4341..622bdd57c7 100644
--- a/_rules/SVG-image-has-name
+++ b/_rules/SVG-image-has-name
@@ -18,7 +18,7 @@ authors:
### Applicability
-The rule applies to any `SVG` element with the rle of `img` or `graphics-document`, that is [included in the accessibility tree](#included-in-the-accessibility-tree).
+The rule applies to any `SVG` element with the semantic role of `img` or `graphics-document`, that is [included in the accessibility tree](#included-in-the-accessibility-tree).
### Expectation
@@ -35,10 +35,11 @@ Browser and assitive technology support for SVG `title` and `desc` elements is c
## Background
- [Understanding Success Criterion 1.1.1: Non-text Content](https://www.w3.org/WAI/WCAG21/Understanding/non-text-content.html)
-- [F30: Failure of Success Criterion 1.1.1 and 1.2.1 due to using text alternatives that are not alternatives (e.g., filenames or placeholder text)](https://www.w3.org/WAI/WCAG21/Techniques/failures/F30)
-- https://www.w3.org/TR/svg-aam-1.0/#mapping_general
-- https://www.w3.org/TR/svg-aam-1.0/#mapping_role_table
-- https://www.w3.org/TR/svg-aam-1.0/#include_elements
+- [SVG Accessibility API Mappings](https://www.w3.org/TR/svg-aam-1.0)
+- [WAI-ARIA Graphics Module](https://www.w3.org/TR/graphics-aria-1.0/)
+- [ARIA4: Using a WAI-ARIA role to expose the role of a user interface component](https://www.w3.org/WAI/WCAG21/Techniques/aria/ARIA4)
+- [ARIA6: Using aria-label to provide labels for objects](https://www.w3.org/WAI/WCAG21/Techniques/aria/ARIA6)
+- [ARIA10: Using aria-labelledby to provide a text alternative for non-text content](https://www.w3.org/WAI/WCAG21/Techniques/aria/ARIA10)
## Test Cases
From 817228b1c0e8e792880610436f5110701a3b9b08 Mon Sep 17 00:00:00 2001
From: Brynanders <37368581+Brynanders@users.noreply.github.com>
Date: Wed, 20 Mar 2019 12:22:06 +0000
Subject: [PATCH 08/53] Update SVG-image-has-name
---
_rules/SVG-image-has-name | 14 +++++++-------
1 file changed, 7 insertions(+), 7 deletions(-)
diff --git a/_rules/SVG-image-has-name b/_rules/SVG-image-has-name
index 622bdd57c7..cb76b4b5b4 100644
--- a/_rules/SVG-image-has-name
+++ b/_rules/SVG-image-has-name
@@ -18,7 +18,7 @@ authors:
### Applicability
-The rule applies to any `SVG` element with the semantic role of `img` or `graphics-document`, that is [included in the accessibility tree](#included-in-the-accessibility-tree).
+The rule applies to any `svg` element with the semantic role of `img` or `graphics-document`, that is [included in the accessibility tree](#included-in-the-accessibility-tree).
### Expectation
@@ -47,7 +47,7 @@ Browser and assitive technology support for SVG `title` and `desc` elements is c
#### Pass example 1
-The `svg` has a role of `img` which takes it's accessible name from it's `` element.
+The `` element has a role of `img` which takes it's accessible name from it's `` element.
```html
@@ -58,7 +58,7 @@ The `svg` has a role of `img` which takes it's accessible name from it's `` element has a role of `img` and an `aria-label` containing the accessible name.
```html
@@ -68,7 +68,7 @@ The `svg` has a role of `img` and an `aria-label` containing the accessible name
#### Pass example 3
-The `svg` has the role of `img` which takes it's accessible name from it's child content, the `` element.
+The `` element has the role of `img` which takes it's accessible name from it's child content, the `` element.
```html
@@ -79,7 +79,7 @@ The `svg` has the role of `img` which takes it's accessible name from it's child
#### Pass example 4
-The `svg` has the role of `graphics-document` which takes it's accessible name from it's child content, the `` element.
+The `` element has the role of `graphics-document` which takes it's accessible name from it's child content, the `` element.
```html
@@ -100,7 +100,7 @@ The `svg` has the role of `graphics-document` which takes it's accessible name f
#### Failed example 1
-The `svg` has a rle of `img` but has no accessible name.
+The `` element has a rle of `img` but has no accessible name.
```html
@@ -110,7 +110,7 @@ The `svg` has a rle of `img` but has no accessible name.
#### Failed example 2
-The `svg` element has an empty `title`.
+The `` element has an empty `title`.
```html
From 5d5ca372ebfd7f90d0c963b45916b937f601a6ac Mon Sep 17 00:00:00 2001
From: Brynanders <37368581+Brynanders@users.noreply.github.com>
Date: Wed, 20 Mar 2019 15:42:50 +0000
Subject: [PATCH 09/53] Update SVG-image-has-name
---
_rules/SVG-image-has-name | 2 +-
1 file changed, 1 insertion(+), 1 deletion(-)
diff --git a/_rules/SVG-image-has-name b/_rules/SVG-image-has-name
index cb76b4b5b4..5896e2826a 100644
--- a/_rules/SVG-image-has-name
+++ b/_rules/SVG-image-has-name
@@ -18,7 +18,7 @@ authors:
### Applicability
-The rule applies to any `svg` element with the semantic role of `img` or `graphics-document`, that is [included in the accessibility tree](#included-in-the-accessibility-tree).
+The rule applies to any `svg` element with the [semantic role](#semantic-role) of `img` or `graphics-document`, that is [included in the accessibility tree](#included-in-the-accessibility-tree).
### Expectation
From dad03552fc142a5127ea4645fe48db96e1025fe1 Mon Sep 17 00:00:00 2001
From: Brynanders <37368581+Brynanders@users.noreply.github.com>
Date: Thu, 21 Mar 2019 12:42:28 +0000
Subject: [PATCH 10/53] Update SVG-image-has-name
---
_rules/SVG-image-has-name | 2 +-
1 file changed, 1 insertion(+), 1 deletion(-)
diff --git a/_rules/SVG-image-has-name b/_rules/SVG-image-has-name
index 5896e2826a..6042d03635 100644
--- a/_rules/SVG-image-has-name
+++ b/_rules/SVG-image-has-name
@@ -22,7 +22,7 @@ The rule applies to any `svg` element with the [semantic role](#semantic-role) o
### Expectation
-Each target element has a [non-empty](#non-empty) accessible name.
+Each target element has a an accessible name.
## Assumptions
From 067be4cd9e604ebcc5209c527f057a8f52d13ab3 Mon Sep 17 00:00:00 2001
From: Brynanders <37368581+Brynanders@users.noreply.github.com>
Date: Tue, 26 Mar 2019 10:18:28 +0000
Subject: [PATCH 11/53] Update SVG-image-has-name
---
_rules/SVG-image-has-name | 2 +-
1 file changed, 1 insertion(+), 1 deletion(-)
diff --git a/_rules/SVG-image-has-name b/_rules/SVG-image-has-name
index 6042d03635..3b55bf6cc5 100644
--- a/_rules/SVG-image-has-name
+++ b/_rules/SVG-image-has-name
@@ -18,7 +18,7 @@ authors:
### Applicability
-The rule applies to any `svg` element with the [semantic role](#semantic-role) of `img` or `graphics-document`, that is [included in the accessibility tree](#included-in-the-accessibility-tree).
+The rule applies to any [SVG](https://www.w3.org/2000/svg) element with the [semantic role](#semantic-role) of `img` or `graphics-document`, that is [included in the accessibility tree](#included-in-the-accessibility-tree).
### Expectation
From 2f213a1e690554fde1a46d6ee05f143f204a734d Mon Sep 17 00:00:00 2001
From: Brynanders <37368581+Brynanders@users.noreply.github.com>
Date: Tue, 26 Mar 2019 11:30:02 +0000
Subject: [PATCH 12/53] Update and rename SVG-image-has-name to
SVG-image-has-name.md
---
_rules/{SVG-image-has-name => SVG-image-has-name.md} | 4 ++--
1 file changed, 2 insertions(+), 2 deletions(-)
rename _rules/{SVG-image-has-name => SVG-image-has-name.md} (98%)
diff --git a/_rules/SVG-image-has-name b/_rules/SVG-image-has-name.md
similarity index 98%
rename from _rules/SVG-image-has-name
rename to _rules/SVG-image-has-name.md
index 3b55bf6cc5..54d1f58399 100644
--- a/_rules/SVG-image-has-name
+++ b/_rules/SVG-image-has-name.md
@@ -1,7 +1,7 @@
---
-name: SVG image has name
+name: SVG image has accessible name
description: |
- This rule checks that each SVG image element that is included in the accessibility tree has an accessible name.
+ This rule checks that each SVG image element that is included in the accessibility tree, has an accessible name.
success_criterion:
- 1.1.1 # Non-Text Content
From e42859f10668b5ba89a16209b9cec724da6563d7 Mon Sep 17 00:00:00 2001
From: Brynanders <37368581+Brynanders@users.noreply.github.com>
Date: Fri, 5 Apr 2019 15:48:23 +0100
Subject: [PATCH 13/53] Update SVG-image-has-name.md
Removed invalid test case.
Small editorial changes.
---
_rules/SVG-image-has-name.md | 21 +++++----------------
1 file changed, 5 insertions(+), 16 deletions(-)
diff --git a/_rules/SVG-image-has-name.md b/_rules/SVG-image-has-name.md
index 54d1f58399..53a9629e42 100644
--- a/_rules/SVG-image-has-name.md
+++ b/_rules/SVG-image-has-name.md
@@ -30,7 +30,7 @@ Each target element has a an accessible name.
## Accessibility support
-Browser and assitive technology support for SVG `title` and `desc` elements is currently inconsistent. Using WAI ARIA in combination with the `img` role for non-decorative `svg` elements significantly improves accessibility brwoser support.
+Browser and assistive technology support for SVG `title` and `desc` elements is currently inconsistent. Using WAI ARIA in combination with the `img` role for non-decorative `svg` elements significantly improves accessibility browser support.
## Background
@@ -47,10 +47,10 @@ Browser and assitive technology support for SVG `title` and `desc` elements is c
#### Pass example 1
-The `` element has a role of `img` which takes it's accessible name from it's `` element.
+The `` element has a role of `img` which takes its accessible name from its `` element.
```html
-
+
A yellow circle
@@ -68,18 +68,7 @@ The `` element has a role of `img` and an `aria-label` containing the acces
#### Pass example 3
-The `` element has the role of `img` which takes it's accessible name from it's child content, the `` element.
-
-```html
-
-
- A yellow circle
-
-```
-
-#### Pass example 4
-
-The `` element has the role of `graphics-document` which takes it's accessible name from it's child content, the `` element.
+The `` element has the role of `graphics-document` which takes its accessible name from its child content, the `` element.
```html
@@ -100,7 +89,7 @@ The `` element has the role of `graphics-document` which takes it's accessi
#### Failed example 1
-The `` element has a rle of `img` but has no accessible name.
+The `` element has a role of `img` but has no accessible name.
```html
From 3cc2f55b69af5f9061668c992e0cbebd80af6382 Mon Sep 17 00:00:00 2001
From: Brynanders <37368581+Brynanders@users.noreply.github.com>
Date: Fri, 5 Apr 2019 15:57:49 +0100
Subject: [PATCH 14/53] Update SVG-image-has-name.md
Added detail to "Failed example 2" description
---
_rules/SVG-image-has-name.md | 4 ++--
1 file changed, 2 insertions(+), 2 deletions(-)
diff --git a/_rules/SVG-image-has-name.md b/_rules/SVG-image-has-name.md
index 53a9629e42..33479c3bbf 100644
--- a/_rules/SVG-image-has-name.md
+++ b/_rules/SVG-image-has-name.md
@@ -99,7 +99,7 @@ The `` element has a role of `img` but has no accessible name.
#### Failed example 2
-The `` element has an empty `title`.
+The `img` role includes the `` element in the accessibility tree but the element has an empty accessible name `title` attribute.
```html
@@ -112,7 +112,7 @@ The `` element has an empty `title`.
#### Inapplicable example 1
-The `svg` element does nott have a role of `img` or `graphics-document`.
+The `svg` element does not have a role of `img` or `graphics-document`.
```html
From 801fd6415eba8b51487bd9db1a3d1e27ad33000f Mon Sep 17 00:00:00 2001
From: Brynanders <37368581+Brynanders@users.noreply.github.com>
Date: Fri, 5 Apr 2019 16:02:35 +0100
Subject: [PATCH 15/53] Update SVG-image-has-name.md
Updated "Inapplicable example 2" to differ from "Inapplicable example 1"
---
_rules/SVG-image-has-name.md | 4 ++--
1 file changed, 2 insertions(+), 2 deletions(-)
diff --git a/_rules/SVG-image-has-name.md b/_rules/SVG-image-has-name.md
index 33479c3bbf..346f954baf 100644
--- a/_rules/SVG-image-has-name.md
+++ b/_rules/SVG-image-has-name.md
@@ -122,10 +122,10 @@ The `svg` element does not have a role of `img` or `graphics-document`.
#### Inapplicable example 2
-The `svg` element is not included in the accessibility tree.
+The `svg` element has an accessible name but is not included in the accessibility tree.
```html
-
+
```
From 96a861cba232452af786a4cad5863ceaa1539802 Mon Sep 17 00:00:00 2001
From: Brynanders <37368581+Brynanders@users.noreply.github.com>
Date: Fri, 5 Apr 2019 16:07:19 +0100
Subject: [PATCH 16/53] Update SVG-image-has-name.md
Added "Inapplicable example 3" test case
---
_rules/SVG-image-has-name.md | 9 +++++++++
1 file changed, 9 insertions(+)
diff --git a/_rules/SVG-image-has-name.md b/_rules/SVG-image-has-name.md
index 346f954baf..f6ea3f61fb 100644
--- a/_rules/SVG-image-has-name.md
+++ b/_rules/SVG-image-has-name.md
@@ -130,3 +130,12 @@ The `svg` element has an accessible name but is not included in the accessibilit
```
+#### Inapplicable example 3
+
+The `svg` element is not included in the accessibility tree because the `` element is empty.
+
+````html
+
+
+
+
From 7799a15a69303caec7ac664bbad8b522e85d96f2 Mon Sep 17 00:00:00 2001
From: Brian Bors
Date: Fri, 12 Apr 2019 16:36:35 +0200
Subject: [PATCH 17/53] Typo
---
_rules/SVG-image-has-name.md | 2 +-
1 file changed, 1 insertion(+), 1 deletion(-)
diff --git a/_rules/SVG-image-has-name.md b/_rules/SVG-image-has-name.md
index f6ea3f61fb..b7bcb88f8d 100644
--- a/_rules/SVG-image-has-name.md
+++ b/_rules/SVG-image-has-name.md
@@ -22,7 +22,7 @@ The rule applies to any [SVG](https://www.w3.org/2000/svg) element with the [sem
### Expectation
-Each target element has a an accessible name.
+Each target element has an accessible name.
## Assumptions
From ad3365073858048c2d2d6c0418c738246bbdef70 Mon Sep 17 00:00:00 2001
From: Brynanders <37368581+Brynanders@users.noreply.github.com>
Date: Mon, 15 Apr 2019 14:14:05 +0100
Subject: [PATCH 18/53] Update SVG-image-has-name.md
---
_rules/SVG-image-has-name.md | 2 +-
1 file changed, 1 insertion(+), 1 deletion(-)
diff --git a/_rules/SVG-image-has-name.md b/_rules/SVG-image-has-name.md
index b7bcb88f8d..eff2089c36 100644
--- a/_rules/SVG-image-has-name.md
+++ b/_rules/SVG-image-has-name.md
@@ -18,7 +18,7 @@ authors:
### Applicability
-The rule applies to any [SVG](https://www.w3.org/2000/svg) element with the [semantic role](#semantic-role) of `img` or `graphics-document`, that is [included in the accessibility tree](#included-in-the-accessibility-tree).
+The rule applies to any element in the [SVG](https://www.w3.org/2000/svg) namespace with the [semantic role](#semantic-role) of or inherits from `img` or `graphics-document`, that is [included in the accessibility tree](#included-in-the-accessibility-tree).
### Expectation
From d956363dfa7cbdcc93e963420c1216a895d994e9 Mon Sep 17 00:00:00 2001
From: Brynanders <37368581+Brynanders@users.noreply.github.com>
Date: Tue, 16 Apr 2019 16:29:34 +0100
Subject: [PATCH 19/53] Update SVG-image-has-name.md
Updated applicability to include graphics-object and graphics-symbol
added new test cases
---
_rules/SVG-image-has-name.md | 78 +++++++++++++++++++++++++++++++-----
1 file changed, 69 insertions(+), 9 deletions(-)
diff --git a/_rules/SVG-image-has-name.md b/_rules/SVG-image-has-name.md
index eff2089c36..19514bb048 100644
--- a/_rules/SVG-image-has-name.md
+++ b/_rules/SVG-image-has-name.md
@@ -18,7 +18,7 @@ authors:
### Applicability
-The rule applies to any element in the [SVG](https://www.w3.org/2000/svg) namespace with the [semantic role](#semantic-role) of or inherits from `img` or `graphics-document`, that is [included in the accessibility tree](#included-in-the-accessibility-tree).
+The rule applies to any element in the [SVG](https://www.w3.org/2000/svg) namespace with a [semantic role](#semantic-role) of either `img` `graphics-document` `graphics-object` `graphics-symbol`, that is [included in the accessibility tree](#included-in-the-accessibility-tree).
### Expectation
@@ -68,12 +68,11 @@ The `` element has a role of `img` and an `aria-label` containing the acces
#### Pass example 3
-The `` element has the role of `graphics-document` which takes its accessible name from its child content, the `` element.
+The `` element has the role of `graphics-document` which takes its accessible name from its' child content, the `` and `` elements.
```html
-
+
3 circles
3 yellow circles with a green stroke horizontally adjacent to each other
@@ -85,6 +84,36 @@ The `` element has the role of `graphics-document` which takes its accessib
```
+#### Pass example 4
+
+The `` element is included in the accessibility tree and takes its' accessible name from its' child content, the `` element.
+
+```html
+
+
+ Yellow circle
+
+
+```
+
+#### Pass example 5
+
+The `svg` element and both child `` elements are included in the accessibility tree with the `graphics-document` and `graphics-object` roles. All three elements have accessibile names via the `title` and `aria-label` attributes.
+
+```html
+
+ 3 shapes
+
+ Large blue rectangle with two other shapes inside it
+
+
+
+
+
+
+
+```
+
### Failed
#### Failed example 1
@@ -108,24 +137,54 @@ The `img` role includes the `` element in the accessibility tree but the el
```
+#### Failed example 3
+
+The `svg` `` elements are included in the accessibility tree but do not have accessible names.
+
+```html
+
+ Yellow shapes
+
+
+
+
+```
+#### Failed example 4
+
+The `` elements are included in the accessibility tree with the `graphics-object` role but only one of the elements has an accessible name.
+
+```html
+
+ 3 shapes
+
+ Large blue rectangle with two other shapes inside it
+
+
+
+
+
+
+
+```
+
### Inapplicable
#### Inapplicable example 1
-The `svg` element does not have a role of `img` or `graphics-document`.
+The `svg` element does not have a role of `img` `graphics-document` `graphics-object` or `graphics-symbol`.
```html
-
+
```
#### Inapplicable example 2
-The `svg` element has an accessible name but is not included in the accessibility tree.
+The `svg` element has an accessible name but the `aria-hidden` attribute excludes the element from the accessibility tree.
```html
-
+
```
@@ -134,8 +193,9 @@ The `svg` element has an accessible name but is not included in the accessibilit
The `svg` element is not included in the accessibility tree because the `` element is empty.
-````html
+```html
+```
From fa56eea12661cfe846fe3dcf3bcf0a61a158b2c6 Mon Sep 17 00:00:00 2001
From: Brynanders <37368581+Brynanders@users.noreply.github.com>
Date: Wed, 24 Apr 2019 09:45:02 +0200
Subject: [PATCH 20/53] Update SVG-image-has-name.md
---
_rules/SVG-image-has-name.md | 8 ++++----
1 file changed, 4 insertions(+), 4 deletions(-)
diff --git a/_rules/SVG-image-has-name.md b/_rules/SVG-image-has-name.md
index 19514bb048..36dfa1138e 100644
--- a/_rules/SVG-image-has-name.md
+++ b/_rules/SVG-image-has-name.md
@@ -22,7 +22,7 @@ The rule applies to any element in the [SVG](https://www.w3.org/2000/svg) namesp
### Expectation
-Each target element has an accessible name.
+Each target element has an accessible name that is not only [whitespace](#whitespace).
## Assumptions
@@ -106,8 +106,8 @@ The `svg` element and both child `` elements are included in the accessibilit
Large blue rectangle with two other shapes inside it
-
-
+
+
@@ -194,7 +194,7 @@ The `svg` element has an accessible name but the `aria-hidden` attribute exclude
The `svg` element is not included in the accessibility tree because the `` element is empty.
```html
-
+
From 5e9710e20b41ebbca3327fb9c95ff04dd5ceee3f Mon Sep 17 00:00:00 2001
From: Brynanders <37368581+Brynanders@users.noreply.github.com>
Date: Wed, 24 Apr 2019 12:25:40 +0200
Subject: [PATCH 21/53] Update SVG-image-has-name.md
---
_rules/SVG-image-has-name.md | 18 +++++++++---------
1 file changed, 9 insertions(+), 9 deletions(-)
diff --git a/_rules/SVG-image-has-name.md b/_rules/SVG-image-has-name.md
index 36dfa1138e..e19bf86212 100644
--- a/_rules/SVG-image-has-name.md
+++ b/_rules/SVG-image-has-name.md
@@ -45,7 +45,7 @@ Browser and assistive technology support for SVG `title` and `desc` elements is
### Passed
-#### Pass example 1
+#### Passed example 1
The `` element has a role of `img` which takes its accessible name from its `` element.
@@ -56,7 +56,7 @@ The `` element has a role of `img` which takes its accessible name from its
```
-#### Pass example 2
+#### Passed example 2
The `` element has a role of `img` and an `aria-label` containing the accessible name.
@@ -66,7 +66,7 @@ The `` element has a role of `img` and an `aria-label` containing the acces
```
-#### Pass example 3
+#### Passed example 3
The `` element has the role of `graphics-document` which takes its accessible name from its' child content, the `` and `` elements.
@@ -84,7 +84,7 @@ The `` element has the role of `graphics-document` which takes its accessib
```
-#### Pass example 4
+#### Passed example 4
The `` element is included in the accessibility tree and takes its' accessible name from its' child content, the `` element.
@@ -96,9 +96,9 @@ The `` element is included in the accessibility tree and takes its' acce
```
-#### Pass example 5
+#### Passed example 5
-The `svg` element and both child `` elements are included in the accessibility tree with the `graphics-document` and `graphics-object` roles. All three elements have accessibile names via the `title` and `aria-label` attributes.
+The `` element and both descendant `` elements are included in the accessibility tree with the `graphics-document` and `graphics-object` roles. The `svg` element gets its' accessible name via the `` element and both `` elements from their `aria-label` attributes.
```html
@@ -128,7 +128,7 @@ The `` element has a role of `img` but has no accessible name.
#### Failed example 2
-The `img` role includes the `` element in the accessibility tree but the element has an empty accessible name `title` attribute.
+The `img` role includes the `` element in the accessibility tree but the element has no accessible name because the `` element contains only whitespace.
```html
@@ -191,11 +191,11 @@ The `svg` element has an accessible name but the `aria-hidden` attribute exclude
#### Inapplicable example 3
-The `svg` element is not included in the accessibility tree because the `` element is empty.
+The `svg` element is not included in the accessibility tree because the `` element has no content.
```html
-
+
```
From 668ce46579b7700105948168572fbee4f9b302a5 Mon Sep 17 00:00:00 2001
From: Brynanders <37368581+Brynanders@users.noreply.github.com>
Date: Wed, 24 Apr 2019 16:17:06 +0200
Subject: [PATCH 22/53] Update SVG-image-has-name.md
---
_rules/SVG-image-has-name.md | 31 ++++++++++++++++++++-----------
1 file changed, 20 insertions(+), 11 deletions(-)
diff --git a/_rules/SVG-image-has-name.md b/_rules/SVG-image-has-name.md
index e19bf86212..e62b3cbbd2 100644
--- a/_rules/SVG-image-has-name.md
+++ b/_rules/SVG-image-has-name.md
@@ -47,10 +47,10 @@ Browser and assistive technology support for SVG `title` and `desc` elements is
#### Passed example 1
-The `` element has a role of `img` which takes its accessible name from its `` element.
+The `` has an implicit role of `graphics-document` and takes its accessible name from its `` element.
```html
-
+
A yellow circle
@@ -58,6 +58,17 @@ The `` element has a role of `img` which takes its accessible name from its
#### Passed example 2
+The `` element has an explicit role of `img` and takes its accessible name from its `` element.
+
+```html
+
+ A yellow circle
+
+
+```
+
+#### Passed example 3
+
The `` element has a role of `img` and an `aria-label` containing the accessible name.
```html
@@ -66,16 +77,14 @@ The `` element has a role of `img` and an `aria-label` containing the acces
```
-#### Passed example 3
+#### Passed example 4
-The `` element has the role of `graphics-document` which takes its accessible name from its' child content, the `` and `` elements.
+The `` element has the role of `graphics-document` which takes its accessible name from its child `` element.
```html
3 circles
- 3 yellow circles with a green stroke horizontally adjacent to each other
-
@@ -84,9 +93,9 @@ The `` element has the role of `graphics-document` which takes its accessib
```
-#### Passed example 4
+#### Passed example 5
-The `` element is included in the accessibility tree and takes its' accessible name from its' child content, the `` element.
+The `` element is included in the accessibility tree and takes its accessible name from its child `` element.
```html
@@ -96,7 +105,7 @@ The `` element is included in the accessibility tree and takes its' acce
```
-#### Passed example 5
+#### Passed example 6
The `` element and both descendant `` elements are included in the accessibility tree with the `graphics-document` and `graphics-object` roles. The `svg` element gets its' accessible name via the `` element and both `` elements from their `aria-label` attributes.
@@ -175,7 +184,7 @@ The `svg` element does not have a role of `img` `graphics-document` `graphics-ob
```html
-
+
```
@@ -185,7 +194,7 @@ The `svg` element has an accessible name but the `aria-hidden` attribute exclude
```html
-
+
```
From b88c70da120dcfd210fc7bf8779bd46065b6a3e4 Mon Sep 17 00:00:00 2001
From: Brynanders <37368581+Brynanders@users.noreply.github.com>
Date: Mon, 29 Apr 2019 12:54:48 +0200
Subject: [PATCH 23/53] Update SVG-image-has-name.md
---
_rules/SVG-image-has-name.md | 3 ++-
1 file changed, 2 insertions(+), 1 deletion(-)
diff --git a/_rules/SVG-image-has-name.md b/_rules/SVG-image-has-name.md
index e62b3cbbd2..26d2799341 100644
--- a/_rules/SVG-image-has-name.md
+++ b/_rules/SVG-image-has-name.md
@@ -18,7 +18,7 @@ authors:
### Applicability
-The rule applies to any element in the [SVG](https://www.w3.org/2000/svg) namespace with a [semantic role](#semantic-role) of either `img` `graphics-document` `graphics-object` `graphics-symbol`, that is [included in the accessibility tree](#included-in-the-accessibility-tree).
+The rule applies to any element in the [SVG](https://www.w3.org/2000/svg) namespace with a [semantic role](#semantic-role) of either `img`, `graphics-document`, `graphics-object`, `graphics-symbol`, that is [included in the accessibility tree](#included-in-the-accessibility-tree).
### Expectation
@@ -158,6 +158,7 @@ The `svg` `` elements are included in the accessibility tree but do not
```
+
#### Failed example 4
The `` elements are included in the accessibility tree with the `graphics-object` role but only one of the elements has an accessible name.
From aed615be5041a5be92420d7e7b62b101d6795c25 Mon Sep 17 00:00:00 2001
From: Anne Thyme
Date: Wed, 1 May 2019 15:53:57 +0200
Subject: [PATCH 24/53] Add id to frontmatter of rule
---
_rules/SVG-image-has-name.md | 1 +
1 file changed, 1 insertion(+)
diff --git a/_rules/SVG-image-has-name.md b/_rules/SVG-image-has-name.md
index 26d2799341..99692aa856 100644
--- a/_rules/SVG-image-has-name.md
+++ b/_rules/SVG-image-has-name.md
@@ -1,4 +1,5 @@
---
+id: 7d6734
name: SVG image has accessible name
description: |
This rule checks that each SVG image element that is included in the accessibility tree, has an accessible name.
From ec690c0da11b355361d5626890ed8b37b1776c58 Mon Sep 17 00:00:00 2001
From: Brynanders <37368581+Brynanders@users.noreply.github.com>
Date: Wed, 8 May 2019 11:06:13 +0100
Subject: [PATCH 25/53] Update SVG-image-has-name.md
---
_rules/SVG-image-has-name.md | 28 +++++++++++++++-------------
1 file changed, 15 insertions(+), 13 deletions(-)
diff --git a/_rules/SVG-image-has-name.md b/_rules/SVG-image-has-name.md
index 99692aa856..3b24781cb5 100644
--- a/_rules/SVG-image-has-name.md
+++ b/_rules/SVG-image-has-name.md
@@ -23,7 +23,7 @@ The rule applies to any element in the [SVG](https://www.w3.org/2000/svg) namesp
### Expectation
-Each target element has an accessible name that is not only [whitespace](#whitespace).
+Each target element has an [accessible name](#accessible-name) that is not only [whitespace](#whitespace).
## Assumptions
@@ -31,6 +31,8 @@ Each target element has an accessible name that is not only [whitespace](#whites
## Accessibility support
+The [HTML Accessibility API Mappings](https://www.w3.org/TR/html-aam-1.0/#html-element-role-mappings) specify that the `` element has an implicit role of `graphics-document`. However browser support for `graphics-document` and the SVG Accessibility API Mappings is inconsistent.
+
Browser and assistive technology support for SVG `title` and `desc` elements is currently inconsistent. Using WAI ARIA in combination with the `img` role for non-decorative `svg` elements significantly improves accessibility browser support.
## Background
@@ -178,11 +180,22 @@ The `` elements are included in the accessibility tree with the `graphics-obj
```
+#### Failed example 5
+
+The `` element has a role of `img` but the accessible name `` element has no content.
+
+```html
+
+
+
+
+```
+
### Inapplicable
#### Inapplicable example 1
-The `svg` element does not have a role of `img` `graphics-document` `graphics-object` or `graphics-symbol`.
+The `svg` element does not have a role of `img`, `graphics-document`, `graphics-object`, or `graphics-symbol`.
```html
@@ -199,14 +212,3 @@ The `svg` element has an accessible name but the `aria-hidden` attribute exclude
```
-
-#### Inapplicable example 3
-
-The `svg` element is not included in the accessibility tree because the `` element has no content.
-
-```html
-
-
-
-
-```
From 34f9099635474ec2c64ff8020eeea36fb9e56f71 Mon Sep 17 00:00:00 2001
From: Brynanders <37368581+Brynanders@users.noreply.github.com>
Date: Wed, 8 May 2019 11:13:41 +0100
Subject: [PATCH 26/53] Update SVG-image-has-name.md
---
_rules/SVG-image-has-name.md | 10 ++++++++++
1 file changed, 10 insertions(+)
diff --git a/_rules/SVG-image-has-name.md b/_rules/SVG-image-has-name.md
index 3b24781cb5..3e6b507e49 100644
--- a/_rules/SVG-image-has-name.md
+++ b/_rules/SVG-image-has-name.md
@@ -191,6 +191,16 @@ The `` element has a role of `img` but the accessible name `` elemen
```
+#### Failed example 6
+
+The `` element has a role of `img` but has no accessible name. The `title` attribute is not defined in the SVG namespace.
+
+```html
+
+
+
+```
+
### Inapplicable
#### Inapplicable example 1
From 4b65ad863446bbfece085d0e431caca7b7803555 Mon Sep 17 00:00:00 2001
From: Brynanders <37368581+Brynanders@users.noreply.github.com>
Date: Wed, 8 May 2019 12:07:44 +0100
Subject: [PATCH 27/53] Update SVG-image-has-name.md
---
_rules/SVG-image-has-name.md | 11 ++++++-----
1 file changed, 6 insertions(+), 5 deletions(-)
diff --git a/_rules/SVG-image-has-name.md b/_rules/SVG-image-has-name.md
index 3e6b507e49..f3a5ac1496 100644
--- a/_rules/SVG-image-has-name.md
+++ b/_rules/SVG-image-has-name.md
@@ -31,9 +31,11 @@ Each target element has an [accessible name](#accessible-name) that is not only
## Accessibility support
-The [HTML Accessibility API Mappings](https://www.w3.org/TR/html-aam-1.0/#html-element-role-mappings) specify that the `` element has an implicit role of `graphics-document`. However browser support for `graphics-document` and the SVG Accessibility API Mappings is inconsistent.
+The [SVG Accessibility API Mappings](https://www.w3.org/TR/svg-aam-1.0/#include_elements) specifies that many elements in the SVG namespace are purely presentational and should not be included in the accessibility tree unless indicated otherwise through the use of text alternatve content and WAI ARIA attributes.
-Browser and assistive technology support for SVG `title` and `desc` elements is currently inconsistent. Using WAI ARIA in combination with the `img` role for non-decorative `svg` elements significantly improves accessibility browser support.
+The [HTML Accessibility API Mappings](https://www.w3.org/TR/html-aam-1.0/#html-element-role-mappings) specify that the `` element has an implicit role of `graphics-document`. However browser support for the `graphics-document` role and the [SVG Accessibility API Mappings](https://www.w3.org/TR/html-aam-1.0/#html-element-role-mappings) is inconsistent.
+
+Browser and assistive technology support for SVG `` and `` elements is currently inconsistent. Using WAI ARIA in combination with the `img` role for non-decorative `` elements significantly improves accessibility browser support.
## Background
@@ -82,7 +84,7 @@ The `` element has a role of `img` and an `aria-label` containing the acces
#### Passed example 4
-The `` element has the role of `graphics-document` which takes its accessible name from its child `` element.
+The `` element has an explicit role of `graphics-document` which takes its accessible name from its child `` element.
```html
@@ -205,11 +207,10 @@ The `` element has a role of `img` but has no accessible name. The `title`
#### Inapplicable example 1
-The `svg` element does not have a role of `img`, `graphics-document`, `graphics-object`, or `graphics-symbol`.
+The `svg` element does not render any content to the screen and is therefore not included in the accessibility tree.
```html
-
```
From 85248beda4bec8c538d69b025adcc8a0cc78b98b Mon Sep 17 00:00:00 2001
From: Brynanders <37368581+Brynanders@users.noreply.github.com>
Date: Tue, 25 Jun 2019 14:16:28 +0100
Subject: [PATCH 28/53] Update SVG-image-has-name.md
Removed *Pass Example 5*
---
_rules/SVG-image-has-name.md | 12 ------------
1 file changed, 12 deletions(-)
diff --git a/_rules/SVG-image-has-name.md b/_rules/SVG-image-has-name.md
index f3a5ac1496..e1c5ff6f62 100644
--- a/_rules/SVG-image-has-name.md
+++ b/_rules/SVG-image-has-name.md
@@ -98,18 +98,6 @@ The `` element has an explicit role of `graphics-document` which takes its
```
-#### Passed example 5
-
-The `` element is included in the accessibility tree and takes its accessible name from its child `` element.
-
-```html
-
-
- Yellow circle
-
-
-```
-
#### Passed example 6
The `` element and both descendant `` elements are included in the accessibility tree with the `graphics-document` and `graphics-object` roles. The `svg` element gets its' accessible name via the `` element and both `` elements from their `aria-label` attributes.
From 3a3a3113c3cc83f12e21a41092b94ce45fa8d22b Mon Sep 17 00:00:00 2001
From: Brynanders <37368581+Brynanders@users.noreply.github.com>
Date: Tue, 25 Jun 2019 14:30:23 +0100
Subject: [PATCH 29/53] Update and rename SVG-image-has-name.md to 7d6734.md
Corrected SVG AAM link in Background
Reformatted rule to newest ACT format
---
_rules/{SVG-image-has-name.md => 7d6734.md} | 27 +++++++++++++++++----
1 file changed, 22 insertions(+), 5 deletions(-)
rename _rules/{SVG-image-has-name.md => 7d6734.md} (93%)
diff --git a/_rules/SVG-image-has-name.md b/_rules/7d6734.md
similarity index 93%
rename from _rules/SVG-image-has-name.md
rename to _rules/7d6734.md
index e1c5ff6f62..a73d31e434 100644
--- a/_rules/SVG-image-has-name.md
+++ b/_rules/7d6734.md
@@ -15,13 +15,30 @@ authors:
- Bryn Anderson
---
-## Test procedure
+---
+id: 7d6734
+name: SVG image has accessible name
+rule_type: atomic
+description: |
+ This rule checks that each SVG image element that is included in the accessibility tree has an accessible name.
+accessibility_requirements:
+ wcag20:1.1.1: # Non-Text Content (A)
+ forConformance: true
+ failed: not satisfied
+ passed: further testing needed
+ inapplicable: further testing needed
+input_aspects:
+ - DOM Tree
+ - CSS Styling
+authors:
+ - Bryn Anderson
+---
-### Applicability
+## Applicability
The rule applies to any element in the [SVG](https://www.w3.org/2000/svg) namespace with a [semantic role](#semantic-role) of either `img`, `graphics-document`, `graphics-object`, `graphics-symbol`, that is [included in the accessibility tree](#included-in-the-accessibility-tree).
-### Expectation
+## Expectation
Each target element has an [accessible name](#accessible-name) that is not only [whitespace](#whitespace).
@@ -29,11 +46,11 @@ Each target element has an [accessible name](#accessible-name) that is not only
*There are currently no assumptions*
-## Accessibility support
+## Accessibility Support
The [SVG Accessibility API Mappings](https://www.w3.org/TR/svg-aam-1.0/#include_elements) specifies that many elements in the SVG namespace are purely presentational and should not be included in the accessibility tree unless indicated otherwise through the use of text alternatve content and WAI ARIA attributes.
-The [HTML Accessibility API Mappings](https://www.w3.org/TR/html-aam-1.0/#html-element-role-mappings) specify that the `` element has an implicit role of `graphics-document`. However browser support for the `graphics-document` role and the [SVG Accessibility API Mappings](https://www.w3.org/TR/html-aam-1.0/#html-element-role-mappings) is inconsistent.
+The [HTML Accessibility API Mappings](https://www.w3.org/TR/html-aam-1.0/#html-element-role-mappings) specify that the `` element has an implicit role of `graphics-document`. However browser support for the `graphics-document` role and the [SVG Accessibility API Mappings](https://www.w3.org/TR/svg-aam-1.0) is inconsistent.
Browser and assistive technology support for SVG `` and `` elements is currently inconsistent. Using WAI ARIA in combination with the `img` role for non-decorative `` elements significantly improves accessibility browser support.
From b573d82e05fe01c17361ffb8d112c3eb662993ef Mon Sep 17 00:00:00 2001
From: Brynanders <37368581+Brynanders@users.noreply.github.com>
Date: Tue, 25 Jun 2019 14:30:49 +0100
Subject: [PATCH 30/53] Update 7d6734.md
---
_rules/7d6734.md | 17 -----------------
1 file changed, 17 deletions(-)
diff --git a/_rules/7d6734.md b/_rules/7d6734.md
index a73d31e434..187ca33951 100644
--- a/_rules/7d6734.md
+++ b/_rules/7d6734.md
@@ -1,20 +1,3 @@
----
-id: 7d6734
-name: SVG image has accessible name
-description: |
- This rule checks that each SVG image element that is included in the accessibility tree, has an accessible name.
-
-success_criterion:
-- 1.1.1 # Non-Text Content
-
-test_aspects:
-- DOM Tree
-- CSS Styling
-
-authors:
-- Bryn Anderson
----
-
---
id: 7d6734
name: SVG image has accessible name
From 04befe913e6bcfd296145ee3f38bc57714fe7c97 Mon Sep 17 00:00:00 2001
From: Brynanders <37368581+Brynanders@users.noreply.github.com>
Date: Tue, 25 Jun 2019 14:55:14 +0100
Subject: [PATCH 31/53] Update 7d6734.md
---
_rules/7d6734.md | 2 +-
1 file changed, 1 insertion(+), 1 deletion(-)
diff --git a/_rules/7d6734.md b/_rules/7d6734.md
index 187ca33951..b59672b947 100644
--- a/_rules/7d6734.md
+++ b/_rules/7d6734.md
@@ -23,7 +23,7 @@ The rule applies to any element in the [SVG](https://www.w3.org/2000/svg) namesp
## Expectation
-Each target element has an [accessible name](#accessible-name) that is not only [whitespace](#whitespace).
+Each target element has an [accessible name](#accessible-name) that is not [whitespace](#whitespace).
## Assumptions
From e2a026061a65a482ca383d02d69c30a75faffdff Mon Sep 17 00:00:00 2001
From: Brynanders <37368581+Brynanders@users.noreply.github.com>
Date: Tue, 25 Jun 2019 16:31:48 +0100
Subject: [PATCH 32/53] Update 7d6734.md
Added failed example 7
---
_rules/7d6734.md | 10 ++++++++++
1 file changed, 10 insertions(+)
diff --git a/_rules/7d6734.md b/_rules/7d6734.md
index b59672b947..8a5a8e8db3 100644
--- a/_rules/7d6734.md
+++ b/_rules/7d6734.md
@@ -191,6 +191,16 @@ The `` element has a role of `img` but has no accessible name. The `title`
```
+#### Failed example 7
+
+The `` element has an implicit role of `graphics-document` implying that the visual appearance or layout of content conveys meaning but it has no accessible name.
+
+```html
+
+
+
+```
+
### Inapplicable
#### Inapplicable example 1
From 3914d553dc43a7f400462aec03d281f78359941b Mon Sep 17 00:00:00 2001
From: Brynanders <37368581+Brynanders@users.noreply.github.com>
Date: Wed, 26 Jun 2019 10:46:22 +0100
Subject: [PATCH 33/53] Update 7d6734.md
Added Note to applicability - updated test cases after meeting with Anne and Jey.
---
_rules/7d6734.md | 86 +++++++++++++-----------------------------------
1 file changed, 23 insertions(+), 63 deletions(-)
diff --git a/_rules/7d6734.md b/_rules/7d6734.md
index 8a5a8e8db3..836bf1cab7 100644
--- a/_rules/7d6734.md
+++ b/_rules/7d6734.md
@@ -21,6 +21,8 @@ authors:
The rule applies to any element in the [SVG](https://www.w3.org/2000/svg) namespace with a [semantic role](#semantic-role) of either `img`, `graphics-document`, `graphics-object`, `graphics-symbol`, that is [included in the accessibility tree](#included-in-the-accessibility-tree).
+**Note**: The [SVG Accessibility API Mappings](https://www.w3.org/TR/svg-aam-1.0/#include_elements) specifies that many elements in the SVG namespace are purely presentational and should not be included in the accessibility tree unless indicated otherwise through the use of text alternatve content and WAI ARIA attributes.
+
## Expectation
Each target element has an [accessible name](#accessible-name) that is not [whitespace](#whitespace).
@@ -31,8 +33,6 @@ Each target element has an [accessible name](#accessible-name) that is not [whit
## Accessibility Support
-The [SVG Accessibility API Mappings](https://www.w3.org/TR/svg-aam-1.0/#include_elements) specifies that many elements in the SVG namespace are purely presentational and should not be included in the accessibility tree unless indicated otherwise through the use of text alternatve content and WAI ARIA attributes.
-
The [HTML Accessibility API Mappings](https://www.w3.org/TR/html-aam-1.0/#html-element-role-mappings) specify that the `` element has an implicit role of `graphics-document`. However browser support for the `graphics-document` role and the [SVG Accessibility API Mappings](https://www.w3.org/TR/svg-aam-1.0) is inconsistent.
Browser and assistive technology support for SVG `` and `` elements is currently inconsistent. Using WAI ARIA in combination with the `img` role for non-decorative `` elements significantly improves accessibility browser support.
@@ -84,38 +84,17 @@ The `` element has a role of `img` and an `aria-label` containing the acces
#### Passed example 4
-The `` element has an explicit role of `graphics-document` which takes its accessible name from its child `` element.
+The `` element is removed from the accessibility tree with role `presentation` but the `` element is included in the accessibility tree with role `graphics-document` and an accessible name through the `aria-label` attribute for it's rendered child content.
```html
-
-
- 3 circles
-
-
-
-
-
+
+
+
+
+
```
-#### Passed example 6
-
-The `` element and both descendant `` elements are included in the accessibility tree with the `graphics-document` and `graphics-object` roles. The `svg` element gets its' accessible name via the `` element and both `` elements from their `aria-label` attributes.
-
-```html
-
- 3 shapes
-
- Large blue rectangle with two other shapes inside it
-
-
-
-
-
-
-
-```
-
### Failed
#### Failed example 1
@@ -140,48 +119,29 @@ The `img` role includes the `` element in the accessibility tree but the el
```
#### Failed example 3
-
-The `svg` `` elements are included in the accessibility tree but do not have accessible names.
-
+
+The `` element has a role of `img` but the accessible name `` element has no content.
+
```html
-
- Yellow shapes
-
-
-
+
+
+
```
#### Failed example 4
-The `` elements are included in the accessibility tree with the `graphics-object` role but only one of the elements has an accessible name.
-
-```html
-
- 3 shapes
-
- Large blue rectangle with two other shapes inside it
-
-
-
-
-
-
-
-```
+The `` element is removed from the accessibility tree with role `presentation` but the `` elements are included in the accessibility tree with role `graphics-symbol` but they have no have accessible names.
-#### Failed example 5
-
-The `` element has a role of `img` but the accessible name `` element has no content.
-
```html
-
-
-
+
+
+
+
```
-#### Failed example 6
+#### Failed example 5
The `` element has a role of `img` but has no accessible name. The `title` attribute is not defined in the SVG namespace.
@@ -191,9 +151,9 @@ The `` element has a role of `img` but has no accessible name. The `title`
```
-#### Failed example 7
+#### Failed example 6
-The `` element has an implicit role of `graphics-document` implying that the visual appearance or layout of content conveys meaning but it has no accessible name.
+The `` element has an implicit role of `graphics-document` but it has no accessible name.
```html
@@ -217,7 +177,7 @@ The `svg` element does not render any content to the screen and is therefore not
The `svg` element has an accessible name but the `aria-hidden` attribute excludes the element from the accessibility tree.
```html
-
+
```
From 0024ac9e497523a431d339245f6e5eee0a26e397 Mon Sep 17 00:00:00 2001
From: Brynanders <37368581+Brynanders@users.noreply.github.com>
Date: Tue, 2 Jul 2019 19:08:41 +0100
Subject: [PATCH 34/53] Update 7d6734.md
Updated applicability
Reworked test cases
---
_rules/7d6734.md | 66 +++++++++++++++++++++++++++++++++---------------
1 file changed, 45 insertions(+), 21 deletions(-)
diff --git a/_rules/7d6734.md b/_rules/7d6734.md
index 836bf1cab7..a8b7a9cf63 100644
--- a/_rules/7d6734.md
+++ b/_rules/7d6734.md
@@ -21,7 +21,9 @@ authors:
The rule applies to any element in the [SVG](https://www.w3.org/2000/svg) namespace with a [semantic role](#semantic-role) of either `img`, `graphics-document`, `graphics-object`, `graphics-symbol`, that is [included in the accessibility tree](#included-in-the-accessibility-tree).
-**Note**: The [SVG Accessibility API Mappings](https://www.w3.org/TR/svg-aam-1.0/#include_elements) specifies that many elements in the SVG namespace are purely presentational and should not be included in the accessibility tree unless indicated otherwise through the use of text alternatve content and WAI ARIA attributes.
+The rule applies to any element in the [SVG](https://www.w3.org/2000/svg) namespace with a [semantic role](#semantic-role) of either `img`, `graphics-document`, `graphics-object`, `graphics-symbol`, that is [visible](#visible), and [included in the accessibility tree](#included-in-the-accessibility-tree).
+
+**Note**: The [SVG Accessibility API Mappings](https://www.w3.org/TR/svg-aam-1.0/#include_elements) specifies that many elements in the SVG namespace are purely presentational and should not be included in the accessibility tree unless indicated otherwise through the use of text alternative content, an explicit WAI ARIA role, or a valid `tabindex` attribute.
## Expectation
@@ -52,39 +54,39 @@ Browser and assistive technology support for SVG `` and `` elements
#### Passed example 1
-The `` has an implicit role of `graphics-document` and takes its accessible name from its `` element.
+The `` element has an implicit role of `graphics-document`, has visible content rendered by the `` element and, is included in the accessibility tree by the `` that does not only whitespace.
```html
A yellow circle
-
+
```
#### Passed example 2
-The `` element has an explicit role of `img` and takes its accessible name from its `` element.
+The `` element has an explicit role of `img`, has visible content rendered by the `` element, and is included in the accessibility tree by the `` that does not only whitespace.
```html
A yellow circle
-
+
```
#### Passed example 3
-The `` element has a role of `img` and an `aria-label` containing the accessible name.
+The `` element has an explicit role of `img`, has visible content rendered by the `` element, and is included in the accessibility tree by the `aria-label` attribute that is not only whitespace.
```html
-
+
```
#### Passed example 4
-The `` element is removed from the accessibility tree with role `presentation` but the `` element is included in the accessibility tree with role `graphics-document` and an accessible name through the `aria-label` attribute for it's rendered child content.
+The `` child `` element has visible content, is included in the accessibility tree with the `graphics-document` role, and provides an accessible name through the `aria-label` attribute that is not only whitespace.
```html
@@ -99,7 +101,7 @@ The `` element is removed from the accessibility tree with role `presentati
#### Failed example 1
-The `` element has a role of `img` but has no accessible name.
+The `` element is included in the accessibility tree with an explicit role of `img`, has visible content rendered by the `` element, but has no accessible name.
```html
@@ -109,18 +111,18 @@ The `` element has a role of `img` but has no accessible name.
#### Failed example 2
-The `img` role includes the `` element in the accessibility tree but the element has no accessible name because the `` element contains only whitespace.
+The `` element is included in the accessibility tree with an explicit role of `img`, has visible content rendered by the `` element, but has only has whitespace in the `` element that is being used for the accessible name.
```html
-
+
```
#### Failed example 3
-
-The `` element has a role of `img` but the accessible name `` element has no content.
+
+The `` element is included in the accessibility tree with an explicit role of `img`, has visible content rendered by the `` element, but has no content in the `` element that is being used for the accessible name.
```html
@@ -131,7 +133,7 @@ The `` element has a role of `img` but the accessible name `` elemen
#### Failed example 4
-The `` element is removed from the accessibility tree with role `presentation` but the `` elements are included in the accessibility tree with role `graphics-symbol` but they have no have accessible names.
+The `` elements have visible content, are included in the accessibility tree with the explicit role `graphics-symbol` but they have no have accessible names.
```html
@@ -143,21 +145,21 @@ The `` element is removed from the accessibility tree with role `presentati
#### Failed example 5
-The `` element has a role of `img` but has no accessible name. The `title` attribute is not defined in the SVG namespace.
+The `` element has a role of `img`, has visible content rendered by the `` element, but no accessible name. The `title` attribute is not defined in the SVG namespace.
```html
-
+
```
#### Failed example 6
-The `` element has an implicit role of `graphics-document` but it has no accessible name.
+The `` element has visible content, is included in the accessibility tree with a valid `tabindex` attribute, but has no accessible name.
```html
-
-
+
+
```
@@ -165,7 +167,7 @@ The `` element has an implicit role of `graphics-document` but it has no ac
#### Inapplicable example 1
-The `svg` element does not render any content to the screen and is therefore not included in the accessibility tree.
+The `svg` element does not render any visible content to the screen and is not included in the accessibility tree.
```html
@@ -174,10 +176,32 @@ The `svg` element does not render any content to the screen and is therefore not
#### Inapplicable example 2
-The `svg` element has an accessible name but the `aria-hidden` attribute excludes the element from the accessibility tree.
+The `` element has visible content rendered by the `` element but with no explicit role indicating its purpose it is not included in the accessibility tree.
+
+```html
+
+
+
+```
+
+#### Inapplicable example 3
+
+The `svg` element has visible content rendered by the `` element, has an accessible name but the `aria-hidden` attribute removed the element from the accessibility tree.
```html
```
+
+#### Inapplicable example 4
+
+The `svg` element does not render any visible content.
+
+```html
+
+
+
+
+
+```
From c51993ed646a40e8ae98d02e44b1f55a325e9ab7 Mon Sep 17 00:00:00 2001
From: Brynanders <37368581+Brynanders@users.noreply.github.com>
Date: Wed, 3 Jul 2019 12:50:22 +0100
Subject: [PATCH 35/53] Update and rename 7d6734.md to
SVG-image-has-name-7d6734.md
---
_rules/{7d6734.md => SVG-image-has-name-7d6734.md} | 2 --
1 file changed, 2 deletions(-)
rename _rules/{7d6734.md => SVG-image-has-name-7d6734.md} (96%)
diff --git a/_rules/7d6734.md b/_rules/SVG-image-has-name-7d6734.md
similarity index 96%
rename from _rules/7d6734.md
rename to _rules/SVG-image-has-name-7d6734.md
index a8b7a9cf63..09928d41d3 100644
--- a/_rules/7d6734.md
+++ b/_rules/SVG-image-has-name-7d6734.md
@@ -19,8 +19,6 @@ authors:
## Applicability
-The rule applies to any element in the [SVG](https://www.w3.org/2000/svg) namespace with a [semantic role](#semantic-role) of either `img`, `graphics-document`, `graphics-object`, `graphics-symbol`, that is [included in the accessibility tree](#included-in-the-accessibility-tree).
-
The rule applies to any element in the [SVG](https://www.w3.org/2000/svg) namespace with a [semantic role](#semantic-role) of either `img`, `graphics-document`, `graphics-object`, `graphics-symbol`, that is [visible](#visible), and [included in the accessibility tree](#included-in-the-accessibility-tree).
**Note**: The [SVG Accessibility API Mappings](https://www.w3.org/TR/svg-aam-1.0/#include_elements) specifies that many elements in the SVG namespace are purely presentational and should not be included in the accessibility tree unless indicated otherwise through the use of text alternative content, an explicit WAI ARIA role, or a valid `tabindex` attribute.
From 746afe9433f49dc8b7eec4d8ea37512744de6122 Mon Sep 17 00:00:00 2001
From: Brynanders <37368581+Brynanders@users.noreply.github.com>
Date: Wed, 3 Jul 2019 12:54:50 +0100
Subject: [PATCH 36/53] Update SVG-image-has-name-7d6734.md
Updated description to include visible content
---
_rules/SVG-image-has-name-7d6734.md | 2 +-
1 file changed, 1 insertion(+), 1 deletion(-)
diff --git a/_rules/SVG-image-has-name-7d6734.md b/_rules/SVG-image-has-name-7d6734.md
index 09928d41d3..ec5e0b4337 100644
--- a/_rules/SVG-image-has-name-7d6734.md
+++ b/_rules/SVG-image-has-name-7d6734.md
@@ -3,7 +3,7 @@ id: 7d6734
name: SVG image has accessible name
rule_type: atomic
description: |
- This rule checks that each SVG image element that is included in the accessibility tree has an accessible name.
+ This rule checks that each SVG image element that renders visible content that and is included in the accessibility tree has an accessible name.
accessibility_requirements:
wcag20:1.1.1: # Non-Text Content (A)
forConformance: true
From ba7a7865e4c4aad363887e7479e0016768a33188 Mon Sep 17 00:00:00 2001
From: Brynanders <37368581+Brynanders@users.noreply.github.com>
Date: Wed, 3 Jul 2019 13:07:15 +0100
Subject: [PATCH 37/53] Update SVG-image-has-name-7d6734.md
---
_rules/SVG-image-has-name-7d6734.md | 12 ++++++------
1 file changed, 6 insertions(+), 6 deletions(-)
diff --git a/_rules/SVG-image-has-name-7d6734.md b/_rules/SVG-image-has-name-7d6734.md
index ec5e0b4337..3165e04fa8 100644
--- a/_rules/SVG-image-has-name-7d6734.md
+++ b/_rules/SVG-image-has-name-7d6734.md
@@ -25,7 +25,7 @@ The rule applies to any element in the [SVG](https://www.w3.org/2000/svg) namesp
## Expectation
-Each target element has an [accessible name](#accessible-name) that is not [whitespace](#whitespace).
+Each target element has an [accessible name](#accessible-name) that is not only [whitespace](#whitespace).
## Assumptions
@@ -52,7 +52,7 @@ Browser and assistive technology support for SVG `` and `` elements
#### Passed example 1
-The `` element has an implicit role of `graphics-document`, has visible content rendered by the `` element and, is included in the accessibility tree by the `` that does not only whitespace.
+The `` element has an implicit role of `graphics-document`, has visible content rendered by the `` element and, is included in the accessibility tree by the `` does not contain only whitespace.
```html
@@ -63,7 +63,7 @@ The `` element has an implicit role of `graphics-document`, has visible con
#### Passed example 2
-The `` element has an explicit role of `img`, has visible content rendered by the `` element, and is included in the accessibility tree by the `` that does not only whitespace.
+The `` element has an explicit role of `img`, has visible content rendered by the `` element, and is included in the accessibility tree by the `` that does not contain only whitespace.
```html
@@ -74,7 +74,7 @@ The `` element has an explicit role of `img`, has visible content rendered
#### Passed example 3
-The `` element has an explicit role of `img`, has visible content rendered by the `` element, and is included in the accessibility tree by the `aria-label` attribute that is not only whitespace.
+The `` element has an explicit role of `img`, has visible content rendered by the `` element, and is included in the accessibility tree by the `aria-label` attribute that is not only contain whitespace.
```html
@@ -84,7 +84,7 @@ The `` element has an explicit role of `img`, has visible content rendered
#### Passed example 4
-The `` child `` element has visible content, is included in the accessibility tree with the `graphics-document` role, and provides an accessible name through the `aria-label` attribute that is not only whitespace.
+The `` child `` element has visible content, is included in the accessibility tree with the `graphics-object` role, and provides an accessible name through the `aria-label` attribute that is not only contain whitespace.
```html
@@ -197,7 +197,7 @@ The `svg` element has visible content rendered by the `` element, has an
The `svg` element does not render any visible content.
```html
-