Skip to content

Improve definition of "disabled element" #1503

New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Merged
merged 9 commits into from
Nov 24, 2020
Merged
Show file tree
Hide file tree
Changes from all commits
Commits
File filter

Filter by extension

Filter by extension

Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
3 changes: 3 additions & 0 deletions _rules/text-contrast-afw4f7.md
Original file line number Diff line number Diff line change
Expand Up @@ -46,6 +46,8 @@ For each test target, the [highest possible contrast][] between the [foreground

- Text that has the same foreground and background color (a contrast ratio of 1:1) is not considered to be "visual presentation of text", making it inapplicable to the success criterion. Text hidden in this way can still cause accessibility issues under other success criteria, depending on the content.

- The definition of [disabled element][disabled] assumes that when the `aria-disabled` attribute is specified on an element, this element has also been disabled for users that do not rely on [assistive technology][]. If this is not the case, that definition may produce incorrect results and in consequence this rule might be Inapplicable to some text nodes that still require a good contrast ratio.

## 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.
Expand Down Expand Up @@ -380,6 +382,7 @@ This text is part of a label of a [disabled][] widget, because it is in a `label

[accessible name]: #accessible-name 'Definition of Accessible Name'
[ancestor]: https://dom.spec.whatwg.org/#concept-shadow-including-ancestor 'DOM, ancestor, 2020/07/23'
[assistive technology]: https://www.w3.org/TR/WCAG21/#dfn-assistive-technologies 'WCAG definition of Assistive Technologies'
[background colors]: #background-colors-of-text 'Definition of Background color of text'
[child]: https://dom.spec.whatwg.org/#concept-tree-child 'DOM, child, 2020/07/23'
[disabled]: #disabled-element 'Definition of Disabled'
Expand Down
39 changes: 10 additions & 29 deletions pages/glossary/disabled-element.md
Original file line number Diff line number Diff line change
Expand Up @@ -7,38 +7,19 @@ input_aspects:
- DOM tree
---

An element is considered disabled when it has been rendered [inoperable][] using one of the following properties:
An element is _disabled_ when it has been rendered [inoperable][] in one of the following ways:

1. The [`disabled`][disabled] attribute. The presence of this attribute, regardless of its value, on a
1. The element matches the [`:disabled` pseudo-class][disabled pseudo-class]. For HTML elements this means that the element is [actually disabled][].

- [`button`][button],
- [`input`][input],
- [`select`][select],
- [`textarea`][textarea],
- [form-associated custom element][],
- or [`fieldset`][fieldset] element
2. The element has a [shadow-including ancestor][] whose `aria-disabled` [attribute value][] is "true".

will disable the element itself if it is not a [`fieldset`][fieldset] or, if it is, will disable any [descendants][descendant] of the element, excluding those that are [descendants][descendant] of the first [`legend`][legend] [child][] of the element.
#### Assumptions

**Note:** When the [`disabled`][disabled] attribute is specified on a [`fieldset`][fieldset] element, [shadow-including descendants][shadow-including descendant] are **not** disabled by default. Such behavior may however be explicitly implemented by [form-associated custom elements][form-associated custom element].
This definition assumes that when the `aria-disabled` attribute is specified on an element, this element has also been disabled for users that do not rely on [assistive technology][]. For example, this can be done by disabling pointer events using the `pointer-events` property and by disabling keyboard interactions using the `tabindex` attribute. If this is not the case, the definition will produce incorrect results.

2. The [`aria-disabled`][aria-disabled] attribute. The presence of this attribute with a value that is an [ASCII case-insensitive](https://infra.spec.whatwg.org/#ascii-case-insensitive) match for `true` on an element will communicate its state, and the state of its [shadow-including descendants][shadow-including descendant], as "disabled" to [assistive technology][].

**Note:** When the [`aria-disabled`][aria-disabled] attribute is specified on an element, it is assumed that the element has also been disabled for users that do not rely on [assistive technology][]. For example, this can be done by disabling pointer events using the [`pointer-events`][pointer-events] property and by disabling keyboard interactions using the [`tabindex`][tabindex] attribute.

[aria-disabled]: https://www.w3.org/TR/wai-aria/#aria-disabled
[assistive technology]: https://www.w3.org/TR/WCAG21/#dfn-assistive-technologies)
[button]: https://html.spec.whatwg.org/multipage/form-elements.html#the-button-element
[child]: https://dom.spec.whatwg.org/#concept-tree-child
[descendant]: https://dom.spec.whatwg.org/#concept-tree-descendant
[disabled]: https://html.spec.whatwg.org/multipage/form-control-infrastructure.html#attr-fe-disabled
[fieldset]: https://html.spec.whatwg.org/multipage/form-elements.html#the-fieldset-element
[form-associated custom element]: https://html.spec.whatwg.org/multipage/custom-elements.html#form-associated-custom-element
[input]: https://html.spec.whatwg.org/multipage/input.html#the-input-element
[legend]: https://html.spec.whatwg.org/multipage/form-elements.html#the-legend-element
[actually disabled]: https://html.spec.whatwg.org/multipage/semantics-other.html#concept-element-disabled 'HTML definition of Actually Disabled'
[assistive technology]: https://www.w3.org/TR/WCAG21/#dfn-assistive-technologies 'WCAG definition of Assistive Technologies'
[attribute value]: #attribute-value 'Definition of Attribute Value'
[disabled pseudo-class]: https://drafts.csswg.org/selectors/#disabled-pseudo "CSS Selectors Level 4 (Editor's Draft), definition of the :disabled pseudo-class"
[inoperable]: https://www.w3.org/TR/wai-aria/#dfn-operable
[pointer-events]: https://www.w3.org/TR/SVG2/interact.html#PointerEventsProperty
[select]: https://html.spec.whatwg.org/multipage/form-elements.html#the-select-element
[shadow-including descendant]: https://dom.spec.whatwg.org/#concept-shadow-including-descendant
[tabindex]: https://html.spec.whatwg.org/multipage/interaction.html#the-tabindex-attribute
[textarea]: https://html.spec.whatwg.org/multipage/form-elements.html#the-textarea-element
[shadow-including ancestor]: https://dom.spec.whatwg.org/#concept-shadow-including-ancestor