Automatic update from web-platform-tests ElementTiming/ContainerTiming: report paints of images in pseudo element contents Added support for reporting the paints of images that are declared in the content property of pseudo elements. To implement it, we modify LayoutObject::GeneratingNode(): - First, for anonymous nodes, we find the enclosing node that is not anonymous. - Then, if it is a pseudo element, then we fetch the ultimate originating element. This is the element that is reported as the lastPaintedElement in container timing and as the element in element timing. This changeset modifies the LayoutObject::GeneratingNode implementation that is used in other places. It includes a kill switch just in case the change introduces an unnoticed regression. Additional tests are added for ElementTiming and ContainerTiming with the pseudo cases. The LayoutObjectTest for GeneratingNode was contributed in the review stage by Philip Rogers. Ticket for the discussion of what should happen with pseudo elements: https://github.com/w3c/element-timing/issues/74 Bug: 382422286 Change-Id: I8f810ac5fb118f2d66c78f29d371348d13c45375 Reviewed-on: https://chromium-review.googlesource.com/c/chromium/src/+/6656960 Reviewed-by: Philip Rogers <pdr@chromium.org> Commit-Queue: José Dapena Paz <jdapena@igalia.com> Cr-Commit-Position: refs/heads/main@{#1572468} -- wpt-commits: a8fbcd0e854ff5b7bb0eb6da8ebad811dab1ae56 wpt-pr: 57282
41 lines
1.3 KiB
HTML
41 lines
1.3 KiB
HTML
<!DOCTYPE HTML>
|
|
<head>
|
|
<meta charset=utf-8>
|
|
<title>Element Timing: observe element with a content image in a pseudo element</title>
|
|
<style>
|
|
body {
|
|
margin: 0;
|
|
}
|
|
#target::before {
|
|
content: url(resources/square100.png);
|
|
width: 100px;
|
|
height: 100px;
|
|
display: inline-block;
|
|
}
|
|
</style>
|
|
<script src="/resources/testharness.js"></script>
|
|
<script src="/resources/testharnessreport.js"></script>
|
|
<script src="resources/element-timing-helpers.js"></script>
|
|
<script>
|
|
let beforeRender = performance.now();
|
|
async_test(function (t) {
|
|
assert_implements(window.PerformanceElementTiming, "PerformanceElementTiming is not implemented");
|
|
const observer = new PerformanceObserver(
|
|
t.step_func_done(function(entryList) {
|
|
assert_equals(entryList.getEntries().length, 1);
|
|
const entry = entryList.getEntries()[0];
|
|
const pathname = window.location.origin + '/element-timing/resources/square100.png';
|
|
checkElement(entry, pathname, 'my_div', 'target', beforeRender,
|
|
document.getElementById('target'));
|
|
checkRect(entry, [0, 100, 0, 100]);
|
|
checkNaturalSize(entry, 100, 100);
|
|
})
|
|
);
|
|
observer.observe({entryTypes: ['element']});
|
|
}, 'Element with elementtiming attribute and a ::before content image is observable.');
|
|
</script>
|
|
</head>
|
|
<body>
|
|
<div id='target' elementtiming='my_div'></div>
|
|
</body>
|