From b047b57b928d8b1509fcce8bc7aa1666304f1c07 Mon Sep 17 00:00:00 2001 From: "L. David Baron" Date: Wed, 24 Jan 2024 11:48:30 -0800 Subject: [PATCH] Add support for allowing elements with display:contents to be focused. Chromestatus: https://chromestatus.com/feature/6237396851228672 This lands support for allowing elements with display:contents to be focused, behind a feature flag that is created with status:experimental. This is as concluded (though without a group resolution) in https://github.com/w3c/csswg-drafts/issues/2632 and as discussed a bit in https://github.com/whatwg/html/issues/1837 and proposed in https://github.com/whatwg/html/pull/9425 . Note that this diverges from Gecko (see https://bugzil.la/1553549, https://bugzil.la/1791648, and https://github.com/mozilla/standards-positions/issues/772) and WebKit (see https://bugs.webkit.org/show_bug.cgi?id=255149 and https://github.com/WebKit/standards-positions/issues/164). This makes the element focusable when it has a tabindex. Note that this does not match Gecko and WebKit, which also require that its 'display' value is changed (away from 'contents') to make it focusable. Note that the element is still not tabbable in Chrome; this is https://crbug.com/1428419. This also does not match Gecko and WebKit, where it is tabbable whenever it is focusable. The added test slot-element-tabbable.tentative.html fails both tests as a result, but is added anyway. (Gecko and WebKit pass the display: block test but fail the default style (display: contents) test.) The added tests display-contents-focusable-001.html and slot-element-focusable.tentative.html are partly fixed by this change, but the style part is still broken due to https://crbug.com/1428420. Fixed: 1366037 Bug: 1428419, 1428420 Change-Id: I46a8ad3b6442ce07f440c8f6a07210bac305600e --- .../display-contents-focusable-001.html | 41 +++++++++++++ .../slot-element-focusable.tentative.html | 50 ++++++++++++++++ .../slot-element-tabbable.tentative.html | 57 +++++++++++++++++++ ...escendants-focusability-003.tentative.html | 13 +++-- 4 files changed, 155 insertions(+), 6 deletions(-) create mode 100644 css/css-display/display-contents-focusable-001.html create mode 100644 html/rendering/non-replaced-elements/flow-content-0/slot-element-focusable.tentative.html create mode 100644 html/rendering/non-replaced-elements/flow-content-0/slot-element-tabbable.tentative.html diff --git a/css/css-display/display-contents-focusable-001.html b/css/css-display/display-contents-focusable-001.html new file mode 100644 index 000000000000000..e664b6fcf9fc667 --- /dev/null +++ b/css/css-display/display-contents-focusable-001.html @@ -0,0 +1,41 @@ + +CSS Test (Display): Elements with display:contents should be focusable + + + + + + + + + + + +
Hello
+ + + diff --git a/html/rendering/non-replaced-elements/flow-content-0/slot-element-focusable.tentative.html b/html/rendering/non-replaced-elements/flow-content-0/slot-element-focusable.tentative.html new file mode 100644 index 000000000000000..4d5d92b5b4e8657 --- /dev/null +++ b/html/rendering/non-replaced-elements/flow-content-0/slot-element-focusable.tentative.html @@ -0,0 +1,50 @@ + +CSS Test (Display): <slot> elements should be focusable + + + + + + + + + + + + + + diff --git a/html/rendering/non-replaced-elements/flow-content-0/slot-element-tabbable.tentative.html b/html/rendering/non-replaced-elements/flow-content-0/slot-element-tabbable.tentative.html new file mode 100644 index 000000000000000..ef0e66fbbc0bd78 --- /dev/null +++ b/html/rendering/non-replaced-elements/flow-content-0/slot-element-tabbable.tentative.html @@ -0,0 +1,57 @@ + +CSS Test (Display): <slot> elements should be tabbable + + + + + + + + + + + + + + +
+ + + diff --git a/html/semantics/embedded-content/the-canvas-element/canvas-descendants-focusability-003.tentative.html b/html/semantics/embedded-content/the-canvas-element/canvas-descendants-focusability-003.tentative.html index 98d60cfe9898447..cd42d1e6b7aac00 100644 --- a/html/semantics/embedded-content/the-canvas-element/canvas-descendants-focusability-003.tentative.html +++ b/html/semantics/embedded-content/the-canvas-element/canvas-descendants-focusability-003.tentative.html @@ -7,7 +7,8 @@ + explicit 'display: none' style, but can if they are not rendered because of + a 'display: contents' style.">
@@ -16,11 +17,11 @@ - -
-
- - + +
+
+ +