73 lines
2.7 KiB
HTML
73 lines
2.7 KiB
HTML
<!DOCTYPE html>
|
|
<html>
|
|
<head>
|
|
<style>
|
|
body {
|
|
width: 750px;
|
|
height: 550px;
|
|
}
|
|
|
|
.testCase {
|
|
float: left;
|
|
margin: 5px;
|
|
}
|
|
|
|
svg {
|
|
padding: 10px;
|
|
border: 5px solid grey;
|
|
margin: 5px;
|
|
background-color: blue;
|
|
}
|
|
</style>
|
|
<script>window.enablePixelTesting = true;</script>
|
|
<script src="../../resources/js-test-pre.js"></script>
|
|
<script>
|
|
function matrixToString(m)
|
|
{
|
|
return "[" + m.a + " " + m.b + " " + m.c + " " + m.d + " " + m.e + " " + m.f + "]";
|
|
}
|
|
|
|
function getCTMById(id)
|
|
{
|
|
return matrixToString(document.getElementById(id).getCTM());
|
|
}
|
|
</script>
|
|
</head>
|
|
<body>
|
|
<div id="description"></div>
|
|
<script>description("This test checks getCTM() on SVG root elements with borders, paddings, and margins.");</script>
|
|
|
|
<div id="console"></div>
|
|
|
|
<hr/>
|
|
|
|
<svg id="svgRoot1" class="testCase" width="50" height="50" viewbox="0 0 50 50"></svg>
|
|
<script>shouldBeEqualToString("getCTMById('svgRoot1')", "[1 0 0 1 0 0]");</script>
|
|
|
|
<svg id="svgRoot2" class="testCase" width="50" height="50" viewbox="0 0 100 100"></svg>
|
|
<script>shouldBeEqualToString("getCTMById('svgRoot2')", "[0.5 0 0 0.5 0 0]");</script>
|
|
|
|
<svg id="svgRoot3" class="testCase" width="50" height="50" viewbox="0 0 25 25"></svg>
|
|
<script>shouldBeEqualToString("getCTMById('svgRoot3')", "[2 0 0 2 0 0]");</script>
|
|
|
|
<div class="testCase" style="width: 90px; height: 90px;">
|
|
<div style="width: 50px; height: 50px; background-color: green;">
|
|
<svg id="svgRoot4" width="100%" height="100%" viewbox="0 0 50 50"></svg>
|
|
</div>
|
|
</div>
|
|
<script>shouldBeEqualToString("getCTMById('svgRoot4')", "[1 0 0 1 0 0]");</script>
|
|
|
|
<div class="testCase" style="width: 100px; height: 100px; background-color: green;">
|
|
<svg id="svgRoot5" width="50%" height="50%" viewbox="0 0 50 50"></svg>
|
|
</div>
|
|
<script>shouldBeEqualToString("getCTMById('svgRoot5')", "[1 0 0 1 0 0]");</script>
|
|
|
|
<div class="testCase" style="width: 100px; height: 100px; background-color: green;">
|
|
<svg id="svgRoot6" width="50%" height="50%" viewbox="0 0 100 100"></svg>
|
|
</div>
|
|
<script>shouldBeEqualToString("getCTMById('svgRoot6')", "[0.5 0 0 0.5 0 0]");</script>
|
|
|
|
<script src="../../resources/js-test-post.js"></script>
|
|
</body>
|
|
</html>
|