122 lines
4.1 KiB
HTML
122 lines
4.1 KiB
HTML
<!DOCTYPE html>
|
|
<html>
|
|
<head>
|
|
<style>
|
|
/* relative positioning ensures underlying RenderLayer */
|
|
.renderingArea {
|
|
position: relative;
|
|
}
|
|
</style>
|
|
</head>
|
|
<body>
|
|
<script src="../resources/js-test-pre.js"></script>
|
|
<pre id="console"></pre>
|
|
<div class="renderingArea" id="svg">
|
|
<svg>
|
|
<foreignObject>
|
|
<svg></svg>
|
|
</foreignObject>
|
|
</svg>
|
|
</div>
|
|
<div class="renderingArea" id="mathml">
|
|
<math>
|
|
<semantics>
|
|
<annotation-xml encoding="image/svg+xml">
|
|
<svg></svg>
|
|
</annotation-xml>
|
|
</semantics>
|
|
</math>
|
|
</div>
|
|
<div class="renderingArea" id="non_svg"></div>
|
|
<div class="renderingArea" id="svg_use">
|
|
<svg>
|
|
<defs>
|
|
<foreignObject>
|
|
<svg id="mySVG"></svg>
|
|
</foreignObject>
|
|
</defs>
|
|
<use href="#mySVG"/>
|
|
</svg>
|
|
</div>
|
|
<div class="renderingArea" id="svg_child_of_use">
|
|
<svg>
|
|
<use href="#invalid">
|
|
<svg></svg>
|
|
</use>
|
|
</svg>
|
|
</div>
|
|
<div class="renderingArea" id="svg_in_shadow_tree"></div>
|
|
<div class="renderingArea" id="mathml_in_shadow_tree"></div>
|
|
<div class="renderingArea" id="non_svg_in_shadow_tree"></div>
|
|
<div class="renderingArea" id="svg_use_in_shadow_tree"></div>
|
|
<div class="renderingArea" id="svg_child_of_use_in_shadow_tree"></div>
|
|
<script>
|
|
const svgNS = 'http://www.w3.org/2000/svg';
|
|
|
|
(function() {
|
|
let nonSVG = document.createElementNS('http://example.org/', "nonSVG");
|
|
let svg = document.createElementNS(svgNS, 'svg');
|
|
nonSVG.appendChild(svg);
|
|
document.getElementById("non_svg").appendChild(nonSVG);
|
|
})();
|
|
|
|
["svg", "mathml", "non_svg", "svg_use", "svg_child_of_use"].forEach(id => {
|
|
let shadowHost = document.createElement("div");
|
|
let shadowRoot = shadowHost.attachShadow({mode: 'open'});
|
|
let svg = document.getElementById(id).firstElementChild.cloneNode(true);
|
|
["href", "id"].forEach(attribute => {
|
|
// Fix duplicate ids.
|
|
Array.from(svg.querySelectorAll(`[${attribute}]`)).forEach(element => {
|
|
element.setAttribute(attribute,
|
|
`${element.getAttribute(attribute)}_copy`);
|
|
});
|
|
});
|
|
shadowRoot.appendChild(svg);
|
|
document.getElementById(`${id}_in_shadow_tree`).appendChild(shadowHost);
|
|
|
|
});
|
|
|
|
function extractSVGRootRenderers(name) {
|
|
let element = document.getElementById(name);
|
|
const regexp = /\w+ \{svg\}/g;
|
|
return window.internals.elementRenderTreeAsText(element).match(regexp);
|
|
}
|
|
|
|
if (window.testRunner)
|
|
testRunner.dumpAsText();
|
|
|
|
shouldBe("extractSVGRootRenderers('svg')",
|
|
"['RenderSVGRoot {svg}','RenderSVGRoot {svg}']");
|
|
|
|
shouldBe("extractSVGRootRenderers('mathml')",
|
|
"['RenderSVGRoot {svg}']");
|
|
|
|
shouldBe("extractSVGRootRenderers('non_svg')",
|
|
"['RenderSVGRoot {svg}']");
|
|
|
|
shouldBe("extractSVGRootRenderers('svg_use')",
|
|
"['RenderSVGRoot {svg}','RenderSVGViewportContainer {svg}']");
|
|
|
|
shouldBe("extractSVGRootRenderers('svg_child_of_use')",
|
|
"['RenderSVGRoot {svg}','RenderSVGViewportContainer {svg}']");
|
|
|
|
shouldBe("extractSVGRootRenderers('svg_in_shadow_tree')",
|
|
"['RenderSVGRoot {svg}','RenderSVGRoot {svg}']");
|
|
|
|
shouldBe("extractSVGRootRenderers('mathml_in_shadow_tree')",
|
|
"['RenderSVGRoot {svg}']");
|
|
|
|
shouldBe("extractSVGRootRenderers('non_svg_in_shadow_tree')",
|
|
"['RenderSVGRoot {svg}']");
|
|
|
|
shouldBe("extractSVGRootRenderers('svg_use_in_shadow_tree')",
|
|
"['RenderSVGRoot {svg}','RenderSVGViewportContainer {svg}']");
|
|
|
|
shouldBe("extractSVGRootRenderers('svg_child_of_use_in_shadow_tree')",
|
|
"['RenderSVGRoot {svg}','RenderSVGViewportContainer {svg}']");
|
|
|
|
</script>
|
|
<script src="../../resources/js-test-post.js"></script>
|
|
</body>
|
|
</html>
|