Chromium Code Reviews
chromiumcodereview-hr@appspot.gserviceaccount.com (chromiumcodereview-hr) | Please choose your nickname with Settings | Help | Chromium Project | Gerrit Changes | Sign out
(378)

Side by Side Diff: LayoutTests/fast/dom/shadow/attr-lang-inherit.html

Issue 878743003: Use the tree of trees for the lang attributes in Shadow DOM (Closed) Base URL: https://chromium.googlesource.com/chromium/blink.git@master
Patch Set: More tests added Created 5 years, 10 months ago
Use n/p to move between diff chunks; N/P to move between comments. Draft comments are only viewable by you.
Jump to:
View unified diff | Download patch
« no previous file with comments | « no previous file | Source/core/dom/Element.cpp » ('j') | no next file with comments »
Toggle Intra-line Diffs ('i') | Expand Comments ('e') | Collapse Comments ('c') | Show Comments Hide Comments ('s')
OLDNEW
(Empty)
1 <!DOCTYPE html>
2 <script src="../../../resources/testharness.js"></script>
3 <script src="../../../resources/testharnessreport.js"></script>
4 <style>
5 #container > div {
6 border: green solid thin;
7 }
8 :lang(fr) { background:blue; color:white; }
9 :lang(ja) { background:green; color:white; }
10 </style>
11 <div id="container">
12 <p>Test passes if "French" are all in blue and other text are all in green.< /p>
13 <div lang="ja">
14 <div id="normal"></div>
15 <div id="distributed"><div>Distributed</div></div>
16 <div id="multiple"><div>Distributed to the youngest</div></div>
17 <div id="multilevel"><div>Multi-level Distributed</div></div>
18 <div id="older"></div>
19 <div id="redistributed"><div>Re-distributed</div></div>
20 </div>
21 </div>
22 <script>
23 setup({ explicit_done: true });
24 var fr = "rgb(0, 0, 255)";
25 var ja = "rgb(0, 128, 0)";
26 var style = "<style>:lang(fr) { background:blue; color:white; } :lang(ja) { back ground:green; color:white; }</style>";
27
28 testLangInShadow("lang inherits into the shadow tree",
29 document.getElementById("normal"),
30 style + "<div lang=fr>French</div><div>Inherit Normally</div>",
31 [[function (root) { return root.querySelector("div"); }, fr],
32 [function (root) { return root.lastChild; }, ja]]);
33
34 testLangInShadow("lang of the distributed content traverses the tree of trees",
35 document.getElementById("distributed"),
36 style + "<div lang=fr><div>French</div><content></content></div>",
37 [[function (root) { return root.querySelector("div"); }, fr],
38 [function (root) { return root.host.firstChild; }, ja]]);
39
40 testLangInShadow("lang of the distributed content traverses the tree of trees (m ultiple shadow roots)",
41 (function () {
42 var host = document.getElementById("multiple");
43 createShadowRoot(host, style + "<content></content>");
44 return host;
45 })(),
46 style + "<div lang=fr><div>French</div><content></content></div>",
47 [[function (root) { return root.querySelector("div"); }, fr],
48 [function (root) { return root.host.firstChild; }, ja]]);
49
50 testLangInShadow("lang of the distributed content traverses the tree of trees (m ultiple levels)",
51 createShadowRoot(document.getElementById("multilevel"), "<div><content></con tent></div>").firstChild,
52 style + "<div lang=fr><div>French</div><content></content></div>",
53 [[function (root) { return root.querySelector("div"); }, fr],
54 [function (root) { return document.getElementById("multilevel").firstChild; }, ja]]);
55
56 testLangInShadow("lang of the older shadow root traverses the tree of trees",
57 (function () {
58 var host = document.getElementById("older");
59 createShadowRoot(host, style + "<div>olderShadowRoot</div>");
60 return host;
61 })(),
62 style + "<div lang=fr><div>French</div><shadow></shadow></div>",
63 [[function (root) { return root.querySelector("div"); }, fr],
64 [function (root) { return root.olderShadowRoot.querySelector("div"); }, ja]] );
65
66 testLangInShadow("lang of the re-distributed content traverses the tree of trees ",
67 (function () {
68 var host = document.getElementById("redistributed");
69 createShadowRoot(host, style + "<div lang=fr><div>French</div><content>< /content></div>");
70 return host;
71 })(),
72 style + "<shadow></shadow>",
73 [[function (root) { return root.olderShadowRoot.querySelector("div"); }, fr] ,
74 [function (root) { return root.host.firstChild; }, ja]]);
75
76 function testLangInShadow(description, host, shadowHtml, elementAndExpectedList) {
77 test(function () {
78 var root = createShadowRoot(host, shadowHtml);
79 elementAndExpectedList.forEach(function (elementAndExpected) {
80 var element = elementAndExpected[0](root);
hayato 2015/02/03 02:22:27 I think that calling function with a shadow root h
kojii 2015/02/04 02:10:05 Done.
81 var actual = getComputedStyle(element).backgroundColor;
82 assert_equals(actual, elementAndExpected[1]);
83 });
84 }, description);
85 }
86
87 function createShadowRoot(host, shadowHtml) {
hayato 2015/02/03 02:22:27 Can we have a better name for this function? It'd
kojii 2015/02/04 02:10:05 Done.
88 var root = host.createShadowRoot();
89 root.innerHTML = shadowHtml;
90 return root;
91 }
92
93 if (window.testRunner)
94 container.style.display = "none";
95 done();
96 </script>
OLDNEW
« no previous file with comments | « no previous file | Source/core/dom/Element.cpp » ('j') | no next file with comments »

Powered by Google App Engine
This is Rietveld 408576698