CSS Scroll Snap Module Level 1 CR Test Suite

Aligning Scroll Snap Areas: Properties on the elements (26 tests)

Test Refs Flags Info
+ 5 Aligning Scroll Snap Areas: Properties on the elements
+ 5.1 Scroll Snapping Area: the scroll-margin property
scroll-margin Script
scroll-target-margin-001 = Recommend #target and scroll-margin with snapping off (y-axis)
  • Test passes if scroll-margin is honored on a scroll container with 'scroll-snap-type: none' when navigating to an element with the target fragment ID.
scroll-target-margin-002 = Recommend scrollIntoView() and scroll-margin with snapping off (y-axis)
  • Test passes if scroll-margin is honored on a scroll container with 'scroll-snap-type: none' when scrolling an element into view explicitly by script.
scroll-target-margin-003 = Recommend focus() and scroll-margin with snapping off (y-axis)
  • Test passes if scroll-margin is honored on a scroll container with 'scroll-snap-type: none' when scrolling an element into view even if that operation is implied (in this case, by .focus()).
scroll-target-margin-004 = Recommend scroll-margin on elements with 'display: table;'
  • Test passes if scroll-margin is honored on elements with 'display: table'.
scroll-target-padding-003 = focus() and scroll-padding with snapping off (y-axis)
  • Test passes if scroll-padding is honored on a scroll container with 'scroll-snap-type: none' when scrolling an element into view even if that operation is implied (in this case, by .focus()).
scrollintoview-scrollmargin Script CSSOM View - scrollIntoView considers scroll-margin
scroll-margin-computed Script CSS Scroll Snap: getComputedStyle().scrollMargin
  • scroll-margin computed value is absolute length.
scroll-margin-invalid Script scroll-margin with invalid values
  • scroll-margin supports only the grammar '<length>{1,4}'.
scroll-margin-shorthand Script scroll-margin sets longhands
  • scroll-margin supports the full grammar '<length>{1,4}'.
scroll-margin-valid Script scroll-margin with valid values
  • scroll-margin supports the full grammar '<length>{1,4}'.
+ 5.2 Scroll Snapping Alignment: the scroll-snap-align property
scroll-snap-initial-layout-000 = On-screen vs. Off-screen Snapped Initial Scroll Position (Mandatory and Proximity)
scroll-snap-writing-mode-000 = scroll-snap-align vs writing-mode
scroll-snap-align-computed Script CSS Scroll Snap: getComputedStyle().scrollSnapAlign
  • scroll-snap-align computed value is as specified.
scroll-snap-align-invalid Script scroll-snap-align with invalid values
  • scroll-snap-align supports only the grammar '[ none | start | end | center ]{1,2}'.
scroll-snap-align-valid Script scroll-snap-align with valid values
  • scroll-snap-align supports the full grammar '[ none | start | end | center ]{1,2}'.
+ 5.2.1 Scoping Valid Snap Positions to Visible Boxes
snap-to-visible-areas-both Script Snap to a visible area only even when there is a closer snap point for an area that is closer but not visible (using both axes snap type)
snap-to-visible-areas-margin-both Script Snap to an area where the element's scroll-margin is visible but not the element itself (using both axes snap type)
snap-to-visible-areas-margin-x-axis Script Snap to an area where the element's scroll-margin is visible but not the element itself (using x-axis snap type)
snap-to-visible-areas-margin-y-axis Script Snap to an area where the element's scroll-margin is visible but not the element itself (using y-axis snap type)
snap-to-visible-areas-x-axis Script Snap to a visible area only even when there is a closer snap point for an area that is closer but not visible (using x-axis snap type)
snap-to-visible-areas-y-axis Script Snap to a visible area only even when there is a closer snap point for an area that is closer but not visible (using y-axis snap type)
+ 5.2.2 Snapping Boxes that Overflow the Scrollport
+ 5.2.3 Unreachable Snap Positions
unreachable-snap-positions Script
+ 5.3 Scroll Snap Limits: the scroll-snap-stop property
scroll-snap-stop-computed Script CSS Scroll Snap: getComputedStyle().scrollSnapStop
  • scroll-snap-stop computed value is as specified.
scroll-snap-stop-invalid Script scroll-snap-stop with invalid values
  • scroll-snap-stop supports only the grammar 'normal | always'.
scroll-snap-stop-valid Script scroll-snap-stop with valid values
  • scroll-snap-stop supports the full grammar 'normal | always'.