diff options
| author | Daniel Baumann <daniel.baumann@progress-linux.org> | 2024-04-19 00:47:55 +0000 |
|---|---|---|
| committer | Daniel Baumann <daniel.baumann@progress-linux.org> | 2024-04-19 00:47:55 +0000 |
| commit | 26a029d407be480d791972afb5975cf62c9360a6 (patch) | |
| tree | f435a8308119effd964b339f76abb83a57c29483 /testing/web-platform/tests/largest-contentful-paint/text-with-display-style.html | |
| parent | Initial commit. (diff) | |
| download | firefox-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/largest-contentful-paint/text-with-display-style.html')
| -rw-r--r-- | testing/web-platform/tests/largest-contentful-paint/text-with-display-style.html | 76 |
1 files changed, 76 insertions, 0 deletions
diff --git a/testing/web-platform/tests/largest-contentful-paint/text-with-display-style.html b/testing/web-platform/tests/largest-contentful-paint/text-with-display-style.html new file mode 100644 index 0000000000..69edc168c5 --- /dev/null +++ b/testing/web-platform/tests/largest-contentful-paint/text-with-display-style.html @@ -0,0 +1,76 @@ +<!DOCTYPE HTML> +<meta charset=utf-8> +<title>Largest Contentful Paint: observe text with display style.</title> +<body> +<script src="/resources/testharness.js"></script> +<script src="/resources/testharnessreport.js"></script> +<style> +#title { + display: flex; +} +</style> +<h1 id='title'>I am a title!</h1> +<script> + async_test(function (t) { + assert_implements(window.LargestContentfulPaint, "LargestContentfulPaint is not implemented"); + let beforeRender; + /* In this test, we first observe a header with style 'display: flex'. + * Once observed, we remove it and add a header with style 'display: grid'. + * And once that is observed, we remove it and add a header with style 'display: block'. + * At each step, we check the values of the entries received. + */ + let observedFlex = false; + let observedGrid = false; + const observer = new PerformanceObserver( + t.step_func(function(entryList) { + assert_equals(entryList.getEntries().length, 1); + const entry = entryList.getEntries()[0]; + assert_equals(entry.entryType, 'largest-contentful-paint'); + assert_greater_than_equal(entry.renderTime, beforeRender); + assert_greater_than_equal(performance.now(), entry.renderTime); + assert_approx_equals(entry.startTime, entry.renderTime, 0.001, + 'startTime should be equal to renderTime to the precision of 1 millisecond.'); + assert_equals(entry.duration, 0); + // TODO: find a good way to bound text size. + assert_greater_than_equal(entry.size, 500); + assert_equals(entry.url, ''); + assert_equals(entry.loadTime, 0); + if (!observedFlex) { + observedFlex = true; + assert_equals(entry.id, 'title'); + const title = document.getElementById('title'); + assert_equals(entry.element, title); + // Remove 'display: flex' and add 'display: grid' text. + title.parentNode.removeChild(title); + const title2 = document.createElement('h1'); + title2.id = 'title2'; + title2.style = 'display: grid'; + title2.innerHTML = 'I am a second title!'; + document.body.appendChild(title2); + beforeRender = performance.now(); + } else if (!observedGrid) { + observedGrid = true; + assert_equals(entry.id, 'title2'); + const title2 = document.getElementById('title2'); + assert_equals(entry.element, title2); + // Remove 'display: grid' and add 'display: block' text. + title2.parentNode.removeChild(title2); + const title3 = document.createElement('h1'); + title3.id = 'title3'; + title3.style = 'display: block'; + title3.innerHTML = 'I am the third and last title!'; + document.body.appendChild(title3); + beforeRender = performance.now(); + } else { + assert_equals(entry.id, 'title3'); + const title3 = document.getElementById('title3'); + assert_equals(entry.element, title3); + t.done(); + } + }) + ); + observer.observe({type: 'largest-contentful-paint', buffered: true}); + beforeRender = performance.now(); + }, 'Text with display style is observable.'); +</script> +</body> |