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

Side by Side Diff: third_party/WebKit/LayoutTests/svg/dom/custom-elements.html

Issue 1751953003: Remove the support of multiple shadow roots with a user agent shadow root (Closed) Base URL: https://chromium.googlesource.com/chromium/src.git@master
Patch Set: fix failing tests Created 4 years, 9 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
OLDNEW
1 <!DOCTYPE HTML> 1 <!DOCTYPE HTML>
2 <script> 2 <script>
3 document.registerElement("x-g", { extends: "g", prototype: { 3 document.registerElement("x-g", { extends: "g", prototype: {
4 __proto__: SVGGElement.prototype, 4 __proto__: SVGGElement.prototype,
5 createdCallback: function() { 5 createdCallback: function() {
6 var greenBox = document.createElementNS('http://www.w3.org/2000/svg', 'rec t'); 6 var greenBox = document.createElementNS('http://www.w3.org/2000/svg', 'rec t');
7 greenBox.setAttribute('width', '20'); 7 greenBox.setAttribute('width', '20');
8 greenBox.setAttribute('height', '20'); 8 greenBox.setAttribute('height', '20');
9 greenBox.setAttribute('fill', 'green'); 9 greenBox.setAttribute('fill', 'green');
10 this.createShadowRoot().appendChild(greenBox); 10 this.createShadowRoot().appendChild(greenBox);
11 } 11 }
12 } 12 }
13 }); 13 });
14 14
15 document.registerElement("x-use", { extends: "use", prototype: {
16 __proto__: SVGUseElement.prototype,
17 createdCallback: function() {
18 var greenBox = document.createElementNS('http://www.w3.org/2000/svg', 'rec t');
19 greenBox.setAttribute('width', '20');
20 greenBox.setAttribute('height', '20');
21 greenBox.setAttribute('fill', 'green');
22 this.createShadowRoot().appendChild(greenBox);
23 }
24 }
25 });
26
27 document.registerElement("x-green", { extends: "g", prototype: { 15 document.registerElement("x-green", { extends: "g", prototype: {
28 __proto__: SVGGElement.prototype, 16 __proto__: SVGGElement.prototype,
29 createdCallback: function() { 17 createdCallback: function() {
30 var shadow = this.createShadowRoot(); 18 var shadow = this.createShadowRoot();
31 var style = document.createElement('style'); 19 var style = document.createElement('style');
32 style.appendChild(document.createTextNode(':host::shadow * { fill: green; }')); 20 style.appendChild(document.createTextNode(':host::shadow * { fill: green; }'));
33 shadow.appendChild(style); 21 shadow.appendChild(style);
34 var rect = document.createElementNS('http://www.w3.org/2000/svg', 'rect'); 22 var rect = document.createElementNS('http://www.w3.org/2000/svg', 'rect');
35 rect.setAttribute('width', '20'); 23 rect.setAttribute('width', '20');
36 rect.setAttribute('height', '20'); 24 rect.setAttribute('height', '20');
(...skipping 11 matching lines...) Expand all
48 }); 36 });
49 </script> 37 </script>
50 38
51 <svg width="30px" height="30px" xmlns="http://www.w3.org/2000/svg"> 39 <svg width="30px" height="30px" xmlns="http://www.w3.org/2000/svg">
52 <g is="x-g"> 40 <g is="x-g">
53 <rect width="100" height="100" fill="red"></rect> 41 <rect width="100" height="100" fill="red"></rect>
54 </g> 42 </g>
55 </svg><br> 43 </svg><br>
56 44
57 <svg width="30px" height="30px" xmlns="http://www.w3.org/2000/svg"> 45 <svg width="30px" height="30px" xmlns="http://www.w3.org/2000/svg">
58 <use is="x-use">
59 <rect width="100" height="100" fill="red"></rect>
60 </use>
61 </svg><br>
62
63 <svg width="30px" height="30px" xmlns="http://www.w3.org/2000/svg">
64 <defs> 46 <defs>
65 <rect id="use-green" width="20" height="20" fill="green"></rect> 47 <rect id="use-green" width="20" height="20" fill="green"></rect>
66 </defs> 48 </defs>
67 <use xlink:href="#use-green"></use> 49 <use xlink:href="#use-green"></use>
68 </svg><br> 50 </svg><br>
69 51
70 <svg width="30px" height="30px" xmlns="http://www.w3.org/2000/svg"> 52 <svg width="30px" height="30px" xmlns="http://www.w3.org/2000/svg">
71 <defs>
72 <rect id="use-red" width="100" height="10" fill="red"></rect>
73 </defs>
74 <use is="x-use" xlink:href="#use-red"></use>
75 </svg><br>
76
77 <svg width="30px" height="30px" xmlns="http://www.w3.org/2000/svg">
78 <g is="x-green"> 53 <g is="x-green">
79 <rect width="100" height="100" fill="red"></rect> 54 <rect width="100" height="100" fill="red"></rect>
80 </g> 55 </g>
81 </svg><br> 56 </svg><br>
82 57
83 <svg width="30px" height="30px" xmlns="http://www.w3.org/2000/svg"> 58 <svg width="30px" height="30px" xmlns="http://www.w3.org/2000/svg">
84 <text is="x-pass" font-size="10px" y="20">FAIL</text> 59 <text is="x-pass" font-size="10px" y="20">FAIL</text>
85 </svg> 60 </svg>
OLDNEW

Powered by Google App Engine
This is Rietveld 408576698