From 171ca3c50f8ac0fee2d0d3ca5bb3eec7692ac5ae Mon Sep 17 00:00:00 2001 From: jwilliams720 Date: Fri, 22 Nov 2024 18:21:59 +0000 Subject: [PATCH] check both container timing and element timing --- polyfill/polyfill.ts | 7 ++++++- 1 file changed, 6 insertions(+), 1 deletion(-) diff --git a/polyfill/polyfill.ts b/polyfill/polyfill.ts index 10d251e..8232818 100644 --- a/polyfill/polyfill.ts +++ b/polyfill/polyfill.ts @@ -328,6 +328,7 @@ class ContainerPerformanceObserver implements PerformanceObserver { // There's a weird bug where we sometimes get a load of empty rects (all zero'd out) // https://issues.chromium.org/issues/379844652 // https://github.com/bloomberg/container-timing/issues/8 + // The other reason this can happen is if an element renders "off screen", which is expected behavior (test case: https://fluoridated-bow-church.glitch.me/) if (ContainerPerformanceObserver.isEmptyRect(entry.intersectionRect)) { return; } @@ -481,7 +482,11 @@ class ContainerPerformanceObserver implements PerformanceObserver { const closestRoot = element.closest(containerTimingAttrSelector); if ( - element.getAttribute("elementtiming") === INTERNAL_ATTR_NAME && + // We should check the element is directly a `containertiming` element or + // its one of our own `elementtiming` elements which we polyfilled + // The former is because you can apply `containertiming` to a

and it should still work + (element.getAttribute("elementtiming") === INTERNAL_ATTR_NAME || + element.hasAttribute("containertiming")) && closestRoot ) { this.emitNewAreaPainted(entry as PerformanceElementTiming, closestRoot);