Fix influence of on dir=auto computation of its shadow tree ancestors.

This change treats a  element as being a strong character, of its
resolved directionality, when resolving dir=auto on its shadow tree
ancestor.

This is behind the RuntimeEnabledFeatures::CSSPseudoDirEnabled() flag
because we're hoping to ship that feature soon and it makes sense to
ship related changes to direction handling all at once rather than
piecemeal.

This is based on the proposed behavior described in:
whatwg/html#3699 (comment)
which is in the process of being specified in:
whatwg/html#9166
whatwg/html#9452
whatwg/html#9554

This fixes the failures of:
external/wpt/shadow-dom/directionality/dir-shadow-30.html
external/wpt/shadow-dom/directionality/dir-shadow-34.html
in the still-unlanded WPT PR at
#29820

This also changes the existing WPT
html/dom/elements/global-attributes/dir-slots-directionality.tentative.html
in the following ways:
 * split the test into separate test() functions to get separate results
 * add a sixth test testing 
 * add tests of the :dir() selector for each test (where Chromium fails
   this test for test 1)
 * change the expected result of the fourth test to match this code
   change and the proposed specification

Bug: 576815
Change-Id: I83551e9bc5807109c5318bace486cfc93fc25bbb
Reviewed-on: https://chromium-review.googlesource.com/c/chromium/src/+/4800366
Reviewed-by: Di Zhang 
Commit-Queue: David Baron 
Cr-Commit-Position: refs/heads/main@{#1186743}

Author: dbaron

html/dom/elements/global-attributes/dir-slots-directionality.tentative.html

@@ -2,37 +2,65 @@
 <title>HTML Test: dir=auto|rtl with slots, and direction should be RTLtitle>
 <meta charset="UTF-8">
 <meta name="author" title="Miyoung Shin" href="mailto:[email protected]">
-<meta name="assert" content="When dir='auto', the direction is set according to
-  slot's assigned node. And the direction should be propagated to shadow" />
+<meta name="author" title="L. David Baron" href="mailto:[email protected]">
 <link rel="help" href="https://html.spec.whatwg.org/multipage/#the-dir-attribute"/>
+<link rel="help" href="https://github.com/whatwg/html/issues/3699">
 <script src="/resources/testharness.js">script>
 <script src="/resources/testharnessreport.js">script>
 <div id="host1"><span>span>div>
 <div id="host2" dir="rtl">div>
 <span id="host3" dir="auto">span>
 <div id="host4">اختبرdiv>
 <div id="host5">div>
+<div id="host6">اختبرdiv>
 <script>
-let root1 = host1.attachShadow({mode:"open"});
-root1.innerHTML = '';
 
-let root2 = host2.attachShadow({mode:"open"});
-root2.innerHTML = '';
+test(() => {
+  let root1 = host1.attachShadow({mode:"open"});
+  root1.innerHTML = '';
+  let span = host1.firstChild;
+  assert_equals(getComputedStyle(span).direction, "rtl");
+  assert_true(span.matches(":dir(ltr)"));
+}, 'Slots: Directionality: dir=rtl on slot');
 
-let root3 = host3.attachShadow({mode:"open"});
-root3.innerHTML = `اختبر`;
+test(() => {
+  let root2 = host2.attachShadow({mode:"open"});
+  root2.innerHTML = '';
+  let span = root2.querySelector("span");
+  assert_equals(getComputedStyle(span).direction, "rtl");
+  assert_true(span.matches(":dir(rtl)"));
+}, 'Slots: Directionality: dir=rtl on host');
 
-let root4 = host4.attachShadow({mode:"open"});
-root4.innerHTML = '';
+test(() => {
+  let root3 = host3.attachShadow({mode:"open"});
+  root3.innerHTML = `اختبر`;
+  let span = host3;
+  assert_equals(getComputedStyle(span).direction, "ltr");
+  assert_true(span.matches(":dir(ltr)"));
+}, 'Slots: Directionality: dir=auto on host with Arabic shadow tree content');
 
-let root5 = host5.attachShadow({mode:"open"});
+test(() => {
+  let root4 = host4.attachShadow({mode:"open"});
+  root4.innerHTML = '';
+  let span = root4.querySelector("span");
+  assert_equals(getComputedStyle(span).direction, "ltr");
+  assert_true(span.matches(":dir(ltr)"));
+}, 'Slots: Directionality: dir=auto in shadow tree with Arabic light tree content');
+
+test(() => {
+  let root5 = host5.attachShadow({mode:"open"});
   root5.innerHTML = 'اختبر';
+  let span = root5.querySelector("span");
+  assert_equals(getComputedStyle(span).direction, "rtl");
+  assert_true(span.matches(":dir(rtl)"));
+}, 'Slots: Directionality: dir=auto in shadow tree with Arabic shadow tree content');
 
 test(() => {
-  assert_equals(getComputedStyle(host1.firstChild).direction, "rtl");
-  assert_equals(getComputedStyle(root2.querySelector("span")).direction, "rtl");
-  assert_equals(getComputedStyle(host3).direction, "ltr");
-  assert_equals(getComputedStyle(root4.querySelector("span")).direction, "rtl");
-  assert_equals(getComputedStyle(root5.querySelector("span")).direction, "rtl");
-}, 'Slots: Directionality');
+  let root6 = host6.attachShadow({mode:"open"});
+  root6.innerHTML = '';
+  let span = root6.querySelector("slot");
+  assert_equals(getComputedStyle(span).direction, "rtl");
+  assert_true(span.matches(":dir(rtl)"));
+}, 'Slots: Directionality: dir=auto on slot with Arabic light tree content');
+
 script>