1
0
mirror of https://github.com/kkapsner/CanvasBlocker synced 2024-12-22 12:50:36 +01:00

domRectTest: added svg tests

This commit is contained in:
kkapsner 2020-07-29 14:17:05 +02:00
parent 3eea8fe7c4
commit ff98b9b9af
4 changed files with 37 additions and 7 deletions

10
test/domRectSVG.svg Normal file
View File

@ -0,0 +1,10 @@
<svg viewBox="0 0 240 80" xmlns="http://www.w3.org/2000/svg">
<style>
#text {
font: italic 13px sans-serif;
transform: rotate(-3.4deg);
}
</style>
<text x="20" y="35" data-name="text" id="text" class="testRect">Text with Unicode &#x1D790;</text>
</svg>

After

Width:  |  Height:  |  Size: 268 B

View File

@ -1,5 +1,5 @@
#iframe {
#iframe, #svg {
position: fixed;
top: -2000%;
}

View File

@ -12,12 +12,13 @@
const container = document.getElementById("tests");
const iframe = document.getElementById("iframe");
const svg = document.getElementById("svg");
const noIframe = document.getElementById("noIframe");
const template = document.querySelector(".test");
template.parentElement.removeChild(template);
function getElements(useIframe = true){
const doc = useIframe? iframe.contentDocument: noIframe;
const doc = useIframe? (useIframe === "svg"? svg.contentDocument: iframe.contentDocument): noIframe;
return Array.from(doc.querySelectorAll(".testRect"));
}
@ -58,9 +59,15 @@
"</tr>" +
properties.map(function(property){
return "<tr><th>" + property + "</th>" + rects.map(function(rect){
return "<td class=\"value\" title=\"" + rect.data[property] + "\">" +
formatNumber(rect.data[property]) +
"</td>";
const value = rect.data[property];
if ((typeof value) === "number"){
return "<td class=\"value\" title=\"" + rect.data[property] + "\">" +
formatNumber(rect.data[property]) +
"</td>";
}
else {
return "<td class=\"value unavailable\">not available</td>";
}
}).join("") + "</tr>";
}).join("") +
"</table>";
@ -79,7 +86,8 @@
function createTest(title, callback, useIframe){
const output = template.cloneNode(true);
output.querySelector(".title").textContent = title + (useIframe? " (iframe)": "");
output.querySelector(".title").textContent = title +
(useIframe? " (" + (useIframe === "svg"? "svg": "iframe") + ")": "");
output.querySelector(".refresh").addEventListener("click", function(){
performTest(output, callback, useIframe);
});
@ -145,6 +153,17 @@
return range.getBoundingClientRect();
}, useIframe);
});
createTest("SVGGraphicsElement.getBBox", function(element){
return element.getBBox();
}, "svg");
createTest("SVGTextContentElement.getExtentOfChar", function(element){
return element.getExtentOfChar(element.textContent.length - 1);
}, "svg");
createTest("SVGTextContentElement.get(Start|End)OfChar", function(element){
const start = element.getStartPositionOfChar(element.textContent.length - 1);
const end = element.getEndPositionOfChar(element.textContent.length - 1);
return new DOMRect(start.x, start.y, end.x - start.x, end.y - start.y);
}, "svg");
document.querySelectorAll(".content-hidable").forEach(function(parentNode){
parentNode.querySelector(".toggle").addEventListener("click", function(){

View File

@ -11,12 +11,13 @@
<h1>DOMRect test</h1>
<h2>Expected result</h2>
<ul>
<li>all the hashes and numbers should be equal for each test</li>
<li>all the hashes and numbers should be equal for the getClientRects and getBoundingClientRect tests</li>
<li>if "refresh" is clicked the hash must not change</li>
<li>upon page reload the hashes change (depending on CanvasBlocker settings - e.g. not in the stealth preset)</li>
</ul>
<h2>Tests</h2>
<iframe id="iframe" src="domRectIFrame.php"></iframe>
<iframe id="svg" src="domRectSVG.svg"></iframe>
<div id="noIframe"><?php include("domRectElements.part.html");?></div>
<div id="tests">
<div class="test">