Bug 1575301 [wpt PR 18569] - [LargestContentfulPaint] Add tests for invisible images and iframe, a=testonly

marco-c · marco-c · commit 675b3510e3c4 · 2019-10-04T13:50:36.000Z
Automatic update from web-platform-tests [LargestContentfulPaint] Add tests for invisible images and iframe Bug: 994414 Change-Id: Ica33ea747b8985956ab791f9e55950f46016bda6 Reviewed-on: https://chromium-review.googlesource.com/c/chromium/src/+/1762334 Reviewed-by: Steve Kobes <skobeschromium.org> Commit-Queue: Nicolás Peña Moreno <npmchromium.org> Cr-Commit-Position: refs/heads/master{#689002} -- wpt-commits: 24dc5f097c1bbf98be038b534f3ba83c75c809e1 wpt-pr: 18569 UltraBlame original commit: 0d061585604052d655be17bac418ba092e4578f4
diff --git a/testing/web-platform/tests/element-timing/resources/iframe-with-content.html b/testing/web-platform/tests/element-timing/resources/iframe-with-content.html
@@ -0,0 +1,5 @@
+<!DOCTYPE html>
+<body>
+<p>Text</p>
+<img src='/images/blue.png'/>
+</body>
diff --git a/testing/web-platform/tests/largest-contentful-paint/iframe-content-not-observed.html b/testing/web-platform/tests/largest-contentful-paint/iframe-content-not-observed.html
@@ -0,0 +1,27 @@
+<!DOCTYPE HTML>
+<meta charset=utf-8>
+<head>
+<title>Largest Contentful Paint: do NOT observe elements from same-origin iframes</title>
+<script src="/resources/testharness.js"></script>
+<script src="/resources/testharnessreport.js"></script>
+</head>
+<body>
+<script>
+  async_test((t) => {
+    if (!window.LargestContentfulPaint) {
+      assert_unreached("LargestContentfulPaint is not implemented");
+    }
+    const observer = new PerformanceObserver(
+      t.step_func_done(entryList => {
+        assert_unreached("Should not have received an entry!");
+      })
+    );
+    observer.observe({type: 'largest-contentful-paint', buffered: true});
+    // After a delay, assume that no entry was produced.
+    t.step_timeout(() => {
+      t.done();
+    }, 200);
+  }, 'Element in child iframe is not observed, even if same-origin.');
+</script>
+<iframe src='resources/iframe-with-content.html'></iframe>
+</body>
diff --git a/testing/web-platform/tests/largest-contentful-paint/invisible-images.html b/testing/web-platform/tests/largest-contentful-paint/invisible-images.html
@@ -0,0 +1,46 @@
+<!DOCTYPE HTML>
+<meta charset=utf-8>
+<head>
+<title>Largest Contentful Paint: invisible images are not observable</title>
+<script src="/resources/testharness.js"></script>
+<script src="/resources/testharnessreport.js"></script>
+<style>
+  .opacity0 {
+    opacity: 0;
+  }
+  .visibilityHidden {
+    visibility: hidden;
+  }
+  .displayNone {
+    display: none;
+  }
+</style>
+</head>
+<body>
+<script>
+  async_test(t => {
+    if (!window.LargestContentfulPaint) {
+      assert_unreached("LargestContentfulPaint is not implemented");
+    }
+    const observer = new PerformanceObserver(
+      t.step_func_done(entryList => {
+        // The images should not have caused an entry, so fail test.
+        assert_unreached('Should not have received an entry! Received one with id '
+            + entryList.getEntries()[0].id);
+      })
+    );
+    observer.observe({type: 'largest-contentful-paint', buffered: true});
+    // Images have been added but should not cause entries to be dispatched.
+    // Wait for 500ms and end test, ensuring no entry was created.
+    t.step_timeout(() => {
+      t.done();
+    }, 500);
+  }, 'Images with opacity: 0, visibility: hidden, or display: none are not observable by LargestContentfulPaint.');
+</script>
+<img src='/images/blue.png' class='opacity0' id='opacity0'/>
+<img src='/images/green.png' class='visibilityHidden' id='visibilityHidden'/>
+<img src='/images/red.png' class='displayNone' id='displayNone'/>
+<div class='opacity0'><img src='/images/yellow.png' id='divOpacity0'/></div>
+<div class='visibilityHidden'><img src='/images/yellow.png' id='divVisibilityHidden'/></div>
+<div class='displayNone'><img src='/images/yellow.png' id='divDisplayNone'/></div>
+</body>
