diff --git a/test/domRectElements.part.html b/test/domRectElements.part.html new file mode 100644 index 0000000..5128bb4 --- /dev/null +++ b/test/domRectElements.part.html @@ -0,0 +1,16 @@ +
+
+

https://browserleaks.com/rects

+Element.getClientRects (̿▀̿ ̿Ĺ̯̿̿▀̿ ̿)̄
+               +               +               +               +F i n g e r p r i n t i n g ? +
+ +test + +
\ No newline at end of file diff --git a/test/domRectIFrame.php b/test/domRectIFrame.php new file mode 100644 index 0000000..d1644ec --- /dev/null +++ b/test/domRectIFrame.php @@ -0,0 +1,13 @@ + + + + + + + + + + + + + \ No newline at end of file diff --git a/test/domRectIFrame.html b/test/domRectTest.css similarity index 50% rename from test/domRectIFrame.html rename to test/domRectTest.css index 959f010..4c309d5 100644 --- a/test/domRectIFrame.html +++ b/test/domRectTest.css @@ -1,11 +1,57 @@ - - - - - - - - - - -
-

https://browserleaks.com/rects

-Element.getClientRects (̿▀̿ ̿Ĺ̯̿̿▀̿ ̿)̄
-               -               -               -               -F i n g e r p r i n t i n g ? -
- -test - - - \ No newline at end of file +} \ No newline at end of file diff --git a/test/domRectTest.js b/test/domRectTest.js index b96f902..59c1007 100644 --- a/test/domRectTest.js +++ b/test/domRectTest.js @@ -12,11 +12,12 @@ const container = document.getElementById("tests"); const iframe = document.getElementById("iframe"); + const noIframe = document.getElementById("noIframe"); const template = document.querySelector(".test"); template.parentElement.removeChild(template); - function getElements(){ - const doc = iframe.contentDocument; + function getElements(useIframe = true){ + const doc = useIframe? iframe.contentDocument: noIframe; return Array.from(doc.querySelectorAll(".testRect")); } @@ -28,8 +29,8 @@ } const properties = ["x", "y", "width", "height", "top", "left", "right", "bottom"]; - async function performTest(output, callback){ - const rects = getElements().map(function(element){ + async function performTest(output, callback, useIframe = true){ + const rects = getElements(useIframe).map(function(element){ return { name: element.dataset.name, data: callback(element) @@ -76,11 +77,11 @@ }); } - function createTest(title, callback){ + function createTest(title, callback, useIframe){ const output = template.cloneNode(true); - output.querySelector(".title").textContent = title; + output.querySelector(".title").textContent = title + (useIframe? " (iframe)": ""); output.querySelector(".refresh").addEventListener("click", function(){ - performTest(output, callback); + performTest(output, callback, useIframe); }); output.querySelector(".performance").addEventListener("click", function(){ let count = 200; @@ -92,7 +93,7 @@ while (duration < 1000){ const start = Date.now(); for (; i < count; i += 1){ - const rects = getElements().map(function(element){ + const rects = getElements(useIframe).map(function(element){ return { name: element.dataset.name, data: callback(element) @@ -123,24 +124,26 @@ }()); container.appendChild(output); - performTest(output, callback); + performTest(output, callback, useIframe); } iframe.addEventListener("load", function(){ - createTest("Element.getClientRects", function(element){ - return element.getClientRects()[0]; - }); - createTest("Element.getBoundingClientRect", function(element){ - return element.getBoundingClientRect(); - }); - createTest("Range.getClientRects", function(element){ - const range = document.createRange(); - range.selectNode(element); - return range.getClientRects()[0]; - }); - createTest("Range.getBoundingClientRect", function(element){ - const range = document.createRange(); - range.selectNode(element); - return range.getBoundingClientRect(); + [true, false].forEach(function(useIframe){ + createTest("Element.getClientRects", function(element){ + return element.getClientRects()[0]; + }, useIframe); + createTest("Element.getBoundingClientRect", function(element){ + return element.getBoundingClientRect(); + }, useIframe); + createTest("Range.getClientRects", function(element){ + const range = document.createRange(); + range.selectNode(element); + return range.getClientRects()[0]; + }, useIframe); + createTest("Range.getBoundingClientRect", function(element){ + const range = document.createRange(); + range.selectNode(element); + return range.getBoundingClientRect(); + }, useIframe); }); }); }()); \ No newline at end of file diff --git a/test/domRectTest.html b/test/domRectTest.php similarity index 60% rename from test/domRectTest.html rename to test/domRectTest.php index c1c09d6..58e8ee8 100644 --- a/test/domRectTest.html +++ b/test/domRectTest.php @@ -5,42 +5,7 @@ - +

DOMRect test

@@ -51,7 +16,8 @@
  • upon page reload the hashes change (depending on CanvasBlocker settings - e.g. not in the stealth preset)

    • Tests

    - + +