| Index: LayoutTests/svg/dom/custom-elements.html
|
| diff --git a/LayoutTests/svg/dom/custom-elements.html b/LayoutTests/svg/dom/custom-elements.html
|
| new file mode 100644
|
| index 0000000000000000000000000000000000000000..9c08e0c3fe99d596eb8915330a874f2ff2b45e79
|
| --- /dev/null
|
| +++ b/LayoutTests/svg/dom/custom-elements.html
|
| @@ -0,0 +1,85 @@
|
| +<!DOCTYPE HTML>
|
| +<script>
|
| +document.registerElement("x-g", { extends: "g", prototype: {
|
| + __proto__: SVGGElement.prototype,
|
| + createdCallback: function() {
|
| + var greenBox = document.createElementNS('http://www.w3.org/2000/svg', 'rect');
|
| + greenBox.setAttribute('width', '20');
|
| + greenBox.setAttribute('height', '20');
|
| + greenBox.setAttribute('fill', 'green');
|
| + this.createShadowRoot().appendChild(greenBox);
|
| + }
|
| + }
|
| +});
|
| +
|
| +document.registerElement("x-use", { extends: "use", prototype: {
|
| + __proto__: SVGUseElement.prototype,
|
| + createdCallback: function() {
|
| + var greenBox = document.createElementNS('http://www.w3.org/2000/svg', 'rect');
|
| + greenBox.setAttribute('width', '20');
|
| + greenBox.setAttribute('height', '20');
|
| + greenBox.setAttribute('fill', 'green');
|
| + this.createShadowRoot().appendChild(greenBox);
|
| + }
|
| + }
|
| +});
|
| +
|
| +document.registerElement("x-green", { extends: "g", prototype: {
|
| + __proto__: SVGGElement.prototype,
|
| + createdCallback: function() {
|
| + var shadow = this.createShadowRoot();
|
| + var style = document.createElement('style');
|
| + style.appendChild(document.createTextNode(':host::shadow * { fill: green; }'));
|
| + shadow.appendChild(style);
|
| + var rect = document.createElementNS('http://www.w3.org/2000/svg', 'rect');
|
| + rect.setAttribute('width', '20');
|
| + rect.setAttribute('height', '20');
|
| + shadow.appendChild(rect);
|
| + }
|
| + }
|
| +});
|
| +
|
| +document.registerElement("x-pass", { extends: "text", prototype: {
|
| + __proto__: SVGTextElement.prototype,
|
| + createdCallback: function() {
|
| + this.innerHTML = this.innerHTML.replace('FAIL', 'PASS');
|
| + }
|
| + }
|
| +});
|
| +</script>
|
| +
|
| +<svg width="30px" height="30px" xmlns="http://www.w3.org/2000/svg">
|
| + <g is="x-g">
|
| + <rect width="100" height="100" fill="red"></rect>
|
| + </g>
|
| +</svg><br>
|
| +
|
| +<svg width="30px" height="30px" xmlns="http://www.w3.org/2000/svg">
|
| + <use is="x-use">
|
| + <rect width="100" height="100" fill="red"></rect>
|
| + </use>
|
| +</svg><br>
|
| +
|
| +<svg width="30px" height="30px" xmlns="http://www.w3.org/2000/svg">
|
| + <defs>
|
| + <rect id="use-green" width="20" height="20" fill="green"></rect>
|
| + </defs>
|
| + <use xlink:href="#use-green"></use>
|
| +</svg><br>
|
| +
|
| +<svg width="30px" height="30px" xmlns="http://www.w3.org/2000/svg">
|
| + <defs>
|
| + <rect id="use-red" width="100" height="10" fill="red"></rect>
|
| + </defs>
|
| + <use is="x-use" xlink:href="#use-red"></use>
|
| +</svg><br>
|
| +
|
| +<svg width="30px" height="30px" xmlns="http://www.w3.org/2000/svg">
|
| + <g is="x-green">
|
| + <rect width="100" height="100" fill="red"></rect>
|
| + </g>
|
| +</svg><br>
|
| +
|
| +<svg width="30px" height="30px" xmlns="http://www.w3.org/2000/svg">
|
| + <text is="x-pass" font-size="10px" y="20">FAIL</text>
|
| +</svg>
|
|
|
Chromium Code Reviews
Issue 585183004:
Enable author shadows for SVG elements (Closed)
Base URL: svn://svn.chromium.org/blink/trunk