Skip to content
This repository was archived by the owner on Jul 9, 2025. It is now read-only.

Commit 06ccd2b

Browse files
dbaronmoz-wptsync-bot
authored andcommitted
Bug 1876401 [wpt PR 44178] - Add tests for direction and bidi isolation behavior of <slot> element., a=testonly
Automatic update from web-platform-tests Add tests for direction and bidi isolation behavior of <slot> element. These tests are based on the tests previously in https://crrev.com/c/4800075 and https://crrev.com/c/4973701, but are revised to reflect that the HTML spec changes that those changes were implementing have been reverted in whatwg/html#9880 Bug: 576815 Change-Id: Id4536cb39691c2d234113f891f96d7100c7eeea4 Reviewed-on: https://chromium-review.googlesource.com/c/chromium/src/+/5233352 Reviewed-by: Di Zhang <[email protected]> Auto-Submit: David Baron <[email protected]> Commit-Queue: Di Zhang <[email protected]> Cr-Commit-Position: refs/heads/main@{#1251783} -- wpt-commits: 41bbcfcc813d99401ca0cacfa392c87d6f18ffca wpt-pr: 44178
1 parent 6683f10 commit 06ccd2b

File tree

3 files changed

+102
-0
lines changed

3 files changed

+102
-0
lines changed
Lines changed: 72 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,72 @@
1+
// https://html.spec.whatwg.org/multipage/rendering.html#bidi-rendering
2+
// https://github.com/whatwg/html/pull/9796
3+
// https://github.com/whatwg/html/pull/9880
4+
5+
for (let t of [
6+
{
7+
description: "<slot> inherits direction from parent",
8+
shadow_tree: `
9+
<div dir=ltr data-expected="ltr">
10+
<slot data-expected="ltr"></slot>
11+
</div>
12+
`,
13+
host_dir: "rtl",
14+
},
15+
{
16+
description: "<slot> inherits CSS direction from parent",
17+
shadow_tree: `
18+
<div style="direction: ltr" data-expected="ltr">
19+
<slot data-expected="ltr"></slot>
20+
</div>
21+
`,
22+
host_dir: "rtl",
23+
},
24+
{
25+
description: "<slot dir=ltr>",
26+
shadow_tree: `
27+
<slot dir="ltr" data-expected="ltr"></slot>
28+
`,
29+
host_dir: "rtl",
30+
},
31+
{
32+
description: "<slot dir=rtl>",
33+
shadow_tree: `
34+
<slot dir="rtl" data-expected="rtl"></slot>
35+
`,
36+
host_dir: "ltr",
37+
},
38+
{
39+
description: "<slot dir=auto> resolving to LTR",
40+
shadow_tree: `
41+
<slot dir="ltr" data-expected="ltr"></slot>
42+
`,
43+
host_dir: "rtl",
44+
host_contents: "A",
45+
},
46+
{
47+
description: "<slot dir=auto> resolving to RTL",
48+
shadow_tree: `
49+
<slot dir="rtl" data-expected="rtl"></slot>
50+
`,
51+
host_dir: "ltr",
52+
host_contents: "\u0627",
53+
},
54+
]) {
55+
test(() => {
56+
let host = document.createElement("div");
57+
document.body.appendChild(host);
58+
host.dir = t.host_dir;
59+
if ("host_contents" in t) {
60+
host.innerHTML = t.host_contents;
61+
}
62+
63+
let root = host.attachShadow({mode: "open"});
64+
root.innerHTML = t.shadow_tree;
65+
66+
for (let e of Array.from(root.querySelectorAll("[data-expected]"))) {
67+
assert_equals(getComputedStyle(e).direction, e.getAttribute("data-expected"), `direction of ${e.nodeName}`);
68+
}
69+
70+
host.remove();
71+
}, `<slot> element sets CSS direction property: ${t.description}`);
72+
}
Lines changed: 8 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,8 @@
1+
<!DOCTYPE html>
2+
<title>HTML Rendering: slot element has unicode-bidi: isolate</title>
3+
<link rel="author" title="L. David Baron" href="https://dbaron.org/">
4+
<link rel="author" title="Google" href="http://www.google.com/">
5+
6+
<div style="unicode-bidi: bidi-override; direction: ltr;">&#x5D1;-&#x5D0;</div>
7+
8+
<div>normal</div>
Lines changed: 22 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,22 @@
1+
<!DOCTYPE html>
2+
<title>HTML Rendering: slot element has unicode-bidi: isolate</title>
3+
<link rel="author" title="L. David Baron" href="https://dbaron.org/">
4+
<link rel="author" title="Google" href="http://www.google.com/">
5+
<link rel="help" href="https://html.spec.whatwg.org/multipage/rendering.html#bidi-rendering">
6+
<link rel="help" href="https://github.com/whatwg/html/pull/9880">
7+
<link rel="match" href="slot-no-isolate-001-ref.html">
8+
9+
<div>&#x5D0;-<span id="e">&#x5D1;</span></div>
10+
11+
<div id="v"></div>
12+
13+
<script>
14+
15+
let e = document.getElementById("e");
16+
let root = e.attachShadow({mode: "open"});
17+
// use display:inline to override default display:contents
18+
root.innerHTML = "<slot style='display:inline'>\u05D2</slot>";
19+
let val = getComputedStyle(root.querySelector("slot")).unicodeBidi;
20+
document.getElementById("v").innerText = val;
21+
22+
</script>

0 commit comments

Comments
 (0)