svg.html | Explore in Territory

<!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>

chromium/third_party/blink/web_tests/external/wpt/paint-timing/resources/svg.html