Contact emailsdba...@chromium.org, dizha...@chromium.org,
myid.s...@igalia.com

ExplainerNone

Specificationhttps://www.w3.org/TR/selectors-4/#the-dir-pseudo

Summary

The :dir() CSS pseudo-class selector matches elements based on
directionality, which is determined based on the HTML dir attribute.
:dir(ltr) matches left-to-right text directionality, and :dir(rtl) matches
elements with right-to-left text directionality. It is not equivalent to
[dir] attribute selectors because it matches against directions inherited
from an ancestor with the dir attribute, and because it matches against the
direction computed from use of dir=auto (which determines directionality
from the first character in the text with strong directionality).


Blink componentBlink>CSS
<https://bugs.chromium.org/p/chromium/issues/list?q=component:Blink%3ECSS>

TAG review

TAG review statusNot applicable

Risks


Interoperability and Compatibility

This is largely an additive feature. However, as part of the process of
preparing to ship the feature, we worked on more clearly specifying exactly
how directionality in HTML works, and particularly how it interacts with
shadow DOM. This work is occurring in
https://github.com/whatwg/html/issues/3699
https://github.com/whatwg/html/pull/9554 and
https://github.com/whatwg/html/pull/9796 . Since these changes to HTML
directionality also affect the dirname attribute (which is a form
submission feature), they have been implemented behind the same flag as the
pseudo-class. However, they are likely to be low risk because the
recommended way of using the dirname attribute is to use dir=auto on the
same element as the dirname attribute, and that usage pattern should not be
affected. This feature is part of Interop2023's focus area on CSS
Pseudo-classes: https://wpt.fyi/interop-2023


*Gecko*: Shipped/Shipping (
https://bugzilla.mozilla.org/show_bug.cgi?id=562169)

*WebKit*: Shipped/Shipping (https://bugs.webkit.org/show_bug.cgi?id=64861)
Supported as of Safari 16.4 according to https://caniuse.com/css-dir-pseudo

*Web developers*: No signals

*Other signals*: CSSWG consensus to ship documented in
https://www.w3.org/TR/css-2017/#experimental (CSSWG includes reps from all
major browser vendors)

WebView application risks

Does this intent deprecate or change behavior of existing APIs, such that
it has potentially high risk for Android WebView-based applications?

no


Debuggability

Same as other pseudo-classes


Will this feature be supported on all six Blink platforms (Windows, Mac,
Linux, Chrome OS, Android, and Android WebView)?No

Is this feature fully tested by web-platform-tests
<https://chromium.googlesource.com/chromium/src/+/main/docs/testing/web_platform_tests.md>
?Yes

WPT test plan (somewhat out of date, since recent CLs have added many
tests) at https://github.com/web-platform-tests/wpt/issues/25569 Existing
tests have names starting with "dir" in
https://wpt.fyi/results/css/selectors and
https://wpt.fyi/results/html/dom/elements/global-attributes PR for testing
shadow DOM interaction at
https://github.com/web-platform-tests/wpt/pull/29820 which will add
additional tests


Flag name on chrome://flags

Finch feature namekCSSPseudoDir

Requires code in //chrome?False

Tracking bughttps://code.google.com/p/chromium/issues/detail?id=576815

Availability expectationAvailable in all major browsers once we ship.

Sample links
https://jsfiddle.net/fxc9a8uc/1

Estimated milestones
Shipping on desktop 120
Shipping on Android 120
Shipping on WebView 120

Anticipated spec changes

Open questions about a feature may be a source of future web compat or
interop issues. Please list open issues (e.g. links to known github issues
in the project for the feature specification) whose resolution may
introduce web compat/interop risk (e.g., changing to naming or structure of
the API in a non-backward-compatible way).
PR at https://github.com/whatwg/html/pull/9796 to better define the
feature, particularly how it relates to Shadow DOM

Link to entry on the Chrome Platform Status
https://chromestatus.com/feature/5751531651465216

Links to previous Intent discussionsIntent to prototype:
https://groups.google.com/a/chromium.org/g/blink-dev/c/p0Wc66rbVOc/m/khHJ0dSsAwAJ

This intent message was generated by Chrome Platform Status
<https://chromestatus.com/>.

-- 
You received this message because you are subscribed to the Google Groups 
"blink-dev" group.
To unsubscribe from this group and stop receiving emails from it, send an email 
to blink-dev+unsubscr...@chromium.org.
To view this discussion on the web visit 
https://groups.google.com/a/chromium.org/d/msgid/blink-dev/CAG0MU3iYpepa-W7j8eX65F6KtMf1ioC82-ujZw%2BjnGNGpxEKzQ%40mail.gmail.com.

Reply via email to