@@ -1628,21 +1628,14 @@ Suppressing An Element's Contents Entirely: the 'content-visibility' property {#
16281628 </div>
16291629 </div>
16301630
1631- <div algorithm >
1632- An element is <dfn export>relevant to the user</dfn>
1633- if <strong> any </strong> of the following conditions are true :
1631+ <div>
1632+ An element that has ''content-visibility: auto'' is in one of three states
1633+ when it comes to its <dfn export>proximity to the viewport</dfn> :
16341634
1635- * The element is "on-screen":
1636- its [=paint containment box=] 's [=overflow clip edge=]
1637- intersects with the viewport,
1638- or a user-agent defined margin around the viewport.
1639-
1640- <wpt>
1641- content-visibility/content-visibility-046.html
1642- content-visibility/content-visibility-079.html
1643- content-visibility/content-visibility-auto-in-iframe.html
1644- content-visibility/content-visibility-auto-intrinsic-width.html
1645- </wpt>
1635+ * The element is <dfn>close to the viewport</dfn> :
1636+ In this state, the element is considered "on-screen":
1637+ its [=paint containment box=] 's [=overflow clip edge=] intersects with the viewport,
1638+ or a user-agent defined margin around the viewport.
16461639
16471640 Note: This margin is meant to allow the user agent
16481641 to begin preparing for an element to be in the viewport soon.
@@ -1654,6 +1647,32 @@ Suppressing An Element's Contents Entirely: the 'content-visibility' property {#
16541647 (or within the user-agent defined margin around the viewport),
16551648 even if the element itself is still off-screen.
16561649
1650+
1651+ * The element is <dfn>far away from the viewport</dfn> :
1652+ In this state, the element's proximity to the viewport has been computed and is not [=close to the viewport=] .
1653+
1654+ * The element's [=proximity to the viewport=] is <dfn>not determined</dfn> :
1655+ In this state, the computation to determine the element's [=proximity to the viewport=] has not been done
1656+ since the last time the element was connected.
1657+
1658+ Initially, the element's [=proximity to the viewport=] is [=not determined=] .
1659+ Only connected elements with ''content-visibility: auto'' determine their [=proximity to the viewport=] .
1660+ When the element becomes disconnected, the element's [=proximity to the viewport=] becomes [=not determined=] .
1661+ </div>
1662+
1663+ <div algorithm>
1664+ An element is <dfn export>relevant to the user</dfn>
1665+ if <strong> any</strong> of the following conditions are true:
1666+
1667+ * The element is [=close to the viewport=] .
1668+
1669+ <wpt>
1670+ content-visibility/content-visibility-046.html
1671+ content-visibility/content-visibility-079.html
1672+ content-visibility/content-visibility-auto-in-iframe.html
1673+ content-visibility/content-visibility-auto-intrinsic-width.html
1674+ </wpt>
1675+
16571676 * Either the element or its [=contents=]
16581677 are focused,
16591678 as described in the <a href="https://html.spec.whatwg.org/multipage/interaction.html#focus">focus</a> section of the HTML spec.
@@ -1879,11 +1898,11 @@ This event is dispatched by posting a task at the time when the state change occ
18791898<pre class='idl'>
18801899[Exposed=Window]
18811900interface ContentVisibilityAutoStateChangeEvent : Event {
1882- constructor(DOMString type, optional ContentVisibilityAutoStateChangeEventInit eventInitDict = {});
1883- readonly attribute boolean skipped;
1901+ constructor(DOMString type, optional ContentVisibilityAutoStateChangeEventInit eventInitDict = {});
1902+ readonly attribute boolean skipped;
18841903};
18851904dictionary ContentVisibilityAutoStateChangeEventInit : EventInit {
1886- boolean skipped = false;
1905+ boolean skipped = false;
18871906};
18881907</pre>
18891908
@@ -1924,8 +1943,8 @@ Restrictions and Clarifications {#cv-notes}
192419431. From the perspective of an {{IntersectionObserver}} ,
19251944 the [=skipped contents=] of an element
19261945 are never intersecting the [=intersection root=] .
1927- This is true even if both the root and the target elements
1928- are in the [=skipped contents=] .
1946+ This is true even if both the root and the target elements
1947+ are in the [=skipped contents=] .
19291948
19301949 <wpt>
19311950 content-visibility/content-visibility-030.html
@@ -1948,15 +1967,15 @@ Restrictions and Clarifications {#cv-notes}
19481967 of the frame that renders the effects of the change
19491968 have run.
19501969 Specifically, such changes will take effect between steps 13 and 14
1951- of <a href="https://html.spec.whatwg.org/multipage/webappapis.html# update-the-rendering">Update the Rendering</a> step of the Processing Model
1970+ of [= update the rendering=] step of the Processing Model
19521971 (between “run the animation frame callbacks”
1953- and “run the update intersection observations steps”).
1972+ and “run the update intersection observations steps”).
19541973
19551974 <div class=note>
19561975 Determining the viewport intersection of the element
19571976 can be done with an internal version of an IntersectionObserver.
19581977 However, since the observations from this are dispatched at
1959- step 14 of Update the Rendering ,
1978+ step 14 of [=update the rendering=] ,
19601979 any changes to the [=skipped contents|skipped=] (and thus painted) state
19611980 will not be visible to the user until the next frame's processing.
19621981 For this reason, updating the [=skipped contents|skipped=] state,
@@ -1970,9 +1989,13 @@ Restrictions and Clarifications {#cv-notes}
19701989 and not cause any forced layouts.
19711990 </div>
19721991
1973- 4. The initial determination of visibility for ''content-visibility: auto'' must
1974- happen in the same frame that determined an existence of a new
1975- ''content-visibility: auto'' element.
1992+ 4. Elements with ''content-visibility: auto''
1993+ that have not determined [=proximity to the viewport=]
1994+ must determine their proximity to the viewport
1995+ in the next [=update the rendering=] cycle.
1996+ The effect of this determination must be reflected in the visual update which results from this [=update the rendering=] cycle.
1997+
19
2ACE
98+ ISSUE: Reference the HTML spec algorithm here, when it's available.
19761999
19772000 <div class=note>
19782001 When an element first gains ''content-visibility: auto'' , it may or may not
@@ -2280,6 +2303,7 @@ This appendix is <em>informative</em>.
22802303Changes from <a href="https://www.w3.org/TR/2022/WD-css-contain-2-20220917/">2022-09-17 Working Draft</a>
22812304</h3>
22822305
2306+ * defined [=proximity to the viewport=] and used it in the [[#cv-notes]] , clarification 4.
22832307* 'content-visibility' applies to the same properties as [=size containment=] rather than [=layout containment=]
22842308* clarified that 'content-visibility' affects the used value, not computed value, of the 'contain' property
22852309* Updated the ContentVisibilityAutoStateChanged event name to ContentVisibilityAutoStateChange to follow the convention for event names.
0 commit comments