Testing plan for :dir() pseudo-class

[zcorpan]

Relevant spec sections:

https://drafts.csswg.org/selectors-4/#the-dir-pseudo
https://html.spec.whatwg.org/multipage/semantics-other.html#selector-ltr

The interesting cases to test are from the definition of "directionality" in HTML:
https://html.spec.whatwg.org/multipage/dom.html#the-directionality

• element with dir="ltr" matches :dir(ltr) [selectors4] Implement :dir pseudo-class #26159
• root element without dir attribute matches :dir(ltr)
• root element with dir="invalid" matches :dir(ltr)
• <input type=tel> (HTML: Add test for <input type=tel> matching :dir() #25599)
  • without dir matches :dir(ltr)
  • with dir="invalid" matches :dir(ltr)
  • with dir="rtl" matches :dir(rtl)
• element with dir="rtl" matches :dir(rtl)
• child of element with dir="rtl" matches :dir(rtl)
• <input type=text/search/tel/url/email dir=auto>
• <textarea dir=auto>
• element with dir=auto
  • first character is of bidirectional character type AL or R matches :dir(rtl)
  • first character is of bidirectional character type L matches :dir(ltr)
  • test the first strong bidi character being in a child bdi, script, style, textarea, element with dir=ltr/rtl/auto (should be ignored for auto logic)
  • test the first strong bidi character being in a child that is display: none (should still affect directionality) Fix the updating dir=auto issue when inserting text into a display:none #27125
  • element is the root element and text has no strong bidi characters, matches :dir(ltr)
  • text has no strong bidi characters, parent has dir=rtl, matches :dir(rtl)
• <bdi> without dir with the same cases as "element with dir=auto"
• <bdi dir=ltr> and first character is of bidirectional character type AL or R matches :dir(ltr)
• <bdi dir=rtl> and first character is of bidirectional character type L matches :dir(rtl)
• child of element with dir="ltr" matches :dir(ltr)
• child of element with dir="rtl" matches :dir(rtl)
• non-HTML element with an (invalid) dir attribute does not affect :dir() matching.
• Shadow DOM Tests for directionality and shadow DOM #29820
• <slot> Fix the wrong directionality of slots #27954

Check for existing coverage in wpt: git grep -l ":dir(" (in 16 Sep 2020)

css/css-scoping/shadow-directionality-001.tentative.html
css/css-scoping/shadow-directionality-002.tentative.html
css/selectors/selectors-dir-selector-ltr-001.html
css/selectors/selectors-dir-selector-rtl-001.html
css/vendor-imports/mozilla/mozilla-central-reftests/counter-styles-3/disclosure-styles-ref.html
css/vendor-imports/mozilla/mozilla-central-reftests/selectors4/dir-style-01a.html
css/vendor-imports/mozilla/mozilla-central-reftests/selectors4/dir-style-01b.html
css/vendor-imports/mozilla/mozilla-central-reftests/selectors4/dir-style-02a.html
css/vendor-imports/mozilla/mozilla-central-reftests/selectors4/dir-style-02b.html
css/vendor-imports/mozilla/mozilla-central-reftests/selectors4/dir-style-03a.html
css/vendor-imports/mozilla/mozilla-central-reftests/selectors4/dir-style-03b.html
css/vendor-imports/mozilla/mozilla-central-reftests/selectors4/dir-style-04.html
html/semantics/selectors/pseudo-classes/dir.html
html/semantics/selectors/pseudo-classes/dir01.html
shadow-dom/directionality-002.tentative.html

(Maybe also check for dir="auto" tests)

[zcorpan]

The html/semantics/selectors/pseudo-classes/dir.html test seems suitable to extend with additional cases.

[MyidShin]

FYI, recently TCs[1][2] for :dir() which cover the list below have been added.

 element with dir="ltr" matches :dir(ltr)
 element with dir="rtl" matches :dir(rtl)
 child of element with dir="rtl" matches :dir(rtl)
 element with dir=auto ** not for <bdi> ** 
   first character is of bidirectional character type AL or R matches :dir(rtl)
   first character is of bidirectional character type L matches 
   test the first strong bidi character being in a child that is display: none (should still affect directionality)
   text has no strong bidi characters, parent has dir=rtl, matches :dir(rtl)
 child of element with dir="ltr" matches :dir(ltr)
 child of element with dir="rtl" matches :dir(rtl)
 non-HTML element with an (invalid) dir attribute does not affect :dir() matching.

I think it would be nice if the checklist includes something about shadow dom and [3]. :)

[1] 7741972
[2] 60d6e8d
[3] 126ec5c

[zcorpan]

Thanks @MyidShin! I've invited you to the web-platform-tests reviewers team, which I think would let you edit my comment. I'll edit my comment for now with your suggestions

[zcorpan]

cc @bkardell

[bkardell]

It's interesting, I guess we need to compare because it looks like #29820 has like 40+ tests which I believe are just a couple of checkboxes here?

[dbaron]

#41620 also has some tests to land for this.

[dbaron]

Many additional tests have landed for this, but at some point one of us should go through the list in the initial comment and see what's missing.