summaryrefslogtreecommitdiffstats
path: root/testing/web-platform/tests/paint-timing/resources
diff options
context:
space:
mode:
authorDaniel Baumann <daniel.baumann@progress-linux.org>2024-04-19 00:47:55 +0000
committerDaniel Baumann <daniel.baumann@progress-linux.org>2024-04-19 00:47:55 +0000
commit26a029d407be480d791972afb5975cf62c9360a6 (patch)
treef435a8308119effd964b339f76abb83a57c29483 /testing/web-platform/tests/paint-timing/resources
parentInitial commit. (diff)
downloadfirefox-26a029d407be480d791972afb5975cf62c9360a6.tar.xz
firefox-26a029d407be480d791972afb5975cf62c9360a6.zip
Adding upstream version 124.0.1.upstream/124.0.1
Signed-off-by: Daniel Baumann <daniel.baumann@progress-linux.org>
Diffstat (limited to 'testing/web-platform/tests/paint-timing/resources')
-rw-r--r--testing/web-platform/tests/paint-timing/resources/circle.svg3
-rw-r--r--testing/web-platform/tests/paint-timing/resources/circles.pngbin0 -> 2479 bytes
-rw-r--r--testing/web-platform/tests/paint-timing/resources/subframe-painting.html24
-rw-r--r--testing/web-platform/tests/paint-timing/resources/subframe-sending-paint.html13
-rw-r--r--testing/web-platform/tests/paint-timing/resources/svg.html20
-rw-r--r--testing/web-platform/tests/paint-timing/resources/utils.js52
6 files changed, 112 insertions, 0 deletions
diff --git a/testing/web-platform/tests/paint-timing/resources/circle.svg b/testing/web-platform/tests/paint-timing/resources/circle.svg
new file mode 100644
index 0000000000..6b5fdbe8e0
--- /dev/null
+++ b/testing/web-platform/tests/paint-timing/resources/circle.svg
@@ -0,0 +1,3 @@
+<svg xmlns="http://www.w3.org/2000/svg" version="1.1">
+ <circle cx="100" cy="50" r="40" stroke="black" stroke-width="2" fill="none" />
+</svg>
diff --git a/testing/web-platform/tests/paint-timing/resources/circles.png b/testing/web-platform/tests/paint-timing/resources/circles.png
new file mode 100644
index 0000000000..708682a207
--- /dev/null
+++ b/testing/web-platform/tests/paint-timing/resources/circles.png
Binary files differ
diff --git a/testing/web-platform/tests/paint-timing/resources/subframe-painting.html b/testing/web-platform/tests/paint-timing/resources/subframe-painting.html
new file mode 100644
index 0000000000..00fd39bcb8
--- /dev/null
+++ b/testing/web-platform/tests/paint-timing/resources/subframe-painting.html
@@ -0,0 +1,24 @@
+<!DOCTYPE html>
+<body>
+<div id="image"></div>
+<script>
+ const img = document.createElement('IMG');
+ img.src = 'circles.png';
+
+ var observer = new PerformanceObserver(function(list, obj) {
+ var paintEntries = list.getEntries();
+ for (let i = 0; i < paintEntries.length; i++) {
+ // postMessage doesn't allow sending the entry object over directly
+ var dataToSend = {
+ "entryType": paintEntries[i]["entryType"],
+ "name": paintEntries[i]["name"]
+ };
+ parent.postMessage(dataToSend, '*');
+ }
+ });
+
+ observer.observe({"type": "paint"});
+ document.getElementById('image').appendChild(img);
+</script>
+</body>
+</html>
diff --git a/testing/web-platform/tests/paint-timing/resources/subframe-sending-paint.html b/testing/web-platform/tests/paint-timing/resources/subframe-sending-paint.html
new file mode 100644
index 0000000000..f372bd6f4f
--- /dev/null
+++ b/testing/web-platform/tests/paint-timing/resources/subframe-sending-paint.html
@@ -0,0 +1,13 @@
+<!DOCTYPE html>
+<script>
+ self.addEventListener('message', function(e) {
+ // Send paint-timing entries upon receiving a message.
+ const paintEntries = performance.getEntriesByType('paint');
+ let entryContents = paintEntries.length + '';
+ for (let i = 0; i < paintEntries.length; i++) {
+ const entry = paintEntries[i];
+ entryContents += ' ' + entry.entryType + ' ' + entry.name;
+ }
+ parent.postMessage(entryContents, '*');
+ });
+</script>
diff --git a/testing/web-platform/tests/paint-timing/resources/svg.html b/testing/web-platform/tests/paint-timing/resources/svg.html
new file mode 100644
index 0000000000..94185eab34
--- /dev/null
+++ b/testing/web-platform/tests/paint-timing/resources/svg.html
@@ -0,0 +1,20 @@
+<!DOCTYPE html>
+<div id="main">
+ <svg viewBox="0 0 10 10">
+ <defs>
+ <circle id="myCircle" cx="5" cy="5" r="4" stroke="blue" />
+ </defs>
+ <use id="circle" href="#myCircle" fill="green" />
+ </svg>
+</div>
+<script>
+ const observer = new PerformanceObserver(list => {
+ const fcp = list.getEntriesByName("first-contentful-paint");
+ if (!fcp.length)
+ return;
+
+ // Message the parent when FCP has been reached.
+ parent.postMessage("GotFCP", '*');
+ });
+ observer.observe({ type: "paint", buffered: true });
+</script>
diff --git a/testing/web-platform/tests/paint-timing/resources/utils.js b/testing/web-platform/tests/paint-timing/resources/utils.js
new file mode 100644
index 0000000000..5766971dd0
--- /dev/null
+++ b/testing/web-platform/tests/paint-timing/resources/utils.js
@@ -0,0 +1,52 @@
+function waitForAnimationFrames(count) {
+ return new Promise(resolve => {
+ if (count-- <= 0) {
+ resolve();
+ } else {
+ requestAnimationFrame(() => {
+ waitForAnimationFrames(count).then(resolve);
+ });
+ }
+ });
+}
+
+// Asserts that there is currently no FCP reported. Pass t to add some wait, in case CSS is loaded
+// and FCP is incorrectly fired afterwards.
+async function assertNoFirstContentfulPaint(t) {
+ await waitForAnimationFrames(3);
+ assert_equals(performance.getEntriesByName('first-contentful-paint').length, 0, 'First contentful paint marked too early. ');
+}
+
+// Function that is resolved once FCP is reported, using PerformanceObserver. It rejects after a long
+// wait time so that failing tests don't timeout.
+async function assertFirstContentfulPaint(t) {
+ return new Promise(resolve => {
+ function checkFCP() {
+ if (performance.getEntriesByName('first-contentful-paint').length === 1) {
+ resolve();
+ } else {
+ t.step_timeout(checkFCP, 0);
+ }
+ }
+ t.step(checkFCP);
+ });
+}
+
+async function test_fcp(label, before_assert_fcp_func) {
+ setup({"hide_test_state": true});
+ const style = document.createElement('style');
+ document.head.appendChild(style);
+ await promise_test(async t => {
+ assert_implements(window.PerformancePaintTiming, "Paint Timing isn't supported.");
+ const main = document.getElementById('main');
+ await new Promise(r => window.addEventListener('load', r));
+ await assertNoFirstContentfulPaint(t);
+ main.className = 'preFCP';
+ await assertNoFirstContentfulPaint(t);
+ if (before_assert_fcp_func) {
+ await before_assert_fcp_func();
+ }
+ main.className = 'contentful';
+ await assertFirstContentfulPaint(t);
+ }, label);
+}