From 157ef6f9e4d11332a506ea6448d25746b0f72a1e Mon Sep 17 00:00:00 2001 From: Rune Lillesveen Date: Wed, 23 Oct 2024 17:43:14 +0200 Subject: [PATCH 1/2] Run snapshot post-layout state steps in resizeObserver loop This step is necessary for CSS features that depend on post layout state. This includes anchor-positioning, scroll-animations, and scroll-state() container queries. The additional style and layout recalc is for including effects of the updated snapshot. --- source | 9 +++++++++ 1 file changed, 9 insertions(+) diff --git a/source b/source index 6dfd456974a..1c095183b67 100644 --- a/source +++ b/source @@ -4063,6 +4063,7 @@ a.setAttribute('href', 'https://example.com/'); // change the content attribute
  • evaluate media queries and report changes
  • Scroll a target into view
  • Scroll to the beginning of the document
    • +
  • run snapshot post-layout state steps
  • The resize event
  • The scroll event
  • The scrollend event
    • @@ -114579,6 +114580,14 @@ import "https://example.com/foo/../module2.mjs";

    1. Recalculate styles and update layout for doc.

      2. +

    2. Run snapshot post-layout state steps for doc. CSSOMVIEW

      3. + +

    3. If any snapshotted state changed:

      +
        +

      1. Recalculate styles and update layout for doc.

        +
      +
      4. +

    4. Let hadInitialVisibleContentVisibilityDetermination be false.

    5. From 105065d8ee11c2629a12e2b3272b8cd7c635ef5c Mon Sep 17 00:00:00 2001 From: Rune Lillesveen Date: Fri, 7 Nov 2025 13:11:17 +0100 Subject: [PATCH 2/2] Snapshot for each iteration and remove content-visibility steps --- source | 39 ++++++--------------------------------- 1 file changed, 6 insertions(+), 33 deletions(-) diff --git a/source b/source index 1c095183b67..ae535a1eebc 100644 --- a/source +++ b/source @@ -114573,6 +114573,7 @@ import "https://example.com/foo/../module2.mjs";

      1. Let resizeObserverDepth be 0.

        2. +

      2. Let didRunSnapshotPostLayoutStateSteps be false.

      3. While true:

        @@ -114580,45 +114581,17 @@ import "https://example.com/foo/../module2.mjs";

        1. Recalculate styles and update layout for doc.

          2. -

        2. Run snapshot post-layout state steps for doc. CSSOMVIEW

          3. - -

        3. If any snapshotted state changed:

          +

        4. If didRunSnapshotPostLayoutStateSteps is false:

            -

          1. Recalculate styles and update layout for doc.

            -
          -
          5. +

        5. Run snapshot post-layout state steps for doc. CSSOMVIEW

          6. -

        6. Let hadInitialVisibleContentVisibilityDetermination be false.

          7. +

        7. Set didRunSnapshotPostLayoutStateSteps to true

          8. -
        8. -

          For each element element with 'auto' used value of - 'content-visibility':

          - -
            -

          1. Let checkForInitialDetermination be true if element's - proximity to the viewport is not determined and it is not relevant to - the user. Otherwise, let checkForInitialDetermination be - false.

            2. - -

          2. Determine proximity to the viewport for element.

            3. - -

          3. If checkForInitialDetermination is true and element is now - relevant to the user, then set - hadInitialVisibleContentVisibilityDetermination to true.

            4. +

          4. If any snapshotted state changed, then continue.

          9. -
        9. -

          If hadInitialVisibleContentVisibilityDetermination is true, then - continue.

          - -

          The intent of this step is for the initial viewport proximity - determination, which takes effect immediately, to be reflected in the style and layout - calculation which is carried out in a previous step of this loop. Proximity - determinations other than the initial one take effect at the next rendering - opportunity. CSSCONTAIN

          -
          10. +

        10. Set didRunSnapshotPostLayoutStateSteps to false.

        11. Gather active resize observations at depth resizeObserverDepth for doc.