From c495992769834b7c38335c7fea8ac245f9e8d9a9 Mon Sep 17 00:00:00 2001 From: Jean-Yves Moyen Date: Tue, 25 Feb 2020 12:02:08 +0100 Subject: [PATCH 01/67] Add conflict resolution in definition --- pages/glossary/semantic-role.md | 13 ++++++++++++- 1 file changed, 12 insertions(+), 1 deletion(-) diff --git a/pages/glossary/semantic-role.md b/pages/glossary/semantic-role.md index 118334d2f1..2e2fed4f0b 100755 --- a/pages/glossary/semantic-role.md +++ b/pages/glossary/semantic-role.md @@ -9,4 +9,15 @@ A _semantic [role](https://www.w3.org/TR/wai-aria-1.1/#dfn-role)_ is a semantic Valid semantic roles are defined by standards. For web content and applications these are defined within the various [WAI-ARIA specifications](https://act-rules.github.io/glossary/#wai-aria-specifications). -The semantic role of an element is its [explicit semantic role](#explicit-role) if it has any, otherwise, the [implicit semantic role](#implicit-role) is used. +The _semantic role_ of an element which is [included in the accessibility tree][] is the role this element has in the accessibility tree. Elements which are not [included in the accessibility tree][] have no semantic role. + +**Note:** In most cases, the semantic role of an element is its [explicit semantic role][] if it has any, otherwise, its [implicit semantic role][]. However, elements with an [explicit role][] of `none` or `presentation` may still be [included in the accessibility tree][] with their [implicit role][] if a [global ARIA state or property](https://www.w3.org/TR/wai-aria-1.1/#global_states) is specified, or if they are focusable or interactive ([Presentational Roles Conflict Resolution][]) + +#### Accessibility Support + +There exist popular web browsers and assistive technologies which do not correctly implement [Presentational Roles Conflict Resolution][]. + +[explicit semantic role]: #explicit-role 'Definition of Explicit Role' +[implicit semantic role]: #implicit-role 'Definition of Implicit Role' +[included in the accessibility tree]: #included-in-the-accessibility-tree 'Definition of Included in the Accessibility Tree' +[presentational roles conflict resolution]: https://www.w3.org/TR/wai-aria-1.1/#conflict_resolution_presentation_none 'Presentational Roles Conflict Resolution' From 06d1467d306982e1728386970a1cac95ca8f7090 Mon Sep 17 00:00:00 2001 From: Jean-Yves Moyen Date: Tue, 25 Feb 2020 12:38:47 +0100 Subject: [PATCH 02/67] Add spelling exception --- __tests__/spelling-ignore.yml | 2 ++ 1 file changed, 2 insertions(+) diff --git a/__tests__/spelling-ignore.yml b/__tests__/spelling-ignore.yml index 6ac02ab3c3..b7371a6ca9 100755 --- a/__tests__/spelling-ignore.yml +++ b/__tests__/spelling-ignore.yml @@ -114,6 +114,8 @@ - Autofill - implementers - Implementers +- presentational +- Presentational # Parts of Unicode - 000A From abe6fc5f8bbe7db10252e09c0397806f753e4a82 Mon Sep 17 00:00:00 2001 From: Jean-Yves Moyen Date: Tue, 25 Feb 2020 13:06:35 +0100 Subject: [PATCH 03/67] Add missing links --- pages/glossary/semantic-role.md | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/pages/glossary/semantic-role.md b/pages/glossary/semantic-role.md index 2e2fed4f0b..fdedd657b4 100755 --- a/pages/glossary/semantic-role.md +++ b/pages/glossary/semantic-role.md @@ -11,7 +11,7 @@ Valid semantic roles are defined by standards. For web content and applications The _semantic role_ of an element which is [included in the accessibility tree][] is the role this element has in the accessibility tree. Elements which are not [included in the accessibility tree][] have no semantic role. -**Note:** In most cases, the semantic role of an element is its [explicit semantic role][] if it has any, otherwise, its [implicit semantic role][]. However, elements with an [explicit role][] of `none` or `presentation` may still be [included in the accessibility tree][] with their [implicit role][] if a [global ARIA state or property](https://www.w3.org/TR/wai-aria-1.1/#global_states) is specified, or if they are focusable or interactive ([Presentational Roles Conflict Resolution][]) +**Note:** In most cases, the semantic role of an element is its [explicit semantic role][] if it has any, otherwise, its [implicit semantic role][]. However, elements with an [explicit semantic role][] of `none` or `presentation` may still be [included in the accessibility tree][] with their [implicit semantic role][] if a [global ARIA state or property](https://www.w3.org/TR/wai-aria-1.1/#global_states) is specified, or if they are focusable or interactive ([Presentational Roles Conflict Resolution][]) #### Accessibility Support From c76ce886969c06f55ea335271cbebdfeb09bd50a Mon Sep 17 00:00:00 2001 From: Jean-Yves Moyen Date: Tue, 25 Feb 2020 13:07:00 +0100 Subject: [PATCH 04/67] Add examples of presentational conflict resolution --- ...aria-state-or-property-permitted-5c01ea.md | 42 ++++++++++++++++++- 1 file changed, 41 insertions(+), 1 deletion(-) mode change 100644 => 100755 _rules/aria-state-or-property-permitted-5c01ea.md diff --git a/_rules/aria-state-or-property-permitted-5c01ea.md b/_rules/aria-state-or-property-permitted-5c01ea.md old mode 100644 new mode 100755 index eeb2064054..58be4c859d --- a/_rules/aria-state-or-property-permitted-5c01ea.md +++ b/_rules/aria-state-or-property-permitted-5c01ea.md @@ -12,6 +12,7 @@ accessibility_requirements: passed: satisfied inapplicable: satisfied input_aspects: + - Accessibility Tree - DOM Tree acknowledgements: authors: @@ -34,7 +35,7 @@ _There are currently no assumptions_ ## Accessibility Support -_There are no major accessibility support issues known for this rule._ +There exist popular web browsers and assistive technologies which do not correctly implement [Presentational Roles Conflict Resolution][]. ## Background @@ -111,6 +112,26 @@ WAI-ARIA states and properties with empty value, specified as an empty string, a
My combobox
``` +#### Passed Example 9 + +This `li` element has an [explicit role][] of `none`. However, the [global][] [property][] `aria-label` is specified. Thus it has a [semantic role][] of `listitem` due to [Presentational Roles Conflict Resolution][]. The `aria-setsize` [property][] is [supported][] for the `listitem` role. + +```html +
    +
  • ACT rules
    • +
+``` + +#### Passed Example 10 + +This `li` element has an [explicit role][] of `none`. However, it is [focusable][] due to the `tabindex` attribute (even if it is excluded from sequential focus order). Thus it has a [semantic role][] of `listitem` due to [Presentational Roles Conflict Resolution][]. The `aria-setsize` [property][] is [supported][] for the `listitem` role. + +```html +
    +
  • ACT rules
    • +
+``` + ### Failed #### Failed Example 1 @@ -129,6 +150,16 @@ WAI-ARIA states and properties with empty value, specified as an empty string, a ``` +#### Failed Example 3 + +This `li` element has an [explicit role][], and a [semantic role][], of `none`. The `aria-setsize` [property][] in neither [inherited][], [supported][] nor [required][] for this role. + +```html +
    +
  • ACT rules
    • +
+``` + ### Inapplicable #### Inapplicable Example 1 @@ -147,4 +178,13 @@ No [WAI-ARIA state or property](https://www.w3.org/TR/wai-aria-1.1/#state_prop_d
``` +[explicit role]: #explicit-role 'Definition of Explicit Role' +[focusable]: #focusable 'Definition of focusable' +[global]: https://www.w3.org/TR/wai-aria-1.1/#global_states 'Definition of Global ARIA States and Properties' [included in the accessibility tree]: #included-in-the-accessibility-tree 'Definition of included in the accessibility tree' +[inherited]: https://www.w3.org/TR/wai-aria/#inheritedattributes 'Definition of Inherited ARIA States and Properties' +[presentational roles conflict resolution]: https://www.w3.org/TR/wai-aria-1.1/#conflict_resolution_presentation_none 'Presentational Roles Conflict Resolution' +[property]: https://www.w3.org/TR/wai-aria/#dfn-property 'Definition of ARIA Property' +[required]: https://www.w3.org/TR/wai-aria/#requiredState 'Definition of Required ARIA States and Properties' +[semantic role]: #semantic-role 'Definition of Semantic Role' +[supported]: https://www.w3.org/TR/wai-aria/#supportedState 'Definition of Supported ARIA States and Properties' From 1004f429c731d3412053eeb5f18be3aaa6fa1d2b Mon Sep 17 00:00:00 2001 From: Jean-Yves Moyen Date: Wed, 26 Feb 2020 14:28:31 +0100 Subject: [PATCH 05/67] Add second assumption --- _rules/aria-state-or-property-permitted-5c01ea.md | 5 +++-- 1 file changed, 3 insertions(+), 2 deletions(-) diff --git a/_rules/aria-state-or-property-permitted-5c01ea.md b/_rules/aria-state-or-property-permitted-5c01ea.md index 58be4c859d..20d2aa3e4a 100755 --- a/_rules/aria-state-or-property-permitted-5c01ea.md +++ b/_rules/aria-state-or-property-permitted-5c01ea.md @@ -35,7 +35,8 @@ _There are currently no assumptions_ ## Accessibility Support -There exist popular web browsers and assistive technologies which do not correctly implement [Presentational Roles Conflict Resolution][]. +- There exist popular web browsers and assistive technologies which do not correctly implement [Presentational Roles Conflict Resolution][]. +- Some browsers expose elements which are [focusable][] but have an `aria-hidden="true"` attribute, while some hide them. ## Background @@ -172,7 +173,7 @@ No [WAI-ARIA state or property](https://www.w3.org/TR/wai-aria-1.1/#state_prop_d #### Inapplicable Example 2 -`aria-sort` property is neither inherited, supported, nor required for role `button`, but the element is not [included in the accessibility tree][]. +`aria-sort` property is neither inherited, supported, nor required for role `button`, but the element is not [included in the accessibility tree][] because it is not rendered. ```html
From 73bb9c50165c252401db3e114c8a22e6fe631b2c Mon Sep 17 00:00:00 2001 From: Jean-Yves Moyen Date: Wed, 26 Feb 2020 14:28:49 +0100 Subject: [PATCH 06/67] Add second assumption --- pages/glossary/semantic-role.md | 6 ++++-- 1 file changed, 4 insertions(+), 2 deletions(-) diff --git a/pages/glossary/semantic-role.md b/pages/glossary/semantic-role.md index fdedd657b4..4b6a18f6f9 100755 --- a/pages/glossary/semantic-role.md +++ b/pages/glossary/semantic-role.md @@ -11,13 +11,15 @@ Valid semantic roles are defined by standards. For web content and applications The _semantic role_ of an element which is [included in the accessibility tree][] is the role this element has in the accessibility tree. Elements which are not [included in the accessibility tree][] have no semantic role. -**Note:** In most cases, the semantic role of an element is its [explicit semantic role][] if it has any, otherwise, its [implicit semantic role][]. However, elements with an [explicit semantic role][] of `none` or `presentation` may still be [included in the accessibility tree][] with their [implicit semantic role][] if a [global ARIA state or property](https://www.w3.org/TR/wai-aria-1.1/#global_states) is specified, or if they are focusable or interactive ([Presentational Roles Conflict Resolution][]) +**Note:** In most cases, the semantic role of an element is its [explicit semantic role][] if it has any, otherwise, its [implicit semantic role][]. However, elements with an [explicit semantic role][] of `none` or `presentation` may still be [included in the accessibility tree][] with their [implicit semantic role][] if a [global ARIA state or property](https://www.w3.org/TR/wai-aria-1.1/#global_states) is specified, or if they are [focusable][] or interactive ([Presentational Roles Conflict Resolution][]) #### Accessibility Support -There exist popular web browsers and assistive technologies which do not correctly implement [Presentational Roles Conflict Resolution][]. +- There exist popular web browsers and assistive technologies which do not correctly implement [Presentational Roles Conflict Resolution][]. +- A similar conflict exists for [focusable][] elements with a `aria-hidden="true"` attribute. The WAI ARIA specification does not explain how to solve it. Some browsers give precedence to the element being focusable (and expose it in the accessibility tree) while some give precedence to the `aria-hidden` attribute (and hide the element). [explicit semantic role]: #explicit-role 'Definition of Explicit Role' +[focusable]: #focusable 'Definition of Focusable' [implicit semantic role]: #implicit-role 'Definition of Implicit Role' [included in the accessibility tree]: #included-in-the-accessibility-tree 'Definition of Included in the Accessibility Tree' [presentational roles conflict resolution]: https://www.w3.org/TR/wai-aria-1.1/#conflict_resolution_presentation_none 'Presentational Roles Conflict Resolution' From e5050038893d8c0ba930e67b8afcac2b963293f9 Mon Sep 17 00:00:00 2001 From: Jean-Yves Moyen Date: Wed, 26 Feb 2020 14:29:14 +0100 Subject: [PATCH 07/67] Handle presentational role conflict resolution --- _rules/form-control-accessible-name-e086e5.md | 24 ++++++++++++------- 1 file changed, 15 insertions(+), 9 deletions(-) mode change 100644 => 100755 _rules/form-control-accessible-name-e086e5.md diff --git a/_rules/form-control-accessible-name-e086e5.md b/_rules/form-control-accessible-name-e086e5.md old mode 100644 new mode 100755 index be3716e451..046762427a --- a/_rules/form-control-accessible-name-e086e5.md +++ b/_rules/form-control-accessible-name-e086e5.md @@ -41,7 +41,9 @@ _There are currently no assumptions_ ## Accessibility Support -Certain assistive technologies can be set up to ignore the title attribute, which means that to some users the title attribute will not act as an [accessible name][]. +- Certain assistive technologies can be set up to ignore the title attribute, which means that to some users the title attribute will not act as an [accessible name][]. +- There exist popular web browsers and assistive technologies which do not correctly implement [Presentational Roles Conflict Resolution][]. +- Some browsers expose elements which are [focusable][] but have an `aria-hidden="true"` attribute, while some hide them. ## Background @@ -174,6 +176,14 @@ The [accessible name][] is empty. ``` +#### Failed Example 8 + +This `input` element has an [explicit role][] of `none`. However, it is [focusable][] (by default). Thus it has a [semantic role][] of `textbox` due to [Presentational Roles Conflict Resolution][]. It has an empty [accessible name][]. + +```html + +``` + ### Inapplicable #### Inapplicable Example 1 @@ -186,14 +196,6 @@ Hidden to everyone. #### Inapplicable Example 2 -Hidden to assistive technologies. - -```html - -``` - -#### Inapplicable Example 3 - Role has [explicitly](#explicit-role) been set to something that isn't a form field. ```html @@ -213,5 +215,9 @@ Option inherits from input, but has a required context role of listbox which inh ``` [accessible name]: #accessible-name 'Definition of accessible name' +[explicit role]: #explicit-role 'Definition of Explicit Role' +[included in the accessibility tree]: #included-in-the-accessibility-tree 'Definition of included in the accessibility tree' +[presentational roles conflict resolution]: https://www.w3.org/TR/wai-aria-1.1/#conflict_resolution_presentation_none 'Presentational Roles Conflict Resolution' +[semantic role]: #semantic-role 'Definition of Semantic Role' [semantic roles]: #semantic-role 'Definition of semantic role' [whitespace]: #whitespace 'Definition of whitespace' From d4ea74085a1b74cc5293db0a9d225b21cb946825 Mon Sep 17 00:00:00 2001 From: Jean-Yves Moyen Date: Wed, 26 Feb 2020 14:29:43 +0100 Subject: [PATCH 08/67] Handle presentational role conflict resolution --- _rules/link-accessible-name-c487ae.md | 25 ++++++++++++++----------- 1 file changed, 14 insertions(+), 11 deletions(-) diff --git a/_rules/link-accessible-name-c487ae.md b/_rules/link-accessible-name-c487ae.md index 8af14cdad9..170edf3f3f 100755 --- a/_rules/link-accessible-name-c487ae.md +++ b/_rules/link-accessible-name-c487ae.md @@ -54,7 +54,9 @@ Each target element has an [accessible name][] that is not empty (`""`). ## Accessibility Support -For `area` elements that have a `href` attribute, but are not nested inside a `map` element, there are differences between browsers and assistive technology on whether the `area` is considered [included in the accessibility tree][] or not. +- For `area` elements that have a `href` attribute, but are not nested inside a `map` element, there are differences between browsers and assistive technology on whether the `area` is considered [included in the accessibility tree][] or not. +- There exist popular web browsers and assistive technologies which do not correctly implement [Presentational Roles Conflict Resolution][]. +- Some browsers expose elements which are [focusable][] but have an `aria-hidden="true"` attribute, while some hide them. ## Background @@ -260,6 +262,14 @@ Link is completely empty, but still shows up in focus order, so it should have a ``` +#### Failed Example 11 + +This `a` element has an [explicit role][] of `none`. However, it is [focusable][] (by default). Thus it has a [semantic role][] of `link` due to [Presentational Roles Conflict Resolution][]. It has an empty [accessible name][]. + +```html + +``` + ### Inapplicable #### Inapplicable Example 1 @@ -290,16 +300,6 @@ Not [included in the accessibility tree][] due to `visibility: hidden`. #### Inapplicable Example 4 -Not [included in the accessibility tree][] due to `aria-hidden="true"`. - -```html - -``` - -#### Inapplicable Example 5 - `area` element without `href` attribute does not have role of `link`. ```html @@ -307,5 +307,8 @@ Not [included in the accessibility tree][] due to `aria-hidden="true"`. ``` [accessible name]: #accessible-name 'Definition of accessible name' +[explicit role]: #explicit-role 'Definition of Explicit Role' [included in the accessibility tree]: #included-in-the-accessibility-tree 'Definition of included in the accessibility tree' +[presentational roles conflict resolution]: https://www.w3.org/TR/wai-aria-1.1/#conflict_resolution_presentation_none 'Presentational Roles Conflict Resolution' +[semantic role]: #semantic-role 'Definition of Semantic Role' [whitespace]: #whitespace 'Definition of whitespace' From 041243f9a98f4a3d89fd429aa95aba07aeb4db3c Mon Sep 17 00:00:00 2001 From: Jean-Yves Moyen Date: Wed, 26 Feb 2020 14:34:08 +0100 Subject: [PATCH 09/67] Handle presentational role conflict resolution --- ...dentical-name-equivalent-purpose-b20e66.md | 31 +++++++++---------- 1 file changed, 14 insertions(+), 17 deletions(-) diff --git a/_rules/links-identical-name-equivalent-purpose-b20e66.md b/_rules/links-identical-name-equivalent-purpose-b20e66.md index db95dbc195..d615287dee 100755 --- a/_rules/links-identical-name-equivalent-purpose-b20e66.md +++ b/_rules/links-identical-name-equivalent-purpose-b20e66.md @@ -48,7 +48,9 @@ When followed, the links in each set of target elements resolve to the [same res ## Accessibility Support -This rule assumes that assistive technologies are exposing all links on the page in the same way no matter which [document tree](https://dom.spec.whatwg.org/#document-trees) they are in. If an assistive technology requires the user to "enter" an `iframe` or a [shadow tree][] before exposing its links, then it is possible for two links to have identical name but resolve to different resources without failing [Success Criterion 2.4.9 Link Purpose (Link Only)][sc249] (if said links are in separate [documents][document] or [shadow trees][shadow tree]) +- This rule assumes that assistive technologies are exposing all links on the page in the same way no matter which [document tree](https://dom.spec.whatwg.org/#document-trees) they are in. If an assistive technology requires the user to "enter" an `iframe` or a [shadow tree][] before exposing its links, then it is possible for two links to have identical name but resolve to different resources without failing [Success Criterion 2.4.9 Link Purpose (Link Only)][sc249] (if said links are in separate [documents][document] or [shadow trees][shadow tree]). +- There exist popular web browsers and assistive technologies which do not correctly implement [Presentational Roles Conflict Resolution][]. +- Some browsers expose elements which are [focusable][] but have an `aria-hidden="true"` attribute, while some hide them. ## Background @@ -326,6 +328,17 @@ Both links resolve to [same resource][] after redirect, but the redirect is not ``` +#### Failed Example 7 + +The first `a` element has an [explicit role][] of `none`. However, it is [focusable][] (by default). Thus it has a [semantic role][] of `link` due to [Presentational Roles Conflict Resolution][]. Both links have the same [accessible name][] but go to different resources. + +```html + + Follow us + Follow us + +``` + ### Inapplicable #### Inapplicable Example 1 @@ -354,22 +367,6 @@ These links have different [accessible names][accessible name]. The rule only ap #### Inapplicable Example 3 -The first link is not [included in the accessibility tree][]. - -```html - - - Contact Us - -``` - -#### Inapplicable Example 4 - These `span` elements do not have a [semantic role][] of link. ```html From db521ab4aeb952e57ad6c6fe65485f351dd8f5df Mon Sep 17 00:00:00 2001 From: Jean-Yves Moyen Date: Wed, 26 Feb 2020 14:36:56 +0100 Subject: [PATCH 10/67] Fix missing refs --- _rules/form-control-accessible-name-e086e5.md | 2 ++ _rules/link-accessible-name-c487ae.md | 2 ++ _rules/links-identical-name-equivalent-purpose-b20e66.md | 3 +++ 3 files changed, 7 insertions(+) diff --git a/_rules/form-control-accessible-name-e086e5.md b/_rules/form-control-accessible-name-e086e5.md index 046762427a..b3034f2a77 100755 --- a/_rules/form-control-accessible-name-e086e5.md +++ b/_rules/form-control-accessible-name-e086e5.md @@ -11,6 +11,7 @@ accessibility_requirements: passed: further testing needed inapplicable: further testing needed input_aspects: + - Accessibility Tree - DOM Tree acknowledgements: authors: @@ -216,6 +217,7 @@ Option inherits from input, but has a required context role of listbox which inh [accessible name]: #accessible-name 'Definition of accessible name' [explicit role]: #explicit-role 'Definition of Explicit Role' +[focusable]: #focusable 'Definition of focusable' [included in the accessibility tree]: #included-in-the-accessibility-tree 'Definition of included in the accessibility tree' [presentational roles conflict resolution]: https://www.w3.org/TR/wai-aria-1.1/#conflict_resolution_presentation_none 'Presentational Roles Conflict Resolution' [semantic role]: #semantic-role 'Definition of Semantic Role' diff --git a/_rules/link-accessible-name-c487ae.md b/_rules/link-accessible-name-c487ae.md index 170edf3f3f..033abd0413 100755 --- a/_rules/link-accessible-name-c487ae.md +++ b/_rules/link-accessible-name-c487ae.md @@ -26,6 +26,7 @@ accessibility_requirements: passed: further testing needed inapplicable: further testing needed input_aspects: + - Accessibility Tree - DOM Tree - CSS Styling acknowledgements: @@ -308,6 +309,7 @@ Not [included in the accessibility tree][] due to `visibility: hidden`. [accessible name]: #accessible-name 'Definition of accessible name' [explicit role]: #explicit-role 'Definition of Explicit Role' +[focusable]: #focusable 'Definition of focusable' [included in the accessibility tree]: #included-in-the-accessibility-tree 'Definition of included in the accessibility tree' [presentational roles conflict resolution]: https://www.w3.org/TR/wai-aria-1.1/#conflict_resolution_presentation_none 'Presentational Roles Conflict Resolution' [semantic role]: #semantic-role 'Definition of Semantic Role' diff --git a/_rules/links-identical-name-equivalent-purpose-b20e66.md b/_rules/links-identical-name-equivalent-purpose-b20e66.md index d615287dee..dff770eba0 100755 --- a/_rules/links-identical-name-equivalent-purpose-b20e66.md +++ b/_rules/links-identical-name-equivalent-purpose-b20e66.md @@ -11,6 +11,7 @@ accessibility_requirements: passed: further testing needed inapplicable: further testing needed input_aspects: + - Accessibility Tree - DOM Tree - CSS Styling - Language @@ -402,9 +403,11 @@ These image links have empty [accessible names][accessible name]. [document]: https://dom.spec.whatwg.org/#concept-document 'Definition of document' [explicit role]: #explicit-role 'Definition of explicit role' [flat tree]: https://drafts.csswg.org/css-scoping/#flat-tree 'Definition of flat tree' +[focusable]: #focusable 'Definition of focusable' [included in the accessibility tree]: #included-in-the-accessibility-tree 'Definition of included in the accessibility tree' [light tree]: https://dom.spec.whatwg.org/#concept-light-tree 'Definition of light tree' [matching]: #matching-characters 'Definition of matching characters' +[presentational roles conflict resolution]: https://www.w3.org/TR/wai-aria-1.1/#conflict_resolution_presentation_none 'Presentational Roles Conflict Resolution' [same resource]: #same-resource 'Definition of same resource' [sc249]: https://www.w3.org/TR/WCAG21/#link-purpose-link-only 'Success Criterion 2.4.9: Link Purpose (link only)' [semantic role]: #semantic-role 'Definition of semantic role' From c82941e8215b0c0d755c91cca471017958f5fd37 Mon Sep 17 00:00:00 2001 From: Jean-Yves Moyen Date: Wed, 26 Feb 2020 14:39:58 +0100 Subject: [PATCH 11/67] Handle presentational role conflict resolution --- _rules/button-accessible-name-97a4e1.md | 24 +++++++++++++++++++++++- 1 file changed, 23 insertions(+), 1 deletion(-) diff --git a/_rules/button-accessible-name-97a4e1.md b/_rules/button-accessible-name-97a4e1.md index 90c59225e7..6f3d4c9aa1 100755 --- a/_rules/button-accessible-name-97a4e1.md +++ b/_rules/button-accessible-name-97a4e1.md @@ -11,6 +11,7 @@ accessibility_requirements: passed: further testing needed inapplicable: further testing needed input_aspects: + - Accessibility Tree - DOM Tree - CSS Styling acknowledgements: @@ -39,7 +40,8 @@ Each target element has an [accessible name][] that is not empty (`""`). ## Accessibility Support -There are no major accessibility support issues known for this rule. +- There exist popular web browsers and assistive technologies which do not correctly implement [Presentational Roles Conflict Resolution][]. +- Some browsers expose elements which are [focusable][] but have an `aria-hidden="true"` attribute, while some hide them. ## Background @@ -172,6 +174,14 @@ This off screen `button` element has no [accessible name][] because it has no co ``` +#### Failed Example 5 + +This `button` element has an [explicit role][] of `none`. However, it is [focusable][] (by default). Thus it has a [semantic role][] of `button` due to [Presentational Roles Conflict Resolution][]. It has an empty [accessible name][]. + +```html + +``` + ### Inapplicable #### Inapplicable Example 1 @@ -198,5 +208,17 @@ This `button` element has a `link` role. Links are tested in a separate rule whi ``` +#### Inapplicable Example 4 + +This `button` element has an [explicit role][] of `none`; it is not [focusable][] because it is `disabled`. Thus it has a [semantic role][] of `none`. + +```html + +``` + [accessible name]: #accessible-name 'Definition of accessible name' +[explicit role]: #explicit-role 'Definition of explicit role' +[focusable]: #focusable 'Definition of focusable' [included in the accessibility tree]: #included-in-the-accessibility-tree 'Definition of included in the accessibility tree' +[presentational roles conflict resolution]: https://www.w3.org/TR/wai-aria-1.1/#conflict_resolution_presentation_none 'Presentational Roles Conflict Resolution' +[semantic role]: #semantic-role 'Definition of Semantic Role' From c480eb90bb09413742f9f84b5fb4a4ba034adc6d Mon Sep 17 00:00:00 2001 From: Jean-Yves Moyen Date: Wed, 26 Feb 2020 14:48:46 +0100 Subject: [PATCH 12/67] Handle presentational role conflict resolution --- _rules/autocomplete-valid-value-73f2c2.md | 30 +++++++++-------------- 1 file changed, 11 insertions(+), 19 deletions(-) mode change 100644 => 100755 _rules/autocomplete-valid-value-73f2c2.md diff --git a/_rules/autocomplete-valid-value-73f2c2.md b/_rules/autocomplete-valid-value-73f2c2.md old mode 100644 new mode 100755 index 8cd8a898e7..d6ccd3e20e --- a/_rules/autocomplete-valid-value-73f2c2.md +++ b/_rules/autocomplete-valid-value-73f2c2.md @@ -11,6 +11,7 @@ accessibility_requirements: passed: further testing needed inapplicable: further testing needed input_aspects: + - Accessibility Tree - DOM Tree - CSS Styling acknowledgements: @@ -52,7 +53,9 @@ For this rule, it is assumed that the `autocomplete` attribute is not used on fo ## Accessibility Support -While `autocomplete` in a promising technique for supporting personalization in HTML, support for this is fairly limited. +- While `autocomplete` in a promising technique for supporting personalization in HTML, support for this is fairly limited. +- There exist popular web browsers and assistive technologies which do not correctly implement [Presentational Roles Conflict Resolution][]. +- Some browsers expose elements which are [focusable][] but have an `aria-hidden="true"` attribute, while some hide them. ## Background @@ -127,7 +130,7 @@ Full length autocomplete terms. #### Passed Example 8 -The `input` element does not have a semantic role that is a widget role, but still participates in sequential focus navigation, and has a single autocomplete term. +This `button` element has an [explicit role][] of `none`. However, it is [focusable][] (by default). Thus it has a [semantic role][] of `button` due to [Presentational Roles Conflict Resolution][]. It has a single autocomplete term. ```html @@ -219,14 +222,6 @@ The element is hidden through `display:none`. #### Inapplicable Example 4 -The element is positioned off screen and hidden to assistive technologies - -```html - -``` - -#### Inapplicable Example 5 - The `input` element has a `type` attribute that is in the `button` state. ```html @@ -262,21 +257,18 @@ The `input` element has an `aria-disabled` attribute with value `true`. Non-widget element that does not participate in sequential focus navigation. ```html - + ``` #### Inapplicable Example 10 -Non-widget element that does not participate in sequential focus navigation. - -```html - -``` - -#### Inapplicable Example 11 - Autocomplete attribute contains no tokens. ```html ``` + +[explicit role]: #explicit-role 'Definition of explicit role' +[focusable]: #focusable 'Definition of focusable' +[presentational roles conflict resolution]: https://www.w3.org/TR/wai-aria-1.1/#conflict_resolution_presentation_none 'Presentational Roles Conflict Resolution' +[semantic role]: #semantic-role 'Definition of Semantic Role' From 5973183c40167a2ed8d2a44da922c836aebe06b2 Mon Sep 17 00:00:00 2001 From: Jean-Yves Moyen Date: Wed, 26 Feb 2020 15:54:49 +0100 Subject: [PATCH 13/67] Fix examples numbering --- _rules/autocomplete-valid-value-73f2c2.md | 10 +++++----- _rules/form-control-accessible-name-e086e5.md | 2 +- .../links-identical-name-equivalent-purpose-b20e66.md | 4 ++-- 3 files changed, 8 insertions(+), 8 deletions(-) diff --git a/_rules/autocomplete-valid-value-73f2c2.md b/_rules/autocomplete-valid-value-73f2c2.md index d6ccd3e20e..e460f33726 100755 --- a/_rules/autocomplete-valid-value-73f2c2.md +++ b/_rules/autocomplete-valid-value-73f2c2.md @@ -228,7 +228,7 @@ The `input` element has a `type` attribute that is in the `button` state. ``` -#### Inapplicable Example 6 +#### Inapplicable Example 5 The `input` element has a `type` attribute that is in the `hidden` state. @@ -236,7 +236,7 @@ The `input` element has a `type` attribute that is in the `hidden` state. ``` -#### Inapplicable Example 7 +#### Inapplicable Example 6 The `input` element has an HTML `disabled` attribute. @@ -244,7 +244,7 @@ The `input` element has an HTML `disabled` attribute. ``` -#### Inapplicable Example 8 +#### Inapplicable Example 7 The `input` element has an `aria-disabled` attribute with value `true`. @@ -252,7 +252,7 @@ The `input` element has an `aria-disabled` attribute with value `true`. ``` -#### Inapplicable Example 9 +#### Inapplicable Example 8 Non-widget element that does not participate in sequential focus navigation. @@ -260,7 +260,7 @@ Non-widget element that does not participate in sequential focus navigation. ``` -#### Inapplicable Example 10 +#### Inapplicable Example 9 Autocomplete attribute contains no tokens. diff --git a/_rules/form-control-accessible-name-e086e5.md b/_rules/form-control-accessible-name-e086e5.md index b3034f2a77..86da012f81 100755 --- a/_rules/form-control-accessible-name-e086e5.md +++ b/_rules/form-control-accessible-name-e086e5.md @@ -203,7 +203,7 @@ Role has [explicitly](#explicit-role) been set to something that isn't a form fi ``` -#### Inapplicable Example 4 +#### Inapplicable Example 3 Option inherits from input, but has a required context role of listbox which inherits from select. We should therefore not consider option as applicable. diff --git a/_rules/links-identical-name-equivalent-purpose-b20e66.md b/_rules/links-identical-name-equivalent-purpose-b20e66.md index dff770eba0..2de7c3eaad 100755 --- a/_rules/links-identical-name-equivalent-purpose-b20e66.md +++ b/_rules/links-identical-name-equivalent-purpose-b20e66.md @@ -382,7 +382,7 @@ These `span` elements do not have a [semantic role][] of link. ``` -#### Inapplicable Example 5 +#### Inapplicable Example 4 These links have empty [accessible names][accessible name]. @@ -390,7 +390,7 @@ These links have empty [accessible names][accessible name]. ``` -#### Inapplicable Example 6 +#### Inapplicable Example 5 These image links have empty [accessible names][accessible name]. From a9dd9cce6d0296e491d24b71a62b96a44eb8ea9a Mon Sep 17 00:00:00 2001 From: Jean-Yves Moyen Date: Wed, 26 Feb 2020 16:25:02 +0100 Subject: [PATCH 14/67] Handle presentational role conflict resolution --- _rules/descriptive-link-5effbb.md | 17 ++++++++++++++++- 1 file changed, 16 insertions(+), 1 deletion(-) diff --git a/_rules/descriptive-link-5effbb.md b/_rules/descriptive-link-5effbb.md index 2206b45319..6860319462 100755 --- a/_rules/descriptive-link-5effbb.md +++ b/_rules/descriptive-link-5effbb.md @@ -16,6 +16,7 @@ accessibility_requirements: passed: further testing needed inapplicable: further testing needed input_aspects: + - Accessibility Tree - DOM Tree - CSS Styling - Language @@ -45,7 +46,8 @@ The [accessible name][] of each target element together with its [programmatical ## Accessibility Support -_There are no major accessibility support issues known for this rule._ +- There exist popular web browsers and assistive technologies which do not correctly implement [Presentational Roles Conflict Resolution][]. +- Some browsers expose elements which are [focusable][] but have an `aria-hidden="true"` attribute, while some hide them. ## Background @@ -294,6 +296,16 @@ The [accessible name][] (from the link's text) does not describe the purpose of ``` +#### Failed Example 7 + +This `a` element has an [explicit role][] of `none`. However, it is [focusable][] (by default). Thus it has a [semantic role][] of `link` due to [Presentational Roles Conflict Resolution][]. Its [accessible name][] (from the link's text), together with the absence of [programmatically determined link context][], does not describe the purpose of the link. + +```html +More + +

This product consists of several web pages.

+``` + ### Inapplicable #### Inapplicable Example 1 @@ -323,8 +335,11 @@ An `a` element without the [semantic role][] `link`. ``` [accessible name]: #accessible-name 'Definition of accessible name' +[explicit role]: #explicit-role 'Definition of explicit role' +[focusable]: #focusable 'Definition of focusable' [included in the accessibility tree]: #included-in-the-accessibility-tree 'Definition of included in the accessibility tree' [link]: https://www.w3.org/TR/wai-aria/#link +[presentational roles conflict resolution]: https://www.w3.org/TR/wai-aria-1.1/#conflict_resolution_presentation_none 'Presentational Roles Conflict Resolution' [programmatically determined link context]: #programmatically-determined-link-context 'Definition of programmatically determined link context' [semantic role]: #semantic-role 'Definition of semantic role' [whitespace]: #whitespace 'Definition of whitespace' From fec1f63d669e4f7478b5af951fc685257013f5ba Mon Sep 17 00:00:00 2001 From: Jean-Yves Moyen Date: Wed, 26 Feb 2020 16:28:33 +0100 Subject: [PATCH 15/67] Handle presentational role conflict resolution --- _rules/form-control-label-descriptive-cc0f0a.md | 17 ++++++++++++++++- 1 file changed, 16 insertions(+), 1 deletion(-) diff --git a/_rules/form-control-label-descriptive-cc0f0a.md b/_rules/form-control-label-descriptive-cc0f0a.md index 3210e2feec..829ea74ec7 100755 --- a/_rules/form-control-label-descriptive-cc0f0a.md +++ b/_rules/form-control-label-descriptive-cc0f0a.md @@ -16,6 +16,7 @@ accessibility_requirements: passed: further testing needed inapplicable: further testing needed input_aspects: + - Accessibility Tree - DOM Tree - CSS Styling - Language @@ -71,7 +72,8 @@ Each test target, together with its [visual context][], describes the purpose of ## Accessibility Support -_There are no major accessibility support issues known for this rule._ +- There exist popular web browsers and assistive technologies which do not correctly implement [Presentational Roles Conflict Resolution][]. +- Some browsers expose elements which are [focusable][] but have an `aria-hidden="true"` attribute, while some hide them. ## Background @@ -219,6 +221,16 @@ Both the `div` and the `span` elements are [programmatic labels][programmatic la ``` +#### Failed Example 6 + +This `input` element has an [explicit role][] of `none`. However, it is [focusable][] (by default). Thus it has a [semantic role][] of `textbox` due to [Presentational Roles Conflict Resolution][]. The `label` element is its [programmatic label][] but does not describe it. + +```html + + + +``` + ### Inapplicable #### Inapplicable Example 1 @@ -267,8 +279,11 @@ The `span` element is not a [programmatic label][] of any element. [abstract]: https://www.w3.org/TR/wai-aria/#abstract_roles 'List of abstract roles' [accessible name]: #accessible-name 'Definition of accessible name' [aria11]: https://www.w3.org/TR/wai-aria-1.1/ 'Accessible Rich Internet Applications 1.1' +[explicit role]: #explicit-role 'Definition of explicit role' +[focusable]: #focusable 'Definition of focusable' [included in the accessibility tree]: #included-in-the-accessibility-tree 'Definition of included in the accessibility tree' [label]: https://www.w3.org/TR/WCAG21/#dfn-labels 'Definition of label' +[presentational roles conflict resolution]: https://www.w3.org/TR/wai-aria-1.1/#conflict_resolution_presentation_none 'Presentational Roles Conflict Resolution' [programmatic label]: #programmatic-label 'Definition of programmatic label' [sc246]: https://www.w3.org/WAI/WCAG21/#headings-and-labels.html 'Success Criterion 2.4.6: Heading and Labels' [sc253]: https://www.w3.org/WAI/WCAG21/label-in-name 'Success Criterion 2.5.3: Label in Name' From eaa5580a3990d6f27cabe71f6b47fefce2e2f159 Mon Sep 17 00:00:00 2001 From: Jean-Yves Moyen Date: Wed, 26 Feb 2020 16:41:52 +0100 Subject: [PATCH 16/67] Handle presentational role conflict resolution --- _rules/heading-accessible-name-ffd0e9.md | 24 +++++++++++++++++++++--- 1 file changed, 21 insertions(+), 3 deletions(-) diff --git a/_rules/heading-accessible-name-ffd0e9.md b/_rules/heading-accessible-name-ffd0e9.md index cfce82ed5e..3a96efc4f2 100755 --- a/_rules/heading-accessible-name-ffd0e9.md +++ b/_rules/heading-accessible-name-ffd0e9.md @@ -16,6 +16,7 @@ accessibility_requirements: passed: further testing needed inapplicable: further testing needed input_aspects: + - Accessibility Tree - DOM Tree - CSS Styling acknowledgements: @@ -37,10 +38,13 @@ _There are currently no assumptions._ ## Accessibility Support -Some assistive technologies may hide headings with empty [accessible name][] from the users. This depends both on the user agent and how the [accessible name][] was computed (the [accessible name and description computation][] is not clear concerning which characters should be trimmed) and of the assistive technology itself. Hence, there are cases where the outcome of this rule is _failed_, but users of certain assistive technology and browser combinations will not experience an issue. +- Some assistive technologies may hide headings with empty [accessible name][] from the users. This depends both on the user agent and how the [accessible name][] was computed (the [accessible name and description computation][] is not clear concerning which characters should be trimmed) and of the assistive technology itself. Hence, there are cases where the outcome of this rule is _failed_, but users of certain assistive technology and browser combinations will not experience an issue. **Note:** Completely empty headings (`

`) seem to be consistently ignored by assistive technologies. However, they fail [Technique H42: Using h1-h6 to identify headings][tech h42] (by using heading markup for content which is not heading). Moreover, they may be rendered on screen (by breaking flow content, or because of custom styling), thus causing concerns for sighted users. Therefore, this rule also fails on these. +- There exist popular web browsers and assistive technologies which do not correctly implement [Presentational Roles Conflict Resolution][]. +- Some browsers expose elements which are [focusable][] but have an `aria-hidden="true"` attribute, while some hide them. + ## Background - [Understanding Success Criterion 1.3.1: Info and Relationships][usc131] @@ -137,6 +141,15 @@ This `div` element with a [semantic role][] of `heading` has an empty [accessibl
``` +#### Failed Example 6 + +This `h1` element has an [explicit role][] of `none`. However, the [global][] [property][] `aria-labelleby` is specified. Thus it has a [semantic role][] of `heading` due to [Presentational Roles Conflict Resolution][]. It has an empty [accessible name][] given by its `aria-labelledby` attribute. + +```html + +

ACT rules

+``` + ### Inapplicable #### Inapplicable Example 1 @@ -157,10 +170,15 @@ This `h1` element is not [included in the accessibility tree][]. [accessible name]: #accessible-name 'Definition of accessible name' [accessible name and description computation]: https://www.w3.org/TR/accname -[marked as decorative]: #marked-as-decorative 'Definition of marked as decorative' +[explicit role]: #explicit-role 'Definition of explicit role' +[focusable]: #focusable 'Definition of focusable' +[global]: https://www.w3.org/TR/wai-aria-1.1/#global_states 'Definition of Global ARIA States and Properties' [included in the accessibility tree]: #included-in-the-accessibility-tree 'Definition of included in the accessibility tree' +[marked as decorative]: #marked-as-decorative 'Definition of marked as decorative' +[presentational roles conflict resolution]: https://www.w3.org/TR/wai-aria-1.1/#conflict_resolution_presentation_none 'Presentational Roles Conflict Resolution' +[property]: https://www.w3.org/TR/wai-aria/#dfn-property 'Definition of ARIA Property' +[semantic role]: #semantic-role 'Definition of semantic role' [tech h42]: https://www.w3.org/WAI/WCAG21/Techniques/html/H42 'Technique H42: Using h1-h6 to identify headings' [usc131]: https://www.w3.org/WAI/WCAG21/Understanding/info-and-relationships.html 'Understanding Success Criterion 1.3.1: Info and Relationships' [usc246]: https://www.w3.org/WAI/WCAG21/Understanding/headings-and-labels.html 'Understanding Success Criterion 2.4.6: Headings and Labels' -[semantic role]: #semantic-role 'Definition of semantic role' [visible]: #visible 'Definition of visible' From d9fd8018bf1ef96cdcd98a1eb89f9dc2416b8fcd Mon Sep 17 00:00:00 2001 From: Jean-Yves Moyen Date: Wed, 26 Feb 2020 16:48:02 +0100 Subject: [PATCH 17/67] Typo --- _rules/heading-accessible-name-ffd0e9.md | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/_rules/heading-accessible-name-ffd0e9.md b/_rules/heading-accessible-name-ffd0e9.md index 3a96efc4f2..78dd18d4f8 100755 --- a/_rules/heading-accessible-name-ffd0e9.md +++ b/_rules/heading-accessible-name-ffd0e9.md @@ -143,7 +143,7 @@ This `div` element with a [semantic role][] of `heading` has an empty [accessibl #### Failed Example 6 -This `h1` element has an [explicit role][] of `none`. However, the [global][] [property][] `aria-labelleby` is specified. Thus it has a [semantic role][] of `heading` due to [Presentational Roles Conflict Resolution][]. It has an empty [accessible name][] given by its `aria-labelledby` attribute. +This `h1` element has an [explicit role][] of `none`. However, the [global][] [property][] `aria-labelledby` is specified. Thus it has a [semantic role][] of `heading` due to [Presentational Roles Conflict Resolution][]. It has an empty [accessible name][] given by its `aria-labelledby` attribute. ```html From 66c15d982a7d0c7216ea10ff108e379405186923 Mon Sep 17 00:00:00 2001 From: Jean-Yves Moyen Date: Thu, 27 Feb 2020 12:00:29 +0100 Subject: [PATCH 18/67] Handle presentational role conflict resolution --- _rules/heading-descriptive-b49b2e.md | 18 +++++++++++++++++- 1 file changed, 17 insertions(+), 1 deletion(-) mode change 100644 => 100755 _rules/heading-descriptive-b49b2e.md diff --git a/_rules/heading-descriptive-b49b2e.md b/_rules/heading-descriptive-b49b2e.md old mode 100644 new mode 100755 index 78cc92e8bb..17929f84b5 --- a/_rules/heading-descriptive-b49b2e.md +++ b/_rules/heading-descriptive-b49b2e.md @@ -11,6 +11,7 @@ accessibility_requirements: passed: further testing needed inapplicable: further testing needed input_aspects: + - Accessibility Tree - DOM Tree - CSS Styling - Language @@ -39,7 +40,8 @@ This rule assumes that the language of each test target can be correctly determi ## Accessibility Support -_There are no major accessibility support issues known for this rule._ +- There exist popular web browsers and assistive technologies which do not correctly implement [Presentational Roles Conflict Resolution][]. +- Some browsers expose elements which are [focusable][] but have an `aria-hidden="true"` attribute, while some hide them. ## Background @@ -191,6 +193,15 @@ Heading marked up with `h1` element that does not describe the topic or purpose ``` +#### Failed Example 5 + +This `h1` element has an [explicit role][] of `none`. However, the [global][] [property][] `aria-label` is specified. Thus it has a [semantic role][] of `heading` due to [Presentational Roles Conflict Resolution][]. It does not describes the topic of its [section of the content][]. + +```html +

Weather

+

We are open Monday through Friday from 10 to 16

+``` + ### Inapplicable #### Inapplicable Example 1 @@ -234,7 +245,12 @@ Empty heading marked up with `role="heading"` is not [visible][]. ``` +[explicit role]: #explicit-role 'Definition of explicit role' +[focusable]: #focusable 'Definition of focusable' +[global]: https://www.w3.org/TR/wai-aria-1.1/#global_states 'Definition of Global ARIA States and Properties' [included in the accessibility tree]: #included-in-the-accessibility-tree 'Definition of included in the accessibility tree' +[presentational roles conflict resolution]: https://www.w3.org/TR/wai-aria-1.1/#conflict_resolution_presentation_none 'Presentational Roles Conflict Resolution' +[property]: https://www.w3.org/TR/wai-aria/#dfn-property 'Definition of ARIA Property' [section of the content]: #section-of-content 'Definition of section of content' [semantic role]: #semantic-role 'Definition of semantic role' [visible]: #visible 'Definition of visible' From eed6c2648294f13cc8556cb84905366f77bd44fe Mon Sep 17 00:00:00 2001 From: Jean-Yves Moyen Date: Thu, 27 Feb 2020 15:11:29 +0100 Subject: [PATCH 19/67] Handle presentational role conflict resolution --- _rules/image-accessible-name-23a2a8.md | 29 ++++++++++++++++++++------ 1 file changed, 23 insertions(+), 6 deletions(-) diff --git a/_rules/image-accessible-name-23a2a8.md b/_rules/image-accessible-name-23a2a8.md index 0bd3d7f6dd..151a3b8017 100755 --- a/_rules/image-accessible-name-23a2a8.md +++ b/_rules/image-accessible-name-23a2a8.md @@ -21,6 +21,7 @@ accessibility_requirements: passed: further testing needed inapplicable: further testing needed input_aspects: + - Accessibility Tree - DOM Tree - CSS Styling acknowledgements: @@ -39,7 +40,7 @@ The rule applies to HTML `img` elements or any HTML element with the [semantic r ## Expectation -Each target element has an [accessible name][] that is not empty (`""`), or is [marked as decorative][]. +Each target element has an [accessible name][] that is not empty (`""`), or has a [semantic role][] of `none` or `presentation`. **Note:** Testing that the [accessible name][] is descriptive is not part of this rule and must be tested separately. @@ -51,6 +52,9 @@ _There are currently no assumptions._ - There is a known combination of a popular browser and assistive technology that does not by default support `title` as an [accessible name][]. - There are several popular browsers that do not treat images with empty `alt` attribute as having a role of `presentation` but instead add the `img` element to the accessibility tree with a [semantic role][] of either `img` or `graphic`. +- There exist popular web browsers and assistive technologies which do not correctly implement [Presentational Roles Conflict Resolution][]. +- Some browsers expose elements which are [focusable][] but have an `aria-hidden="true"` attribute, while some hide them. +- Images can have their role set to `presentation` through an empty `alt` attribute. [Presentational Roles Conflict Resolution][] does not specifies what to do if such an image is [focusable][] (it only specifies what to do in case of explicit `role="none"` or `role="presentation"`). Some browsers expose these images and some don't. ## Background @@ -102,7 +106,7 @@ The HTML `img` element has an [accessible name][] given by a `title` attribute, #### Passed Example 5 -The HTML `img` element is [marked as decorative][] through an empty `alt` attribute. +The HTML `img` element has a [semantic role][] of `presentation` through an empty `alt` attribute. ```html @@ -110,7 +114,7 @@ The HTML `img` element is [marked as decorative][] through an empty `alt` attrib #### Passed Example 6 -The HTML `img` element is [marked as decorative][] through `role="presentation"`. +The HTML `img` element has a [semantic role][] of `presentation` through [explicit role][]. ```html @@ -118,7 +122,7 @@ The HTML `img` element is [marked as decorative][] through `role="presentation"` #### Passed Example 7 -The HTML `img` element is [marked as decorative][] through `role="none"`. +The HTML `img` element has a [semantic role][] of `none` through [explicit role][]. ```html @@ -136,7 +140,7 @@ The HTML `img` element has an [accessible name][] that is not empty. #### Failed Example 1 -The HTML `img` element is not [marked as decorative][] and has an empty [accessible name][]. +The HTML `img` element with [implicit role][] of `img` has an empty [accessible name][]. ```html @@ -152,7 +156,7 @@ The element with role of `img` has an empty [accessible name][]. #### Failed Example 3 -The `img` element inside a `div` positioned off screen has an empty [accessible name][] and is not [marked as decorative][]. +The `img` element inside a `div` positioned off screen has an empty [accessible name][] and an [implicit role][] of `img`. ```html
@@ -166,6 +170,14 @@ The HTML `img` element has an empty [accessible name][]. ``` +#### Failed Example 5 + +This `img` element has an [explicit role][] of `none`. However, it is [focusable][] due to the `tabindex` attribute. Thus it has a [semantic role][] of `img` due to [Presentational Roles Conflict Resolution][]. It does not have an accessible name. + +```html + +``` + ### Inapplicable #### Inapplicable Example 1 @@ -203,7 +215,12 @@ The element is not an `img` element. ``` [accessible name]: #accessible-name 'Definition of accessible name' +[explicit role]: #explicit-role 'Definition of explicit role' +[focusable]: #focusable 'Definition of focusable' +[global]: https://www.w3.org/TR/wai-aria-1.1/#global_states 'Definition of Global ARIA States and Properties' [marked as decorative]: #marked-as-decorative 'Definition of marked as decorative' [included in the accessibility tree]: #included-in-the-accessibility-tree 'Definition of included in the accessibility tree' +[presentational roles conflict resolution]: https://www.w3.org/TR/wai-aria-1.1/#conflict_resolution_presentation_none 'Presentational Roles Conflict Resolution' +[property]: https://www.w3.org/TR/wai-aria/#dfn-property 'Definition of ARIA Property' [semantic role]: #semantic-role 'Definition of semantic role' [whitespace]: #whitespace 'Definition of whitespace' From 0ed417d362de3925d7d2f160201d702ac8dcfa7b Mon Sep 17 00:00:00 2001 From: Jean-Yves Moyen Date: Thu, 27 Feb 2020 15:20:43 +0100 Subject: [PATCH 20/67] Clean up link list --- _rules/image-accessible-name-23a2a8.md | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/_rules/image-accessible-name-23a2a8.md b/_rules/image-accessible-name-23a2a8.md index 151a3b8017..babdd9cbc7 100755 --- a/_rules/image-accessible-name-23a2a8.md +++ b/_rules/image-accessible-name-23a2a8.md @@ -218,7 +218,7 @@ The element is not an `img` element. [explicit role]: #explicit-role 'Definition of explicit role' [focusable]: #focusable 'Definition of focusable' [global]: https://www.w3.org/TR/wai-aria-1.1/#global_states 'Definition of Global ARIA States and Properties' -[marked as decorative]: #marked-as-decorative 'Definition of marked as decorative' +[implicit role]: #implicit-role 'Definition of implicit role' [included in the accessibility tree]: #included-in-the-accessibility-tree 'Definition of included in the accessibility tree' [presentational roles conflict resolution]: https://www.w3.org/TR/wai-aria-1.1/#conflict_resolution_presentation_none 'Presentational Roles Conflict Resolution' [property]: https://www.w3.org/TR/wai-aria/#dfn-property 'Definition of ARIA Property' From fbd3f7f06f3b02e8d0c923d9f7ee14c0c71ef022 Mon Sep 17 00:00:00 2001 From: Jean-Yves Moyen Date: Thu, 27 Feb 2020 15:36:29 +0100 Subject: [PATCH 21/67] Remove imprecise def of marked as decorative --- _rules/heading-accessible-name-ffd0e9.md | 3 +-- _rules/image-accessible-name-23a2a8.md | 2 +- _rules/link-accessible-name-c487ae.md | 2 +- ...rs-attribute-refer-to-data-cells-a25f45.md | 3 +-- pages/glossary/marked-as-decorative.md | 20 ------------------- 5 files changed, 4 insertions(+), 26 deletions(-) mode change 100644 => 100755 _rules/table-headers-attribute-refer-to-data-cells-a25f45.md delete mode 100755 pages/glossary/marked-as-decorative.md diff --git a/_rules/heading-accessible-name-ffd0e9.md b/_rules/heading-accessible-name-ffd0e9.md index 78dd18d4f8..8483bfd36e 100755 --- a/_rules/heading-accessible-name-ffd0e9.md +++ b/_rules/heading-accessible-name-ffd0e9.md @@ -109,7 +109,7 @@ This `h1` element has an empty [accessible name][] given by its `aria-labelledby #### Failed Example 2 -This `h1` element has an empty [accessible name][] because the `img` element is [marked as decorative][] through its [semantic role][] of `presentation`, and thus does not provide an [accessible name][] to the `h1` element. +This `h1` element has an empty [accessible name][] because the `img` element has a [semantic role][] of `presentation`, and thus does not provide an [accessible name][] to the `h1` element. Note that the `alt` attribute does not trigger [Presentational Roles Conflict Resolution][] because it is not an ARIA attribute. ```html

ACT rules

@@ -174,7 +174,6 @@ This `h1` element is not [included in the accessibility tree][]. [focusable]: #focusable 'Definition of focusable' [global]: https://www.w3.org/TR/wai-aria-1.1/#global_states 'Definition of Global ARIA States and Properties' [included in the accessibility tree]: #included-in-the-accessibility-tree 'Definition of included in the accessibility tree' -[marked as decorative]: #marked-as-decorative 'Definition of marked as decorative' [presentational roles conflict resolution]: https://www.w3.org/TR/wai-aria-1.1/#conflict_resolution_presentation_none 'Presentational Roles Conflict Resolution' [property]: https://www.w3.org/TR/wai-aria/#dfn-property 'Definition of ARIA Property' [semantic role]: #semantic-role 'Definition of semantic role' diff --git a/_rules/image-accessible-name-23a2a8.md b/_rules/image-accessible-name-23a2a8.md index babdd9cbc7..1e5a9b16fe 100755 --- a/_rules/image-accessible-name-23a2a8.md +++ b/_rules/image-accessible-name-23a2a8.md @@ -3,7 +3,7 @@ id: 23a2a8 name: Image has accessible name rule_type: atomic description: | - This rule checks that each image that is not marked as decorative, has an accessible name. + This rule checks that each image is either marked as decorative, or has an accessible name. accessibility_requirements: wcag20:1.1.1: # Non-Text Content forConformance: true diff --git a/_rules/link-accessible-name-c487ae.md b/_rules/link-accessible-name-c487ae.md index 033abd0413..d7a644b966 100755 --- a/_rules/link-accessible-name-c487ae.md +++ b/_rules/link-accessible-name-c487ae.md @@ -186,7 +186,7 @@ Image link with empty [accessible name][]. #### Failed Example 2 -Image link where image is [marked as decorative](#marked-as-decorative). +Image link where image has a role of `presentation` through empty `alt`. ```html diff --git a/_rules/table-headers-attribute-refer-to-data-cells-a25f45.md b/_rules/table-headers-attribute-refer-to-data-cells-a25f45.md old mode 100644 new mode 100755 index 87aa2eb118..ce5bfb307e --- a/_rules/table-headers-attribute-refer-to-data-cells-a25f45.md +++ b/_rules/table-headers-attribute-refer-to-data-cells-a25f45.md @@ -267,7 +267,7 @@ There is no `headers` attribute. #### Inapplicable Example 2 -The `table` has a `role="presentation"` and thus is [decorative][]. +The `table` has a `role="presentation"` and thus is not [included in the accessibility tree][]. ```html @@ -338,7 +338,6 @@ The `table` is not [included in the accessibility tree][]. [included in the accessibility tree]: #included-in-the-accessibility-tree 'Definition of included in the accessibility tree' [visible]: #visible 'Definition of visible' -[decorative]: #marked-as-decorative 'Definition of marked as decorative' [`cell`]: https://html.spec.whatwg.org/#concept-cell 'Definition of cell' [semantic role]: #semantic-role 'Definition of semantic role' [a set of space separated ids]: https://html.spec.whatwg.org/#set-of-space-separated-tokens 'Space separated tokens' diff --git a/pages/glossary/marked-as-decorative.md b/pages/glossary/marked-as-decorative.md deleted file mode 100755 index c2d9250ccf..0000000000 --- a/pages/glossary/marked-as-decorative.md +++ /dev/null @@ -1,20 +0,0 @@ ---- -title: Marked as Decorative -key: marked-as-decorative -unambiguous: true -objective: true ---- - -An element is _marked as decorative_ if it has a [semantic role][] of `none` or `presentation`. - -The most common ways of marking an element as decorative are to explicitly set `role="none"`, or `role="presentation"`, or, for images, `alt=""`. - -**Note:** an element should only be marked as decorative if it is [pure decoration](https://www.w3.org/TR/WCAG21/#dfn-pure-decoration) and removing it does not cause a loss of information to the user. - -**Note:** The [semantic role][] of `none` has been introduced in ARIA 1.1 and has less support than the synonym [role][semantic role] of `presentation`. Therefore, authors are encouraged to use `role="none presentation"` to keep the fallback option ([WAI-ARIA description of `presentation` role](https://www.w3.org/TR/wai-aria-1.1/#presentation)). - -#### Accessibility Support - -Images with an empty `alt` attribute should have a role set to `presentation`, according to the [HTML Accessibility API Mapping (work in progress)](https://www.w3.org/TR/html-aam-1.0/#html-element-role-mappings). However, there are several popular browsers that do not treat images with empty `alt` attribute as having a role of `presentation` but instead add the `img` element to the accessibility tree with a role of either `img` or `graphic`. - -[semantic role]: #semantic-role 'Definition of semantic role' From fb7351d2c593322a9ec446da9f1008ad3beec8d1 Mon Sep 17 00:00:00 2001 From: Jean-Yves Moyen Date: Thu, 27 Feb 2020 15:48:29 +0100 Subject: [PATCH 22/67] Handle presentational role conflict resolution --- ...mage-filename-as-accessible-name-9eb3f6.md | 20 ++++++++++++++++++- 1 file changed, 19 insertions(+), 1 deletion(-) diff --git a/_rules/image-filename-as-accessible-name-9eb3f6.md b/_rules/image-filename-as-accessible-name-9eb3f6.md index a8af195a53..91fc5c7104 100755 --- a/_rules/image-filename-as-accessible-name-9eb3f6.md +++ b/_rules/image-filename-as-accessible-name-9eb3f6.md @@ -21,6 +21,7 @@ accessibility_requirements: passed: further testing needed inapplicable: further testing needed input_aspects: + - Accessibility Tree - DOM Tree - CSS Styling - Language @@ -43,7 +44,8 @@ This rule assumes that the language of each test target can be correctly determi ## Accessibility Support -_There are no major accessibility support issues known for this rule._ +- There exist popular web browsers and assistive technologies which do not correctly implement [Presentational Roles Conflict Resolution][]. +- Some browsers expose elements which are [focusable][] but have an `aria-hidden="true"` attribute, while some hide them. ## Background @@ -98,6 +100,16 @@ The `input` element with a `type` of `image` has an [accessible name][] that mat ``` +#### Failed Example 3 + +This `img` element has an [explicit role][] of `none`. However, the [global][] [property][] `aria-label` is specified. Thus it has a [semantic role][] of `img` due to [Presentational Roles Conflict Resolution][]. Its [accessible name][] is not descriptive due to the redundant file extension. + +```html + + + +``` + ### Inapplicable #### Inapplicable Example 1 @@ -145,4 +157,10 @@ The `img` element's `alt` attribute matches the filename but is overridden by th ``` [accessible name]: #accessible-name 'Definition of accessible name' +[explicit role]: #explicit-role 'Definition of Explicit Role' +[focusable]: #focusable 'Definition of focusable' +[global]: https://www.w3.org/TR/wai-aria-1.1/#global_states 'Definition of Global ARIA States and Properties' [included in the accessibility tree]: #included-in-the-accessibility-tree 'Definition of included in the accessibility tree' +[presentational roles conflict resolution]: https://www.w3.org/TR/wai-aria-1.1/#conflict_resolution_presentation_none 'Presentational Roles Conflict Resolution' +[property]: https://www.w3.org/TR/wai-aria/#dfn-property 'Definition of ARIA Property' +[semantic role]: #semantic-role 'Definition of Semantic Role' From 28da7d9ee085205b30067b2b77b4d43bb3db7886 Mon Sep 17 00:00:00 2001 From: Jean-Yves Moyen Date: Thu, 27 Feb 2020 15:54:58 +0100 Subject: [PATCH 23/67] Handle presentational role conflict resolution --- ...header-cells-refer-to-data-cells-d0f69e.md | 32 +++++++++++++++++-- 1 file changed, 30 insertions(+), 2 deletions(-) mode change 100644 => 100755 _rules/table-header-cells-refer-to-data-cells-d0f69e.md diff --git a/_rules/table-header-cells-refer-to-data-cells-d0f69e.md b/_rules/table-header-cells-refer-to-data-cells-d0f69e.md old mode 100644 new mode 100755 index f62fbbcc54..7afa2e4e14 --- a/_rules/table-header-cells-refer-to-data-cells-d0f69e.md +++ b/_rules/table-header-cells-refer-to-data-cells-d0f69e.md @@ -11,6 +11,7 @@ accessibility_requirements: passed: further testing needed inapplicable: further testing needed input_aspects: + - Accessibility Tree - DOM Tree acknowledgements: authors: @@ -36,7 +37,7 @@ Each target element is [assigned][] to at least one element with a [semantic rol ## Assumptions -This rule assumes that table header cells have a relationship conveyed through presentation with other cells within the same table. +- This rule assumes that table header cells have a relationship conveyed through presentation with other cells within the same table. **Note:** This assumption helps exclude edge cases like: @@ -45,7 +46,9 @@ This rule assumes that table header cells have a relationship conveyed through p ## Accessibility Support -Table markup and header cell association is not well supported by some popular assistive technologies. Passing this rule can still cause issues for users of those assistive technologies. +- Table markup and header cell association is not well supported by some popular assistive technologies. Passing this rule can still cause issues for users of those assistive technologies. +- There exist popular web browsers and assistive technologies which do not correctly implement [Presentational Roles Conflict Resolution][]. +- Some browsers expose elements which are [focusable][] but have an `aria-hidden="true"` attribute, while some hide them. ## Background @@ -219,6 +222,26 @@ The column header ('Col B') does not have an assigned cell within the same `tabl ``` +#### Failed Example 4 + +The column header ("Column 2") has an [explicit role][] of `none`. However, the [global][] [property][] `aria-label` is specified. Thus it has a [semantic role][] of `columnheader` due to [Presentational Roles Conflict Resolution][]. It does not have an assigned cell within the same `table` element. + +```html +
+ + + + + + + + + + + +
Column 1Column 2
15%
+``` + ### Inapplicable #### Inapplicable Example 1 @@ -325,3 +348,8 @@ The only element with a header [role][semantic role] is part of a table which is [grid]: https://www.w3.org/TR/wai-aria-1.1/#grid 'ARIA grid role' [columnheader]: https://www.w3.org/TR/wai-aria-1.1/#columnheader 'ARIA columnheader role' [rowheader]: https://www.w3.org/TR/wai-aria-1.1/#rowheader 'ARIA rowheader role' +[explicit role]: #explicit-role 'Definition of Explicit Role' +[focusable]: #focusable 'Definition of focusable' +[global]: https://www.w3.org/TR/wai-aria-1.1/#global_states 'Definition of Global ARIA States and Properties' +[presentational roles conflict resolution]: https://www.w3.org/TR/wai-aria-1.1/#conflict_resolution_presentation_none 'Presentational Roles Conflict Resolution' +[property]: https://www.w3.org/TR/wai-aria/#dfn-property 'Definition of ARIA Property' From 72c67afe6684a0d58f9be5fc87698ae0fd55cef9 Mon Sep 17 00:00:00 2001 From: Jean-Yves Moyen Date: Fri, 28 Feb 2020 09:41:42 +0100 Subject: [PATCH 24/67] Handle presentational role conflict resolution --- _rules/text-contrast-afw4f7.md | 25 ++++++++++++++++++++----- 1 file changed, 20 insertions(+), 5 deletions(-) mode change 100644 => 100755 _rules/text-contrast-afw4f7.md diff --git a/_rules/text-contrast-afw4f7.md b/_rules/text-contrast-afw4f7.md old mode 100644 new mode 100755 index 9e918b582d..ed875d0fb8 --- a/_rules/text-contrast-afw4f7.md +++ b/_rules/text-contrast-afw4f7.md @@ -19,6 +19,7 @@ accessibility_requirements: inapplicable: further testing needed input_aspects: + - Accessibility Tree - DOM Tree - CSS Styling - Language @@ -58,7 +59,9 @@ For each test target, the [highest possible contrast](#highest-possible-contrast ## Accessibility Support -Different browsers have different levels of support for CSS. This can cause contrast issues in one browser that do not appear in another. Because of that, this rule can produce different results depending on the browser that is used. For example, a text that is positioned using CSS transform may be on a different background in a browser that does not support CSS transform. +- Different browsers have different levels of support for CSS. This can cause contrast issues in one browser that do not appear in another. Because of that, this rule can produce different results depending on the browser that is used. For example, a text that is positioned using CSS transform may be on a different background in a browser that does not support CSS transform. +- There exist popular web browsers and assistive technologies which do not correctly implement [Presentational Roles Conflict Resolution][]. +- Some browsers expose elements which are [focusable][] but have an `aria-hidden="true"` attribute, while some hide them. ## Background @@ -322,13 +325,21 @@ This text is part of a widget because it is a child of a `button` element. #### Inapplicable Example 7 +This `button` element has an [explicit role][] of `none`. However, it is [focusable][] (by default). Thus it has a [semantic role][] of `button` due to [Presentational Roles Conflict Resolution][]. The text is therefore part of a widget because it is a child of an element with a [semantic role][] of `button`. + +```html + +``` + +#### Inapplicable Example 8 + This text is part of a widget because it is a child of an element with the `role` attribute set to `button`. ```html
My button!
``` -#### Inapplicable Example 8 +#### Inapplicable Example 9 This text is part of a label of a [disabled][] widget, because it is in a `label` element that is the label for an `input` element with `type="text"`. @@ -339,7 +350,7 @@ This text is part of a label of a [disabled][] widget, because it is in a `label ``` -#### Inapplicable Example 9 +#### Inapplicable Example 10 This text is part of a label of a [disabled][] widget, because it is in an element that is referenced by `aria-labelledby` from an element with `role="textbox"`. @@ -357,7 +368,7 @@ This text is part of a label of a [disabled][] widget, because it is in an eleme ``` -#### Inapplicable Example 10 +#### Inapplicable Example 11 This text is part of a label of a [disabled][] widget, because it is in a `label` element that is the label for an `input` element in a `fieldset` element with the `disabled` attribute. @@ -370,7 +381,7 @@ This text is part of a label of a [disabled][] widget, because it is in a `label ``` -#### Inapplicable Example 11 +#### Inapplicable Example 12 This text is part of a label of a [disabled][] widget, because it is in a `label` element that is the label for an `input` element in an element with `role="group"` with the `aria-disabled="true"` attribute. @@ -387,3 +398,7 @@ This text is part of a label of a [disabled][] widget, because it is in a `label [visible]: #visible 'Definition of visible' [text node]: https://dom.spec.whatwg.org/#text 'Definition of text node' [purely decorative]: https://www.w3.org/TR/WCAG21/#dfn-pure-decoration 'Definition of purely decorative' +[explicit role]: #explicit-role 'Definition of explicit role' +[focusable]: #focusable 'Definition of focusable' +[presentational roles conflict resolution]: https://www.w3.org/TR/wai-aria-1.1/#conflict_resolution_presentation_none 'Presentational Roles Conflict Resolution' +[semantic role]: #semantic-role 'Definition of semantic role' From 6e85759386c26ca479332fa182a5a51152f23ff5 Mon Sep 17 00:00:00 2001 From: Jean-Yves Moyen Date: Fri, 28 Feb 2020 09:57:44 +0100 Subject: [PATCH 25/67] Handle presentational role conflict resolution --- .../visible-label-in-accessible-name-2ee8b8.md | 16 +++++++++++++++- 1 file changed, 15 insertions(+), 1 deletion(-) mode change 100644 => 100755 _rules/visible-label-in-accessible-name-2ee8b8.md diff --git a/_rules/visible-label-in-accessible-name-2ee8b8.md b/_rules/visible-label-in-accessible-name-2ee8b8.md old mode 100644 new mode 100755 index baaf3d53e0..ebde173c97 --- a/_rules/visible-label-in-accessible-name-2ee8b8.md +++ b/_rules/visible-label-in-accessible-name-2ee8b8.md @@ -11,6 +11,7 @@ accessibility_requirements: passed: further testing needed inapplicable: further testing needed input_aspects: + - Accessibility Tree - DOM Tree - CSS Styling acknowledgements: @@ -42,7 +43,8 @@ _There are currently no assumptions_ ## Accessibility Support -There are no major accessibility support issues known for this rule. +- There exist popular web browsers and assistive technologies which do not correctly implement [Presentational Roles Conflict Resolution][]. +- Some browsers expose elements which are [focusable][] but have an `aria-hidden="true"` attribute, while some hide them. ## Background @@ -102,6 +104,14 @@ Mathematical symbols cannot be substituted for text as [explicitly mentioned in Proof of 2×2=4 ``` +#### Failed Example 4 + +This `a` element has an [explicit role][] of `none`. However, it is [focusable][] (by default). Thus it has a [semantic role][] of `link` due to [Presentational Roles Conflict Resolution][]. Its [visible][] label doesn't match its [accessible name][]. + +```html +Next +``` + ### Inapplicable #### Inapplicable Example 1 @@ -145,4 +155,8 @@ Non-text content. ``` [accessible name]: #accessible-name 'Definition of accessible name' +[focusable]: #focusable 'Definition of focusable' +[presentational roles conflict resolution]: https://www.w3.org/TR/wai-aria-1.1/#conflict_resolution_presentation_none 'Presentational Roles Conflict Resolution' [visible]: #visible 'Definition of visible' +[explicit role]: #explicit-role 'Definition of explicit role' +[semantic role]: #semantic-role 'Definition of semantic role' From 1bfd6f84ef56595793b27c1e10f4e5a3dd0a018b Mon Sep 17 00:00:00 2001 From: Jean-Yves Moyen Date: Fri, 28 Feb 2020 14:58:05 +0100 Subject: [PATCH 26/67] Allow img with aria-label --- _rules/image-filename-as-accessible-name-9eb3f6.md | 5 +++++ 1 file changed, 5 insertions(+) diff --git a/_rules/image-filename-as-accessible-name-9eb3f6.md b/_rules/image-filename-as-accessible-name-9eb3f6.md index 91fc5c7104..4443a34c89 100755 --- a/_rules/image-filename-as-accessible-name-9eb3f6.md +++ b/_rules/image-filename-as-accessible-name-9eb3f6.md @@ -28,6 +28,11 @@ input_aspects: acknowledgements: authors: - Bryn Anderson +htmlHintIgnore: + # https://www.npmjs.com/package/htmlhint + # (used with `npm test` to ensure validity of code snippets) + # needs to be skipped so that passes… + - 'alt-require' --- ## Applicability From b1792944df6e01ea1d5e61d6e254a2310e3aa1bb Mon Sep 17 00:00:00 2001 From: Jean-Yves Moyen Date: Fri, 28 Feb 2020 15:00:12 +0100 Subject: [PATCH 27/67] Cleanup --- _rules/form-control-accessible-name-e086e5.md | 0 1 file changed, 0 insertions(+), 0 deletions(-) mode change 100644 => 100755 _rules/form-control-accessible-name-e086e5.md diff --git a/_rules/form-control-accessible-name-e086e5.md b/_rules/form-control-accessible-name-e086e5.md old mode 100644 new mode 100755 From d4f54faa1645c9c8a938c6284f2e6dd17d4c4910 Mon Sep 17 00:00:00 2001 From: Jean-Yves Moyen Date: Fri, 28 Feb 2020 15:53:59 +0100 Subject: [PATCH 28/67] Improve example best practice --- .../aria-state-or-property-permitted-5c01ea.md | 18 ++++++------------ 1 file changed, 6 insertions(+), 12 deletions(-) diff --git a/_rules/aria-state-or-property-permitted-5c01ea.md b/_rules/aria-state-or-property-permitted-5c01ea.md index 20d2aa3e4a..7096a3b298 100755 --- a/_rules/aria-state-or-property-permitted-5c01ea.md +++ b/_rules/aria-state-or-property-permitted-5c01ea.md @@ -115,22 +115,18 @@ WAI-ARIA states and properties with empty value, specified as an empty string, a #### Passed Example 9 -This `li` element has an [explicit role][] of `none`. However, the [global][] [property][] `aria-label` is specified. Thus it has a [semantic role][] of `listitem` due to [Presentational Roles Conflict Resolution][]. The `aria-setsize` [property][] is [supported][] for the `listitem` role. +This `aside` element has an [explicit role][] of `none`. However, the [global][] [property][] `aria-label` is specified. Thus it has a [semantic role][] of `complementary` due to [Presentational Roles Conflict Resolution][]. The `aria-expanded` [state][] is [inherited][] for the `complementary` role. ```html -
    -
  • ACT rules
    • -
+ ``` #### Passed Example 10 -This `li` element has an [explicit role][] of `none`. However, it is [focusable][] due to the `tabindex` attribute (even if it is excluded from sequential focus order). Thus it has a [semantic role][] of `listitem` due to [Presentational Roles Conflict Resolution][]. The `aria-setsize` [property][] is [supported][] for the `listitem` role. +This `aside` element has an [explicit role][] of `none`. However, it is [focusable][] due to the `tabindex` attribute (even if it is excluded from sequential focus order). Thus it has a [semantic role][] of `complementary` due to [Presentational Roles Conflict Resolution][]. The `aria-expanded` [state][] is [supported][] for the `complementary` role. ```html -
    -
  • ACT rules
    • -
+ ``` ### Failed @@ -153,12 +149,10 @@ This `li` element has an [explicit role][] of `none`. However, it is [focusable] #### Failed Example 3 -This `li` element has an [explicit role][], and a [semantic role][], of `none`. The `aria-setsize` [property][] in neither [inherited][], [supported][] nor [required][] for this role. +This `aside` element has an [explicit role][], and a [semantic role][], of `none`. The `aria-expanded` [state][] in neither [inherited][], [supported][] nor [required][] for this role. ```html -
    -
  • ACT rules
    • -
+ ``` ### Inapplicable From e849da0d6637fdc911611fc969a10233e1ac481b Mon Sep 17 00:00:00 2001 From: Jean-Yves Moyen Date: Fri, 28 Feb 2020 16:06:25 +0100 Subject: [PATCH 29/67] Clean up --- _rules/aria-state-or-property-permitted-5c01ea.md | 1 + _rules/autocomplete-valid-value-73f2c2.md | 2 +- 2 files changed, 2 insertions(+), 1 deletion(-) diff --git a/_rules/aria-state-or-property-permitted-5c01ea.md b/_rules/aria-state-or-property-permitted-5c01ea.md index 7096a3b298..1e52d98b1a 100755 --- a/_rules/aria-state-or-property-permitted-5c01ea.md +++ b/_rules/aria-state-or-property-permitted-5c01ea.md @@ -182,4 +182,5 @@ No [WAI-ARIA state or property](https://www.w3.org/TR/wai-aria-1.1/#state_prop_d [property]: https://www.w3.org/TR/wai-aria/#dfn-property 'Definition of ARIA Property' [required]: https://www.w3.org/TR/wai-aria/#requiredState 'Definition of Required ARIA States and Properties' [semantic role]: #semantic-role 'Definition of Semantic Role' +[state]: https://www.w3.org/TR/wai-aria/#dfn-state 'Definition of ARIA State' [supported]: https://www.w3.org/TR/wai-aria/#supportedState 'Definition of Supported ARIA States and Properties' diff --git a/_rules/autocomplete-valid-value-73f2c2.md b/_rules/autocomplete-valid-value-73f2c2.md index e460f33726..192dc3443c 100755 --- a/_rules/autocomplete-valid-value-73f2c2.md +++ b/_rules/autocomplete-valid-value-73f2c2.md @@ -130,7 +130,7 @@ Full length autocomplete terms. #### Passed Example 8 -This `button` element has an [explicit role][] of `none`. However, it is [focusable][] (by default). Thus it has a [semantic role][] of `button` due to [Presentational Roles Conflict Resolution][]. It has a single autocomplete term. +This `input` element has an [explicit role][] of `none`. However, it is [focusable][] (by default). Thus it has a [semantic role][] of `textbox` due to [Presentational Roles Conflict Resolution][]. It has a single autocomplete term. ```html From e2ec3b4d4da7823f208b2f5aa10ee4e43a1b9e3d Mon Sep 17 00:00:00 2001 From: Jean-Yves Moyen Date: Mon, 9 Mar 2020 11:42:20 +0100 Subject: [PATCH 30/67] Update _rules/aria-state-or-property-permitted-5c01ea.md Co-Authored-By: daniel-montalvo <49305434+daniel-montalvo@users.noreply.github.com> --- _rules/aria-state-or-property-permitted-5c01ea.md | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/_rules/aria-state-or-property-permitted-5c01ea.md b/_rules/aria-state-or-property-permitted-5c01ea.md index 1e52d98b1a..1c037640a7 100755 --- a/_rules/aria-state-or-property-permitted-5c01ea.md +++ b/_rules/aria-state-or-property-permitted-5c01ea.md @@ -149,7 +149,7 @@ This `aside` element has an [explicit role][] of `none`. However, it is [focusab #### Failed Example 3 -This `aside` element has an [explicit role][], and a [semantic role][], of `none`. The `aria-expanded` [state][] in neither [inherited][], [supported][] nor [required][] for this role. +This `aside` element has an [explicit role][], and a [semantic role][], of `none`. The `aria-expanded` [state][] is neither [inherited][], [supported][] nor [required][] for this role. ```html From 4bd270dad28f28ae619ec194c0073886c9b54de5 Mon Sep 17 00:00:00 2001 From: Wilco Fiers Date: Sat, 29 Feb 2020 10:28:45 +0100 Subject: [PATCH 31/67] Tweak the assumption of link-acc-name (#1191) * Tweak the assumption of link-acc-name * Update link-accessible-name-c487ae.md * Update link-accessible-name-c487ae.md * Update link-accessible-name-c487ae.md Co-authored-by: Jey Nandakumar --- _rules/link-accessible-name-c487ae.md | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/_rules/link-accessible-name-c487ae.md b/_rules/link-accessible-name-c487ae.md index d7a644b966..e9561046dd 100755 --- a/_rules/link-accessible-name-c487ae.md +++ b/_rules/link-accessible-name-c487ae.md @@ -51,7 +51,7 @@ Each target element has an [accessible name][] that is not empty (`""`). ## Assumptions -- The rule assumes that all links are [user interface components](https://www.w3.org/TR/WCAG21/#dfn-user-interface-components) as defined by WCAG 2. When the link role is used incorrectly, this assumption may not be true. +The rule assumes that all links are [user interface components](https://www.w3.org/TR/WCAG21/#dfn-user-interface-components) as defined by WCAG 2. When the link role is used on elements that do not behave as links, failing this rule might not mean that the success criteria are failed. ## Accessibility Support From 8ad03ff9c464b7aa138a47ea9686326d8ae44a29 Mon Sep 17 00:00:00 2001 From: Jean-Yves Moyen Date: Mon, 2 Mar 2020 09:44:46 +0100 Subject: [PATCH 32/67] Remove duplicate example (#1188) --- _rules/explicit-SVG-image-has-name-7d6734.md | 14 +------------- 1 file changed, 1 insertion(+), 13 deletions(-) mode change 100644 => 100755 _rules/explicit-SVG-image-has-name-7d6734.md diff --git a/_rules/explicit-SVG-image-has-name-7d6734.md b/_rules/explicit-SVG-image-has-name-7d6734.md old mode 100644 new mode 100755 index 668df9208b..fdb1c4758a --- a/_rules/explicit-SVG-image-has-name-7d6734.md +++ b/_rules/explicit-SVG-image-has-name-7d6734.md @@ -116,18 +116,6 @@ The `svg` element has an explicit role of `img` but has no [accessible name][]. #### Failed Example 2 -The `svg` element has an explicit role of `img` but has only whitespace in the `title` element for the [accessible name][]. - -```html -

How many circles are there?

- - - - -``` - -#### Failed Example 3 - The `svg` element has an explicit role of `img`, is included in the accessibility tree, but it has no [accessible name][] because the `title` element is empty. ```html @@ -138,7 +126,7 @@ The `svg` element has an explicit role of `img`, is included in the accessibilit ``` -#### Failed Example 4 +#### Failed Example 3 The `circle` element has an explicit role of `graphics-symbol` but does not have an [accessible name][]. From f44e926751e75da30cedcfd3630baecda8f7e879 Mon Sep 17 00:00:00 2001 From: Kasper Isager Date: Tue, 3 Mar 2020 10:27:18 +0100 Subject: [PATCH 33/67] Remove Kasper as author (#1198) --- _rules/text-contrast-afw4f7.md | 1 - 1 file changed, 1 deletion(-) diff --git a/_rules/text-contrast-afw4f7.md b/_rules/text-contrast-afw4f7.md index ed875d0fb8..72544ceaae 100755 --- a/_rules/text-contrast-afw4f7.md +++ b/_rules/text-contrast-afw4f7.md @@ -27,7 +27,6 @@ input_aspects: acknowledgements: authors: - Brian Bors - - Kasper Isager - Wilco Fiers --- From bb0af2f371c8ef31afe00d3a8b9afad84a99b09d Mon Sep 17 00:00:00 2001 From: Jean-Yves Moyen Date: Tue, 3 Mar 2020 16:10:40 +0100 Subject: [PATCH 34/67] Remove several examples --- _rules/form-control-label-descriptive-cc0f0a.md | 10 ---------- _rules/heading-descriptive-b49b2e.md | 9 --------- .../image-filename-as-accessible-name-9eb3f6.md | 15 --------------- ...s-identical-name-equivalent-purpose-b20e66.md | 11 ----------- ...le-header-cells-refer-to-data-cells-d0f69e.md | 8 +++----- _rules/text-contrast-afw4f7.md | 16 ++++------------ .../visible-label-in-accessible-name-2ee8b8.md | 8 -------- pages/glossary/semantic-role.md | 2 +- 8 files changed, 8 insertions(+), 71 deletions(-) diff --git a/_rules/form-control-label-descriptive-cc0f0a.md b/_rules/form-control-label-descriptive-cc0f0a.md index 829ea74ec7..0b20bd9bfc 100755 --- a/_rules/form-control-label-descriptive-cc0f0a.md +++ b/_rules/form-control-label-descriptive-cc0f0a.md @@ -221,16 +221,6 @@ Both the `div` and the `span` elements are [programmatic labels][programmatic la ``` -#### Failed Example 6 - -This `input` element has an [explicit role][] of `none`. However, it is [focusable][] (by default). Thus it has a [semantic role][] of `textbox` due to [Presentational Roles Conflict Resolution][]. The `label` element is its [programmatic label][] but does not describe it. - -```html - - - -``` - ### Inapplicable #### Inapplicable Example 1 diff --git a/_rules/heading-descriptive-b49b2e.md b/_rules/heading-descriptive-b49b2e.md index 17929f84b5..aca0786c60 100755 --- a/_rules/heading-descriptive-b49b2e.md +++ b/_rules/heading-descriptive-b49b2e.md @@ -193,15 +193,6 @@ Heading marked up with `h1` element that does not describe the topic or purpose ``` -#### Failed Example 5 - -This `h1` element has an [explicit role][] of `none`. However, the [global][] [property][] `aria-label` is specified. Thus it has a [semantic role][] of `heading` due to [Presentational Roles Conflict Resolution][]. It does not describes the topic of its [section of the content][]. - -```html -

Weather

-

We are open Monday through Friday from 10 to 16

-``` - ### Inapplicable #### Inapplicable Example 1 diff --git a/_rules/image-filename-as-accessible-name-9eb3f6.md b/_rules/image-filename-as-accessible-name-9eb3f6.md index 4443a34c89..d142edfcb8 100755 --- a/_rules/image-filename-as-accessible-name-9eb3f6.md +++ b/_rules/image-filename-as-accessible-name-9eb3f6.md @@ -28,11 +28,6 @@ input_aspects: acknowledgements: authors: - Bryn Anderson -htmlHintIgnore: - # https://www.npmjs.com/package/htmlhint - # (used with `npm test` to ensure validity of code snippets) - # needs to be skipped so that passes… - - 'alt-require' --- ## Applicability @@ -105,16 +100,6 @@ The `input` element with a `type` of `image` has an [accessible name][] that mat ``` -#### Failed Example 3 - -This `img` element has an [explicit role][] of `none`. However, the [global][] [property][] `aria-label` is specified. Thus it has a [semantic role][] of `img` due to [Presentational Roles Conflict Resolution][]. Its [accessible name][] is not descriptive due to the redundant file extension. - -```html - - - -``` - ### Inapplicable #### Inapplicable Example 1 diff --git a/_rules/links-identical-name-equivalent-purpose-b20e66.md b/_rules/links-identical-name-equivalent-purpose-b20e66.md index 2de7c3eaad..58d716903c 100755 --- a/_rules/links-identical-name-equivalent-purpose-b20e66.md +++ b/_rules/links-identical-name-equivalent-purpose-b20e66.md @@ -329,17 +329,6 @@ Both links resolve to [same resource][] after redirect, but the redirect is not ``` -#### Failed Example 7 - -The first `a` element has an [explicit role][] of `none`. However, it is [focusable][] (by default). Thus it has a [semantic role][] of `link` due to [Presentational Roles Conflict Resolution][]. Both links have the same [accessible name][] but go to different resources. - -```html - - Follow us - Follow us - -``` - ### Inapplicable #### Inapplicable Example 1 diff --git a/_rules/table-header-cells-refer-to-data-cells-d0f69e.md b/_rules/table-header-cells-refer-to-data-cells-d0f69e.md index 7afa2e4e14..a8540319df 100755 --- a/_rules/table-header-cells-refer-to-data-cells-d0f69e.md +++ b/_rules/table-header-cells-refer-to-data-cells-d0f69e.md @@ -37,7 +37,7 @@ Each target element is [assigned][] to at least one element with a [semantic rol ## Assumptions -- This rule assumes that table header cells have a relationship conveyed through presentation with other cells within the same table. +This rule assumes that table header cells have a relationship conveyed through presentation with other cells within the same table. **Note:** This assumption helps exclude edge cases like: @@ -224,14 +224,14 @@ The column header ('Col B') does not have an assigned cell within the same `tabl #### Failed Example 4 -The column header ("Column 2") has an [explicit role][] of `none`. However, the [global][] [property][] `aria-label` is specified. Thus it has a [semantic role][] of `columnheader` due to [Presentational Roles Conflict Resolution][]. It does not have an assigned cell within the same `table` element. +The column header ("Column 2") has an [explicit role][] of `none`. However, it is [focusable][] due to the `tabindex` attribute. Thus it has a [semantic role][] of `columnheader` due to [Presentational Roles Conflict Resolution][]. It does not have an assigned cell within the same `table` element. ```html - + @@ -350,6 +350,4 @@ The only element with a header [role][semantic role] is part of a table which is [rowheader]: https://www.w3.org/TR/wai-aria-1.1/#rowheader 'ARIA rowheader role' [explicit role]: #explicit-role 'Definition of Explicit Role' [focusable]: #focusable 'Definition of focusable' -[global]: https://www.w3.org/TR/wai-aria-1.1/#global_states 'Definition of Global ARIA States and Properties' [presentational roles conflict resolution]: https://www.w3.org/TR/wai-aria-1.1/#conflict_resolution_presentation_none 'Presentational Roles Conflict Resolution' -[property]: https://www.w3.org/TR/wai-aria/#dfn-property 'Definition of ARIA Property' diff --git a/_rules/text-contrast-afw4f7.md b/_rules/text-contrast-afw4f7.md index 72544ceaae..29a66a1273 100755 --- a/_rules/text-contrast-afw4f7.md +++ b/_rules/text-contrast-afw4f7.md @@ -324,21 +324,13 @@ This text is part of a widget because it is a child of a `button` element. #### Inapplicable Example 7 -This `button` element has an [explicit role][] of `none`. However, it is [focusable][] (by default). Thus it has a [semantic role][] of `button` due to [Presentational Roles Conflict Resolution][]. The text is therefore part of a widget because it is a child of an element with a [semantic role][] of `button`. - -```html - -``` - -#### Inapplicable Example 8 - This text is part of a widget because it is a child of an element with the `role` attribute set to `button`. ```html
My button!
``` -#### Inapplicable Example 9 +#### Inapplicable Example 8 This text is part of a label of a [disabled][] widget, because it is in a `label` element that is the label for an `input` element with `type="text"`. @@ -349,7 +341,7 @@ This text is part of a label of a [disabled][] widget, because it is in a `label ``` -#### Inapplicable Example 10 +#### Inapplicable Example 9 This text is part of a label of a [disabled][] widget, because it is in an element that is referenced by `aria-labelledby` from an element with `role="textbox"`. @@ -367,7 +359,7 @@ This text is part of a label of a [disabled][] widget, because it is in an eleme ``` -#### Inapplicable Example 11 +#### Inapplicable Example 10 This text is part of a label of a [disabled][] widget, because it is in a `label` element that is the label for an `input` element in a `fieldset` element with the `disabled` attribute. @@ -380,7 +372,7 @@ This text is part of a label of a [disabled][] widget, because it is in a `label ``` -#### Inapplicable Example 12 +#### Inapplicable Example 11 This text is part of a label of a [disabled][] widget, because it is in a `label` element that is the label for an `input` element in an element with `role="group"` with the `aria-disabled="true"` attribute. diff --git a/_rules/visible-label-in-accessible-name-2ee8b8.md b/_rules/visible-label-in-accessible-name-2ee8b8.md index ebde173c97..760b67fcd7 100755 --- a/_rules/visible-label-in-accessible-name-2ee8b8.md +++ b/_rules/visible-label-in-accessible-name-2ee8b8.md @@ -104,14 +104,6 @@ Mathematical symbols cannot be substituted for text as [explicitly mentioned in Proof of 2×2=4 ``` -#### Failed Example 4 - -This `a` element has an [explicit role][] of `none`. However, it is [focusable][] (by default). Thus it has a [semantic role][] of `link` due to [Presentational Roles Conflict Resolution][]. Its [visible][] label doesn't match its [accessible name][]. - -```html -Next -``` - ### Inapplicable #### Inapplicable Example 1 diff --git a/pages/glossary/semantic-role.md b/pages/glossary/semantic-role.md index 4b6a18f6f9..8f07d4d8e8 100755 --- a/pages/glossary/semantic-role.md +++ b/pages/glossary/semantic-role.md @@ -13,7 +13,7 @@ The _semantic role_ of an element which is [included in the accessibility tree][ **Note:** In most cases, the semantic role of an element is its [explicit semantic role][] if it has any, otherwise, its [implicit semantic role][]. However, elements with an [explicit semantic role][] of `none` or `presentation` may still be [included in the accessibility tree][] with their [implicit semantic role][] if a [global ARIA state or property](https://www.w3.org/TR/wai-aria-1.1/#global_states) is specified, or if they are [focusable][] or interactive ([Presentational Roles Conflict Resolution][]) -#### Accessibility Support +#### Accessibility Support for Definition of Semantic Role - There exist popular web browsers and assistive technologies which do not correctly implement [Presentational Roles Conflict Resolution][]. - A similar conflict exists for [focusable][] elements with a `aria-hidden="true"` attribute. The WAI ARIA specification does not explain how to solve it. Some browsers give precedence to the element being focusable (and expose it in the accessibility tree) while some give precedence to the `aria-hidden` attribute (and hide the element). From 0135159e3582e073f1c8ca9ff3f4df8db3697d92 Mon Sep 17 00:00:00 2001 From: Jey Nandakumar Date: Wed, 4 Mar 2020 09:28:10 +0000 Subject: [PATCH 35/67] test: ensure each test case in a rule has a title (#1135) --- __tests__/link-reference-has-definition.js | 2 +- _rules/__tests__/testcase-has-heading.js | 29 +++++++++++++ .../{testcases.js => testcase-html-hint.js} | 0 package-lock.json | 42 ++++++++++++++++--- package.json | 2 + utils/get-markdown-data.js | 11 ++++- 6 files changed, 78 insertions(+), 8 deletions(-) create mode 100644 _rules/__tests__/testcase-has-heading.js rename _rules/__tests__/{testcases.js => testcase-html-hint.js} (100%) diff --git a/__tests__/link-reference-has-definition.js b/__tests__/link-reference-has-definition.js index d94182ae47..e22b240c82 100644 --- a/__tests__/link-reference-has-definition.js +++ b/__tests__/link-reference-has-definition.js @@ -17,7 +17,7 @@ const uniqueArray = require('../utils/unique-array') describe(`Validate link references`, () => { describeRule('Rules', ({ markdownAST }) => validateLinkReferences(markdownAST)) - describePage('Rules', ({ markdownAST }) => validateLinkReferences(markdownAST)) + describePage('Pages', ({ markdownAST }) => validateLinkReferences(markdownAST)) }) function validateLinkReferences(markdownAST) { diff --git a/_rules/__tests__/testcase-has-heading.js b/_rules/__tests__/testcase-has-heading.js new file mode 100644 index 0000000000..d6dabdfff4 --- /dev/null +++ b/_rules/__tests__/testcase-has-heading.js @@ -0,0 +1,29 @@ +const describeRule = require('../../test-utils/describe-rule') +const getMarkdownAstNodesOfType = require('../../utils/get-markdown-ast-nodes-of-type') + +describeRule('testcase has heading', ({ filename, markdownAST }) => { + /** + * get all headings of test case examples (eg: #### Failed Example 1) + */ + const testcaseHeadings = getMarkdownAstNodesOfType(markdownAST, 'heading') + .filter(({ depth, children }) => { + return depth === 4 && children && children.length > 0 + }) + .map(({ children }) => { + const [textNode] = children + return textNode.value + }) + + /** + * get code blocks in markdown body + */ + const testcaseCodeSnippets = getMarkdownAstNodesOfType(markdownAST, 'code') + + /** + * Check if filename has `id` as a part of the name + */ + test('each testcase has a heading', () => { + const msg = `Not all test cases have headings in ${filename}.` + expect(testcaseHeadings.length, msg).toBe(testcaseCodeSnippets.length) + }) +}) diff --git a/_rules/__tests__/testcases.js b/_rules/__tests__/testcase-html-hint.js similarity index 100% rename from _rules/__tests__/testcases.js rename to _rules/__tests__/testcase-html-hint.js diff --git a/package-lock.json b/package-lock.json index c43588be73..b26185b40c 100644 --- a/package-lock.json +++ b/package-lock.json @@ -1179,7 +1179,8 @@ "array-iterate": { "version": "1.1.4", "resolved": "https://registry.npmjs.org/array-iterate/-/array-iterate-1.1.4.tgz", - "integrity": "sha512-sNRaPGh9nnmdC8Zf+pT3UqP8rnWj5Hf9wiFGsX3wUQ2yVSIhO2ShFwCoceIPpB41QF6i2OEmrHmCo36xronCVA==" + "integrity": "sha512-sNRaPGh9nnmdC8Zf+pT3UqP8rnWj5Hf9wiFGsX3wUQ2yVSIhO2ShFwCoceIPpB41QF6i2OEmrHmCo36xronCVA==", + "dev": true }, "array-union": { "version": "2.1.0", @@ -2472,6 +2473,14 @@ "reusify": "^1.0.0" } }, + "fault": { + "version": "1.0.4", + "resolved": "https://registry.npmjs.org/fault/-/fault-1.0.4.tgz", + "integrity": "sha512-CJ0HCB5tL5fYTEA7ToAq5+kTwd++Borf1/bifxd9iT70QcXr4MRrO3Llf8Ifs70q+SJcGHFtnIE/Nw6giCtECA==", + "requires": { + "format": "^0.2.0" + } + }, "fb-watchman": { "version": "2.0.0", "resolved": "https://registry.npmjs.org/fb-watchman/-/fb-watchman-2.0.0.tgz", @@ -2553,6 +2562,11 @@ "mime-types": "^2.1.12" } }, + "format": { + "version": "0.2.2", + "resolved": "https://registry.npmjs.org/format/-/format-0.2.2.tgz", + "integrity": "sha1-1hcBB+nv3E7TDJ3DkBbflCtctYs=" + }, "fragment-cache": { "version": "0.2.1", "resolved": "https://registry.npmjs.org/fragment-cache/-/fragment-cache-0.2.1.tgz", @@ -6794,6 +6808,7 @@ "version": "1.2.1", "resolved": "https://registry.npmjs.org/nlcst-is-literal/-/nlcst-is-literal-1.2.1.tgz", "integrity": "sha512-abNv1XY7TUoyLn5kSSorMIYHfRvVfXbgftNFNvEMiQQkyKteLdjrGuDqEMMyK70sMbn7uPA6oUbRvykM6pg+pg==", + "dev": true, "requires": { "nlcst-to-string": "^2.0.0" } @@ -6802,6 +6817,7 @@ "version": "2.1.4", "resolved": "https://registry.npmjs.org/nlcst-normalize/-/nlcst-normalize-2.1.4.tgz", "integrity": "sha512-dWJ3XUoAoWoau24xOM59Y1FPozv7DyYWy+rdUaXj9Ow0hBCVuwqDQbXzTF7H+HskyTVpTkRPXYPu4YsMEScmRw==", + "dev": true, "requires": { "nlcst-to-string": "^2.0.0" } @@ -6840,7 +6856,8 @@ "nlcst-to-string": { "version": "2.0.4", "resolved": "https://registry.npmjs.org/nlcst-to-string/-/nlcst-to-string-2.0.4.tgz", - "integrity": "sha512-3x3jwTd6UPG7vi5k4GEzvxJ5rDA7hVUIRNHPblKuMVP9Z3xmlsd9cgLcpAMkc5uPOBna82EeshROFhsPkbnTZg==" + "integrity": "sha512-3x3jwTd6UPG7vi5k4GEzvxJ5rDA7hVUIRNHPblKuMVP9Z3xmlsd9cgLcpAMkc5uPOBna82EeshROFhsPkbnTZg==", + "dev": true }, "node-int64": { "version": "0.4.0", @@ -7133,6 +7150,7 @@ "version": "4.1.3", "resolved": "https://registry.npmjs.org/parse-english/-/parse-english-4.1.3.tgz", "integrity": "sha512-IQl1v/ik9gw437T8083coohMihae0rozpc7JYC/9h6hi9xKBSxFwh5HWRpzVC2ZhEs2nUlze2aAktpNBJXdJKA==", + "dev": true, "requires": { "nlcst-to-string": "^2.0.0", "parse-latin": "^4.0.0", @@ -7193,6 +7211,7 @@ "version": "4.2.1", "resolved": "https://registry.npmjs.org/parse-latin/-/parse-latin-4.2.1.tgz", "integrity": "sha512-7T9g6mIsFFpLlo0Zzb2jLWdCt+H9Qtf/hRmMYFi/Mq6Ovi+YKo+AyDFX3OhFfu0vXX5Nid9FKJGKSSzNcTkWiA==", + "dev": true, "requires": { "nlcst-to-string": "^2.0.0", "unist-util-modify-children": "^1.0.0", @@ -7395,7 +7414,8 @@ "quotation": { "version": "1.1.3", "resolved": "https://registry.npmjs.org/quotation/-/quotation-1.1.3.tgz", - "integrity": "sha512-45gUgmX/RtQOQV1kwM06boP49OYXcKCPrYwdmAvs5YqkpiobhNKKwo524JM6Ma0ko3oN9tXNcWs9+ABq3Ry7YA==" + "integrity": "sha512-45gUgmX/RtQOQV1kwM06boP49OYXcKCPrYwdmAvs5YqkpiobhNKKwo524JM6Ma0ko3oN9tXNcWs9+ABq3Ry7YA==", + "dev": true }, "react-is": { "version": "16.8.6", @@ -7474,6 +7494,15 @@ "unified": "^8.2.0" } }, + "remark-frontmatter": { + "version": "1.3.2", + "resolved": "https://registry.npmjs.org/remark-frontmatter/-/remark-frontmatter-1.3.2.tgz", + "integrity": "sha512-2eayxITZ8rezsXdgcXnYB3iLivohm2V/ZT4Ne8uhua6A4pk6GdLE2ZzJnbnINtD1HRLaTdB7RwF9sgUbMptJZA==", + "requires": { + "fault": "^1.0.1", + "xtend": "^4.0.1" + } + }, "remark-parse": { "version": "7.0.2", "resolved": "https://registry.npmjs.org/remark-parse/-/remark-parse-7.0.2.tgz", @@ -8787,6 +8816,7 @@ "version": "1.1.6", "resolved": "https://registry.npmjs.org/unist-util-modify-children/-/unist-util-modify-children-1.1.6.tgz", "integrity": "sha512-TOA6W9QLil+BrHqIZNR4o6IA5QwGOveMbnQxnWYq+7EFORx9vz/CHrtzF36zWrW61E2UKw7sM1KPtIgeceVwXw==", + "dev": true, "requires": { "array-iterate": "^1.0.0" } @@ -8794,7 +8824,8 @@ "unist-util-position": { "version": "3.1.0", "resolved": "https://registry.npmjs.org/unist-util-position/-/unist-util-position-3.1.0.tgz", - "integrity": "sha512-w+PkwCbYSFw8vpgWD0v7zRCl1FpY3fjDSQ3/N/wNd9Ffa4gPi8+4keqt99N3XW6F99t/mUzp2xAhNmfKWp95QA==" + "integrity": "sha512-w+PkwCbYSFw8vpgWD0v7zRCl1FpY3fjDSQ3/N/wNd9Ffa4gPi8+4keqt99N3XW6F99t/mUzp2xAhNmfKWp95QA==", + "dev": true }, "unist-util-remove-position": { "version": "1.1.4", @@ -8850,7 +8881,8 @@ "unist-util-visit-children": { "version": "1.1.4", "resolved": "https://registry.npmjs.org/unist-util-visit-children/-/unist-util-visit-children-1.1.4.tgz", - "integrity": "sha512-sA/nXwYRCQVRwZU2/tQWUqJ9JSFM1X3x7JIOsIgSzrFHcfVt6NkzDtKzyxg2cZWkCwGF9CO8x4QNZRJRMK8FeQ==" + "integrity": "sha512-sA/nXwYRCQVRwZU2/tQWUqJ9JSFM1X3x7JIOsIgSzrFHcfVt6NkzDtKzyxg2cZWkCwGF9CO8x4QNZRJRMK8FeQ==", + "dev": true }, "unist-util-visit-parents": { "version": "3.0.2", diff --git a/package.json b/package.json index c17d35e0a1..ed9a2ccb25 100755 --- a/package.json +++ b/package.json @@ -122,7 +122,9 @@ "is-url": "^1.2.4", "jest-expect-message": "^1.0.2", "remark": "^11.0.2", + "remark-frontmatter": "^1.3.2", "remove-markdown": "^0.3.0", + "unified": "^8.4.2", "unist-util-visit": "^2.0.2" }, "devDependencies": { diff --git a/utils/get-markdown-data.js b/utils/get-markdown-data.js index 2d1d194769..7bff69ba36 100644 --- a/utils/get-markdown-data.js +++ b/utils/get-markdown-data.js @@ -2,7 +2,9 @@ const fs = require('fs') const globby = require('globby') const path = require('path') const fastmatter = require('fastmatter') -const remark = require('remark') +const unified = require('unified') +const remarkParse = require('remark-parse') +const remarkFrontmatter = require('remark-frontmatter') /** * Parse all markdown files in a given directory and construct metadata of each markdown file @@ -14,8 +16,13 @@ const remark = require('remark') const getMarkdownData = (dir, exclude = []) => { return globby.sync([`${dir}/**/*.md`, ...exclude]).map(markdownPath => { const filename = path.parse(markdownPath).base + const fileContents = fs.readFileSync(markdownPath, { encoding: 'utf-8' }) - const markdownAST = remark.parse(fileContents) + const unifiedProcesser = unified() + .use(remarkParse) + .use(remarkFrontmatter) + const markdownAST = unifiedProcesser.parse(fileContents) + const { attributes: frontmatter, body } = fastmatter(fileContents) return { path: markdownPath, From f089057b563fa6942d7b2bd50ed7dc7dcb9cde38 Mon Sep 17 00:00:00 2001 From: Wilco Fiers Date: Wed, 4 Mar 2020 15:50:46 +0100 Subject: [PATCH 36/67] page-has-lang: add understanding link to background (#1204) Noticed this link was missing, very minor change. --- _rules/html-page-lang-b5c3f8.md | 1 + 1 file changed, 1 insertion(+) diff --git a/_rules/html-page-lang-b5c3f8.md b/_rules/html-page-lang-b5c3f8.md index dabfee4e94..b85b3c5431 100755 --- a/_rules/html-page-lang-b5c3f8.md +++ b/_rules/html-page-lang-b5c3f8.md @@ -46,6 +46,7 @@ _There are no major accessibility support issues known for this rule._ ## Background +- [Understanding Success Criterion 3.1.1: Language of Page](https://www.w3.org/WAI/WCAG21/Understanding/language-of-page.html) - [H57: Using language attributes on the html element](https://www.w3.org/WAI/WCAG21/Techniques/html/H57) - [BCP 47: Tags for Identifying Languages](https://www.ietf.org/rfc/bcp/bcp47.txt) - [The `lang` and `xml:lang` attributes](https://html.spec.whatwg.org/multipage/dom.html#the-lang-and-xml:lang-attributes) From ccf6e366726fb5a21efaecee05d7e4845d9b9ce8 Mon Sep 17 00:00:00 2001 From: Jean-Yves Moyen Date: Thu, 5 Mar 2020 09:37:34 +0100 Subject: [PATCH 37/67] Remove outdated class="target" from examples (b49b2e / a1b64e / ebe86a / 80af7b) (#1193) * Remove outdated class="target" from examples * Remove some forgotten ones --- _rules/focusable-no-keyboard-trap-80af7b.md | 20 ++++++++----------- ...o-keyboard-trap-non-standard-nav-ebe86a.md | 8 ++------ ...le-no-keyboard-trap-standard-nav-a1b64e.md | 12 +++++------ _rules/heading-descriptive-b49b2e.md | 12 +++++------ 4 files changed, 22 insertions(+), 30 deletions(-) mode change 100644 => 100755 _rules/focusable-no-keyboard-trap-non-standard-nav-ebe86a.md diff --git a/_rules/focusable-no-keyboard-trap-80af7b.md b/_rules/focusable-no-keyboard-trap-80af7b.md index 060f35d480..5abdef1c93 100755 --- a/_rules/focusable-no-keyboard-trap-80af7b.md +++ b/_rules/focusable-no-keyboard-trap-80af7b.md @@ -61,7 +61,7 @@ _There are no major accessibility support issues known for this rule._ No trap for keyboard navigation. ```html -Link 1 +Link 1 ``` #### Passed Example 2 @@ -96,7 +96,6 @@ Keyboard trap with help information in a paragraph before, and where the method How to go the next element
- @@ -165,7 +163,7 @@ Keyboard trap one element. ```html Link 1 - ``` @@ -175,10 +173,10 @@ Keyboard trap one element. Keyboard trap group. ```html - - - + ``` @@ -211,7 +209,6 @@ Keyboard trap with no instructions.

Press the M-key to Exit

- Link 2 @@ -296,7 +292,7 @@ Hidden element using `display:none`. Hidden element using `visibility:hidden`. ```html -Link 1 +Link 1 ``` [focusable]: #focusable 'Definition of focusable' diff --git a/_rules/focusable-no-keyboard-trap-non-standard-nav-ebe86a.md b/_rules/focusable-no-keyboard-trap-non-standard-nav-ebe86a.md old mode 100644 new mode 100755 index 833d323fb7..613b540f43 --- a/_rules/focusable-no-keyboard-trap-non-standard-nav-ebe86a.md +++ b/_rules/focusable-no-keyboard-trap-non-standard-nav-ebe86a.md @@ -76,7 +76,6 @@ Keyboard trap with help information in a paragraph before, and where the method How to go the next element
- @@ -154,7 +152,6 @@ Keyboard trap with no instructions.

Press the M-key to Exit

- Link 2 diff --git a/_rules/focusable-no-keyboard-trap-standard-nav-a1b64e.md b/_rules/focusable-no-keyboard-trap-standard-nav-a1b64e.md index 1a75677ccf..2d6b7fcb3d 100755 --- a/_rules/focusable-no-keyboard-trap-standard-nav-a1b64e.md +++ b/_rules/focusable-no-keyboard-trap-standard-nav-a1b64e.md @@ -55,7 +55,7 @@ There are no major accessibility support issues known for this rule. No trap for keyboard navigation. ```html -Link 1 +Link 1 ``` #### Passed Example 2 @@ -82,7 +82,7 @@ Keyboard trap one element. ```html Link 1 - ``` @@ -92,10 +92,10 @@ Keyboard trap one element. Keyboard trap group. ```html - - - + ``` @@ -144,7 +144,7 @@ Hidden element using `display:none`. Hidden element using `visibility:hidden`. ```html -Link 1 +Link 1 ``` [focusable]: #focusable 'Definition of focusable' diff --git a/_rules/heading-descriptive-b49b2e.md b/_rules/heading-descriptive-b49b2e.md index aca0786c60..e6adf2ece5 100755 --- a/_rules/heading-descriptive-b49b2e.md +++ b/_rules/heading-descriptive-b49b2e.md @@ -61,7 +61,7 @@ Heading marked up with `h1` element that describes the topic or purpose of its [ ```html -

Opening Hours

+

Opening Hours

We are open Monday through Friday from 10 to 16

``` @@ -94,7 +94,7 @@ Heading marked up with `h1` element with an image that describes the topic or pu ```html -

+

Opening hours

We are open Monday through Friday from 10 to 16

@@ -107,7 +107,7 @@ Heading marked up with `h1` element that is a single character that describes th ```html -

A

+

A

airplane
@@ -140,7 +140,7 @@ Heading marked up with `h1` element that describes the topic or purpose of its [ ```html -

Opening Hours

+

Opening Hours

We are open Monday through Friday from 10 to 16

``` @@ -153,7 +153,7 @@ Heading marked up with `h1` element that does not describe the topic or purpose ```html -

Weather

+

Weather

We are open Monday through Friday from 10 to 16

``` @@ -188,7 +188,7 @@ Heading marked up with `h1` element that does not describe the topic or purpose ```html -

Weather

+

Weather

We are open Monday through Friday from 10 to 16

``` From 159a9a02ba09958c431bb6cecd7d2e5dd32bbb48 Mon Sep 17 00:00:00 2001 From: Jean-Yves Moyen Date: Fri, 6 Mar 2020 09:13:07 +0100 Subject: [PATCH 38/67] De-duplicate IDs of Accessibility Supports in Glossary (#1201) * De-duplicate IDs of Accessibility Supports --- pages/glossary/accessible-name.md | 2 +- pages/glossary/explicit-role.md | 2 +- 2 files changed, 2 insertions(+), 2 deletions(-) diff --git a/pages/glossary/accessible-name.md b/pages/glossary/accessible-name.md index 6ca78ce987..7e7c4da07b 100755 --- a/pages/glossary/accessible-name.md +++ b/pages/glossary/accessible-name.md @@ -15,7 +15,7 @@ For native markup languages, such as HTML and SVG, additional information on how **Note:** As per the [accessible name and description computation](https://www.w3.org/TR/accname), accessible names are [flat string](https://www.w3.org/TR/accname-1.1/#terminology) trimmed of leading and trailing whitespace. Notably, it is not possible for a non-empty accessible name to be composed only of whitespace since these must be trimmed. -#### Accessibility Support +#### Accessibility Support for definition of accessible name - Because the [accessible name and description computation](https://www.w3.org/TR/accname) is not clear about which whitespace are considered, browsers behave differently when trimming and flattening the accessible name. For example, some browsers completely trim non-breaking spaces while some keep them in the accessible name. - There exists a popular browser which does not perform the same trimming and flattening depending whether the accessible name comes from content, an `aria-label` attribute, or an `alt` attribute. diff --git a/pages/glossary/explicit-role.md b/pages/glossary/explicit-role.md index 16b7eca5e6..d92439228d 100755 --- a/pages/glossary/explicit-role.md +++ b/pages/glossary/explicit-role.md @@ -11,6 +11,6 @@ The [role attribute](https://www.w3.org/TR/role-attribute/) takes a list of toke Other roles may be added as they become available. Not all roles will be supported in all assistive technologies. Testers are encouraged to adjust which roles are allowed according to the [accessibility support base line](https://www.w3.org/TR/WCAG-EM/#step1c). For the purposes of executing test cases in all rules, it should be assumed that all roles are supported by assistive technologies so that none of the roles fail due to lack of accessibility support. -#### Accessibility Support +#### Accessibility Support for definition of explicit role Some browsers and assistive technologies treat the tokens of the `role` attribute as case-sensitive. Unless lowercase letters are used for the value of the `role` attribute, not all user agents will be able to interpret the tokens correctly. [ARIA in HTML (working draft)](https://www.w3.org/TR/html-aria/) also specifies that [authors must use lowercase letters for the `role` and `aria-*` attributes](https://www.w3.org/TR/html-aria/#case-sensitivity). From 5d4eb12b1969f047023cd139e0fe4988cd63028b Mon Sep 17 00:00:00 2001 From: Jean-Yves Moyen Date: Mon, 9 Mar 2020 09:32:00 +0100 Subject: [PATCH 39/67] Remove outdated data-rule-target (ee13b5 / c3232f / e7aa44) (#1207) * Remove outdated data-rule-target --- _rules/audio-text-alternative-e7aa44.md | 10 +++++----- ...video-only-alternative-for-visual-c3232f.md | 18 +++++------------- _rules/video-only-transcript-ee13b5.md | 16 ++++++++-------- 3 files changed, 18 insertions(+), 26 deletions(-) diff --git a/_rules/audio-text-alternative-e7aa44.md b/_rules/audio-text-alternative-e7aa44.md index 40e2fcfd47..7b58f6ca12 100755 --- a/_rules/audio-text-alternative-e7aa44.md +++ b/_rules/audio-text-alternative-e7aa44.md @@ -65,7 +65,7 @@ Audio with controls and internal transcript ```html - +

The above audio contains the following speech: We choose to go to the moon in this decade and do the other things, not because they are easy, but because they are hard, because that goal will serve to organize and measure the best @@ -90,7 +90,7 @@ An audio element that describes some of the text on the same page. The text on t

You can also listen to the audio file below to hear the above part of the speech.

- + ``` @@ -102,7 +102,7 @@ Audio with controls and incorrect internal transcript ```html - +

The above audio contains the following speech: We choose to go to the cheese in this decade and do the other things, not because they are easy, but because they are hard, because that goal will serve to organize and measure the best @@ -127,7 +127,7 @@ An audio element that describes some of the text on the same page. The text is n

You can also listen to the audio file below to hear the above part of the speech.

- + ``` @@ -158,7 +158,7 @@ An audio element that describes some of the text on the same page. The text on t

You can also listen to the audio file below to hear the above part of the speech.

- + ``` diff --git a/_rules/video-only-alternative-for-visual-c3232f.md b/_rules/video-only-alternative-for-visual-c3232f.md index f74950a0ec..864c9f9c68 100755 --- a/_rules/video-only-alternative-for-visual-c3232f.md +++ b/_rules/video-only-alternative-for-visual-c3232f.md @@ -69,11 +69,7 @@ A video element without audio. The text on the page labels the video as an alter keyboard to navigate websites. Either through preference or circumstance. This is solved by keyboard compatibility. Keyboard compatibility is described in WCAG. See the video below to watch the same information again in video form.

- + ``` @@ -97,7 +93,7 @@ A silent video element with a text transcript on the same page. ```html -
Column 1Column 2Column 2
``` -#### Failed Example 7 - -This `a` element has an [explicit role][] of `none`. However, it is [focusable][] (by default). Thus it has a [semantic role][] of `link` due to [Presentational Roles Conflict Resolution][]. Its [accessible name][] (from the link's text), together with the absence of [programmatically determined link context][], does not describe the purpose of the link. - -```html -More - -

This product consists of several web pages.

-``` - ### Inapplicable #### Inapplicable Example 1 @@ -334,8 +324,6 @@ An `a` element without the [semantic role][] `link`. ``` [accessible name]: #accessible-name 'Definition of accessible name' -[explicit role]: #explicit-role 'Definition of explicit role' -[focusable]: #focusable 'Definition of focusable' [included in the accessibility tree]: #included-in-the-accessibility-tree 'Definition of included in the accessibility tree' [link]: https://www.w3.org/TR/wai-aria/#link [presentational roles conflict resolution]: https://www.w3.org/TR/wai-aria-1.1/#conflict_resolution_presentation_none 'Presentational Roles Conflict Resolution' From 70a52f83803adec64c2f21c0a7938806eff63c9d Mon Sep 17 00:00:00 2001 From: Jym Date: Thu, 12 Mar 2020 14:09:31 +0100 Subject: [PATCH 50/67] Remove parenthesises around case name --- pages/glossary/semantic-role.md | 8 ++++---- 1 file changed, 4 insertions(+), 4 deletions(-) diff --git a/pages/glossary/semantic-role.md b/pages/glossary/semantic-role.md index 66b8ec28f8..44ee7d5653 100755 --- a/pages/glossary/semantic-role.md +++ b/pages/glossary/semantic-role.md @@ -11,13 +11,13 @@ Valid semantic roles are defined by standards. For web content and applications The _semantic role_ of an element is determined by the first of these cases that applies: -1. **(Conflict)** If the element has an [explicit role][] which is either `none` or `presentation`, but the element is [included in the accessibility tree][] (or would be when it is not [hidden](https://www.w3.org/TR/wai-aria-1.2/#dfn-hidden)), then its _semantic role_ is its **[implicit role][]**. -2. **(Explicit)** If the element has an [explicit role][], then its _semantic role_ is its [explicit role][]. -3. **(Implicit)** The _semantic role_ of the element is its [implicit role][]. +1. **Conflict** If the element has an [explicit role][] which is either `none` or `presentation`, but the element is [included in the accessibility tree][] (or would be when it is not [hidden](https://www.w3.org/TR/wai-aria-1.2/#dfn-hidden)), then its _semantic role_ is its **[implicit role][]**. +2. **Explicit** If the element has an [explicit role][], then its _semantic role_ is its [explicit role][]. +3. **Implicit** The _semantic role_ of the element is its [implicit role][]. #### Accessibility Support for Definition of Semantic Role -- There exist popular web browsers and assistive technologies which do not correctly implement [Presentational Roles Conflict Resolution][]. These technologies will not [include in the accessibility tree][included in the accessibility tree] elements that should be, according to Specifications. Thus, some elements that should have their _semantic role_ fixed by case **(Conflict)** above are instead falling into case **(Explicit)** and are hidden for users of assistive technologies. +- There exist popular web browsers and assistive technologies which do not correctly implement [Presentational Roles Conflict Resolution][]. These technologies will not [include in the accessibility tree][included in the accessibility tree] elements that should be, according to Specifications. Thus, some elements that should have their _semantic role_ fixed by case **Conflict** above are instead falling into case **Explicit** and are hidden for users of assistive technologies. - A similar conflict exists for [focusable][] elements with a `aria-hidden="true"` attribute. The WAI ARIA specification does not explain how to solve it. Some browsers give precedence to the element being focusable (and expose it in the accessibility tree) while some give precedence to the `aria-hidden` attribute (and hide the element). [explicit role]: #explicit-role 'Definition of Explicit Role' From 89ea3d39f6154ca0eeab92ff498fe134b2e4725b Mon Sep 17 00:00:00 2001 From: Jym Date: Thu, 12 Mar 2020 14:09:50 +0100 Subject: [PATCH 51/67] Reintroduce definition of Marked as decorative --- pages/glossary/marked-as-decorative.md | 24 ++++++++++++++++++++++++ 1 file changed, 24 insertions(+) create mode 100644 pages/glossary/marked-as-decorative.md diff --git a/pages/glossary/marked-as-decorative.md b/pages/glossary/marked-as-decorative.md new file mode 100644 index 0000000000..9362f27c5f --- /dev/null +++ b/pages/glossary/marked-as-decorative.md @@ -0,0 +1,24 @@ +--- +title: Marked as Decorative +key: marked-as-decorative +unambiguous: true +objective: true +--- + +An element is _marked as decorative_ if it has a [semantic role][] of `none` or `presentation`. + +The most common ways of marking an element as decorative are to explicitly set `role="none"`, or `role="presentation"`, or, for images, `alt=""`. + +**Note:** an element should only be marked as decorative if it is [pure decoration](https://www.w3.org/TR/WCAG21/#dfn-pure-decoration) and removing it does not cause a loss of information to the user. + +**Note:** The [semantic role][] of `none` has been introduced in ARIA 1.1 and has less support than the synonym [role][semantic role] of `presentation`. Therefore, authors are encouraged to use `role="none presentation"` to keep the fallback option ([WAI-ARIA description of `presentation` role](https://www.w3.org/TR/wai-aria-1.1/#presentation)). + +#### Accessibility Support for definition of marked as decorative + +- Images with an empty `alt` attribute should have a role set to `presentation`, according to the [HTML Accessibility API Mapping (work in progress)](https://www.w3.org/TR/html-aam-1.0/#html-element-role-mappings). However, there are several popular browsers that do not treat images with empty `alt` attribute as having a role of `presentation` but instead add the `img` element to the accessibility tree with a role of either `img` or `graphic`. +- Implementation of [Presentational Roles Conflict Resolution][] varies from one browser or assistive technology to another. Depending on this, some elements can have a [semantic role][] of `none` with some technology but be exposed with their [implicit role][] with others. Especially, [presentational roles conflict resolution] only consider elements whose [explicit role][]is `none` or presentation`but do not consider images marked as decorative through an empty`alt` attribute. Some browsers and assistive technologies choose to apply the conflict resolution to these images while other don’t. + +[explicit role]: #explicit-role ’Definition of explicit role’ +[implicit role]: #implicit-role ’Definition of implicit role’ +[presentational roles conflict resolution]: https://www.w3.org/TR/wai-aria-1.1/#conflict_resolution_presentation_none 'Presentational Roles Conflict Resolution' +[semantic role]: #semantic-role 'Definition of semantic role' From 4316d42ef253deb069aaa3807e0d740382acbf11 Mon Sep 17 00:00:00 2001 From: Jym Date: Thu, 12 Mar 2020 14:10:18 +0100 Subject: [PATCH 52/67] Re use marked as decorative --- _rules/image-accessible-name-23a2a8.md | 4 +++- 1 file changed, 3 insertions(+), 1 deletion(-) diff --git a/_rules/image-accessible-name-23a2a8.md b/_rules/image-accessible-name-23a2a8.md index 8a9291aadf..43e1017620 100755 --- a/_rules/image-accessible-name-23a2a8.md +++ b/_rules/image-accessible-name-23a2a8.md @@ -40,7 +40,7 @@ The rule applies to HTML `img` elements or any HTML element with the [semantic r ## Expectation -Each target element has an [accessible name][] that is not empty (`""`), or has a [semantic role][] of `none` or `presentation`. +Each target element has an [accessible name][] that is not empty (`""`), or is [marked as decorative][]. **Note:** Testing that the [accessible name][] is descriptive is not part of this rule and must be tested separately. @@ -219,6 +219,8 @@ The element is not an `img` element. [global]: https://www.w3.org/TR/wai-aria-1.1/#global_states 'Definition of Global ARIA States and Properties' [implicit role]: #implicit-role 'Definition of implicit role' [included in the accessibility tree]: #included-in-the-accessibility-tree 'Definition of included in the accessibility tree' + +[marked as decorative]: #marked-as-decorative ’Definition of marked as decorative’ [presentational roles conflict resolution]: https://www.w3.org/TR/wai-aria-1.1/#conflict_resolution_presentation_none 'Presentational Roles Conflict Resolution' [property]: https://www.w3.org/TR/wai-aria/#dfn-property 'Definition of ARIA Property' [semantic role]: #semantic-role 'Definition of semantic role' From b357d3df3b89b87cba72974fb439c5445f388a48 Mon Sep 17 00:00:00 2001 From: Jym Date: Thu, 12 Mar 2020 14:45:27 +0100 Subject: [PATCH 53/67] Typos --- _rules/image-accessible-name-23a2a8.md | 3 +-- pages/glossary/marked-as-decorative.md | 6 +++--- 2 files changed, 4 insertions(+), 5 deletions(-) diff --git a/_rules/image-accessible-name-23a2a8.md b/_rules/image-accessible-name-23a2a8.md index 43e1017620..340ea43bc0 100755 --- a/_rules/image-accessible-name-23a2a8.md +++ b/_rules/image-accessible-name-23a2a8.md @@ -219,8 +219,7 @@ The element is not an `img` element. [global]: https://www.w3.org/TR/wai-aria-1.1/#global_states 'Definition of Global ARIA States and Properties' [implicit role]: #implicit-role 'Definition of implicit role' [included in the accessibility tree]: #included-in-the-accessibility-tree 'Definition of included in the accessibility tree' - -[marked as decorative]: #marked-as-decorative ’Definition of marked as decorative’ +[marked as decorative]: #marked-as-decorative 'Definition of marked as decorative' [presentational roles conflict resolution]: https://www.w3.org/TR/wai-aria-1.1/#conflict_resolution_presentation_none 'Presentational Roles Conflict Resolution' [property]: https://www.w3.org/TR/wai-aria/#dfn-property 'Definition of ARIA Property' [semantic role]: #semantic-role 'Definition of semantic role' diff --git a/pages/glossary/marked-as-decorative.md b/pages/glossary/marked-as-decorative.md index 9362f27c5f..7034601f4e 100644 --- a/pages/glossary/marked-as-decorative.md +++ b/pages/glossary/marked-as-decorative.md @@ -16,9 +16,9 @@ The most common ways of marking an element as decorative are to explicitly set ` #### Accessibility Support for definition of marked as decorative - Images with an empty `alt` attribute should have a role set to `presentation`, according to the [HTML Accessibility API Mapping (work in progress)](https://www.w3.org/TR/html-aam-1.0/#html-element-role-mappings). However, there are several popular browsers that do not treat images with empty `alt` attribute as having a role of `presentation` but instead add the `img` element to the accessibility tree with a role of either `img` or `graphic`. -- Implementation of [Presentational Roles Conflict Resolution][] varies from one browser or assistive technology to another. Depending on this, some elements can have a [semantic role][] of `none` with some technology but be exposed with their [implicit role][] with others. Especially, [presentational roles conflict resolution] only consider elements whose [explicit role][]is `none` or presentation`but do not consider images marked as decorative through an empty`alt` attribute. Some browsers and assistive technologies choose to apply the conflict resolution to these images while other don’t. +- Implementation of [Presentational Roles Conflict Resolution][] varies from one browser or assistive technology to another. Depending on this, some elements can have a [semantic role][] of `none` with some technology but be exposed with their [implicit role][] with others. Additionally, [presentational roles conflict resolution] only consider elements whose [explicit role][] is `none` or `presentation` but do not consider images marked as decorative through an empty `alt` attribute. Some browsers and assistive technologies choose to apply the conflict resolution to these images while other don't. -[explicit role]: #explicit-role ’Definition of explicit role’ -[implicit role]: #implicit-role ’Definition of implicit role’ +[explicit role]: #explicit-role 'Definition of explicit role' +[implicit role]: #implicit-role 'Definition of implicit role' [presentational roles conflict resolution]: https://www.w3.org/TR/wai-aria-1.1/#conflict_resolution_presentation_none 'Presentational Roles Conflict Resolution' [semantic role]: #semantic-role 'Definition of semantic role' From d5f2e0e0b9f7a491a907eb07e4cc24cba10c6b53 Mon Sep 17 00:00:00 2001 From: Jean-Yves Moyen Date: Mon, 16 Mar 2020 16:23:57 +0100 Subject: [PATCH 54/67] Update pages/glossary/semantic-role.md Co-Authored-By: Kasper Isager --- pages/glossary/semantic-role.md | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/pages/glossary/semantic-role.md b/pages/glossary/semantic-role.md index 44ee7d5653..26223f3de4 100755 --- a/pages/glossary/semantic-role.md +++ b/pages/glossary/semantic-role.md @@ -11,7 +11,7 @@ Valid semantic roles are defined by standards. For web content and applications The _semantic role_ of an element is determined by the first of these cases that applies: -1. **Conflict** If the element has an [explicit role][] which is either `none` or `presentation`, but the element is [included in the accessibility tree][] (or would be when it is not [hidden](https://www.w3.org/TR/wai-aria-1.2/#dfn-hidden)), then its _semantic role_ is its **[implicit role][]**. +1. **Conflict** If the element has an [explicit role][] which is either `none` or `presentation`, but the element is [included in the accessibility tree][], or would be when it is not [hidden](https://www.w3.org/TR/wai-aria-1.2/#dfn-hidden), then its _semantic role_ is its **[implicit role][]**. 2. **Explicit** If the element has an [explicit role][], then its _semantic role_ is its [explicit role][]. 3. **Implicit** The _semantic role_ of the element is its [implicit role][]. From e5bcd97fab327717c0daa17d1ac33581d91d51ce Mon Sep 17 00:00:00 2001 From: Jean-Yves Moyen Date: Wed, 18 Mar 2020 15:26:22 +0100 Subject: [PATCH 55/67] Clean up --- __tests__/spelling-ignore.yml | 0 _rules/image-filename-as-accessible-name-9eb3f6.md | 0 2 files changed, 0 insertions(+), 0 deletions(-) mode change 100644 => 100755 __tests__/spelling-ignore.yml mode change 100644 => 100755 _rules/image-filename-as-accessible-name-9eb3f6.md diff --git a/__tests__/spelling-ignore.yml b/__tests__/spelling-ignore.yml old mode 100644 new mode 100755 diff --git a/_rules/image-filename-as-accessible-name-9eb3f6.md b/_rules/image-filename-as-accessible-name-9eb3f6.md old mode 100644 new mode 100755 From af5b536b85931ce63214e79ab2ff71ea0768fb06 Mon Sep 17 00:00:00 2001 From: Jean-Yves Moyen Date: Tue, 24 Mar 2020 15:30:28 +0100 Subject: [PATCH 56/67] Clean up --- _rules/button-accessible-name-97a4e1.md | 0 1 file changed, 0 insertions(+), 0 deletions(-) mode change 100644 => 100755 _rules/button-accessible-name-97a4e1.md diff --git a/_rules/button-accessible-name-97a4e1.md b/_rules/button-accessible-name-97a4e1.md old mode 100644 new mode 100755 From e35ab4c55b8765e84f042a3047e3bba79570769b Mon Sep 17 00:00:00 2001 From: Jean-Yves Moyen Date: Tue, 24 Mar 2020 15:32:37 +0100 Subject: [PATCH 57/67] Improve formulation --- pages/glossary/semantic-role.md | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/pages/glossary/semantic-role.md b/pages/glossary/semantic-role.md index b8795a0fa3..1a6dfd6b29 100755 --- a/pages/glossary/semantic-role.md +++ b/pages/glossary/semantic-role.md @@ -13,7 +13,7 @@ Valid semantic roles are defined by standards. For web content and applications The _semantic role_ of an element is determined by the first of these cases that applies: -1. **Conflict** If the element has an [explicit role][] which is either `none` or `presentation`, but the element is [included in the accessibility tree][], or would be when it is not [hidden](https://www.w3.org/TR/wai-aria-1.2/#dfn-hidden), then its _semantic role_ is its **[implicit role][]**. +1. **Conflict** If the element has an [explicit role][] which is either `none` or `presentation`, but the element is [included in the accessibility tree][], or would be when it is not [excluded from the accessibility tree](https://w3c.github.io/aria/#tree_exclusion), then its _semantic role_ is its **[implicit role][]**. 2. **Explicit** If the element has an [explicit role][], then its _semantic role_ is its [explicit role][]. 3. **Implicit** The _semantic role_ of the element is its [implicit role][]. From 043ef8502dc4d376ecec839f10d13928f85bc5ed Mon Sep 17 00:00:00 2001 From: Jean-Yves Moyen Date: Tue, 24 Mar 2020 15:34:07 +0100 Subject: [PATCH 58/67] Use correct link to ARIA --- pages/glossary/semantic-role.md | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/pages/glossary/semantic-role.md b/pages/glossary/semantic-role.md index 1a6dfd6b29..f5e96c1dac 100755 --- a/pages/glossary/semantic-role.md +++ b/pages/glossary/semantic-role.md @@ -13,7 +13,7 @@ Valid semantic roles are defined by standards. For web content and applications The _semantic role_ of an element is determined by the first of these cases that applies: -1. **Conflict** If the element has an [explicit role][] which is either `none` or `presentation`, but the element is [included in the accessibility tree][], or would be when it is not [excluded from the accessibility tree](https://w3c.github.io/aria/#tree_exclusion), then its _semantic role_ is its **[implicit role][]**. +1. **Conflict** If the element has an [explicit role][] which is either `none` or `presentation`, but the element is [included in the accessibility tree][], or would be when it is not [excluded from the accessibility tree](https://www.w3.org/TR/wai-aria-1.2/#tree_exclusion), then its _semantic role_ is its **[implicit role][]**. 2. **Explicit** If the element has an [explicit role][], then its _semantic role_ is its [explicit role][]. 3. **Implicit** The _semantic role_ of the element is its [implicit role][]. From c495dc17b19591f088af04bf70afaddf0518f619 Mon Sep 17 00:00:00 2001 From: Jean-Yves Moyen Date: Tue, 24 Mar 2020 15:52:01 +0100 Subject: [PATCH 59/67] Add definition of hidden and fix semantic role --- pages/glossary/hidden.md | 15 +++++++++++++++ pages/glossary/semantic-role.md | 2 +- 2 files changed, 16 insertions(+), 1 deletion(-) create mode 100755 pages/glossary/hidden.md diff --git a/pages/glossary/hidden.md b/pages/glossary/hidden.md new file mode 100755 index 0000000000..b180129032 --- /dev/null +++ b/pages/glossary/hidden.md @@ -0,0 +1,15 @@ +--- +title: Explicitly Hidden +key: hidden +unambiguous: true +objective: true +input_aspects: + - CSS styling + - DOM tree +--- + +An HTML element is _explicitly hidden_ if at least one of the following is true for itself or any of its ancestors: + +- has a `hidden` attribute; or +- has a CSS property `display` set to `none`; or +- has a CSS property `visibility` set to `hidden`. diff --git a/pages/glossary/semantic-role.md b/pages/glossary/semantic-role.md index f5e96c1dac..5cf6017c10 100755 --- a/pages/glossary/semantic-role.md +++ b/pages/glossary/semantic-role.md @@ -13,7 +13,7 @@ Valid semantic roles are defined by standards. For web content and applications The _semantic role_ of an element is determined by the first of these cases that applies: -1. **Conflict** If the element has an [explicit role][] which is either `none` or `presentation`, but the element is [included in the accessibility tree][], or would be when it is not [excluded from the accessibility tree](https://www.w3.org/TR/wai-aria-1.2/#tree_exclusion), then its _semantic role_ is its **[implicit role][]**. +1. **Conflict** If the element has an [explicit role][] which is either `none` or `presentation`, but the element is [included in the accessibility tree][]; or would be [included in the accessibility tree][] when it is not [hidden](#hidden), then its _semantic role_ is its **[implicit role][]**. 2. **Explicit** If the element has an [explicit role][], then its _semantic role_ is its [explicit role][]. 3. **Implicit** The _semantic role_ of the element is its [implicit role][]. From 4a85aecc0eab36f3c3c9a75bc4090830c2cd26ce Mon Sep 17 00:00:00 2001 From: Jean-Yves Moyen Date: Tue, 24 Mar 2020 15:55:21 +0100 Subject: [PATCH 60/67] =?UTF-8?q?Add=20CSS=E2=80=AFstyling=20input=20aspec?= =?UTF-8?q?t=20where=20needed?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- _rules/aria-required-context-role-ff89c9.md | 1 + _rules/aria-required-owned-element-bc4a75.md | 1 + _rules/aria-state-or-property-permitted-5c01ea.md | 1 + _rules/form-control-accessible-name-e086e5.md | 1 + _rules/table-header-cells-refer-to-data-cells-d0f69e.md | 1 + 5 files changed, 5 insertions(+) mode change 100644 => 100755 _rules/aria-required-context-role-ff89c9.md mode change 100644 => 100755 _rules/aria-required-owned-element-bc4a75.md diff --git a/_rules/aria-required-context-role-ff89c9.md b/_rules/aria-required-context-role-ff89c9.md old mode 100644 new mode 100755 index a4d142d60a..e37273b5fc --- a/_rules/aria-required-context-role-ff89c9.md +++ b/_rules/aria-required-context-role-ff89c9.md @@ -12,6 +12,7 @@ accessibility_requirements: inapplicable: further testing needed input_aspects: - Accessibility tree + - CSS styling - DOM Tree acknowledgments: authors: diff --git a/_rules/aria-required-owned-element-bc4a75.md b/_rules/aria-required-owned-element-bc4a75.md old mode 100644 new mode 100755 index cde3f7306e..1f0accd90c --- a/_rules/aria-required-owned-element-bc4a75.md +++ b/_rules/aria-required-owned-element-bc4a75.md @@ -12,6 +12,7 @@ accessibility_requirements: inapplicable: further testing needed input_aspects: - Accessibility tree + - CSS styling - DOM Tree acknowledgments: authors: diff --git a/_rules/aria-state-or-property-permitted-5c01ea.md b/_rules/aria-state-or-property-permitted-5c01ea.md index 66c6adace3..c6cb92249f 100755 --- a/_rules/aria-state-or-property-permitted-5c01ea.md +++ b/_rules/aria-state-or-property-permitted-5c01ea.md @@ -18,6 +18,7 @@ accessibility_requirements: inapplicable: satisfied input_aspects: - Accessibility Tree + - CSS styling - DOM Tree acknowledgments: authors: diff --git a/_rules/form-control-accessible-name-e086e5.md b/_rules/form-control-accessible-name-e086e5.md index 4c4f2e8b05..45390f12d9 100755 --- a/_rules/form-control-accessible-name-e086e5.md +++ b/_rules/form-control-accessible-name-e086e5.md @@ -12,6 +12,7 @@ accessibility_requirements: inapplicable: further testing needed input_aspects: - Accessibility Tree + - CSS styling - DOM Tree acknowledgments: authors: diff --git a/_rules/table-header-cells-refer-to-data-cells-d0f69e.md b/_rules/table-header-cells-refer-to-data-cells-d0f69e.md index 86bcaedbc0..80c48a49fa 100755 --- a/_rules/table-header-cells-refer-to-data-cells-d0f69e.md +++ b/_rules/table-header-cells-refer-to-data-cells-d0f69e.md @@ -17,6 +17,7 @@ accessibility_requirements: inapplicable: further testing needed input_aspects: - Accessibility Tree + - CSS styling - DOM Tree acknowledgments: authors: From c6d1c5ef05bb40bd57b54569f23a8e1251b1562c Mon Sep 17 00:00:00 2001 From: Jean-Yves Moyen Date: Wed, 25 Mar 2020 08:45:18 +0100 Subject: [PATCH 61/67] Update pages/glossary/hidden.md Co-Authored-By: Kasper Isager --- pages/glossary/hidden.md | 4 ++-- 1 file changed, 2 insertions(+), 2 deletions(-) diff --git a/pages/glossary/hidden.md b/pages/glossary/hidden.md index b180129032..758c1dd30b 100755 --- a/pages/glossary/hidden.md +++ b/pages/glossary/hidden.md @@ -11,5 +11,5 @@ input_aspects: An HTML element is _explicitly hidden_ if at least one of the following is true for itself or any of its ancestors: - has a `hidden` attribute; or -- has a CSS property `display` set to `none`; or -- has a CSS property `visibility` set to `hidden`. +- has a [computed](https://www.w3.org/TR/css-cascade/#computed-value) CSS property `display` of `none`; or +- has a [computed](https://www.w3.org/TR/css-cascade/#computed-value) CSS property `visibility` of `hidden`. From a01b45d8db6ad2afcaa33a86c085cd8e5a849b59 Mon Sep 17 00:00:00 2001 From: Jean-Yves Moyen Date: Wed, 25 Mar 2020 10:52:38 +0100 Subject: [PATCH 62/67] Update pages/glossary/hidden.md Co-Authored-By: Wilco Fiers --- pages/glossary/hidden.md | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/pages/glossary/hidden.md b/pages/glossary/hidden.md index 758c1dd30b..38e100d2c6 100755 --- a/pages/glossary/hidden.md +++ b/pages/glossary/hidden.md @@ -8,7 +8,7 @@ input_aspects: - DOM tree --- -An HTML element is _explicitly hidden_ if at least one of the following is true for itself or any of its ancestors: +An HTML element is _hidden_ if at least one of the following is true for itself or any of its [ancestors][] in the [flat tree][]: - has a `hidden` attribute; or - has a [computed](https://www.w3.org/TR/css-cascade/#computed-value) CSS property `display` of `none`; or From 7e84e02adc0b89bbcee328b7d4754cec672678cc Mon Sep 17 00:00:00 2001 From: Jean-Yves Moyen Date: Wed, 25 Mar 2020 10:52:56 +0100 Subject: [PATCH 63/67] Update pages/glossary/hidden.md Co-Authored-By: Wilco Fiers --- pages/glossary/hidden.md | 1 + 1 file changed, 1 insertion(+) diff --git a/pages/glossary/hidden.md b/pages/glossary/hidden.md index 38e100d2c6..f459bae545 100755 --- a/pages/glossary/hidden.md +++ b/pages/glossary/hidden.md @@ -13,3 +13,4 @@ An HTML element is _hidden_ if at least one of the following is true for itself - has a `hidden` attribute; or - has a [computed](https://www.w3.org/TR/css-cascade/#computed-value) CSS property `display` of `none`; or - has a [computed](https://www.w3.org/TR/css-cascade/#computed-value) CSS property `visibility` of `hidden`. +- has an `aria-hidden` attribute set to `true` From bcf7a285db60180becfe430f49e8021eb422314e Mon Sep 17 00:00:00 2001 From: Jean-Yves Moyen Date: Wed, 25 Mar 2020 12:14:04 +0100 Subject: [PATCH 64/67] Add missing links --- pages/glossary/hidden.md | 3 +++ 1 file changed, 3 insertions(+) diff --git a/pages/glossary/hidden.md b/pages/glossary/hidden.md index f459bae545..8f89b9ee7e 100755 --- a/pages/glossary/hidden.md +++ b/pages/glossary/hidden.md @@ -14,3 +14,6 @@ An HTML element is _hidden_ if at least one of the following is true for itself - has a [computed](https://www.w3.org/TR/css-cascade/#computed-value) CSS property `display` of `none`; or - has a [computed](https://www.w3.org/TR/css-cascade/#computed-value) CSS property `visibility` of `hidden`. - has an `aria-hidden` attribute set to `true` + +[ancestors]: https://dom.spec.whatwg.org/#concept-tree-ancestor 'Definition Ancestor' +[flat tree]: https://drafts.csswg.org/css-scoping/#flat-tree 'Definition of flat tree' From 872a419a692dea078fe1e41244b1c41e34e68d75 Mon Sep 17 00:00:00 2001 From: Jean-Yves Moyen Date: Tue, 31 Mar 2020 13:24:04 +0200 Subject: [PATCH 65/67] Clean up --- __tests__/spelling-ignore.yml | 0 _rules/visible-label-in-accessible-name-2ee8b8.md | 0 2 files changed, 0 insertions(+), 0 deletions(-) mode change 100644 => 100755 __tests__/spelling-ignore.yml mode change 100644 => 100755 _rules/visible-label-in-accessible-name-2ee8b8.md diff --git a/__tests__/spelling-ignore.yml b/__tests__/spelling-ignore.yml old mode 100644 new mode 100755 diff --git a/_rules/visible-label-in-accessible-name-2ee8b8.md b/_rules/visible-label-in-accessible-name-2ee8b8.md old mode 100644 new mode 100755 From 4a5b6318164d6368420a0d08cf299272eebd867d Mon Sep 17 00:00:00 2001 From: Jean-Yves Moyen Date: Mon, 6 Apr 2020 11:30:40 +0200 Subject: [PATCH 66/67] Change hidden to hidden state --- pages/glossary/{hidden.md => hidden-state.md} | 8 +++++--- pages/glossary/semantic-role.md | 2 +- 2 files changed, 6 insertions(+), 4 deletions(-) rename pages/glossary/{hidden.md => hidden-state.md} (69%) diff --git a/pages/glossary/hidden.md b/pages/glossary/hidden-state.md similarity index 69% rename from pages/glossary/hidden.md rename to pages/glossary/hidden-state.md index 8f89b9ee7e..9da9226306 100755 --- a/pages/glossary/hidden.md +++ b/pages/glossary/hidden-state.md @@ -1,6 +1,6 @@ --- -title: Explicitly Hidden -key: hidden +title: Hidden State +key: hidden-state unambiguous: true objective: true input_aspects: @@ -8,12 +8,14 @@ input_aspects: - DOM tree --- -An HTML element is _hidden_ if at least one of the following is true for itself or any of its [ancestors][] in the [flat tree][]: +An HTML element's _hidden state_ is "true" if at least one of the following is true for itself or any of its [ancestors][] in the [flat tree][]: - has a `hidden` attribute; or - has a [computed](https://www.w3.org/TR/css-cascade/#computed-value) CSS property `display` of `none`; or - has a [computed](https://www.w3.org/TR/css-cascade/#computed-value) CSS property `visibility` of `hidden`. - has an `aria-hidden` attribute set to `true` +In any other case, the element's _hidden state_ is "false". + [ancestors]: https://dom.spec.whatwg.org/#concept-tree-ancestor 'Definition Ancestor' [flat tree]: https://drafts.csswg.org/css-scoping/#flat-tree 'Definition of flat tree' diff --git a/pages/glossary/semantic-role.md b/pages/glossary/semantic-role.md index 5cf6017c10..aff4f99e71 100755 --- a/pages/glossary/semantic-role.md +++ b/pages/glossary/semantic-role.md @@ -13,7 +13,7 @@ Valid semantic roles are defined by standards. For web content and applications The _semantic role_ of an element is determined by the first of these cases that applies: -1. **Conflict** If the element has an [explicit role][] which is either `none` or `presentation`, but the element is [included in the accessibility tree][]; or would be [included in the accessibility tree][] when it is not [hidden](#hidden), then its _semantic role_ is its **[implicit role][]**. +1. **Conflict** If the element has an [explicit role][] which is either `none` or `presentation`, but the element is [included in the accessibility tree][]; or would be [included in the accessibility tree][] when its [hidden state](#hidden-state) is true, then its _semantic role_ is its **[implicit role][]**. 2. **Explicit** If the element has an [explicit role][], then its _semantic role_ is its [explicit role][]. 3. **Implicit** The _semantic role_ of the element is its [implicit role][]. From e6e297776c17143c7c32525d2b07b0baaf3db1e9 Mon Sep 17 00:00:00 2001 From: Jean-Yves Moyen Date: Tue, 28 Apr 2020 09:36:33 +0200 Subject: [PATCH 67/67] Cleanup --- __tests__/spelling-ignore.yml | 0 1 file changed, 0 insertions(+), 0 deletions(-) mode change 100644 => 100755 __tests__/spelling-ignore.yml diff --git a/__tests__/spelling-ignore.yml b/__tests__/spelling-ignore.yml old mode 100644 new mode 100755