summaryrefslogtreecommitdiffstats
path: root/testing/web-platform/tests/css/css-typed-om/the-stylepropertymap/properties
diff options
context:
space:
mode:
Diffstat (limited to 'testing/web-platform/tests/css/css-typed-om/the-stylepropertymap/properties')
-rw-r--r--testing/web-platform/tests/css/css-typed-om/the-stylepropertymap/properties/accent-color.html35
-rw-r--r--testing/web-platform/tests/css/css-typed-om/the-stylepropertymap/properties/alignment-baseline.html30
-rw-r--r--testing/web-platform/tests/css/css-typed-om/the-stylepropertymap/properties/all.html18
-rw-r--r--testing/web-platform/tests/css/css-typed-om/the-stylepropertymap/properties/animation-delay-end.tentative.html19
-rw-r--r--testing/web-platform/tests/css/css-typed-om/the-stylepropertymap/properties/animation-delay-start.tentative.html19
-rw-r--r--testing/web-platform/tests/css/css-typed-om/the-stylepropertymap/properties/animation-delay.html20
-rw-r--r--testing/web-platform/tests/css/css-typed-om/the-stylepropertymap/properties/animation-direction.html23
-rw-r--r--testing/web-platform/tests/css/css-typed-om/the-stylepropertymap/properties/animation-duration.html42
-rw-r--r--testing/web-platform/tests/css/css-typed-om/the-stylepropertymap/properties/animation-fill-mode.html23
-rw-r--r--testing/web-platform/tests/css/css-typed-om/the-stylepropertymap/properties/animation-iteration-count.html34
-rw-r--r--testing/web-platform/tests/css/css-typed-om/the-stylepropertymap/properties/animation-name.html27
-rw-r--r--testing/web-platform/tests/css/css-typed-om/the-stylepropertymap/properties/animation-play-state.html21
-rw-r--r--testing/web-platform/tests/css/css-typed-om/the-stylepropertymap/properties/animation-timing-function.html40
-rw-r--r--testing/web-platform/tests/css/css-typed-om/the-stylepropertymap/properties/animation.html21
-rw-r--r--testing/web-platform/tests/css/css-typed-om/the-stylepropertymap/properties/backdrop-filter.html25
-rw-r--r--testing/web-platform/tests/css/css-typed-om/the-stylepropertymap/properties/backface-visibility.html21
-rw-r--r--testing/web-platform/tests/css/css-typed-om/the-stylepropertymap/properties/background-attachment.html22
-rw-r--r--testing/web-platform/tests/css/css-typed-om/the-stylepropertymap/properties/background-blend-mode.html35
-rw-r--r--testing/web-platform/tests/css/css-typed-om/the-stylepropertymap/properties/background-clip.html22
-rw-r--r--testing/web-platform/tests/css/css-typed-om/the-stylepropertymap/properties/background-color.html30
-rw-r--r--testing/web-platform/tests/css/css-typed-om/the-stylepropertymap/properties/background-image.html21
-rw-r--r--testing/web-platform/tests/css/css-typed-om/the-stylepropertymap/properties/background-origin.html22
-rw-r--r--testing/web-platform/tests/css/css-typed-om/the-stylepropertymap/properties/background-position.html20
-rw-r--r--testing/web-platform/tests/css/css-typed-om/the-stylepropertymap/properties/background-repeat.html29
-rw-r--r--testing/web-platform/tests/css/css-typed-om/the-stylepropertymap/properties/background-size.html34
-rw-r--r--testing/web-platform/tests/css/css-typed-om/the-stylepropertymap/properties/background.html24
-rw-r--r--testing/web-platform/tests/css/css-typed-om/the-stylepropertymap/properties/baseline-shift.html23
-rw-r--r--testing/web-platform/tests/css/css-typed-om/the-stylepropertymap/properties/block-size.html63
-rw-r--r--testing/web-platform/tests/css/css-typed-om/the-stylepropertymap/properties/border-collapse.html21
-rw-r--r--testing/web-platform/tests/css/css-typed-om/the-stylepropertymap/properties/border-color.html33
-rw-r--r--testing/web-platform/tests/css/css-typed-om/the-stylepropertymap/properties/border-image-outset.html35
-rw-r--r--testing/web-platform/tests/css/css-typed-om/the-stylepropertymap/properties/border-image-repeat.html41
-rw-r--r--testing/web-platform/tests/css/css-typed-om/the-stylepropertymap/properties/border-image-slice.html35
-rw-r--r--testing/web-platform/tests/css/css-typed-om/the-stylepropertymap/properties/border-image-source.html21
-rw-r--r--testing/web-platform/tests/css/css-typed-om/the-stylepropertymap/properties/border-image-width.html44
-rw-r--r--testing/web-platform/tests/css/css-typed-om/the-stylepropertymap/properties/border-radius.html38
-rw-r--r--testing/web-platform/tests/css/css-typed-om/the-stylepropertymap/properties/border-style.html24
-rw-r--r--testing/web-platform/tests/css/css-typed-om/the-stylepropertymap/properties/border-width.html44
-rw-r--r--testing/web-platform/tests/css/css-typed-om/the-stylepropertymap/properties/bottom.html22
-rw-r--r--testing/web-platform/tests/css/css-typed-om/the-stylepropertymap/properties/box-shadow.html24
-rw-r--r--testing/web-platform/tests/css/css-typed-om/the-stylepropertymap/properties/box-sizing.html21
-rw-r--r--testing/web-platform/tests/css/css-typed-om/the-stylepropertymap/properties/break.html41
-rw-r--r--testing/web-platform/tests/css/css-typed-om/the-stylepropertymap/properties/caption-side.html21
-rw-r--r--testing/web-platform/tests/css/css-typed-om/the-stylepropertymap/properties/caret-color.html35
-rw-r--r--testing/web-platform/tests/css/css-typed-om/the-stylepropertymap/properties/center-coordinate.html26
-rw-r--r--testing/web-platform/tests/css/css-typed-om/the-stylepropertymap/properties/clear.html23
-rw-r--r--testing/web-platform/tests/css/css-typed-om/the-stylepropertymap/properties/clip-path.html32
-rw-r--r--testing/web-platform/tests/css/css-typed-om/the-stylepropertymap/properties/clip-rule.html21
-rw-r--r--testing/web-platform/tests/css/css-typed-om/the-stylepropertymap/properties/clip.html24
-rw-r--r--testing/web-platform/tests/css/css-typed-om/the-stylepropertymap/properties/color-interpolation.html22
-rw-r--r--testing/web-platform/tests/css/css-typed-om/the-stylepropertymap/properties/color.html30
-rw-r--r--testing/web-platform/tests/css/css-typed-om/the-stylepropertymap/properties/column-count.html41
-rw-r--r--testing/web-platform/tests/css/css-typed-om/the-stylepropertymap/properties/column-rule-color.html30
-rw-r--r--testing/web-platform/tests/css/css-typed-om/the-stylepropertymap/properties/column-rule-style.html29
-rw-r--r--testing/web-platform/tests/css/css-typed-om/the-stylepropertymap/properties/column-rule-width.html42
-rw-r--r--testing/web-platform/tests/css/css-typed-om/the-stylepropertymap/properties/column-span.html21
-rw-r--r--testing/web-platform/tests/css/css-typed-om/the-stylepropertymap/properties/column-width.html24
-rw-r--r--testing/web-platform/tests/css/css-typed-om/the-stylepropertymap/properties/contain.html31
-rw-r--r--testing/web-platform/tests/css/css-typed-om/the-stylepropertymap/properties/container-name.html25
-rw-r--r--testing/web-platform/tests/css/css-typed-om/the-stylepropertymap/properties/container-type.html20
-rw-r--r--testing/web-platform/tests/css/css-typed-om/the-stylepropertymap/properties/coordinate.html26
-rw-r--r--testing/web-platform/tests/css/css-typed-om/the-stylepropertymap/properties/counter-increment.html24
-rw-r--r--testing/web-platform/tests/css/css-typed-om/the-stylepropertymap/properties/counter-reset.html24
-rw-r--r--testing/web-platform/tests/css/css-typed-om/the-stylepropertymap/properties/counter-set.html24
-rw-r--r--testing/web-platform/tests/css/css-typed-om/the-stylepropertymap/properties/cursor.html59
-rw-r--r--testing/web-platform/tests/css/css-typed-om/the-stylepropertymap/properties/d.html24
-rw-r--r--testing/web-platform/tests/css/css-typed-om/the-stylepropertymap/properties/direction.html21
-rw-r--r--testing/web-platform/tests/css/css-typed-om/the-stylepropertymap/properties/display.html59
-rw-r--r--testing/web-platform/tests/css/css-typed-om/the-stylepropertymap/properties/dominant-baseline.html28
-rw-r--r--testing/web-platform/tests/css/css-typed-om/the-stylepropertymap/properties/empty-cells.html21
-rw-r--r--testing/web-platform/tests/css/css-typed-om/the-stylepropertymap/properties/fill-color.html30
-rw-r--r--testing/web-platform/tests/css/css-typed-om/the-stylepropertymap/properties/fill-opacity.html50
-rw-r--r--testing/web-platform/tests/css/css-typed-om/the-stylepropertymap/properties/fill-rule.html21
-rw-r--r--testing/web-platform/tests/css/css-typed-om/the-stylepropertymap/properties/fill.html21
-rw-r--r--testing/web-platform/tests/css/css-typed-om/the-stylepropertymap/properties/filter.html25
-rw-r--r--testing/web-platform/tests/css/css-typed-om/the-stylepropertymap/properties/flex-basis.html42
-rw-r--r--testing/web-platform/tests/css/css-typed-om/the-stylepropertymap/properties/flex-direction.html23
-rw-r--r--testing/web-platform/tests/css/css-typed-om/the-stylepropertymap/properties/flex-flow.html20
-rw-r--r--testing/web-platform/tests/css/css-typed-om/the-stylepropertymap/properties/flex-grow.html33
-rw-r--r--testing/web-platform/tests/css/css-typed-om/the-stylepropertymap/properties/flex-shrink.html33
-rw-r--r--testing/web-platform/tests/css/css-typed-om/the-stylepropertymap/properties/flex-wrap.html22
-rw-r--r--testing/web-platform/tests/css/css-typed-om/the-stylepropertymap/properties/flex.html20
-rw-r--r--testing/web-platform/tests/css/css-typed-om/the-stylepropertymap/properties/float.html22
-rw-r--r--testing/web-platform/tests/css/css-typed-om/the-stylepropertymap/properties/flood-color.html30
-rw-r--r--testing/web-platform/tests/css/css-typed-om/the-stylepropertymap/properties/flood-opacity.html50
-rw-r--r--testing/web-platform/tests/css/css-typed-om/the-stylepropertymap/properties/font-family.html23
-rw-r--r--testing/web-platform/tests/css/css-typed-om/the-stylepropertymap/properties/font-feature-settings.html25
-rw-r--r--testing/web-platform/tests/css/css-typed-om/the-stylepropertymap/properties/font-kerning.html22
-rw-r--r--testing/web-platform/tests/css/css-typed-om/the-stylepropertymap/properties/font-language-override.html24
-rw-r--r--testing/web-platform/tests/css/css-typed-om/the-stylepropertymap/properties/font-optical-sizing.html21
-rw-r--r--testing/web-platform/tests/css/css-typed-om/the-stylepropertymap/properties/font-palette.html26
-rw-r--r--testing/web-platform/tests/css/css-typed-om/the-stylepropertymap/properties/font-presentation.html22
-rw-r--r--testing/web-platform/tests/css/css-typed-om/the-stylepropertymap/properties/font-size-adjust.html34
-rw-r--r--testing/web-platform/tests/css/css-typed-om/the-stylepropertymap/properties/font-size.html72
-rw-r--r--testing/web-platform/tests/css/css-typed-om/the-stylepropertymap/properties/font-stretch.html42
-rw-r--r--testing/web-platform/tests/css/css-typed-om/the-stylepropertymap/properties/font-style.html22
-rw-r--r--testing/web-platform/tests/css/css-typed-om/the-stylepropertymap/properties/font-synthesis.html27
-rw-r--r--testing/web-platform/tests/css/css-typed-om/the-stylepropertymap/properties/font-variant-alternates.html31
-rw-r--r--testing/web-platform/tests/css/css-typed-om/the-stylepropertymap/properties/font-variant-caps.html26
-rw-r--r--testing/web-platform/tests/css/css-typed-om/the-stylepropertymap/properties/font-variant-east-asian.html34
-rw-r--r--testing/web-platform/tests/css/css-typed-om/the-stylepropertymap/properties/font-variant-emoji.html23
-rw-r--r--testing/web-platform/tests/css/css-typed-om/the-stylepropertymap/properties/font-variant-ligatures.html34
-rw-r--r--testing/web-platform/tests/css/css-typed-om/the-stylepropertymap/properties/font-variant-numeric.html32
-rw-r--r--testing/web-platform/tests/css/css-typed-om/the-stylepropertymap/properties/font-variant.html21
-rw-r--r--testing/web-platform/tests/css/css-typed-om/the-stylepropertymap/properties/font-variation-settings.html24
-rw-r--r--testing/web-platform/tests/css/css-typed-om/the-stylepropertymap/properties/font-weight.html50
-rw-r--r--testing/web-platform/tests/css/css-typed-om/the-stylepropertymap/properties/font.html24
-rw-r--r--testing/web-platform/tests/css/css-typed-om/the-stylepropertymap/properties/gap.html40
-rw-r--r--testing/web-platform/tests/css/css-typed-om/the-stylepropertymap/properties/grid-area.html21
-rw-r--r--testing/web-platform/tests/css/css-typed-om/the-stylepropertymap/properties/grid-auto-columns-rows.html49
-rw-r--r--testing/web-platform/tests/css/css-typed-om/the-stylepropertymap/properties/grid-auto-flow.html25
-rw-r--r--testing/web-platform/tests/css/css-typed-om/the-stylepropertymap/properties/grid-gap.html20
-rw-r--r--testing/web-platform/tests/css/css-typed-om/the-stylepropertymap/properties/grid-start-end.html28
-rw-r--r--testing/web-platform/tests/css/css-typed-om/the-stylepropertymap/properties/grid-template-areas.html24
-rw-r--r--testing/web-platform/tests/css/css-typed-om/the-stylepropertymap/properties/grid-template-columns-rows.html49
-rw-r--r--testing/web-platform/tests/css/css-typed-om/the-stylepropertymap/properties/grid-template.html22
-rw-r--r--testing/web-platform/tests/css/css-typed-om/the-stylepropertymap/properties/grid.html21
-rw-r--r--testing/web-platform/tests/css/css-typed-om/the-stylepropertymap/properties/height.html63
-rw-r--r--testing/web-platform/tests/css/css-typed-om/the-stylepropertymap/properties/hyphens.html22
-rw-r--r--testing/web-platform/tests/css/css-typed-om/the-stylepropertymap/properties/image-rendering.html24
-rw-r--r--testing/web-platform/tests/css/css-typed-om/the-stylepropertymap/properties/inline-size.html63
-rw-r--r--testing/web-platform/tests/css/css-typed-om/the-stylepropertymap/properties/isolation.html21
-rw-r--r--testing/web-platform/tests/css/css-typed-om/the-stylepropertymap/properties/left.html22
-rw-r--r--testing/web-platform/tests/css/css-typed-om/the-stylepropertymap/properties/letter-spacing.html40
-rw-r--r--testing/web-platform/tests/css/css-typed-om/the-stylepropertymap/properties/lighting-color.html30
-rw-r--r--testing/web-platform/tests/css/css-typed-om/the-stylepropertymap/properties/line-break.html24
-rw-r--r--testing/web-platform/tests/css/css-typed-om/the-stylepropertymap/properties/line-height.html35
-rw-r--r--testing/web-platform/tests/css/css-typed-om/the-stylepropertymap/properties/list-style-image.html21
-rw-r--r--testing/web-platform/tests/css/css-typed-om/the-stylepropertymap/properties/list-style-position.html21
-rw-r--r--testing/web-platform/tests/css/css-typed-om/the-stylepropertymap/properties/list-style-type.html27
-rw-r--r--testing/web-platform/tests/css/css-typed-om/the-stylepropertymap/properties/logical.html105
-rw-r--r--testing/web-platform/tests/css/css-typed-om/the-stylepropertymap/properties/margin.html35
-rw-r--r--testing/web-platform/tests/css/css-typed-om/the-stylepropertymap/properties/marker.html27
-rw-r--r--testing/web-platform/tests/css/css-typed-om/the-stylepropertymap/properties/mask-image.html21
-rw-r--r--testing/web-platform/tests/css/css-typed-om/the-stylepropertymap/properties/mask-type.html21
-rw-r--r--testing/web-platform/tests/css/css-typed-om/the-stylepropertymap/properties/mask.html20
-rw-r--r--testing/web-platform/tests/css/css-typed-om/the-stylepropertymap/properties/mix-blend-mode.html35
-rw-r--r--testing/web-platform/tests/css/css-typed-om/the-stylepropertymap/properties/object-fit.html24
-rw-r--r--testing/web-platform/tests/css/css-typed-om/the-stylepropertymap/properties/object-position.html20
-rw-r--r--testing/web-platform/tests/css/css-typed-om/the-stylepropertymap/properties/offset-anchor.html20
-rw-r--r--testing/web-platform/tests/css/css-typed-om/the-stylepropertymap/properties/offset-distance.html21
-rw-r--r--testing/web-platform/tests/css/css-typed-om/the-stylepropertymap/properties/offset-path.html25
-rw-r--r--testing/web-platform/tests/css/css-typed-om/the-stylepropertymap/properties/offset-position.html22
-rw-r--r--testing/web-platform/tests/css/css-typed-om/the-stylepropertymap/properties/offset-rotate.html26
-rw-r--r--testing/web-platform/tests/css/css-typed-om/the-stylepropertymap/properties/offset.html23
-rw-r--r--testing/web-platform/tests/css/css-typed-om/the-stylepropertymap/properties/opacity.html48
-rw-r--r--testing/web-platform/tests/css/css-typed-om/the-stylepropertymap/properties/order.html35
-rw-r--r--testing/web-platform/tests/css/css-typed-om/the-stylepropertymap/properties/orphans.html37
-rw-r--r--testing/web-platform/tests/css/css-typed-om/the-stylepropertymap/properties/outline-color.html31
-rw-r--r--testing/web-platform/tests/css/css-typed-om/the-stylepropertymap/properties/outline-offset.html20
-rw-r--r--testing/web-platform/tests/css/css-typed-om/the-stylepropertymap/properties/outline-style.html29
-rw-r--r--testing/web-platform/tests/css/css-typed-om/the-stylepropertymap/properties/outline-width.html41
-rw-r--r--testing/web-platform/tests/css/css-typed-om/the-stylepropertymap/properties/overflow-anchor.html21
-rw-r--r--testing/web-platform/tests/css/css-typed-om/the-stylepropertymap/properties/overflow-clip-margin.html26
-rw-r--r--testing/web-platform/tests/css/css-typed-om/the-stylepropertymap/properties/overflow-wrap.html26
-rw-r--r--testing/web-platform/tests/css/css-typed-om/the-stylepropertymap/properties/overflow.html26
-rw-r--r--testing/web-platform/tests/css/css-typed-om/the-stylepropertymap/properties/overscroll-behavior.html24
-rw-r--r--testing/web-platform/tests/css/css-typed-om/the-stylepropertymap/properties/padding.html39
-rw-r--r--testing/web-platform/tests/css/css-typed-om/the-stylepropertymap/properties/page.html23
-rw-r--r--testing/web-platform/tests/css/css-typed-om/the-stylepropertymap/properties/paint-order.html27
-rw-r--r--testing/web-platform/tests/css/css-typed-om/the-stylepropertymap/properties/perspective-origin.html21
-rw-r--r--testing/web-platform/tests/css/css-typed-om/the-stylepropertymap/properties/perspective.html24
-rw-r--r--testing/web-platform/tests/css/css-typed-om/the-stylepropertymap/properties/pointer-events.html29
-rw-r--r--testing/web-platform/tests/css/css-typed-om/the-stylepropertymap/properties/position.html22
-rw-r--r--testing/web-platform/tests/css/css-typed-om/the-stylepropertymap/properties/quotes.html24
-rw-r--r--testing/web-platform/tests/css/css-typed-om/the-stylepropertymap/properties/radius.html63
-rw-r--r--testing/web-platform/tests/css/css-typed-om/the-stylepropertymap/properties/resize.html23
-rw-r--r--testing/web-platform/tests/css/css-typed-om/the-stylepropertymap/properties/resources/testsuite.js485
-rw-r--r--testing/web-platform/tests/css/css-typed-om/the-stylepropertymap/properties/right.html22
-rw-r--r--testing/web-platform/tests/css/css-typed-om/the-stylepropertymap/properties/scroll-behavior.html21
-rw-r--r--testing/web-platform/tests/css/css-typed-om/the-stylepropertymap/properties/scroll-margin.html32
-rw-r--r--testing/web-platform/tests/css/css-typed-om/the-stylepropertymap/properties/scroll-padding.html57
-rw-r--r--testing/web-platform/tests/css/css-typed-om/the-stylepropertymap/properties/scroll-snap-align.html39
-rw-r--r--testing/web-platform/tests/css/css-typed-om/the-stylepropertymap/properties/scroll-snap-stop.html21
-rw-r--r--testing/web-platform/tests/css/css-typed-om/the-stylepropertymap/properties/scroll-snap-type.html29
-rw-r--r--testing/web-platform/tests/css/css-typed-om/the-stylepropertymap/properties/scrollbar-gutter.html24
-rw-r--r--testing/web-platform/tests/css/css-typed-om/the-stylepropertymap/properties/scrollbar-width.html22
-rw-r--r--testing/web-platform/tests/css/css-typed-om/the-stylepropertymap/properties/shape-image-threshold.html34
-rw-r--r--testing/web-platform/tests/css/css-typed-om/the-stylepropertymap/properties/shape-margin.html37
-rw-r--r--testing/web-platform/tests/css/css-typed-om/the-stylepropertymap/properties/shape-outside.html33
-rw-r--r--testing/web-platform/tests/css/css-typed-om/the-stylepropertymap/properties/shape-rendering.html23
-rw-r--r--testing/web-platform/tests/css/css-typed-om/the-stylepropertymap/properties/speak.html22
-rw-r--r--testing/web-platform/tests/css/css-typed-om/the-stylepropertymap/properties/stop-color.html30
-rw-r--r--testing/web-platform/tests/css/css-typed-om/the-stylepropertymap/properties/stop-opacity.html49
-rw-r--r--testing/web-platform/tests/css/css-typed-om/the-stylepropertymap/properties/stroke-dasharray.html47
-rw-r--r--testing/web-platform/tests/css/css-typed-om/the-stylepropertymap/properties/stroke-dashoffset.html25
-rw-r--r--testing/web-platform/tests/css/css-typed-om/the-stylepropertymap/properties/stroke-linecap.html22
-rw-r--r--testing/web-platform/tests/css/css-typed-om/the-stylepropertymap/properties/stroke-linejoin.html29
-rw-r--r--testing/web-platform/tests/css/css-typed-om/the-stylepropertymap/properties/stroke-miterlimit.html30
-rw-r--r--testing/web-platform/tests/css/css-typed-om/the-stylepropertymap/properties/stroke-opacity.html48
-rw-r--r--testing/web-platform/tests/css/css-typed-om/the-stylepropertymap/properties/stroke-width.html39
-rw-r--r--testing/web-platform/tests/css/css-typed-om/the-stylepropertymap/properties/stroke.html21
-rw-r--r--testing/web-platform/tests/css/css-typed-om/the-stylepropertymap/properties/tab-size.html42
-rw-r--r--testing/web-platform/tests/css/css-typed-om/the-stylepropertymap/properties/table-layout.html21
-rw-r--r--testing/web-platform/tests/css/css-typed-om/the-stylepropertymap/properties/text-align-last.html26
-rw-r--r--testing/web-platform/tests/css/css-typed-om/the-stylepropertymap/properties/text-align.html22
-rw-r--r--testing/web-platform/tests/css/css-typed-om/the-stylepropertymap/properties/text-anchor.html22
-rw-r--r--testing/web-platform/tests/css/css-typed-om/the-stylepropertymap/properties/text-combine-upright.html25
-rw-r--r--testing/web-platform/tests/css/css-typed-om/the-stylepropertymap/properties/text-decoration-color.html30
-rw-r--r--testing/web-platform/tests/css/css-typed-om/the-stylepropertymap/properties/text-decoration-line.html26
-rw-r--r--testing/web-platform/tests/css/css-typed-om/the-stylepropertymap/properties/text-decoration-skip-ink.html21
-rw-r--r--testing/web-platform/tests/css/css-typed-om/the-stylepropertymap/properties/text-decoration-skip.html29
-rw-r--r--testing/web-platform/tests/css/css-typed-om/the-stylepropertymap/properties/text-decoration-style.html24
-rw-r--r--testing/web-platform/tests/css/css-typed-om/the-stylepropertymap/properties/text-decoration-thickness.html26
-rw-r--r--testing/web-platform/tests/css/css-typed-om/the-stylepropertymap/properties/text-decoration.html20
-rw-r--r--testing/web-platform/tests/css/css-typed-om/the-stylepropertymap/properties/text-emphasis-color.html30
-rw-r--r--testing/web-platform/tests/css/css-typed-om/the-stylepropertymap/properties/text-indent.html25
-rw-r--r--testing/web-platform/tests/css/css-typed-om/the-stylepropertymap/properties/text-justify.html23
-rw-r--r--testing/web-platform/tests/css/css-typed-om/the-stylepropertymap/properties/text-orientation.html22
-rw-r--r--testing/web-platform/tests/css/css-typed-om/the-stylepropertymap/properties/text-overflow.html26
-rw-r--r--testing/web-platform/tests/css/css-typed-om/the-stylepropertymap/properties/text-rendering.html23
-rw-r--r--testing/web-platform/tests/css/css-typed-om/the-stylepropertymap/properties/text-shadow.html24
-rw-r--r--testing/web-platform/tests/css/css-typed-om/the-stylepropertymap/properties/text-size-adjust.html22
-rw-r--r--testing/web-platform/tests/css/css-typed-om/the-stylepropertymap/properties/text-transform.html24
-rw-r--r--testing/web-platform/tests/css/css-typed-om/the-stylepropertymap/properties/text-underline-offset.html22
-rw-r--r--testing/web-platform/tests/css/css-typed-om/the-stylepropertymap/properties/text-underline-position.html27
-rw-r--r--testing/web-platform/tests/css/css-typed-om/the-stylepropertymap/properties/top.html22
-rw-r--r--testing/web-platform/tests/css/css-typed-om/the-stylepropertymap/properties/touch-action.html33
-rw-r--r--testing/web-platform/tests/css/css-typed-om/the-stylepropertymap/properties/transform-box.html22
-rw-r--r--testing/web-platform/tests/css/css-typed-om/the-stylepropertymap/properties/transform-interpolated.html31
-rw-r--r--testing/web-platform/tests/css/css-typed-om/the-stylepropertymap/properties/transform-style.html22
-rw-r--r--testing/web-platform/tests/css/css-typed-om/the-stylepropertymap/properties/transform.html21
-rw-r--r--testing/web-platform/tests/css/css-typed-om/the-stylepropertymap/properties/transition-delay.html20
-rw-r--r--testing/web-platform/tests/css/css-typed-om/the-stylepropertymap/properties/transition-duration.html19
-rw-r--r--testing/web-platform/tests/css/css-typed-om/the-stylepropertymap/properties/transition-property.html24
-rw-r--r--testing/web-platform/tests/css/css-typed-om/the-stylepropertymap/properties/transition-timing-function.html40
-rw-r--r--testing/web-platform/tests/css/css-typed-om/the-stylepropertymap/properties/transition.html20
-rw-r--r--testing/web-platform/tests/css/css-typed-om/the-stylepropertymap/properties/unicode-bidi.html25
-rw-r--r--testing/web-platform/tests/css/css-typed-om/the-stylepropertymap/properties/user-select.html24
-rw-r--r--testing/web-platform/tests/css/css-typed-om/the-stylepropertymap/properties/vector-effect.html21
-rw-r--r--testing/web-platform/tests/css/css-typed-om/the-stylepropertymap/properties/vertical-align.html23
-rw-r--r--testing/web-platform/tests/css/css-typed-om/the-stylepropertymap/properties/visibility.html22
-rw-r--r--testing/web-platform/tests/css/css-typed-om/the-stylepropertymap/properties/white-space.html51
-rw-r--r--testing/web-platform/tests/css/css-typed-om/the-stylepropertymap/properties/widows.html37
-rw-r--r--testing/web-platform/tests/css/css-typed-om/the-stylepropertymap/properties/width.html63
-rw-r--r--testing/web-platform/tests/css/css-typed-om/the-stylepropertymap/properties/will-change.html24
-rw-r--r--testing/web-platform/tests/css/css-typed-om/the-stylepropertymap/properties/word-break.html22
-rw-r--r--testing/web-platform/tests/css/css-typed-om/the-stylepropertymap/properties/word-spacing.html22
-rw-r--r--testing/web-platform/tests/css/css-typed-om/the-stylepropertymap/properties/word-wrap.html26
-rw-r--r--testing/web-platform/tests/css/css-typed-om/the-stylepropertymap/properties/writing-mode.html24
-rw-r--r--testing/web-platform/tests/css/css-typed-om/the-stylepropertymap/properties/z-index.html37
241 files changed, 7469 insertions, 0 deletions
diff --git a/testing/web-platform/tests/css/css-typed-om/the-stylepropertymap/properties/accent-color.html b/testing/web-platform/tests/css/css-typed-om/the-stylepropertymap/properties/accent-color.html
new file mode 100644
index 0000000000..8cd0b986e8
--- /dev/null
+++ b/testing/web-platform/tests/css/css-typed-om/the-stylepropertymap/properties/accent-color.html
@@ -0,0 +1,35 @@
+<!DOCTYPE html>
+<meta charset="utf-8">
+<title>'accent-color' property</title>
+<link rel="help" href="https://drafts.css-houdini.org/css-typed-om-1/#dom-stylepropertymap-get">
+<link rel="help" href="https://drafts.css-houdini.org/css-typed-om-1/#dom-stylepropertymap-set">
+<link rel="help" href="https://drafts.css-houdini.org/css-typed-om-1/#property-stle-value-normalization">
+<script src="/resources/testharness.js"></script>
+<script src="/resources/testharnessreport.js"></script>
+<script src="../../resources/testhelper.js"></script>
+<script src="resources/testsuite.js"></script>
+<body>
+<div id="log"></div>
+<script>
+'use strict';
+
+runPropertyTests('accent-color', [
+ {
+ syntax: 'currentcolor',
+ // computes to a <color>, which is not supported in level 1
+ computed: (_, result) => assert_class_string(result, 'CSSStyleValue')
+ },
+ {
+ syntax: 'auto',
+ // computes to a <color>, which is not supported in level 1
+ computed: (_, result) => assert_class_string(result, 'CSSStyleValue')
+ }
+]);
+
+// <color>s are not supported in level 1
+runUnsupportedPropertyTests('accent-color', [
+ 'red', '#bbff00', 'rgb(255, 255, 128)', 'hsl(50, 33%, 25%)',
+ 'transparent'
+]);
+
+</script>
diff --git a/testing/web-platform/tests/css/css-typed-om/the-stylepropertymap/properties/alignment-baseline.html b/testing/web-platform/tests/css/css-typed-om/the-stylepropertymap/properties/alignment-baseline.html
new file mode 100644
index 0000000000..aab4a6a5c3
--- /dev/null
+++ b/testing/web-platform/tests/css/css-typed-om/the-stylepropertymap/properties/alignment-baseline.html
@@ -0,0 +1,30 @@
+<!doctype html>
+<meta charset="utf-8">
+<title>'alignment-baseline' property</title>
+<link rel="help" href="https://drafts.css-houdini.org/css-typed-om-1/#dom-stylepropertymap-get">
+<link rel="help" href="https://drafts.css-houdini.org/css-typed-om-1/#dom-stylepropertymap-set">
+<link rel="help" href="https://drafts.css-houdini.org/css-typed-om-1/#property-stle-value-normalization">
+<script src="/resources/testharness.js"></script>
+<script src="/resources/testharnessreport.js"></script>
+<script src="../../resources/testhelper.js"></script>
+<script src="resources/testsuite.js"></script>
+<body>
+<div id="log"></div>
+<script>
+'use strict';
+
+runPropertyTests('alignment-baseline', [
+ { syntax: 'baseline' },
+ { syntax: 'text-bottom' },
+ { syntax: 'alphabetic' },
+ { syntax: 'ideographic' },
+ { syntax: 'middle' },
+ { syntax: 'central' },
+ { syntax: 'mathematical' },
+ { syntax: 'text-top' },
+ { syntax: 'bottom' },
+ { syntax: 'center' },
+ { syntax: 'top' },
+]);
+
+</script>
diff --git a/testing/web-platform/tests/css/css-typed-om/the-stylepropertymap/properties/all.html b/testing/web-platform/tests/css/css-typed-om/the-stylepropertymap/properties/all.html
new file mode 100644
index 0000000000..dd618bcde6
--- /dev/null
+++ b/testing/web-platform/tests/css/css-typed-om/the-stylepropertymap/properties/all.html
@@ -0,0 +1,18 @@
+<!doctype html>
+<meta charset="utf-8">
+<title>'all' property</title>
+<link rel="help" href="https://drafts.css-houdini.org/css-typed-om-1/#dom-stylepropertymap-get">
+<link rel="help" href="https://drafts.css-houdini.org/css-typed-om-1/#dom-stylepropertymap-set">
+<link rel="help" href="https://drafts.css-houdini.org/css-typed-om-1/#property-stle-value-normalization">
+<script src="/resources/testharness.js"></script>
+<script src="/resources/testharnessreport.js"></script>
+<script src="../../resources/testhelper.js"></script>
+<script src="resources/testsuite.js"></script>
+<body>
+<div id="log"></div>
+<script>
+'use strict';
+
+runPropertyTests('all', []);
+
+</script>
diff --git a/testing/web-platform/tests/css/css-typed-om/the-stylepropertymap/properties/animation-delay-end.tentative.html b/testing/web-platform/tests/css/css-typed-om/the-stylepropertymap/properties/animation-delay-end.tentative.html
new file mode 100644
index 0000000000..79b9f94617
--- /dev/null
+++ b/testing/web-platform/tests/css/css-typed-om/the-stylepropertymap/properties/animation-delay-end.tentative.html
@@ -0,0 +1,19 @@
+<!DOCTYPE html>
+<title>'animation-delay-end' property</title>
+<link rel="help" href="https://drafts.css-houdini.org/css-typed-om-1/#dom-stylepropertymap-get">
+<link rel="help" href="https://drafts.css-houdini.org/css-typed-om-1/#dom-stylepropertymap-set">
+<link rel="help" href="https://drafts.css-houdini.org/css-typed-om-1/#property-stle-value-normalization">
+<script src="/resources/testharness.js"></script>
+<script src="/resources/testharnessreport.js"></script>
+<script src="../../resources/testhelper.js"></script>
+<script src="resources/testsuite.js"></script>
+<body>
+<div id="log"></div>
+<script>
+'use strict';
+
+runListValuedPropertyTests('animation-delay-end', [
+ { syntax: '<time>' }
+]);
+
+</script>
diff --git a/testing/web-platform/tests/css/css-typed-om/the-stylepropertymap/properties/animation-delay-start.tentative.html b/testing/web-platform/tests/css/css-typed-om/the-stylepropertymap/properties/animation-delay-start.tentative.html
new file mode 100644
index 0000000000..2fba4d8e51
--- /dev/null
+++ b/testing/web-platform/tests/css/css-typed-om/the-stylepropertymap/properties/animation-delay-start.tentative.html
@@ -0,0 +1,19 @@
+<!DOCTYPE html>
+<title>'animation-delay-start' property</title>
+<link rel="help" href="https://drafts.css-houdini.org/css-typed-om-1/#dom-stylepropertymap-get">
+<link rel="help" href="https://drafts.css-houdini.org/css-typed-om-1/#dom-stylepropertymap-set">
+<link rel="help" href="https://drafts.css-houdini.org/css-typed-om-1/#property-stle-value-normalization">
+<script src="/resources/testharness.js"></script>
+<script src="/resources/testharnessreport.js"></script>
+<script src="../../resources/testhelper.js"></script>
+<script src="resources/testsuite.js"></script>
+<body>
+<div id="log"></div>
+<script>
+'use strict';
+
+runListValuedPropertyTests('animation-delay-start', [
+ { syntax: '<time>' }
+]);
+
+</script>
diff --git a/testing/web-platform/tests/css/css-typed-om/the-stylepropertymap/properties/animation-delay.html b/testing/web-platform/tests/css/css-typed-om/the-stylepropertymap/properties/animation-delay.html
new file mode 100644
index 0000000000..91ee95ec1d
--- /dev/null
+++ b/testing/web-platform/tests/css/css-typed-om/the-stylepropertymap/properties/animation-delay.html
@@ -0,0 +1,20 @@
+<!doctype html>
+<meta charset="utf-8">
+<title>'animation-delay' property</title>
+<link rel="help" href="https://drafts.css-houdini.org/css-typed-om-1/#dom-stylepropertymap-get">
+<link rel="help" href="https://drafts.css-houdini.org/css-typed-om-1/#dom-stylepropertymap-set">
+<link rel="help" href="https://drafts.css-houdini.org/css-typed-om-1/#property-stle-value-normalization">
+<script src="/resources/testharness.js"></script>
+<script src="/resources/testharnessreport.js"></script>
+<script src="../../resources/testhelper.js"></script>
+<script src="resources/testsuite.js"></script>
+<body>
+<div id="log"></div>
+<script>
+'use strict';
+
+runListValuedPropertyTests('animation-delay', [
+ { syntax: '<time>' }
+]);
+
+</script>
diff --git a/testing/web-platform/tests/css/css-typed-om/the-stylepropertymap/properties/animation-direction.html b/testing/web-platform/tests/css/css-typed-om/the-stylepropertymap/properties/animation-direction.html
new file mode 100644
index 0000000000..0d4f6c0295
--- /dev/null
+++ b/testing/web-platform/tests/css/css-typed-om/the-stylepropertymap/properties/animation-direction.html
@@ -0,0 +1,23 @@
+<!doctype html>
+<meta charset="utf-8">
+<title>'animation-direction' property</title>
+<link rel="help" href="https://drafts.css-houdini.org/css-typed-om-1/#dom-stylepropertymap-get">
+<link rel="help" href="https://drafts.css-houdini.org/css-typed-om-1/#dom-stylepropertymap-set">
+<link rel="help" href="https://drafts.css-houdini.org/css-typed-om-1/#property-stle-value-normalization">
+<script src="/resources/testharness.js"></script>
+<script src="/resources/testharnessreport.js"></script>
+<script src="../../resources/testhelper.js"></script>
+<script src="resources/testsuite.js"></script>
+<body>
+<div id="log"></div>
+<script>
+'use strict';
+
+runListValuedPropertyTests('animation-direction', [
+ { syntax: 'normal' },
+ { syntax: 'reverse' },
+ { syntax: 'alternate-reverse' },
+ { syntax: 'alternate' },
+]);
+
+</script>
diff --git a/testing/web-platform/tests/css/css-typed-om/the-stylepropertymap/properties/animation-duration.html b/testing/web-platform/tests/css/css-typed-om/the-stylepropertymap/properties/animation-duration.html
new file mode 100644
index 0000000000..edff11c8a2
--- /dev/null
+++ b/testing/web-platform/tests/css/css-typed-om/the-stylepropertymap/properties/animation-duration.html
@@ -0,0 +1,42 @@
+<meta charset="utf-8">
+<title>'animation-duration' property</title>
+<link rel="help" href="https://drafts.css-houdini.org/css-typed-om-1/#dom-stylepropertymap-get">
+<link rel="help" href="https://drafts.css-houdini.org/css-typed-om-1/#dom-stylepropertymap-set">
+<link rel="help" href="https://drafts.css-houdini.org/css-typed-om-1/#property-stle-value-normalization">
+<script src="/resources/testharness.js"></script>
+<script src="/resources/testharnessreport.js"></script>
+<script src="../../resources/testhelper.js"></script>
+<script src="resources/testsuite.js"></script>
+<body>
+<div id="log"></div>
+<script>
+'use strict';
+
+function assert_is_equal_with_clamping_time(input, result) {
+ const time = input.to('s');
+
+ if (time.value < 0)
+ assert_style_value_equals(result, new CSSUnitValue(0, 's'));
+ else
+ assert_style_value_equals(result, time);
+}
+
+runListValuedPropertyTests('animation-duration', [
+ {
+ syntax: '<time>',
+ specified: assert_is_equal_with_range_handling,
+ computed: assert_is_equal_with_clamping_time
+ },
+]);
+
+test((t) => {
+ let div = document.createElement('div');
+ t.add_cleanup(() => {
+ div.remove();
+ });
+ document.body.append(div);
+ let actual = div.computedStyleMap().get('animation-duration').toString();
+ assert_equals(actual, 'auto');
+}, 'Computed value of animation-duration is auto');
+
+</script>
diff --git a/testing/web-platform/tests/css/css-typed-om/the-stylepropertymap/properties/animation-fill-mode.html b/testing/web-platform/tests/css/css-typed-om/the-stylepropertymap/properties/animation-fill-mode.html
new file mode 100644
index 0000000000..419b98847c
--- /dev/null
+++ b/testing/web-platform/tests/css/css-typed-om/the-stylepropertymap/properties/animation-fill-mode.html
@@ -0,0 +1,23 @@
+<!doctype html>
+<meta charset="utf-8">
+<title>'animation-fill-mode' property</title>
+<link rel="help" href="https://drafts.css-houdini.org/css-typed-om-1/#dom-stylepropertymap-get">
+<link rel="help" href="https://drafts.css-houdini.org/css-typed-om-1/#dom-stylepropertymap-set">
+<link rel="help" href="https://drafts.css-houdini.org/css-typed-om-1/#property-stle-value-normalization">
+<script src="/resources/testharness.js"></script>
+<script src="/resources/testharnessreport.js"></script>
+<script src="../../resources/testhelper.js"></script>
+<script src="resources/testsuite.js"></script>
+<body>
+<div id="log"></div>
+<script>
+'use strict';
+
+runListValuedPropertyTests('animation-fill-mode', [
+ { syntax: 'none' },
+ { syntax: 'forwards' },
+ { syntax: 'backwards' },
+ { syntax: 'both' },
+]);
+
+</script>
diff --git a/testing/web-platform/tests/css/css-typed-om/the-stylepropertymap/properties/animation-iteration-count.html b/testing/web-platform/tests/css/css-typed-om/the-stylepropertymap/properties/animation-iteration-count.html
new file mode 100644
index 0000000000..627b281c7f
--- /dev/null
+++ b/testing/web-platform/tests/css/css-typed-om/the-stylepropertymap/properties/animation-iteration-count.html
@@ -0,0 +1,34 @@
+<!doctype html>
+<meta charset="utf-8">
+<title>'animation-iteration-count' property</title>
+<link rel="help" href="https://drafts.css-houdini.org/css-typed-om-1/#dom-stylepropertymap-get">
+<link rel="help" href="https://drafts.css-houdini.org/css-typed-om-1/#dom-stylepropertymap-set">
+<link rel="help" href="https://drafts.css-houdini.org/css-typed-om-1/#property-stle-value-normalization">
+<script src="/resources/testharness.js"></script>
+<script src="/resources/testharnessreport.js"></script>
+<script src="../../resources/testhelper.js"></script>
+<script src="resources/testsuite.js"></script>
+<body>
+<div id="log"></div>
+<script>
+'use strict';
+
+function assert_is_equal_with_clamping_number(input, result) {
+ const number = input.to('number');
+
+ if (number.value < 0)
+ assert_style_value_equals(result, new CSSUnitValue(0, 'number'));
+ else
+ assert_style_value_equals(result, number);
+}
+
+runListValuedPropertyTests('animation-iteration-count', [
+ { syntax: 'infinite' },
+ {
+ syntax: '<number>',
+ specified: assert_is_equal_with_range_handling,
+ computed: assert_is_equal_with_clamping_number
+ },
+]);
+
+</script>
diff --git a/testing/web-platform/tests/css/css-typed-om/the-stylepropertymap/properties/animation-name.html b/testing/web-platform/tests/css/css-typed-om/the-stylepropertymap/properties/animation-name.html
new file mode 100644
index 0000000000..df5d44ae38
--- /dev/null
+++ b/testing/web-platform/tests/css/css-typed-om/the-stylepropertymap/properties/animation-name.html
@@ -0,0 +1,27 @@
+<!doctype html>
+<meta charset="utf-8">
+<title>'animation-name' property</title>
+<link rel="help" href="https://drafts.css-houdini.org/css-typed-om-1/#dom-stylepropertymap-get">
+<link rel="help" href="https://drafts.css-houdini.org/css-typed-om-1/#dom-stylepropertymap-set">
+<link rel="help" href="https://drafts.css-houdini.org/css-typed-om-1/#property-stle-value-normalization">
+<script src="/resources/testharness.js"></script>
+<script src="/resources/testharnessreport.js"></script>
+<script src="../../resources/testhelper.js"></script>
+<script src="resources/testsuite.js"></script>
+<body>
+<div id="log"></div>
+<script>
+'use strict';
+
+runListValuedPropertyTests('animation-name', [
+ { syntax: 'none' },
+ // FIXME: This should be <custom-ident>, but the test harness doesn't
+ // currently support it.
+ { syntax: 'custom-ident' },
+]);
+
+runUnsupportedPropertyTests('animation-name', [
+ '"foo"'
+]);
+
+</script>
diff --git a/testing/web-platform/tests/css/css-typed-om/the-stylepropertymap/properties/animation-play-state.html b/testing/web-platform/tests/css/css-typed-om/the-stylepropertymap/properties/animation-play-state.html
new file mode 100644
index 0000000000..caa961131d
--- /dev/null
+++ b/testing/web-platform/tests/css/css-typed-om/the-stylepropertymap/properties/animation-play-state.html
@@ -0,0 +1,21 @@
+<!doctype html>
+<meta charset="utf-8">
+<title>'animation-play-state' property</title>
+<link rel="help" href="https://drafts.css-houdini.org/css-typed-om-1/#dom-stylepropertymap-get">
+<link rel="help" href="https://drafts.css-houdini.org/css-typed-om-1/#dom-stylepropertymap-set">
+<link rel="help" href="https://drafts.css-houdini.org/css-typed-om-1/#property-stle-value-normalization">
+<script src="/resources/testharness.js"></script>
+<script src="/resources/testharnessreport.js"></script>
+<script src="../../resources/testhelper.js"></script>
+<script src="resources/testsuite.js"></script>
+<body>
+<div id="log"></div>
+<script>
+'use strict';
+
+runListValuedPropertyTests('animation-play-state', [
+ { syntax: 'running' },
+ { syntax: 'paused' },
+]);
+
+</script>
diff --git a/testing/web-platform/tests/css/css-typed-om/the-stylepropertymap/properties/animation-timing-function.html b/testing/web-platform/tests/css/css-typed-om/the-stylepropertymap/properties/animation-timing-function.html
new file mode 100644
index 0000000000..eb9af36a85
--- /dev/null
+++ b/testing/web-platform/tests/css/css-typed-om/the-stylepropertymap/properties/animation-timing-function.html
@@ -0,0 +1,40 @@
+<!doctype html>
+<meta charset="utf-8">
+<title>'animation-timing-function' property</title>
+<link rel="help" href="https://drafts.css-houdini.org/css-typed-om-1/#dom-stylepropertymap-get">
+<link rel="help" href="https://drafts.css-houdini.org/css-typed-om-1/#dom-stylepropertymap-set">
+<link rel="help" href="https://drafts.css-houdini.org/css-typed-om-1/#property-stle-value-normalization">
+<script src="/resources/testharness.js"></script>
+<script src="/resources/testharnessreport.js"></script>
+<script src="../../resources/testhelper.js"></script>
+<script src="resources/testsuite.js"></script>
+<body>
+<div id="log"></div>
+<script>
+'use strict';
+
+runListValuedPropertyTests('animation-timing-function', [
+ { syntax: 'linear' },
+ { syntax: 'ease' },
+ { syntax: 'ease-in' },
+ { syntax: 'ease-out' },
+ { syntax: 'ease-in-out' },
+ {
+ syntax: 'step-start',
+ computed: (_, result) => {
+ assert_equals(result.toString(), 'steps(1, start)');
+ }
+ },
+ {
+ syntax: 'step-end',
+ computed: (_, result) => {
+ assert_equals(result.toString(), 'steps(1)');
+ }
+ },
+]);
+
+runUnsupportedPropertyTests('animation-timing-function', [
+ 'cubic-bezier(0.1, 0.7, 1.0, 0.1)', 'steps(4, end)'
+]);
+
+</script>
diff --git a/testing/web-platform/tests/css/css-typed-om/the-stylepropertymap/properties/animation.html b/testing/web-platform/tests/css/css-typed-om/the-stylepropertymap/properties/animation.html
new file mode 100644
index 0000000000..92a4916747
--- /dev/null
+++ b/testing/web-platform/tests/css/css-typed-om/the-stylepropertymap/properties/animation.html
@@ -0,0 +1,21 @@
+<!doctype html>
+<meta charset="utf-8">
+<title>'animation' property</title>
+<link rel="help" href="https://drafts.css-houdini.org/css-typed-om-1/#dom-stylepropertymap-get">
+<link rel="help" href="https://drafts.css-houdini.org/css-typed-om-1/#dom-stylepropertymap-set">
+<link rel="help" href="https://drafts.css-houdini.org/css-typed-om-1/#property-stle-value-normalization">
+<script src="/resources/testharness.js"></script>
+<script src="/resources/testharnessreport.js"></script>
+<script src="../../resources/testhelper.js"></script>
+<script src="resources/testsuite.js"></script>
+<body>
+<div id="log"></div>
+<script>
+'use strict';
+
+runUnsupportedPropertyTests('animation', [
+ 'slidein 3s ease-in 1s infinite reverse both running',
+ 'slidein .5s linear 1s infinite alternate'
+]);
+
+</script>
diff --git a/testing/web-platform/tests/css/css-typed-om/the-stylepropertymap/properties/backdrop-filter.html b/testing/web-platform/tests/css/css-typed-om/the-stylepropertymap/properties/backdrop-filter.html
new file mode 100644
index 0000000000..837ceb7c23
--- /dev/null
+++ b/testing/web-platform/tests/css/css-typed-om/the-stylepropertymap/properties/backdrop-filter.html
@@ -0,0 +1,25 @@
+<!doctype html>
+<meta charset="utf-8">
+<title>'backdrop-filter' property</title>
+<link rel="help" href="https://drafts.css-houdini.org/css-typed-om-1/#dom-stylepropertymap-get">
+<link rel="help" href="https://drafts.css-houdini.org/css-typed-om-1/#dom-stylepropertymap-set">
+<link rel="help" href="https://drafts.css-houdini.org/css-typed-om-1/#property-stle-value-normalization">
+<script src="/resources/testharness.js"></script>
+<script src="/resources/testharnessreport.js"></script>
+<script src="../../resources/testhelper.js"></script>
+<script src="resources/testsuite.js"></script>
+<body>
+<div id="log"></div>
+<script>
+'use strict';
+
+runPropertyTests('backdrop-filter', [
+ { syntax: 'none' },
+]);
+
+runUnsupportedPropertyTests('filter', [
+ 'blur(2px)',
+ 'url(filters.svg) blur(4px) saturate(150%)',
+]);
+
+</script>
diff --git a/testing/web-platform/tests/css/css-typed-om/the-stylepropertymap/properties/backface-visibility.html b/testing/web-platform/tests/css/css-typed-om/the-stylepropertymap/properties/backface-visibility.html
new file mode 100644
index 0000000000..ae9502d647
--- /dev/null
+++ b/testing/web-platform/tests/css/css-typed-om/the-stylepropertymap/properties/backface-visibility.html
@@ -0,0 +1,21 @@
+<!doctype html>
+<meta charset="utf-8">
+<title>'backface-visibility' property</title>
+<link rel="help" href="https://drafts.css-houdini.org/css-typed-om-1/#dom-stylepropertymap-get">
+<link rel="help" href="https://drafts.css-houdini.org/css-typed-om-1/#dom-stylepropertymap-set">
+<link rel="help" href="https://drafts.css-houdini.org/css-typed-om-1/#property-stle-value-normalization">
+<script src="/resources/testharness.js"></script>
+<script src="/resources/testharnessreport.js"></script>
+<script src="../../resources/testhelper.js"></script>
+<script src="resources/testsuite.js"></script>
+<body>
+<div id="log"></div>
+<script>
+'use strict';
+
+runPropertyTests('backface-visibility', [
+ { syntax: 'visible' },
+ { syntax: 'hidden' },
+]);
+
+</script>
diff --git a/testing/web-platform/tests/css/css-typed-om/the-stylepropertymap/properties/background-attachment.html b/testing/web-platform/tests/css/css-typed-om/the-stylepropertymap/properties/background-attachment.html
new file mode 100644
index 0000000000..77adf0df03
--- /dev/null
+++ b/testing/web-platform/tests/css/css-typed-om/the-stylepropertymap/properties/background-attachment.html
@@ -0,0 +1,22 @@
+<!doctype html>
+<meta charset="utf-8">
+<title>'background-attachment' property</title>
+<link rel="help" href="https://drafts.css-houdini.org/css-typed-om-1/#dom-stylepropertymap-get">
+<link rel="help" href="https://drafts.css-houdini.org/css-typed-om-1/#dom-stylepropertymap-set">
+<link rel="help" href="https://drafts.css-houdini.org/css-typed-om-1/#property-stle-value-normalization">
+<script src="/resources/testharness.js"></script>
+<script src="/resources/testharnessreport.js"></script>
+<script src="../../resources/testhelper.js"></script>
+<script src="resources/testsuite.js"></script>
+<body>
+<div id="log"></div>
+<script>
+'use strict';
+
+runListValuedPropertyTests('background-attachment', [
+ { syntax: 'scroll' },
+ { syntax: 'fixed' },
+ { syntax: 'local' },
+]);
+
+</script>
diff --git a/testing/web-platform/tests/css/css-typed-om/the-stylepropertymap/properties/background-blend-mode.html b/testing/web-platform/tests/css/css-typed-om/the-stylepropertymap/properties/background-blend-mode.html
new file mode 100644
index 0000000000..92082e2f8a
--- /dev/null
+++ b/testing/web-platform/tests/css/css-typed-om/the-stylepropertymap/properties/background-blend-mode.html
@@ -0,0 +1,35 @@
+<!doctype html>
+<meta charset="utf-8">
+<title>'background-blend-mode' property</title>
+<link rel="help" href="https://drafts.css-houdini.org/css-typed-om-1/#dom-stylepropertymap-get">
+<link rel="help" href="https://drafts.css-houdini.org/css-typed-om-1/#dom-stylepropertymap-set">
+<link rel="help" href="https://drafts.css-houdini.org/css-typed-om-1/#property-stle-value-normalization">
+<script src="/resources/testharness.js"></script>
+<script src="/resources/testharnessreport.js"></script>
+<script src="../../resources/testhelper.js"></script>
+<script src="resources/testsuite.js"></script>
+<body>
+<div id="log"></div>
+<script>
+'use strict';
+
+runListValuedPropertyTests('background-blend-mode', [
+ { syntax: 'normal' },
+ { syntax: 'multiply' },
+ { syntax: 'screen' },
+ { syntax: 'overlay' },
+ { syntax: 'darken' },
+ { syntax: 'lighten' },
+ { syntax: 'color-dodge' },
+ { syntax: 'color-burn' },
+ { syntax: 'hard-light' },
+ { syntax: 'soft-light' },
+ { syntax: 'difference' },
+ { syntax: 'exclusion' },
+ { syntax: 'hue' },
+ { syntax: 'saturation' },
+ { syntax: 'color' },
+ { syntax: 'luminosity' },
+]);
+
+</script>
diff --git a/testing/web-platform/tests/css/css-typed-om/the-stylepropertymap/properties/background-clip.html b/testing/web-platform/tests/css/css-typed-om/the-stylepropertymap/properties/background-clip.html
new file mode 100644
index 0000000000..46d16a6f60
--- /dev/null
+++ b/testing/web-platform/tests/css/css-typed-om/the-stylepropertymap/properties/background-clip.html
@@ -0,0 +1,22 @@
+<!doctype html>
+<meta charset="utf-8">
+<title>'background-clip' property</title>
+<link rel="help" href="https://drafts.css-houdini.org/css-typed-om-1/#dom-stylepropertymap-get">
+<link rel="help" href="https://drafts.css-houdini.org/css-typed-om-1/#dom-stylepropertymap-set">
+<link rel="help" href="https://drafts.css-houdini.org/css-typed-om-1/#property-stle-value-normalization">
+<script src="/resources/testharness.js"></script>
+<script src="/resources/testharnessreport.js"></script>
+<script src="../../resources/testhelper.js"></script>
+<script src="resources/testsuite.js"></script>
+<body>
+<div id="log"></div>
+<script>
+'use strict';
+
+runListValuedPropertyTests('background-clip', [
+ { syntax: 'border-box' },
+ { syntax: 'padding-box' },
+ { syntax: 'content-box' },
+]);
+
+</script>
diff --git a/testing/web-platform/tests/css/css-typed-om/the-stylepropertymap/properties/background-color.html b/testing/web-platform/tests/css/css-typed-om/the-stylepropertymap/properties/background-color.html
new file mode 100644
index 0000000000..f684a40fb6
--- /dev/null
+++ b/testing/web-platform/tests/css/css-typed-om/the-stylepropertymap/properties/background-color.html
@@ -0,0 +1,30 @@
+<!doctype html>
+<meta charset="utf-8">
+<title>'background-color' property</title>
+<link rel="help" href="https://drafts.css-houdini.org/css-typed-om-1/#dom-stylepropertymap-get">
+<link rel="help" href="https://drafts.css-houdini.org/css-typed-om-1/#dom-stylepropertymap-set">
+<link rel="help" href="https://drafts.css-houdini.org/css-typed-om-1/#property-stle-value-normalization">
+<script src="/resources/testharness.js"></script>
+<script src="/resources/testharnessreport.js"></script>
+<script src="../../resources/testhelper.js"></script>
+<script src="resources/testsuite.js"></script>
+<body>
+<div id="log"></div>
+<script>
+'use strict';
+
+runPropertyTests('background-color', [
+ {
+ syntax: 'currentcolor',
+ // computes to a <color>, which is not supported in level 1
+ computed: (_, result) => assert_class_string(result, 'CSSStyleValue')
+ }
+]);
+
+// <color>s are not supported in level 1
+runUnsupportedPropertyTests('background-color', [
+ 'red', '#bbff00', 'rgb(255, 255, 128)', 'hsl(50, 33%, 25%)',
+ 'transparent'
+]);
+
+</script>
diff --git a/testing/web-platform/tests/css/css-typed-om/the-stylepropertymap/properties/background-image.html b/testing/web-platform/tests/css/css-typed-om/the-stylepropertymap/properties/background-image.html
new file mode 100644
index 0000000000..b3dddedbe4
--- /dev/null
+++ b/testing/web-platform/tests/css/css-typed-om/the-stylepropertymap/properties/background-image.html
@@ -0,0 +1,21 @@
+<!doctype html>
+<meta charset="utf-8">
+<title>'background-image' property</title>
+<link rel="help" href="https://drafts.css-houdini.org/css-typed-om-1/#dom-stylepropertymap-get">
+<link rel="help" href="https://drafts.css-houdini.org/css-typed-om-1/#dom-stylepropertymap-set">
+<link rel="help" href="https://drafts.css-houdini.org/css-typed-om-1/#property-stle-value-normalization">
+<script src="/resources/testharness.js"></script>
+<script src="/resources/testharnessreport.js"></script>
+<script src="../../resources/testhelper.js"></script>
+<script src="resources/testsuite.js"></script>
+<body>
+<div id="log"></div>
+<script>
+'use strict';
+
+runListValuedPropertyTests('background-image', [
+ { syntax: 'none' },
+ { syntax: '<image>' },
+]);
+
+</script>
diff --git a/testing/web-platform/tests/css/css-typed-om/the-stylepropertymap/properties/background-origin.html b/testing/web-platform/tests/css/css-typed-om/the-stylepropertymap/properties/background-origin.html
new file mode 100644
index 0000000000..511b5dc5bd
--- /dev/null
+++ b/testing/web-platform/tests/css/css-typed-om/the-stylepropertymap/properties/background-origin.html
@@ -0,0 +1,22 @@
+<!doctype html>
+<meta charset="utf-8">
+<title>'background-origin' property</title>
+<link rel="help" href="https://drafts.css-houdini.org/css-typed-om-1/#dom-stylepropertymap-get">
+<link rel="help" href="https://drafts.css-houdini.org/css-typed-om-1/#dom-stylepropertymap-set">
+<link rel="help" href="https://drafts.css-houdini.org/css-typed-om-1/#property-stle-value-normalization">
+<script src="/resources/testharness.js"></script>
+<script src="/resources/testharnessreport.js"></script>
+<script src="../../resources/testhelper.js"></script>
+<script src="resources/testsuite.js"></script>
+<body>
+<div id="log"></div>
+<script>
+'use strict';
+
+runListValuedPropertyTests('background-origin', [
+ { syntax: 'border-box' },
+ { syntax: 'padding-box' },
+ { syntax: 'content-box' },
+]);
+
+</script>
diff --git a/testing/web-platform/tests/css/css-typed-om/the-stylepropertymap/properties/background-position.html b/testing/web-platform/tests/css/css-typed-om/the-stylepropertymap/properties/background-position.html
new file mode 100644
index 0000000000..8e5b09b10a
--- /dev/null
+++ b/testing/web-platform/tests/css/css-typed-om/the-stylepropertymap/properties/background-position.html
@@ -0,0 +1,20 @@
+<!doctype html>
+<meta charset="utf-8">
+<title>'background-position' property</title>
+<link rel="help" href="https://drafts.css-houdini.org/css-typed-om-1/#dom-stylepropertymap-get">
+<link rel="help" href="https://drafts.css-houdini.org/css-typed-om-1/#dom-stylepropertymap-set">
+<link rel="help" href="https://drafts.css-houdini.org/css-typed-om-1/#property-stle-value-normalization">
+<script src="/resources/testharness.js"></script>
+<script src="/resources/testharnessreport.js"></script>
+<script src="../../resources/testhelper.js"></script>
+<script src="resources/testsuite.js"></script>
+<body>
+<div id="log"></div>
+<script>
+'use strict';
+
+runPropertyTests('background-position', [
+ { syntax: '<position>' },
+]);
+
+</script>
diff --git a/testing/web-platform/tests/css/css-typed-om/the-stylepropertymap/properties/background-repeat.html b/testing/web-platform/tests/css/css-typed-om/the-stylepropertymap/properties/background-repeat.html
new file mode 100644
index 0000000000..a89e1f7c93
--- /dev/null
+++ b/testing/web-platform/tests/css/css-typed-om/the-stylepropertymap/properties/background-repeat.html
@@ -0,0 +1,29 @@
+<!doctype html>
+<meta charset="utf-8">
+<title>'background-repeat' property</title>
+<link rel="help" href="https://drafts.css-houdini.org/css-typed-om-1/#dom-stylepropertymap-get">
+<link rel="help" href="https://drafts.css-houdini.org/css-typed-om-1/#dom-stylepropertymap-set">
+<link rel="help" href="https://drafts.css-houdini.org/css-typed-om-1/#property-stle-value-normalization">
+<script src="/resources/testharness.js"></script>
+<script src="/resources/testharnessreport.js"></script>
+<script src="../../resources/testhelper.js"></script>
+<script src="resources/testsuite.js"></script>
+<body>
+<div id="log"></div>
+<script>
+'use strict';
+
+runListValuedPropertyTests('background-repeat', [
+ { syntax: 'repeat-x' },
+ { syntax: 'repeat-y' },
+ { syntax: 'repeat' },
+ { syntax: 'space' },
+ { syntax: 'round' },
+ { syntax: 'no-repeat' },
+]);
+
+runUnsupportedPropertyTests('background-repeat', [
+ 'space repeat'
+]);
+
+</script>
diff --git a/testing/web-platform/tests/css/css-typed-om/the-stylepropertymap/properties/background-size.html b/testing/web-platform/tests/css/css-typed-om/the-stylepropertymap/properties/background-size.html
new file mode 100644
index 0000000000..78fae767d2
--- /dev/null
+++ b/testing/web-platform/tests/css/css-typed-om/the-stylepropertymap/properties/background-size.html
@@ -0,0 +1,34 @@
+<!doctype html>
+<meta charset="utf-8">
+<title>'background-size' property</title>
+<link rel="help" href="https://drafts.css-houdini.org/css-typed-om-1/#dom-stylepropertymap-get">
+<link rel="help" href="https://drafts.css-houdini.org/css-typed-om-1/#dom-stylepropertymap-set">
+<link rel="help" href="https://drafts.css-houdini.org/css-typed-om-1/#property-stle-value-normalization">
+<script src="/resources/testharness.js"></script>
+<script src="/resources/testharnessreport.js"></script>
+<script src="../../resources/testhelper.js"></script>
+<script src="resources/testsuite.js"></script>
+<body>
+<div id="log"></div>
+<script>
+'use strict';
+
+runListValuedPropertyTests('background-size', [
+ {
+ syntax: '<length>',
+ specified: assert_is_equal_with_range_handling
+ },
+ {
+ syntax: '<percentage>',
+ specified: assert_is_equal_with_range_handling
+ },
+ { syntax: 'auto' },
+ { syntax: 'cover' },
+ { syntax: 'contain' },
+]);
+
+runUnsupportedPropertyTests('background-size', [
+ '200px 100px'
+]);
+
+</script>
diff --git a/testing/web-platform/tests/css/css-typed-om/the-stylepropertymap/properties/background.html b/testing/web-platform/tests/css/css-typed-om/the-stylepropertymap/properties/background.html
new file mode 100644
index 0000000000..8926441fba
--- /dev/null
+++ b/testing/web-platform/tests/css/css-typed-om/the-stylepropertymap/properties/background.html
@@ -0,0 +1,24 @@
+<!doctype html>
+<meta charset="utf-8">
+<title>'background' property</title>
+<link rel="help" href="https://drafts.css-houdini.org/css-typed-om-1/#dom-stylepropertymap-get">
+<link rel="help" href="https://drafts.css-houdini.org/css-typed-om-1/#dom-stylepropertymap-set">
+<link rel="help" href="https://drafts.css-houdini.org/css-typed-om-1/#property-stle-value-normalization">
+<script src="/resources/testharness.js"></script>
+<script src="/resources/testharnessreport.js"></script>
+<script src="../../resources/testhelper.js"></script>
+<script src="resources/testsuite.js"></script>
+<body>
+<div id="log"></div>
+<script>
+'use strict';
+
+runPropertyTests('background', []);
+runUnsupportedPropertyTests('background', [
+ 'green', 'content-box radial-gradient(crimson, skyblue)',
+ 'no-repeat url("http://foo.com")',
+ 'left 5% / 15% 60% repeat-x url("http://foo.com")',
+ 'center / contain no-repeat url("foo.com"), red'
+]);
+
+</script>
diff --git a/testing/web-platform/tests/css/css-typed-om/the-stylepropertymap/properties/baseline-shift.html b/testing/web-platform/tests/css/css-typed-om/the-stylepropertymap/properties/baseline-shift.html
new file mode 100644
index 0000000000..c8e90b74c8
--- /dev/null
+++ b/testing/web-platform/tests/css/css-typed-om/the-stylepropertymap/properties/baseline-shift.html
@@ -0,0 +1,23 @@
+<!doctype html>
+<meta charset="utf-8">
+<title>'baseline-shift' property</title>
+<link rel="help" href="https://drafts.css-houdini.org/css-typed-om-1/#dom-stylepropertymap-get">
+<link rel="help" href="https://drafts.css-houdini.org/css-typed-om-1/#dom-stylepropertymap-set">
+<link rel="help" href="https://drafts.css-houdini.org/css-typed-om-1/#property-stle-value-normalization">
+<script src="/resources/testharness.js"></script>
+<script src="/resources/testharnessreport.js"></script>
+<script src="../../resources/testhelper.js"></script>
+<script src="resources/testsuite.js"></script>
+<body>
+<div id="log"></div>
+<script>
+'use strict';
+
+runPropertyTests('baseline-shift', [
+ { syntax: 'sub' },
+ { syntax: 'super' },
+ { syntax: '<percentage>' },
+ { syntax: '<length>' }
+]);
+
+</script>
diff --git a/testing/web-platform/tests/css/css-typed-om/the-stylepropertymap/properties/block-size.html b/testing/web-platform/tests/css/css-typed-om/the-stylepropertymap/properties/block-size.html
new file mode 100644
index 0000000000..311df4d422
--- /dev/null
+++ b/testing/web-platform/tests/css/css-typed-om/the-stylepropertymap/properties/block-size.html
@@ -0,0 +1,63 @@
+<!doctype html>
+<meta charset="utf-8">
+<title>'block-size' property</title>
+<link rel="help" href="https://drafts.css-houdini.org/css-typed-om-1/#dom-stylepropertymap-get">
+<link rel="help" href="https://drafts.css-houdini.org/css-typed-om-1/#dom-stylepropertymap-set">
+<link rel="help" href="https://drafts.css-houdini.org/css-typed-om-1/#property-stle-value-normalization">
+<script src="/resources/testharness.js"></script>
+<script src="/resources/testharnessreport.js"></script>
+<script src="../../resources/testhelper.js"></script>
+<script src="resources/testsuite.js"></script>
+<body>
+<div id="log"></div>
+<script>
+'use strict';
+
+function assert_is_equal_with_clamping_percentage(input, result) {
+ const percent = input.to('percent').value;
+
+ if (percent < 0)
+ assert_style_value_equals(result, new CSSUnitValue(0, 'percent'));
+ else
+ assert_style_value_equals(result, new CSSUnitValue(percent, 'percent'));
+}
+
+runPropertyTests('block-size', [
+ { syntax: 'auto' },
+ {
+ syntax: '<percentage>',
+ specified: assert_is_equal_with_range_handling,
+ computed: assert_is_equal_with_clamping_percentage
+ },
+ {
+ syntax: '<length>',
+ specified: assert_is_equal_with_range_handling
+ },
+]);
+
+runPropertyTests('min-block-size', [
+ {
+ syntax: '<percentage>',
+ specified: assert_is_equal_with_range_handling,
+ computed: assert_is_equal_with_clamping_percentage
+ },
+ {
+ syntax: '<length>',
+ specified: assert_is_equal_with_range_handling
+ },
+]);
+
+runPropertyTests('max-block-size', [
+ { syntax: 'none' },
+ {
+ syntax: '<percentage>',
+ specified: assert_is_equal_with_range_handling,
+ computed: assert_is_equal_with_clamping_percentage
+ },
+ {
+ syntax: '<length>',
+ specified: assert_is_equal_with_range_handling
+ },
+]);
+
+</script>
diff --git a/testing/web-platform/tests/css/css-typed-om/the-stylepropertymap/properties/border-collapse.html b/testing/web-platform/tests/css/css-typed-om/the-stylepropertymap/properties/border-collapse.html
new file mode 100644
index 0000000000..3a48ef0e4d
--- /dev/null
+++ b/testing/web-platform/tests/css/css-typed-om/the-stylepropertymap/properties/border-collapse.html
@@ -0,0 +1,21 @@
+<!doctype html>
+<meta charset="utf-8">
+<title>'border-collapse' property</title>
+<link rel="help" href="https://drafts.css-houdini.org/css-typed-om-1/#dom-stylepropertymap-get">
+<link rel="help" href="https://drafts.css-houdini.org/css-typed-om-1/#dom-stylepropertymap-set">
+<link rel="help" href="https://drafts.css-houdini.org/css-typed-om-1/#property-stle-value-normalization">
+<script src="/resources/testharness.js"></script>
+<script src="/resources/testharnessreport.js"></script>
+<script src="../../resources/testhelper.js"></script>
+<script src="resources/testsuite.js"></script>
+<body>
+<div id="log"></div>
+<script>
+'use strict';
+
+runPropertyTests('border-collapse', [
+ { syntax: 'separate' },
+ { syntax: 'collapse' },
+]);
+
+</script>
diff --git a/testing/web-platform/tests/css/css-typed-om/the-stylepropertymap/properties/border-color.html b/testing/web-platform/tests/css/css-typed-om/the-stylepropertymap/properties/border-color.html
new file mode 100644
index 0000000000..3ce4ca94fc
--- /dev/null
+++ b/testing/web-platform/tests/css/css-typed-om/the-stylepropertymap/properties/border-color.html
@@ -0,0 +1,33 @@
+<!doctype html>
+<meta charset="utf-8">
+<title>'border-color' properties</title>
+<link rel="help" href="https://drafts.css-houdini.org/css-typed-om-1/#dom-stylepropertymap-get">
+<link rel="help" href="https://drafts.css-houdini.org/css-typed-om-1/#dom-stylepropertymap-set">
+<link rel="help" href="https://drafts.css-houdini.org/css-typed-om-1/#property-stle-value-normalization">
+<script src="/resources/testharness.js"></script>
+<script src="/resources/testharnessreport.js"></script>
+<script src="../../resources/testhelper.js"></script>
+<script src="resources/testsuite.js"></script>
+<body>
+<div id="log"></div>
+<script>
+'use strict';
+
+for (const prefix of ['top', 'left', 'right', 'bottom']) {
+ runPropertyTests(`border-${prefix}-color`, [
+ {
+ syntax: 'currentcolor',
+ // computes to a <color>, which is not supported in level 1
+ computed: (_, result) => assert_class_string(result, 'CSSStyleValue')
+ }
+ ]);
+
+ // <color>s are not supported in level 1
+ runUnsupportedPropertyTests(`border-${prefix}-color`, [
+ 'red', '#bbff00', 'rgb(255, 255, 128)', 'hsl(50, 33%, 25%)',
+ 'transparent'
+ ]);
+}
+
+
+</script>
diff --git a/testing/web-platform/tests/css/css-typed-om/the-stylepropertymap/properties/border-image-outset.html b/testing/web-platform/tests/css/css-typed-om/the-stylepropertymap/properties/border-image-outset.html
new file mode 100644
index 0000000000..6ab5f68de6
--- /dev/null
+++ b/testing/web-platform/tests/css/css-typed-om/the-stylepropertymap/properties/border-image-outset.html
@@ -0,0 +1,35 @@
+<!doctype html>
+<meta charset="utf-8">
+<title>'border-image-outset' property</title>
+<link rel="help" href="https://drafts.css-houdini.org/css-typed-om-1/#dom-stylepropertymap-get">
+<link rel="help" href="https://drafts.css-houdini.org/css-typed-om-1/#dom-stylepropertymap-set">
+<link rel="help" href="https://drafts.css-houdini.org/css-typed-om-1/#property-stle-value-normalization">
+<script src="/resources/testharness.js"></script>
+<script src="/resources/testharnessreport.js"></script>
+<script src="../../resources/testhelper.js"></script>
+<script src="resources/testsuite.js"></script>
+<body>
+<div id="log"></div>
+<script>
+'use strict';
+
+runPropertyTests('border-image-outset', [
+ // Computed value is always four values, which are not supported in
+ // Typed OM level 1.
+ {
+ syntax: '<length>',
+ specified: assert_is_equal_with_range_handling,
+ computed: (_, result) => assert_is_unsupported(result)
+ },
+ {
+ syntax: '<number>',
+ specified: assert_is_equal_with_range_handling,
+ computed: (_, result) => assert_is_unsupported(result)
+ },
+]);
+
+runUnsupportedPropertyTests('border-image-outset', [
+ '1 1.2', '30px 2 45px', '7px 12px 14px 5px'
+]);
+
+</script>
diff --git a/testing/web-platform/tests/css/css-typed-om/the-stylepropertymap/properties/border-image-repeat.html b/testing/web-platform/tests/css/css-typed-om/the-stylepropertymap/properties/border-image-repeat.html
new file mode 100644
index 0000000000..885a947923
--- /dev/null
+++ b/testing/web-platform/tests/css/css-typed-om/the-stylepropertymap/properties/border-image-repeat.html
@@ -0,0 +1,41 @@
+<!doctype html>
+<meta charset="utf-8">
+<title>'border-image-repeat' property</title>
+<link rel="help" href="https://drafts.css-houdini.org/css-typed-om-1/#dom-stylepropertymap-get">
+<link rel="help" href="https://drafts.css-houdini.org/css-typed-om-1/#dom-stylepropertymap-set">
+<link rel="help" href="https://drafts.css-houdini.org/css-typed-om-1/#property-stle-value-normalization">
+<script src="/resources/testharness.js"></script>
+<script src="/resources/testharnessreport.js"></script>
+<script src="../../resources/testhelper.js"></script>
+<script src="resources/testsuite.js"></script>
+<body>
+<div id="log"></div>
+<script>
+'use strict';
+
+runPropertyTests('border-image-repeat', [
+ // Computed value is always a pair of values, which are not supported in
+ // Typed OM level 1.
+ {
+ syntax: 'stretch',
+ computed: (_, result) => assert_is_unsupported(result)
+ },
+ {
+ syntax: 'repeat',
+ computed: (_, result) => assert_is_unsupported(result)
+ },
+ {
+ syntax: 'round',
+ computed: (_, result) => assert_is_unsupported(result)
+ },
+ {
+ syntax: 'space',
+ computed: (_, result) => assert_is_unsupported(result)
+ },
+]);
+
+runUnsupportedPropertyTests('border-image-repeat', [
+ 'stretch repeat', 'round space'
+]);
+
+</script>
diff --git a/testing/web-platform/tests/css/css-typed-om/the-stylepropertymap/properties/border-image-slice.html b/testing/web-platform/tests/css/css-typed-om/the-stylepropertymap/properties/border-image-slice.html
new file mode 100644
index 0000000000..da05bad352
--- /dev/null
+++ b/testing/web-platform/tests/css/css-typed-om/the-stylepropertymap/properties/border-image-slice.html
@@ -0,0 +1,35 @@
+<!doctype html>
+<meta charset="utf-8">
+<title>'border-image-slice' property</title>
+<link rel="help" href="https://drafts.css-houdini.org/css-typed-om-1/#dom-stylepropertymap-get">
+<link rel="help" href="https://drafts.css-houdini.org/css-typed-om-1/#dom-stylepropertymap-set">
+<link rel="help" href="https://drafts.css-houdini.org/css-typed-om-1/#property-stle-value-normalization">
+<script src="/resources/testharness.js"></script>
+<script src="/resources/testharnessreport.js"></script>
+<script src="../../resources/testhelper.js"></script>
+<script src="resources/testsuite.js"></script>
+<body>
+<div id="log"></div>
+<script>
+'use strict';
+
+runPropertyTests('border-image-slice', [
+ // Computed value is always four values, which are not supported in
+ // Typed OM level 1.
+ {
+ syntax: '<number>',
+ specified: assert_is_equal_with_range_handling,
+ computed: (_, result) => assert_is_unsupported(result)
+ },
+ {
+ syntax: '<percentage>',
+ specified: assert_is_equal_with_range_handling,
+ computed: (_, result) => assert_is_unsupported(result)
+ },
+]);
+
+runUnsupportedPropertyTests('border-image-slice', [
+ '30 fill', '30 40 50', '30 40 50 60 fill'
+]);
+
+</script>
diff --git a/testing/web-platform/tests/css/css-typed-om/the-stylepropertymap/properties/border-image-source.html b/testing/web-platform/tests/css/css-typed-om/the-stylepropertymap/properties/border-image-source.html
new file mode 100644
index 0000000000..b9ddf19ff2
--- /dev/null
+++ b/testing/web-platform/tests/css/css-typed-om/the-stylepropertymap/properties/border-image-source.html
@@ -0,0 +1,21 @@
+<!doctype html>
+<meta charset="utf-8">
+<title>'border-image-source' property</title>
+<link rel="help" href="https://drafts.css-houdini.org/css-typed-om-1/#dom-stylepropertymap-get">
+<link rel="help" href="https://drafts.css-houdini.org/css-typed-om-1/#dom-stylepropertymap-set">
+<link rel="help" href="https://drafts.css-houdini.org/css-typed-om-1/#property-stle-value-normalization">
+<script src="/resources/testharness.js"></script>
+<script src="/resources/testharnessreport.js"></script>
+<script src="../../resources/testhelper.js"></script>
+<script src="resources/testsuite.js"></script>
+<body>
+<div id="log"></div>
+<script>
+'use strict';
+
+runPropertyTests('border-image-source', [
+ { syntax: 'none' },
+ { syntax: '<image>' },
+]);
+
+</script>
diff --git a/testing/web-platform/tests/css/css-typed-om/the-stylepropertymap/properties/border-image-width.html b/testing/web-platform/tests/css/css-typed-om/the-stylepropertymap/properties/border-image-width.html
new file mode 100644
index 0000000000..381e3b6d1b
--- /dev/null
+++ b/testing/web-platform/tests/css/css-typed-om/the-stylepropertymap/properties/border-image-width.html
@@ -0,0 +1,44 @@
+<!doctype html>
+<meta charset="utf-8">
+<title>'border-image-width' property</title>
+<link rel="help" href="https://drafts.css-houdini.org/css-typed-om-1/#dom-stylepropertymap-get">
+<link rel="help" href="https://drafts.css-houdini.org/css-typed-om-1/#dom-stylepropertymap-set">
+<link rel="help" href="https://drafts.css-houdini.org/css-typed-om-1/#property-stle-value-normalization">
+<script src="/resources/testharness.js"></script>
+<script src="/resources/testharnessreport.js"></script>
+<script src="../../resources/testhelper.js"></script>
+<script src="resources/testsuite.js"></script>
+<body>
+<div id="log"></div>
+<script>
+'use strict';
+
+runPropertyTests('border-image-width', [
+ // Computed value is always four values, which are not supported in
+ // Typed OM level 1.
+ {
+ syntax: '<length>',
+ specified: assert_is_equal_with_range_handling,
+ computed: (_, result) => assert_is_unsupported(result)
+ },
+ {
+ syntax: '<percentage>',
+ specified: assert_is_equal_with_range_handling,
+ computed: (_, result) => assert_is_unsupported(result)
+ },
+ {
+ syntax: '<number>',
+ specified: assert_is_equal_with_range_handling,
+ computed: (_, result) => assert_is_unsupported(result)
+ },
+ {
+ syntax: 'auto',
+ computed: (_, result) => assert_is_unsupported(result)
+ },
+]);
+
+runUnsupportedPropertyTests('border-image-width', [
+ '2em 3em', '5% 15% 10%', '5% 2em 10% auto'
+]);
+
+</script>
diff --git a/testing/web-platform/tests/css/css-typed-om/the-stylepropertymap/properties/border-radius.html b/testing/web-platform/tests/css/css-typed-om/the-stylepropertymap/properties/border-radius.html
new file mode 100644
index 0000000000..c6ebcbf381
--- /dev/null
+++ b/testing/web-platform/tests/css/css-typed-om/the-stylepropertymap/properties/border-radius.html
@@ -0,0 +1,38 @@
+<!doctype html>
+<meta charset="utf-8">
+<title>border radius properties</title>
+<link rel="help" href="https://drafts.css-houdini.org/css-typed-om-1/#dom-stylepropertymap-get">
+<link rel="help" href="https://drafts.css-houdini.org/css-typed-om-1/#dom-stylepropertymap-set">
+<link rel="help" href="https://drafts.css-houdini.org/css-typed-om-1/#property-stle-value-normalization">
+<script src="/resources/testharness.js"></script>
+<script src="/resources/testharnessreport.js"></script>
+<script src="../../resources/testhelper.js"></script>
+<script src="resources/testsuite.js"></script>
+<body>
+<div id="log"></div>
+<script>
+'use strict';
+
+for (const suffix of ['top-left', 'top-right', 'bottom-left', 'bottom-right']) {
+ // Computed value is always a pair of values, which are not supported in
+ // Typed OM level 1.
+ runPropertyTests('border-' + suffix + '-radius', [
+ {
+ syntax: '<length>',
+ specified: assert_is_equal_with_range_handling,
+ computed: (_, result) => assert_is_unsupported(result)
+ },
+ {
+ syntax: '<percentage>',
+ specified: assert_is_equal_with_range_handling,
+ computed: (_, result) => assert_is_unsupported(result)
+ },
+ ]);
+}
+
+// shorthand
+runUnsupportedPropertyTests('border-radius', [
+ '30px', '25% 10%', '10% / 50%', '50% 20% / 10% 40%'
+]);
+
+</script>
diff --git a/testing/web-platform/tests/css/css-typed-om/the-stylepropertymap/properties/border-style.html b/testing/web-platform/tests/css/css-typed-om/the-stylepropertymap/properties/border-style.html
new file mode 100644
index 0000000000..1328ab1dc7
--- /dev/null
+++ b/testing/web-platform/tests/css/css-typed-om/the-stylepropertymap/properties/border-style.html
@@ -0,0 +1,24 @@
+<!doctype html>
+<meta charset="utf-8">
+<title>border style properties</title>
+<link rel="help" href="https://drafts.css-houdini.org/css-typed-om-1/#dom-stylepropertymap-get">
+<link rel="help" href="https://drafts.css-houdini.org/css-typed-om-1/#dom-stylepropertymap-set">
+<link rel="help" href="https://drafts.css-houdini.org/css-typed-om-1/#property-stle-value-normalization">
+<script src="/resources/testharness.js"></script>
+<script src="/resources/testharnessreport.js"></script>
+<script src="../../resources/testhelper.js"></script>
+<script src="resources/testsuite.js"></script>
+<body>
+<div id="log"></div>
+<script>
+'use strict';
+
+for (const suffix of ['top', 'left', 'right', 'bottom']) {
+ runPropertyTests('border-' + suffix + '-style', [
+ { syntax: 'none' },
+ { syntax: 'solid' },
+ // and other keywords
+ ]);
+}
+
+</script>
diff --git a/testing/web-platform/tests/css/css-typed-om/the-stylepropertymap/properties/border-width.html b/testing/web-platform/tests/css/css-typed-om/the-stylepropertymap/properties/border-width.html
new file mode 100644
index 0000000000..5066637f73
--- /dev/null
+++ b/testing/web-platform/tests/css/css-typed-om/the-stylepropertymap/properties/border-width.html
@@ -0,0 +1,44 @@
+<!doctype html>
+<meta charset="utf-8">
+<title>border width properties</title>
+<link rel="help" href="https://drafts.css-houdini.org/css-typed-om-1/#dom-stylepropertymap-get">
+<link rel="help" href="https://drafts.css-houdini.org/css-typed-om-1/#dom-stylepropertymap-set">
+<link rel="help" href="https://drafts.css-houdini.org/css-typed-om-1/#property-stle-value-normalization">
+<script src="/resources/testharness.js"></script>
+<script src="/resources/testharnessreport.js"></script>
+<script src="../../resources/testhelper.js"></script>
+<script src="resources/testsuite.js"></script>
+<body>
+<div id="log"></div>
+<script>
+'use strict';
+
+function assert_is_zero_px(result) {
+ assert_style_value_equals(result, new CSSUnitValue(0, 'px'));
+}
+
+for (const suffix of ['top', 'left', 'right', 'bottom']) {
+ runPropertyTests('border-' + suffix + '-width', [
+ // Computed value is 0 when border-style is 'none'.
+ // FIXME: Add separate test where border-style is not 'none' or 'hidden'.
+ {
+ syntax: 'thin',
+ computed: (_, result) => assert_is_zero_px(result)
+ },
+ {
+ syntax: 'medium',
+ computed: (_, result) => assert_is_zero_px(result)
+ },
+ {
+ syntax: 'thick',
+ computed: (_, result) => assert_is_zero_px(result)
+ },
+ {
+ syntax: '<length>',
+ specified: assert_is_equal_with_range_handling,
+ computed: (_, result) => assert_is_zero_px(result)
+ },
+ ]);
+}
+
+</script>
diff --git a/testing/web-platform/tests/css/css-typed-om/the-stylepropertymap/properties/bottom.html b/testing/web-platform/tests/css/css-typed-om/the-stylepropertymap/properties/bottom.html
new file mode 100644
index 0000000000..36fe5145d4
--- /dev/null
+++ b/testing/web-platform/tests/css/css-typed-om/the-stylepropertymap/properties/bottom.html
@@ -0,0 +1,22 @@
+<!doctype html>
+<meta charset="utf-8">
+<title>'bottom' property</title>
+<link rel="help" href="https://drafts.css-houdini.org/css-typed-om-1/#dom-stylepropertymap-get">
+<link rel="help" href="https://drafts.css-houdini.org/css-typed-om-1/#dom-stylepropertymap-set">
+<link rel="help" href="https://drafts.css-houdini.org/css-typed-om-1/#property-stle-value-normalization">
+<script src="/resources/testharness.js"></script>
+<script src="/resources/testharnessreport.js"></script>
+<script src="../../resources/testhelper.js"></script>
+<script src="resources/testsuite.js"></script>
+<body>
+<div id="log"></div>
+<script>
+'use strict';
+
+runPropertyTests('bottom', [
+ { syntax: 'auto' },
+ { syntax: '<percentage>' },
+ { syntax: '<length>' },
+]);
+
+</script>
diff --git a/testing/web-platform/tests/css/css-typed-om/the-stylepropertymap/properties/box-shadow.html b/testing/web-platform/tests/css/css-typed-om/the-stylepropertymap/properties/box-shadow.html
new file mode 100644
index 0000000000..040e992fea
--- /dev/null
+++ b/testing/web-platform/tests/css/css-typed-om/the-stylepropertymap/properties/box-shadow.html
@@ -0,0 +1,24 @@
+<!doctype html>
+<meta charset="utf-8">
+<title>'box-shadow' property</title>
+<link rel="help" href="https://drafts.css-houdini.org/css-typed-om-1/#dom-stylepropertymap-get">
+<link rel="help" href="https://drafts.css-houdini.org/css-typed-om-1/#dom-stylepropertymap-set">
+<link rel="help" href="https://drafts.css-houdini.org/css-typed-om-1/#property-stle-value-normalization">
+<script src="/resources/testharness.js"></script>
+<script src="/resources/testharnessreport.js"></script>
+<script src="../../resources/testhelper.js"></script>
+<script src="resources/testsuite.js"></script>
+<body>
+<div id="log"></div>
+<script>
+'use strict';
+
+runPropertyTests('box-shadow', [
+ { syntax: 'none' },
+]);
+
+runUnsupportedPropertyTests('box-shadow', [
+ '10px 5px 5px red',
+]);
+
+</script>
diff --git a/testing/web-platform/tests/css/css-typed-om/the-stylepropertymap/properties/box-sizing.html b/testing/web-platform/tests/css/css-typed-om/the-stylepropertymap/properties/box-sizing.html
new file mode 100644
index 0000000000..551adbfe4f
--- /dev/null
+++ b/testing/web-platform/tests/css/css-typed-om/the-stylepropertymap/properties/box-sizing.html
@@ -0,0 +1,21 @@
+<!doctype html>
+<meta charset="utf-8">
+<title>'box-sizing' property</title>
+<link rel="help" href="https://drafts.css-houdini.org/css-typed-om-1/#dom-stylepropertymap-get">
+<link rel="help" href="https://drafts.css-houdini.org/css-typed-om-1/#dom-stylepropertymap-set">
+<link rel="help" href="https://drafts.css-houdini.org/css-typed-om-1/#property-stle-value-normalization">
+<script src="/resources/testharness.js"></script>
+<script src="/resources/testharnessreport.js"></script>
+<script src="../../resources/testhelper.js"></script>
+<script src="resources/testsuite.js"></script>
+<body>
+<div id="log"></div>
+<script>
+'use strict';
+
+runPropertyTests('box-sizing', [
+ { syntax: 'content-box'},
+ { syntax: 'border-box' }
+]);
+
+</script>
diff --git a/testing/web-platform/tests/css/css-typed-om/the-stylepropertymap/properties/break.html b/testing/web-platform/tests/css/css-typed-om/the-stylepropertymap/properties/break.html
new file mode 100644
index 0000000000..66d24beab0
--- /dev/null
+++ b/testing/web-platform/tests/css/css-typed-om/the-stylepropertymap/properties/break.html
@@ -0,0 +1,41 @@
+<!doctype html>
+<meta charset="utf-8">
+<title>'break' property</title>
+<link rel="help" href="https://drafts.css-houdini.org/css-typed-om-1/#dom-stylepropertymap-get">
+<link rel="help" href="https://drafts.css-houdini.org/css-typed-om-1/#dom-stylepropertymap-set">
+<link rel="help" href="https://drafts.css-houdini.org/css-typed-om-1/#property-stle-value-normalization">
+<script src="/resources/testharness.js"></script>
+<script src="/resources/testharnessreport.js"></script>
+<script src="../../resources/testhelper.js"></script>
+<script src="resources/testsuite.js"></script>
+<body>
+<div id="log"></div>
+<script>
+'use strict';
+
+for (const suffix of ['after', 'before']) {
+ runPropertyTests('break-' + suffix, [
+ { syntax: 'auto' },
+ { syntax: 'avoid' },
+ { syntax: 'avoid-column' },
+ { syntax: 'avoid-page' },
+ { syntax: 'avoid-region' },
+ { syntax: 'column' },
+ { syntax: 'left' },
+ { syntax: 'page' },
+ { syntax: 'recto' },
+ { syntax: 'region' },
+ { syntax: 'right' },
+ { syntax: 'verso' },
+ ]);
+}
+
+runPropertyTests('break-inside', [
+ { syntax: 'auto' },
+ { syntax: 'avoid' },
+ { syntax: 'avoid-column' },
+ { syntax: 'avoid-page' },
+ { syntax: 'avoid-region' },
+ ]);
+
+</script>
diff --git a/testing/web-platform/tests/css/css-typed-om/the-stylepropertymap/properties/caption-side.html b/testing/web-platform/tests/css/css-typed-om/the-stylepropertymap/properties/caption-side.html
new file mode 100644
index 0000000000..9ae512d2df
--- /dev/null
+++ b/testing/web-platform/tests/css/css-typed-om/the-stylepropertymap/properties/caption-side.html
@@ -0,0 +1,21 @@
+<!doctype html>
+<meta charset="utf-8">
+<title>'caption-side' property</title>
+<link rel="help" href="https://drafts.css-houdini.org/css-typed-om-1/#dom-stylepropertymap-get">
+<link rel="help" href="https://drafts.css-houdini.org/css-typed-om-1/#dom-stylepropertymap-set">
+<link rel="help" href="https://drafts.css-houdini.org/css-typed-om-1/#property-stle-value-normalization">
+<script src="/resources/testharness.js"></script>
+<script src="/resources/testharnessreport.js"></script>
+<script src="../../resources/testhelper.js"></script>
+<script src="resources/testsuite.js"></script>
+<body>
+<div id="log"></div>
+<script>
+'use strict';
+
+runPropertyTests('caption-side', [
+ { syntax: 'top' },
+ { syntax: 'bottom' },
+]);
+
+</script>
diff --git a/testing/web-platform/tests/css/css-typed-om/the-stylepropertymap/properties/caret-color.html b/testing/web-platform/tests/css/css-typed-om/the-stylepropertymap/properties/caret-color.html
new file mode 100644
index 0000000000..5ea78a08d3
--- /dev/null
+++ b/testing/web-platform/tests/css/css-typed-om/the-stylepropertymap/properties/caret-color.html
@@ -0,0 +1,35 @@
+<!doctype html>
+<meta charset="utf-8">
+<title>'caret-color' property</title>
+<link rel="help" href="https://drafts.css-houdini.org/css-typed-om-1/#dom-stylepropertymap-get">
+<link rel="help" href="https://drafts.css-houdini.org/css-typed-om-1/#dom-stylepropertymap-set">
+<link rel="help" href="https://drafts.css-houdini.org/css-typed-om-1/#property-stle-value-normalization">
+<script src="/resources/testharness.js"></script>
+<script src="/resources/testharnessreport.js"></script>
+<script src="../../resources/testhelper.js"></script>
+<script src="resources/testsuite.js"></script>
+<body>
+<div id="log"></div>
+<script>
+'use strict';
+
+runPropertyTests('caret-color', [
+ {
+ syntax: 'currentcolor',
+ // computes to a <color>, which is not supported in level 1
+ computed: (_, result) => assert_class_string(result, 'CSSStyleValue')
+ },
+ {
+ syntax: 'auto',
+ // computes to a <color>, which is not supported in level 1
+ computed: (_, result) => assert_class_string(result, 'CSSStyleValue')
+ }
+]);
+
+// <color>s are not supported in level 1
+runUnsupportedPropertyTests('caret-color', [
+ 'red', '#bbff00', 'rgb(255, 255, 128)', 'hsl(50, 33%, 25%)',
+ 'transparent'
+]);
+
+</script>
diff --git a/testing/web-platform/tests/css/css-typed-om/the-stylepropertymap/properties/center-coordinate.html b/testing/web-platform/tests/css/css-typed-om/the-stylepropertymap/properties/center-coordinate.html
new file mode 100644
index 0000000000..97722ec3d5
--- /dev/null
+++ b/testing/web-platform/tests/css/css-typed-om/the-stylepropertymap/properties/center-coordinate.html
@@ -0,0 +1,26 @@
+<!doctype html>
+<meta charset="utf-8">
+<title>'center-coordinate' property</title>
+<link rel="help" href="https://drafts.css-houdini.org/css-typed-om-1/#dom-stylepropertymap-get">
+<link rel="help" href="https://drafts.css-houdini.org/css-typed-om-1/#dom-stylepropertymap-set">
+<link rel="help" href="https://drafts.css-houdini.org/css-typed-om-1/#property-stle-value-normalization">
+<script src="/resources/testharness.js"></script>
+<script src="/resources/testharnessreport.js"></script>
+<script src="../../resources/testhelper.js"></script>
+<script src="resources/testsuite.js"></script>
+<body>
+<div id="log"></div>
+<script>
+'use strict';
+
+runPropertyTests('cx', [
+ { syntax: '<percentage>' },
+ { syntax: '<length>' },
+]);
+
+runPropertyTests('cy', [
+ { syntax: '<percentage>' },
+ { syntax: '<length>' },
+]);
+
+</script>
diff --git a/testing/web-platform/tests/css/css-typed-om/the-stylepropertymap/properties/clear.html b/testing/web-platform/tests/css/css-typed-om/the-stylepropertymap/properties/clear.html
new file mode 100644
index 0000000000..3852dd2542
--- /dev/null
+++ b/testing/web-platform/tests/css/css-typed-om/the-stylepropertymap/properties/clear.html
@@ -0,0 +1,23 @@
+<!doctype html>
+<meta charset="utf-8">
+<title>'clear' property</title>
+<link rel="help" href="https://drafts.css-houdini.org/css-typed-om-1/#dom-stylepropertymap-get">
+<link rel="help" href="https://drafts.css-houdini.org/css-typed-om-1/#dom-stylepropertymap-set">
+<link rel="help" href="https://drafts.css-houdini.org/css-typed-om-1/#property-stle-value-normalization">
+<script src="/resources/testharness.js"></script>
+<script src="/resources/testharnessreport.js"></script>
+<script src="../../resources/testhelper.js"></script>
+<script src="resources/testsuite.js"></script>
+<body>
+<div id="log"></div>
+<script>
+'use strict';
+
+runPropertyTests('clear', [
+ { syntax: 'none' },
+ { syntax: 'left' },
+ { syntax: 'right' },
+ { syntax: 'both' },
+]);
+
+</script>
diff --git a/testing/web-platform/tests/css/css-typed-om/the-stylepropertymap/properties/clip-path.html b/testing/web-platform/tests/css/css-typed-om/the-stylepropertymap/properties/clip-path.html
new file mode 100644
index 0000000000..d0c7d0ab9a
--- /dev/null
+++ b/testing/web-platform/tests/css/css-typed-om/the-stylepropertymap/properties/clip-path.html
@@ -0,0 +1,32 @@
+<!doctype html>
+<meta charset="utf-8">
+<title>'clip-path' property</title>
+<link rel="help" href="https://drafts.css-houdini.org/css-typed-om-1/#dom-stylepropertymap-get">
+<link rel="help" href="https://drafts.css-houdini.org/css-typed-om-1/#dom-stylepropertymap-set">
+<link rel="help" href="https://drafts.css-houdini.org/css-typed-om-1/#property-stle-value-normalization">
+<script src="/resources/testharness.js"></script>
+<script src="/resources/testharnessreport.js"></script>
+<script src="../../resources/testhelper.js"></script>
+<script src="resources/testsuite.js"></script>
+<body>
+<div id="log"></div>
+<script>
+'use strict';
+
+runPropertyTests('clip-path', [
+ { syntax: 'none' },
+ { syntax: 'fill-box' },
+ { syntax: 'stroke-box' },
+ { syntax: 'view-box' },
+ { syntax: 'margin-box' },
+ { syntax: 'border-box' },
+ { syntax: 'padding-box' },
+ { syntax: 'content-box' },
+ { syntax: '<url>' },
+]);
+
+runUnsupportedPropertyTests('clip', [
+ 'inset(22% 12% 15px 35px)',
+]);
+
+</script>
diff --git a/testing/web-platform/tests/css/css-typed-om/the-stylepropertymap/properties/clip-rule.html b/testing/web-platform/tests/css/css-typed-om/the-stylepropertymap/properties/clip-rule.html
new file mode 100644
index 0000000000..9e1c401dc9
--- /dev/null
+++ b/testing/web-platform/tests/css/css-typed-om/the-stylepropertymap/properties/clip-rule.html
@@ -0,0 +1,21 @@
+<!doctype html>
+<meta charset="utf-8">
+<title>'clip-rule' property</title>
+<link rel="help" href="https://drafts.css-houdini.org/css-typed-om-1/#dom-stylepropertymap-get">
+<link rel="help" href="https://drafts.css-houdini.org/css-typed-om-1/#dom-stylepropertymap-set">
+<link rel="help" href="https://drafts.css-houdini.org/css-typed-om-1/#property-stle-value-normalization">
+<script src="/resources/testharness.js"></script>
+<script src="/resources/testharnessreport.js"></script>
+<script src="../../resources/testhelper.js"></script>
+<script src="resources/testsuite.js"></script>
+<body>
+<div id="log"></div>
+<script>
+'use strict';
+
+runPropertyTests('clip-rule', [
+ { syntax: 'nonzero' },
+ { syntax: 'evenodd' }
+]);
+
+</script>
diff --git a/testing/web-platform/tests/css/css-typed-om/the-stylepropertymap/properties/clip.html b/testing/web-platform/tests/css/css-typed-om/the-stylepropertymap/properties/clip.html
new file mode 100644
index 0000000000..fa08eb86ab
--- /dev/null
+++ b/testing/web-platform/tests/css/css-typed-om/the-stylepropertymap/properties/clip.html
@@ -0,0 +1,24 @@
+<!doctype html>
+<meta charset="utf-8">
+<title>'clip' property</title>
+<link rel="help" href="https://drafts.css-houdini.org/css-typed-om-1/#dom-stylepropertymap-get">
+<link rel="help" href="https://drafts.css-houdini.org/css-typed-om-1/#dom-stylepropertymap-set">
+<link rel="help" href="https://drafts.css-houdini.org/css-typed-om-1/#property-stle-value-normalization">
+<script src="/resources/testharness.js"></script>
+<script src="/resources/testharnessreport.js"></script>
+<script src="../../resources/testhelper.js"></script>
+<script src="resources/testsuite.js"></script>
+<body>
+<div id="log"></div>
+<script>
+'use strict';
+
+runPropertyTests('clip', [
+ { syntax: 'auto' }
+]);
+
+runUnsupportedPropertyTests('clip', [
+ 'rect(0px, 1px, 2px, 3px)'
+]);
+
+</script>
diff --git a/testing/web-platform/tests/css/css-typed-om/the-stylepropertymap/properties/color-interpolation.html b/testing/web-platform/tests/css/css-typed-om/the-stylepropertymap/properties/color-interpolation.html
new file mode 100644
index 0000000000..d8324db22e
--- /dev/null
+++ b/testing/web-platform/tests/css/css-typed-om/the-stylepropertymap/properties/color-interpolation.html
@@ -0,0 +1,22 @@
+<!doctype html>
+<meta charset="utf-8">
+<title>'color-interpolation' property</title>
+<link rel="help" href="https://drafts.css-houdini.org/css-typed-om-1/#dom-stylepropertymap-get">
+<link rel="help" href="https://drafts.css-houdini.org/css-typed-om-1/#dom-stylepropertymap-set">
+<link rel="help" href="https://drafts.css-houdini.org/css-typed-om-1/#property-stle-value-normalization">
+<script src="/resources/testharness.js"></script>
+<script src="/resources/testharnessreport.js"></script>
+<script src="../../resources/testhelper.js"></script>
+<script src="resources/testsuite.js"></script>
+<body>
+<div id="log"></div>
+<script>
+'use strict';
+
+runPropertyTests('color-interpolation', [
+ { syntax: 'auto' },
+ { syntax: 'srgb' },
+ { syntax: 'linearrgb' },
+]);
+
+</script>
diff --git a/testing/web-platform/tests/css/css-typed-om/the-stylepropertymap/properties/color.html b/testing/web-platform/tests/css/css-typed-om/the-stylepropertymap/properties/color.html
new file mode 100644
index 0000000000..f56182977c
--- /dev/null
+++ b/testing/web-platform/tests/css/css-typed-om/the-stylepropertymap/properties/color.html
@@ -0,0 +1,30 @@
+<!doctype html>
+<meta charset="utf-8">
+<title>'color' property</title>
+<link rel="help" href="https://drafts.css-houdini.org/css-typed-om-1/#dom-stylepropertymap-get">
+<link rel="help" href="https://drafts.css-houdini.org/css-typed-om-1/#dom-stylepropertymap-set">
+<link rel="help" href="https://drafts.css-houdini.org/css-typed-om-1/#property-stle-value-normalization">
+<script src="/resources/testharness.js"></script>
+<script src="/resources/testharnessreport.js"></script>
+<script src="../../resources/testhelper.js"></script>
+<script src="resources/testsuite.js"></script>
+<body>
+<div id="log"></div>
+<script>
+'use strict';
+
+runPropertyTests('color', [
+ {
+ syntax: 'currentcolor',
+ // computes to a <color>, which is not supported in level 1
+ computed: (_, result) => assert_class_string(result, 'CSSStyleValue')
+ }
+]);
+
+// <color>s are not supported in level 1
+runUnsupportedPropertyTests('color', [
+ 'red', '#bbff00', 'rgb(255, 255, 128)', 'hsl(50, 33%, 25%)',
+ 'transparent'
+]);
+
+</script>
diff --git a/testing/web-platform/tests/css/css-typed-om/the-stylepropertymap/properties/column-count.html b/testing/web-platform/tests/css/css-typed-om/the-stylepropertymap/properties/column-count.html
new file mode 100644
index 0000000000..9dfca6177b
--- /dev/null
+++ b/testing/web-platform/tests/css/css-typed-om/the-stylepropertymap/properties/column-count.html
@@ -0,0 +1,41 @@
+<!doctype html>
+<meta charset="utf-8">
+<title>'column-count' property</title>
+<link rel="help" href="https://drafts.css-houdini.org/css-typed-om-1/#dom-stylepropertymap-get">
+<link rel="help" href="https://drafts.css-houdini.org/css-typed-om-1/#dom-stylepropertymap-set">
+<link rel="help" href="https://drafts.css-houdini.org/css-typed-om-1/#property-stle-value-normalization">
+<script src="/resources/testharness.js"></script>
+<script src="/resources/testharnessreport.js"></script>
+<script src="../../resources/testhelper.js"></script>
+<script src="resources/testsuite.js"></script>
+<body>
+<div id="log"></div>
+<script>
+'use strict';
+
+runPropertyTests('column-count', [
+ { syntax: 'auto' },
+ // FIXME: This should say <integer>, but the test harness currently
+ // doesn't support <integer> data type.
+ {
+ syntax: '<number>',
+ // column-count needs to be a positive integer
+ specified: (input, result) => {
+ if (input instanceof CSSUnitValue && (!Number.isInteger(input.value) || input.value < 1))
+ assert_style_value_equals(result, new CSSMathSum(input));
+ else
+ assert_style_value_equals(result, input);
+ },
+ computed: (input, result) => {
+ const number = input.to('number');
+ if (number < 1)
+ assert_style_value_equals(result, new CSSUnitValue(1, 'number'));
+ else if (!Number.isInteger(number.value))
+ assert_style_value_equals(result, new CSSUnitValue(Math.round(number.value), 'number'));
+ else
+ assert_style_value_equals(result, number);
+ }
+ },
+]);
+
+</script>
diff --git a/testing/web-platform/tests/css/css-typed-om/the-stylepropertymap/properties/column-rule-color.html b/testing/web-platform/tests/css/css-typed-om/the-stylepropertymap/properties/column-rule-color.html
new file mode 100644
index 0000000000..3d35b856d7
--- /dev/null
+++ b/testing/web-platform/tests/css/css-typed-om/the-stylepropertymap/properties/column-rule-color.html
@@ -0,0 +1,30 @@
+<!doctype html>
+<meta charset="utf-8">
+<title>'column-rule-color' property</title>
+<link rel="help" href="https://drafts.css-houdini.org/css-typed-om-1/#dom-stylepropertymap-get">
+<link rel="help" href="https://drafts.css-houdini.org/css-typed-om-1/#dom-stylepropertymap-set">
+<link rel="help" href="https://drafts.css-houdini.org/css-typed-om-1/#property-stle-value-normalization">
+<script src="/resources/testharness.js"></script>
+<script src="/resources/testharnessreport.js"></script>
+<script src="../../resources/testhelper.js"></script>
+<script src="resources/testsuite.js"></script>
+<body>
+<div id="log"></div>
+<script>
+'use strict';
+
+runPropertyTests('column-rule-color', [
+ {
+ syntax: 'currentcolor',
+ // computes to a <color>, which is not supported in level 1
+ computed: (_, result) => assert_class_string(result, 'CSSStyleValue')
+ }
+]);
+
+// <color>s are not supported in level 1
+runUnsupportedPropertyTests('column-rule-color', [
+ 'red', '#bbff00', 'rgb(255, 255, 128)', 'hsl(50, 33%, 25%)',
+ 'transparent'
+]);
+
+</script>
diff --git a/testing/web-platform/tests/css/css-typed-om/the-stylepropertymap/properties/column-rule-style.html b/testing/web-platform/tests/css/css-typed-om/the-stylepropertymap/properties/column-rule-style.html
new file mode 100644
index 0000000000..8e56f62171
--- /dev/null
+++ b/testing/web-platform/tests/css/css-typed-om/the-stylepropertymap/properties/column-rule-style.html
@@ -0,0 +1,29 @@
+<!doctype html>
+<meta charset="utf-8">
+<title>'column-rule-style' property</title>
+<link rel="help" href="https://drafts.css-houdini.org/css-typed-om-1/#dom-stylepropertymap-get">
+<link rel="help" href="https://drafts.css-houdini.org/css-typed-om-1/#dom-stylepropertymap-set">
+<link rel="help" href="https://drafts.css-houdini.org/css-typed-om-1/#property-stle-value-normalization">
+<script src="/resources/testharness.js"></script>
+<script src="/resources/testharnessreport.js"></script>
+<script src="../../resources/testhelper.js"></script>
+<script src="resources/testsuite.js"></script>
+<body>
+<div id="log"></div>
+<script>
+'use strict';
+
+runPropertyTests('column-rule-style', [
+ { syntax: 'none' },
+ { syntax: 'hidden' },
+ { syntax: 'dotted' },
+ { syntax: 'dashed' },
+ { syntax: 'solid' },
+ { syntax: 'double' },
+ { syntax: 'groove' },
+ { syntax: 'ridge' },
+ { syntax: 'inset' },
+ { syntax: 'outset' }
+]);
+
+</script>
diff --git a/testing/web-platform/tests/css/css-typed-om/the-stylepropertymap/properties/column-rule-width.html b/testing/web-platform/tests/css/css-typed-om/the-stylepropertymap/properties/column-rule-width.html
new file mode 100644
index 0000000000..bd3c0ac8f4
--- /dev/null
+++ b/testing/web-platform/tests/css/css-typed-om/the-stylepropertymap/properties/column-rule-width.html
@@ -0,0 +1,42 @@
+<!doctype html>
+<meta charset="utf-8">
+<title>'column-rule-width' property</title>
+<link rel="help" href="https://drafts.css-houdini.org/css-typed-om-1/#dom-stylepropertymap-get">
+<link rel="help" href="https://drafts.css-houdini.org/css-typed-om-1/#dom-stylepropertymap-set">
+<link rel="help" href="https://drafts.css-houdini.org/css-typed-om-1/#property-stle-value-normalization">
+<script src="/resources/testharness.js"></script>
+<script src="/resources/testharnessreport.js"></script>
+<script src="../../resources/testhelper.js"></script>
+<script src="resources/testsuite.js"></script>
+<body>
+<div id="log"></div>
+<script>
+'use strict';
+
+function assert_is_zero_px(result) {
+ assert_style_value_equals(result, new CSSUnitValue(0, 'px'));
+}
+
+runPropertyTests('column-rule-width', [
+ // Computed value is 0 when column-rule-style is 'none'.
+ // FIXME: Add separate test where column-rule-style is not 'none' or 'hidden'.
+ {
+ syntax: 'thin',
+ computed: (_, result) => assert_is_zero_px(result)
+ },
+ {
+ syntax: 'medium',
+ computed: (_, result) => assert_is_zero_px(result)
+ },
+ {
+ syntax: 'thick',
+ computed: (_, result) => assert_is_zero_px(result)
+ },
+ {
+ syntax: '<length>',
+ specified: assert_is_equal_with_range_handling,
+ computed: (_, result) => assert_is_zero_px(result)
+ },
+]);
+
+</script>
diff --git a/testing/web-platform/tests/css/css-typed-om/the-stylepropertymap/properties/column-span.html b/testing/web-platform/tests/css/css-typed-om/the-stylepropertymap/properties/column-span.html
new file mode 100644
index 0000000000..28087a1cdd
--- /dev/null
+++ b/testing/web-platform/tests/css/css-typed-om/the-stylepropertymap/properties/column-span.html
@@ -0,0 +1,21 @@
+<!doctype html>
+<meta charset="utf-8">
+<title>'column-span' property</title>
+<link rel="help" href="https://drafts.css-houdini.org/css-typed-om/#dom-stylepropertymapreadonly-get">
+<link rel="help" href="https://drafts.css-houdini.org/css-typed-om/#dom-stylepropertymap-set">
+<link rel="help" href="https://drafts.css-houdini.org/css-typed-om/#reify-stylevalue">
+<script src="/resources/testharness.js"></script>
+<script src="/resources/testharnessreport.js"></script>
+<script src="../../resources/testhelper.js"></script>
+<script src="resources/testsuite.js"></script>
+<body>
+<div id="log"></div>
+<script>
+'use strict';
+
+runPropertyTests('column-span', [
+ { syntax: 'none' },
+ { syntax: 'all' },
+]);
+
+</script>
diff --git a/testing/web-platform/tests/css/css-typed-om/the-stylepropertymap/properties/column-width.html b/testing/web-platform/tests/css/css-typed-om/the-stylepropertymap/properties/column-width.html
new file mode 100644
index 0000000000..97a00ffdc1
--- /dev/null
+++ b/testing/web-platform/tests/css/css-typed-om/the-stylepropertymap/properties/column-width.html
@@ -0,0 +1,24 @@
+<!doctype html>
+<meta charset="utf-8">
+<title>'column-width' property</title>
+<link rel="help" href="https://drafts.css-houdini.org/css-typed-om/#dom-stylepropertymapreadonly-get">
+<link rel="help" href="https://drafts.css-houdini.org/css-typed-om/#dom-stylepropertymap-set">
+<link rel="help" href="https://drafts.css-houdini.org/css-typed-om/#reify-stylevalue">
+<script src="/resources/testharness.js"></script>
+<script src="/resources/testharnessreport.js"></script>
+<script src="../../resources/testhelper.js"></script>
+<script src="resources/testsuite.js"></script>
+<body>
+<div id="log"></div>
+<script>
+'use strict';
+
+runPropertyTests('column-width', [
+ { syntax: 'auto' },
+ {
+ syntax: '<length>',
+ specified: assert_is_equal_with_range_handling
+ },
+]);
+
+</script>
diff --git a/testing/web-platform/tests/css/css-typed-om/the-stylepropertymap/properties/contain.html b/testing/web-platform/tests/css/css-typed-om/the-stylepropertymap/properties/contain.html
new file mode 100644
index 0000000000..f3f50f8143
--- /dev/null
+++ b/testing/web-platform/tests/css/css-typed-om/the-stylepropertymap/properties/contain.html
@@ -0,0 +1,31 @@
+<!doctype html>
+<meta charset="utf-8">
+<title>'contain' property</title>
+<link rel="help" href="https://drafts.css-houdini.org/css-typed-om-1/#dom-stylepropertymap-get">
+<link rel="help" href="https://drafts.css-houdini.org/css-typed-om-1/#dom-stylepropertymap-set">
+<link rel="help" href="https://drafts.css-houdini.org/css-typed-om-1/#property-stle-value-normalization">
+<script src="/resources/testharness.js"></script>
+<script src="/resources/testharnessreport.js"></script>
+<script src="../../resources/testhelper.js"></script>
+<script src="resources/testsuite.js"></script>
+<body>
+<div id="log"></div>
+<script>
+'use strict';
+
+runPropertyTests('contain', [
+ { syntax: 'none' },
+ { syntax: 'strict' },
+ { syntax: 'content' },
+ { syntax: 'size' },
+ { syntax: 'layout' },
+ { syntax: 'style' },
+ { syntax: 'paint' },
+ { syntax: 'inline-size' },
+]);
+
+runUnsupportedPropertyTests('contain', [
+ 'size layout', 'paint style layout size'
+]);
+
+</script>
diff --git a/testing/web-platform/tests/css/css-typed-om/the-stylepropertymap/properties/container-name.html b/testing/web-platform/tests/css/css-typed-om/the-stylepropertymap/properties/container-name.html
new file mode 100644
index 0000000000..45d9cbcb8c
--- /dev/null
+++ b/testing/web-platform/tests/css/css-typed-om/the-stylepropertymap/properties/container-name.html
@@ -0,0 +1,25 @@
+<!doctype html>
+<meta charset="utf-8">
+<title>'contain' property</title>
+<link rel="help" href="https://drafts.css-houdini.org/css-typed-om-1/#dom-stylepropertymap">
+<script src="/resources/testharness.js"></script>
+<script src="/resources/testharnessreport.js"></script>
+<script src="../../resources/testhelper.js"></script>
+<script src="resources/testsuite.js"></script>
+<body>
+<div id="log"></div>
+<script>
+'use strict';
+
+runPropertyTests('container-name', [
+ { syntax: 'none' },
+ // FIXME: This should be <custom-ident>, but the test harness doesn't
+ // currently support it.
+ { syntax: 'my-container' },
+]);
+
+runUnsupportedPropertyTests('container-type', [
+ 'name1 name2'
+]);
+
+</script>
diff --git a/testing/web-platform/tests/css/css-typed-om/the-stylepropertymap/properties/container-type.html b/testing/web-platform/tests/css/css-typed-om/the-stylepropertymap/properties/container-type.html
new file mode 100644
index 0000000000..23474abff4
--- /dev/null
+++ b/testing/web-platform/tests/css/css-typed-om/the-stylepropertymap/properties/container-type.html
@@ -0,0 +1,20 @@
+<!doctype html>
+<meta charset="utf-8">
+<title>'container-type' property</title>
+<link rel="help" href="https://drafts.css-houdini.org/css-typed-om-1/#the-stylepropertymap">
+<script src="/resources/testharness.js"></script>
+<script src="/resources/testharnessreport.js"></script>
+<script src="../../resources/testhelper.js"></script>
+<script src="resources/testsuite.js"></script>
+<body>
+<div id="log"></div>
+<script>
+'use strict';
+
+runPropertyTests('container-type', [
+ { syntax: 'normal' },
+ { syntax: 'size' },
+ { syntax: 'inline-size' },
+]);
+
+</script>
diff --git a/testing/web-platform/tests/css/css-typed-om/the-stylepropertymap/properties/coordinate.html b/testing/web-platform/tests/css/css-typed-om/the-stylepropertymap/properties/coordinate.html
new file mode 100644
index 0000000000..31ccbfa9b9
--- /dev/null
+++ b/testing/web-platform/tests/css/css-typed-om/the-stylepropertymap/properties/coordinate.html
@@ -0,0 +1,26 @@
+<!doctype html>
+<meta charset="utf-8">
+<title>'coordinate' property</title>
+<link rel="help" href="https://drafts.css-houdini.org/css-typed-om-1/#dom-stylepropertymap-get">
+<link rel="help" href="https://drafts.css-houdini.org/css-typed-om-1/#dom-stylepropertymap-set">
+<link rel="help" href="https://drafts.css-houdini.org/css-typed-om-1/#property-stle-value-normalization">
+<script src="/resources/testharness.js"></script>
+<script src="/resources/testharnessreport.js"></script>
+<script src="../../resources/testhelper.js"></script>
+<script src="resources/testsuite.js"></script>
+<body>
+<div id="log"></div>
+<script>
+'use strict';
+
+runPropertyTests('x', [
+ { syntax: '<percentage>' },
+ { syntax: '<length>' },
+]);
+
+runPropertyTests('y', [
+ { syntax: '<percentage>' },
+ { syntax: '<length>' },
+]);
+
+</script>
diff --git a/testing/web-platform/tests/css/css-typed-om/the-stylepropertymap/properties/counter-increment.html b/testing/web-platform/tests/css/css-typed-om/the-stylepropertymap/properties/counter-increment.html
new file mode 100644
index 0000000000..0dba6374fc
--- /dev/null
+++ b/testing/web-platform/tests/css/css-typed-om/the-stylepropertymap/properties/counter-increment.html
@@ -0,0 +1,24 @@
+<!doctype html>
+<meta charset="utf-8">
+<title>'counter-increment' property</title>
+<link rel="help" href="https://drafts.css-houdini.org/css-typed-om-1/#dom-stylepropertymap-get">
+<link rel="help" href="https://drafts.css-houdini.org/css-typed-om-1/#dom-stylepropertymap-set">
+<link rel="help" href="https://drafts.css-houdini.org/css-typed-om-1/#property-stle-value-normalization">
+<script src="/resources/testharness.js"></script>
+<script src="/resources/testharnessreport.js"></script>
+<script src="../../resources/testhelper.js"></script>
+<script src="resources/testsuite.js"></script>
+<body>
+<div id="log"></div>
+<script>
+'use strict';
+
+runPropertyTests('counter-increment', [
+ { syntax: 'none' },
+]);
+
+runUnsupportedPropertyTests('counter-increment', [
+ 'chapter', 'chapter 3'
+]);
+
+</script>
diff --git a/testing/web-platform/tests/css/css-typed-om/the-stylepropertymap/properties/counter-reset.html b/testing/web-platform/tests/css/css-typed-om/the-stylepropertymap/properties/counter-reset.html
new file mode 100644
index 0000000000..5323f18902
--- /dev/null
+++ b/testing/web-platform/tests/css/css-typed-om/the-stylepropertymap/properties/counter-reset.html
@@ -0,0 +1,24 @@
+<!doctype html>
+<meta charset="utf-8">
+<title>'counter-reset' property</title>
+<link rel="help" href="https://drafts.css-houdini.org/css-typed-om-1/#dom-stylepropertymap-get">
+<link rel="help" href="https://drafts.css-houdini.org/css-typed-om-1/#dom-stylepropertymap-set">
+<link rel="help" href="https://drafts.css-houdini.org/css-typed-om-1/#property-stle-value-normalization">
+<script src="/resources/testharness.js"></script>
+<script src="/resources/testharnessreport.js"></script>
+<script src="../../resources/testhelper.js"></script>
+<script src="resources/testsuite.js"></script>
+<body>
+<div id="log"></div>
+<script>
+'use strict';
+
+runPropertyTests('counter-reset', [
+ { syntax: 'none' },
+]);
+
+runUnsupportedPropertyTests('counter-reset', [
+ 'chapter', 'chapter 3'
+]);
+
+</script>
diff --git a/testing/web-platform/tests/css/css-typed-om/the-stylepropertymap/properties/counter-set.html b/testing/web-platform/tests/css/css-typed-om/the-stylepropertymap/properties/counter-set.html
new file mode 100644
index 0000000000..db57f269de
--- /dev/null
+++ b/testing/web-platform/tests/css/css-typed-om/the-stylepropertymap/properties/counter-set.html
@@ -0,0 +1,24 @@
+<!doctype html>
+<meta charset="utf-8">
+<title>'counter-set' property</title>
+<link rel="help" href="https://drafts.css-houdini.org/css-typed-om-1/#dom-stylepropertymap-get">
+<link rel="help" href="https://drafts.css-houdini.org/css-typed-om-1/#dom-stylepropertymap-set">
+<link rel="help" href="https://drafts.css-houdini.org/css-typed-om-1/#property-stle-value-normalization">
+<script src="/resources/testharness.js"></script>
+<script src="/resources/testharnessreport.js"></script>
+<script src="../../resources/testhelper.js"></script>
+<script src="resources/testsuite.js"></script>
+<body>
+<div id="log"></div>
+<script>
+'use strict';
+
+runPropertyTests('counter-set', [
+ { syntax: 'none' },
+]);
+
+runUnsupportedPropertyTests('counter-set', [
+ 'chapter', 'chapter 3'
+]);
+
+</script>
diff --git a/testing/web-platform/tests/css/css-typed-om/the-stylepropertymap/properties/cursor.html b/testing/web-platform/tests/css/css-typed-om/the-stylepropertymap/properties/cursor.html
new file mode 100644
index 0000000000..7465b1a74a
--- /dev/null
+++ b/testing/web-platform/tests/css/css-typed-om/the-stylepropertymap/properties/cursor.html
@@ -0,0 +1,59 @@
+<!doctype html>
+<meta charset="utf-8">
+<title>'cursor' property</title>
+<link rel="help" href="https://drafts.css-houdini.org/css-typed-om-1/#dom-stylepropertymap-get">
+<link rel="help" href="https://drafts.css-houdini.org/css-typed-om-1/#dom-stylepropertymap-set">
+<link rel="help" href="https://drafts.css-houdini.org/css-typed-om-1/#property-stle-value-normalization">
+<script src="/resources/testharness.js"></script>
+<script src="/resources/testharnessreport.js"></script>
+<script src="../../resources/testhelper.js"></script>
+<script src="resources/testsuite.js"></script>
+<body>
+<div id="log"></div>
+<script>
+'use strict';
+
+runPropertyTests('cursor', [
+ { syntax: 'auto' },
+ { syntax: 'default' },
+ { syntax: 'none' },
+ { syntax: 'context-menu' },
+ { syntax: 'help' },
+ { syntax: 'pointer' },
+ { syntax: 'progress' },
+ { syntax: 'wait' },
+ { syntax: 'cell' },
+ { syntax: 'crosshair' },
+ { syntax: 'text' },
+ { syntax: 'vertical-text' },
+ { syntax: 'alias' },
+ { syntax: 'copy' },
+ { syntax: 'move' },
+ { syntax: 'no-drop' },
+ { syntax: 'not-allowed' },
+ { syntax: 'grab' },
+ { syntax: 'grabbing' },
+ { syntax: 'e-resize' },
+ { syntax: 'n-resize' },
+ { syntax: 'ne-resize' },
+ { syntax: 'nw-resize' },
+ { syntax: 's-resize' },
+ { syntax: 'se-resize' },
+ { syntax: 'sw-resize' },
+ { syntax: 'w-resize' },
+ { syntax: 'ew-resize' },
+ { syntax: 'ns-resize' },
+ { syntax: 'nesw-resize' },
+ { syntax: 'nwse-resize' },
+ { syntax: 'col-resize' },
+ { syntax: 'row-resize' },
+ { syntax: 'all-scroll' },
+ { syntax: 'zoom-in' },
+ { syntax: 'zoom-out' }
+]);
+
+runUnsupportedPropertyTests('cursor', [
+ 'url(hand.cur), pointer', 'url(cursor1.png) 4 12, auto'
+]);
+
+</script>
diff --git a/testing/web-platform/tests/css/css-typed-om/the-stylepropertymap/properties/d.html b/testing/web-platform/tests/css/css-typed-om/the-stylepropertymap/properties/d.html
new file mode 100644
index 0000000000..b73daa5067
--- /dev/null
+++ b/testing/web-platform/tests/css/css-typed-om/the-stylepropertymap/properties/d.html
@@ -0,0 +1,24 @@
+<!doctype html>
+<meta charset="utf-8">
+<title>'d' property</title>
+<link rel="help" href="https://drafts.css-houdini.org/css-typed-om-1/#dom-stylepropertymap-get">
+<link rel="help" href="https://drafts.css-houdini.org/css-typed-om-1/#dom-stylepropertymap-set">
+<link rel="help" href="https://drafts.css-houdini.org/css-typed-om-1/#property-stle-value-normalization">
+<script src="/resources/testharness.js"></script>
+<script src="/resources/testharnessreport.js"></script>
+<script src="../../resources/testhelper.js"></script>
+<script src="resources/testsuite.js"></script>
+<body>
+<div id="log"></div>
+<script>
+'use strict';
+
+runPropertyTests('d', [
+ { syntax: 'none' },
+]);
+
+runUnsupportedPropertyTests('d', [
+ 'path("M 100 100 L 300 100 L 200 300 Z")'
+]);
+
+</script>
diff --git a/testing/web-platform/tests/css/css-typed-om/the-stylepropertymap/properties/direction.html b/testing/web-platform/tests/css/css-typed-om/the-stylepropertymap/properties/direction.html
new file mode 100644
index 0000000000..0681032a85
--- /dev/null
+++ b/testing/web-platform/tests/css/css-typed-om/the-stylepropertymap/properties/direction.html
@@ -0,0 +1,21 @@
+<!doctype html>
+<meta charset="utf-8">
+<title>'direction' property</title>
+<link rel="help" href="https://drafts.css-houdini.org/css-typed-om-1/#dom-stylepropertymap-get">
+<link rel="help" href="https://drafts.css-houdini.org/css-typed-om-1/#dom-stylepropertymap-set">
+<link rel="help" href="https://drafts.css-houdini.org/css-typed-om-1/#property-stle-value-normalization">
+<script src="/resources/testharness.js"></script>
+<script src="/resources/testharnessreport.js"></script>
+<script src="../../resources/testhelper.js"></script>
+<script src="resources/testsuite.js"></script>
+<body>
+<div id="log"></div>
+<script>
+'use strict';
+
+runPropertyTests('direction', [
+ { syntax: 'ltr' },
+ { syntax: 'rtl' },
+]);
+
+</script>
diff --git a/testing/web-platform/tests/css/css-typed-om/the-stylepropertymap/properties/display.html b/testing/web-platform/tests/css/css-typed-om/the-stylepropertymap/properties/display.html
new file mode 100644
index 0000000000..b650431d84
--- /dev/null
+++ b/testing/web-platform/tests/css/css-typed-om/the-stylepropertymap/properties/display.html
@@ -0,0 +1,59 @@
+<!doctype html>
+<meta charset="utf-8">
+<title>'display' property</title>
+<link rel="help" href="https://drafts.css-houdini.org/css-typed-om-1/#dom-stylepropertymap-get">
+<link rel="help" href="https://drafts.css-houdini.org/css-typed-om-1/#dom-stylepropertymap-set">
+<link rel="help" href="https://drafts.css-houdini.org/css-typed-om-1/#property-stle-value-normalization">
+<script src="/resources/testharness.js"></script>
+<script src="/resources/testharnessreport.js"></script>
+<script src="../../resources/testhelper.js"></script>
+<script src="resources/testsuite.js"></script>
+<body>
+<div id="log"></div>
+<script>
+'use strict';
+
+runPropertyTests('display', [
+ { syntax: 'none' },
+ { syntax: 'block' },
+ { syntax: 'inline' },
+ { syntax: 'flow-root' },
+ { syntax: 'table' },
+ { syntax: 'flex' },
+ { syntax: 'grid' },
+ { syntax: 'list-item' },
+ { syntax: 'table-row-group' },
+ { syntax: 'table-header-group' },
+ { syntax: 'table-footer-group' },
+ { syntax: 'table-row' },
+ { syntax: 'table-cell' },
+ { syntax: 'table-column-group' },
+ { syntax: 'table-column' },
+ { syntax: 'table-caption' },
+ { syntax: 'contents' },
+ { syntax: 'inline-block' },
+ { syntax: 'inline-table' },
+ { syntax: 'inline-flex' },
+ { syntax: 'inline-grid' },
+]);
+
+// We can not set 'inline math' or 'math inline' via Typed OM.
+// On the other hand, we might get a CSSKeywordValue instance for them instead
+// of a CSSStyleValue because they can be represented as just 'math' in
+// internal representations.
+for (let value of ['inline math', 'math inline']) {
+ test(t => {
+ let element = createDivWithStyle(t);
+ element.style.display = value;
+ const result = element.attributeStyleMap.get('display');
+ assert_not_equals(result, null);
+ assert_in_array({}.toString.call(result),
+ ['[object CSSStyleValue]', '[object CSSKeywordValue]']);
+ }, `'display' does not support setting '${value}'`);
+}
+
+runUnsupportedPropertyTests('display', [
+ 'block math', 'math block'
+]);
+
+</script>
diff --git a/testing/web-platform/tests/css/css-typed-om/the-stylepropertymap/properties/dominant-baseline.html b/testing/web-platform/tests/css/css-typed-om/the-stylepropertymap/properties/dominant-baseline.html
new file mode 100644
index 0000000000..9774ea2f48
--- /dev/null
+++ b/testing/web-platform/tests/css/css-typed-om/the-stylepropertymap/properties/dominant-baseline.html
@@ -0,0 +1,28 @@
+<!doctype html>
+<meta charset="utf-8">
+<title>'dominant-baseline' property</title>
+<link rel="help" href="https://drafts.css-houdini.org/css-typed-om-1/#dom-stylepropertymap-get">
+<link rel="help" href="https://drafts.css-houdini.org/css-typed-om-1/#dom-stylepropertymap-set">
+<link rel="help" href="https://drafts.css-houdini.org/css-typed-om-1/#property-stle-value-normalization">
+<script src="/resources/testharness.js"></script>
+<script src="/resources/testharnessreport.js"></script>
+<script src="../../resources/testhelper.js"></script>
+<script src="resources/testsuite.js"></script>
+<body>
+<div id="log"></div>
+<script>
+'use strict';
+
+runPropertyTests('dominant-baseline', [
+ { syntax: 'auto' },
+ { syntax: 'text-bottom' },
+ { syntax: 'alphabetic' },
+ { syntax: 'ideographic' },
+ { syntax: 'middle' },
+ { syntax: 'central' },
+ { syntax: 'mathematical' },
+ { syntax: 'hanging' },
+ { syntax: 'text-top' },
+]);
+
+</script>
diff --git a/testing/web-platform/tests/css/css-typed-om/the-stylepropertymap/properties/empty-cells.html b/testing/web-platform/tests/css/css-typed-om/the-stylepropertymap/properties/empty-cells.html
new file mode 100644
index 0000000000..f05c09c195
--- /dev/null
+++ b/testing/web-platform/tests/css/css-typed-om/the-stylepropertymap/properties/empty-cells.html
@@ -0,0 +1,21 @@
+<!doctype html>
+<meta charset="utf-8">
+<title>'empty-cells' property</title>
+<link rel="help" href="https://drafts.css-houdini.org/css-typed-om-1/#dom-stylepropertymap-get">
+<link rel="help" href="https://drafts.css-houdini.org/css-typed-om-1/#dom-stylepropertymap-set">
+<link rel="help" href="https://drafts.css-houdini.org/css-typed-om-1/#property-stle-value-normalization">
+<script src="/resources/testharness.js"></script>
+<script src="/resources/testharnessreport.js"></script>
+<script src="../../resources/testhelper.js"></script>
+<script src="resources/testsuite.js"></script>
+<body>
+<div id="log"></div>
+<script>
+'use strict';
+
+runPropertyTests('empty-cells', [
+ { syntax: 'show' },
+ { syntax: 'hide' },
+]);
+
+</script>
diff --git a/testing/web-platform/tests/css/css-typed-om/the-stylepropertymap/properties/fill-color.html b/testing/web-platform/tests/css/css-typed-om/the-stylepropertymap/properties/fill-color.html
new file mode 100644
index 0000000000..5967f496ed
--- /dev/null
+++ b/testing/web-platform/tests/css/css-typed-om/the-stylepropertymap/properties/fill-color.html
@@ -0,0 +1,30 @@
+<!doctype html>
+<meta charset="utf-8">
+<title>'fill-color' property</title>
+<link rel="help" href="https://drafts.css-houdini.org/css-typed-om-1/#dom-stylepropertymap-get">
+<link rel="help" href="https://drafts.css-houdini.org/css-typed-om-1/#dom-stylepropertymap-set">
+<link rel="help" href="https://drafts.css-houdini.org/css-typed-om-1/#property-stle-value-normalization">
+<script src="/resources/testharness.js"></script>
+<script src="/resources/testharnessreport.js"></script>
+<script src="../../resources/testhelper.js"></script>
+<script src="resources/testsuite.js"></script>
+<body>
+<div id="log"></div>
+<script>
+'use strict';
+
+runPropertyTests('fill-color', [
+ {
+ syntax: 'currentcolor',
+ // computes to a <color>, which is not supported in level 1
+ computed: (_, result) => assert_class_string(result, 'CSSStyleValue')
+ }
+]);
+
+// <color>s are not supported in level 1
+runUnsupportedPropertyTests('fill-color', [
+ 'red', '#bbff00', 'rgb(255, 255, 128)', 'hsl(50, 33%, 25%)',
+ 'transparent'
+]);
+
+</script>
diff --git a/testing/web-platform/tests/css/css-typed-om/the-stylepropertymap/properties/fill-opacity.html b/testing/web-platform/tests/css/css-typed-om/the-stylepropertymap/properties/fill-opacity.html
new file mode 100644
index 0000000000..2ba58f6400
--- /dev/null
+++ b/testing/web-platform/tests/css/css-typed-om/the-stylepropertymap/properties/fill-opacity.html
@@ -0,0 +1,50 @@
+<!doctype html>
+<meta charset="utf-8">
+<title>'fill-opacity' property</title>
+<link rel="help" href="https://drafts.css-houdini.org/css-typed-om-1/#dom-stylepropertymap-get">
+<link rel="help" href="https://drafts.css-houdini.org/css-typed-om-1/#dom-stylepropertymap-set">
+<link rel="help" href="https://drafts.css-houdini.org/css-typed-om-1/#property-stle-value-normalization">
+<script src="/resources/testharness.js"></script>
+<script src="/resources/testharnessreport.js"></script>
+<script src="../../resources/testhelper.js"></script>
+<script src="resources/testsuite.js"></script>
+<body>
+<div id="log"></div>
+<script>
+'use strict';
+
+function assert_is_equal_with_clamping_number(input, result) {
+ const number = input.to('number');
+
+ if (number.value < 0)
+ assert_style_value_equals(result, new CSSUnitValue(0, 'number'));
+ else if (number.value > 1)
+ assert_style_value_equals(result, new CSSUnitValue(1, 'number'));
+ else
+ assert_style_value_equals(result, input);
+}
+
+function assert_is_equal_with_clamping_percentage(input, result) {
+ const number = input.to('percent');
+ const value = number.value / 100.;
+
+ if (value < 0)
+ assert_style_value_equals(result, new CSSUnitValue(0, 'number'));
+ else if (value > 1)
+ assert_style_value_equals(result, new CSSUnitValue(1, 'number'));
+ else
+ assert_style_value_equals(result, new CSSUnitValue(value, 'number'));
+}
+
+runPropertyTests('fill-opacity', [
+ {
+ syntax: '<number>',
+ computed: assert_is_equal_with_clamping_number
+ },
+ {
+ syntax: '<percentage>',
+ computed: assert_is_equal_with_clamping_percentage
+ }
+]);
+
+</script>
diff --git a/testing/web-platform/tests/css/css-typed-om/the-stylepropertymap/properties/fill-rule.html b/testing/web-platform/tests/css/css-typed-om/the-stylepropertymap/properties/fill-rule.html
new file mode 100644
index 0000000000..30d5ea912b
--- /dev/null
+++ b/testing/web-platform/tests/css/css-typed-om/the-stylepropertymap/properties/fill-rule.html
@@ -0,0 +1,21 @@
+<!doctype html>
+<meta charset="utf-8">
+<title>'fill-rule' property</title>
+<link rel="help" href="https://drafts.css-houdini.org/css-typed-om-1/#dom-stylepropertymap-get">
+<link rel="help" href="https://drafts.css-houdini.org/css-typed-om-1/#dom-stylepropertymap-set">
+<link rel="help" href="https://drafts.css-houdini.org/css-typed-om-1/#property-stle-value-normalization">
+<script src="/resources/testharness.js"></script>
+<script src="/resources/testharnessreport.js"></script>
+<script src="../../resources/testhelper.js"></script>
+<script src="resources/testsuite.js"></script>
+<body>
+<div id="log"></div>
+<script>
+'use strict';
+
+runListValuedPropertyTests('fill-rule', [
+ { syntax: 'nonzero' },
+ { syntax: 'evenodd' },
+]);
+
+</script>
diff --git a/testing/web-platform/tests/css/css-typed-om/the-stylepropertymap/properties/fill.html b/testing/web-platform/tests/css/css-typed-om/the-stylepropertymap/properties/fill.html
new file mode 100644
index 0000000000..28b3c55647
--- /dev/null
+++ b/testing/web-platform/tests/css/css-typed-om/the-stylepropertymap/properties/fill.html
@@ -0,0 +1,21 @@
+<!doctype html>
+<meta charset="utf-8">
+<title>'fill' property</title>
+<link rel="help" href="https://drafts.css-houdini.org/css-typed-om-1/#dom-stylepropertymap-get">
+<link rel="help" href="https://drafts.css-houdini.org/css-typed-om-1/#dom-stylepropertymap-set">
+<link rel="help" href="https://drafts.css-houdini.org/css-typed-om-1/#property-stle-value-normalization">
+<script src="/resources/testharness.js"></script>
+<script src="/resources/testharnessreport.js"></script>
+<script src="../../resources/testhelper.js"></script>
+<script src="resources/testsuite.js"></script>
+<body>
+<div id="log"></div>
+<script>
+'use strict';
+
+runUnsupportedPropertyTests('fill', [
+ 'black',
+ 'red gray',
+]);
+
+</script>
diff --git a/testing/web-platform/tests/css/css-typed-om/the-stylepropertymap/properties/filter.html b/testing/web-platform/tests/css/css-typed-om/the-stylepropertymap/properties/filter.html
new file mode 100644
index 0000000000..62ddeff008
--- /dev/null
+++ b/testing/web-platform/tests/css/css-typed-om/the-stylepropertymap/properties/filter.html
@@ -0,0 +1,25 @@
+<!doctype html>
+<meta charset="utf-8">
+<title>'filter' property</title>
+<link rel="help" href="https://drafts.css-houdini.org/css-typed-om-1/#dom-stylepropertymap-get">
+<link rel="help" href="https://drafts.css-houdini.org/css-typed-om-1/#dom-stylepropertymap-set">
+<link rel="help" href="https://drafts.css-houdini.org/css-typed-om-1/#property-stle-value-normalization">
+<script src="/resources/testharness.js"></script>
+<script src="/resources/testharnessreport.js"></script>
+<script src="../../resources/testhelper.js"></script>
+<script src="resources/testsuite.js"></script>
+<body>
+<div id="log"></div>
+<script>
+'use strict';
+
+runPropertyTests('filter', [
+ { syntax: 'none' },
+]);
+
+runUnsupportedPropertyTests('filter', [
+ 'blur(2px)',
+ 'url(filters.svg) blur(4px) saturate(150%)',
+]);
+
+</script>
diff --git a/testing/web-platform/tests/css/css-typed-om/the-stylepropertymap/properties/flex-basis.html b/testing/web-platform/tests/css/css-typed-om/the-stylepropertymap/properties/flex-basis.html
new file mode 100644
index 0000000000..de0d62ee6b
--- /dev/null
+++ b/testing/web-platform/tests/css/css-typed-om/the-stylepropertymap/properties/flex-basis.html
@@ -0,0 +1,42 @@
+<!doctype html>
+<meta charset="utf-8">
+<title>'flex-basis' property</title>
+<link rel="help" href="https://drafts.css-houdini.org/css-typed-om-1/#dom-stylepropertymap-get">
+<link rel="help" href="https://drafts.css-houdini.org/css-typed-om-1/#dom-stylepropertymap-set">
+<link rel="help" href="https://drafts.css-houdini.org/css-typed-om-1/#property-stle-value-normalization">
+<script src="/resources/testharness.js"></script>
+<script src="/resources/testharnessreport.js"></script>
+<script src="../../resources/testhelper.js"></script>
+<script src="resources/testsuite.js"></script>
+<body>
+<div id="log"></div>
+<script>
+'use strict';
+
+function assert_is_equal_with_clamping_percentage(input, result) {
+ const percent = input.to('percent').value;
+
+ if (percent < 0)
+ assert_style_value_equals(result, new CSSUnitValue(0, 'percent'));
+ else
+ assert_style_value_equals(result, new CSSUnitValue(percent, 'percent'));
+}
+
+runPropertyTests('flex-basis', [
+ { syntax: 'auto' },
+ { syntax: 'content' },
+ { syntax: 'fit-content' },
+ { syntax: 'min-content' },
+ { syntax: 'max-content' },
+ {
+ syntax: '<length>',
+ specified: assert_is_equal_with_range_handling,
+ },
+ {
+ syntax: '<percentage>',
+ specified: assert_is_equal_with_range_handling,
+ computed: assert_is_equal_with_clamping_percentage
+ },
+]);
+
+</script>
diff --git a/testing/web-platform/tests/css/css-typed-om/the-stylepropertymap/properties/flex-direction.html b/testing/web-platform/tests/css/css-typed-om/the-stylepropertymap/properties/flex-direction.html
new file mode 100644
index 0000000000..49b7a98331
--- /dev/null
+++ b/testing/web-platform/tests/css/css-typed-om/the-stylepropertymap/properties/flex-direction.html
@@ -0,0 +1,23 @@
+<!doctype html>
+<meta charset="utf-8">
+<title>'flex-direction' property</title>
+<link rel="help" href="https://drafts.css-houdini.org/css-typed-om-1/#dom-stylepropertymap-get">
+<link rel="help" href="https://drafts.css-houdini.org/css-typed-om-1/#dom-stylepropertymap-set">
+<link rel="help" href="https://drafts.css-houdini.org/css-typed-om-1/#property-stle-value-normalization">
+<script src="/resources/testharness.js"></script>
+<script src="/resources/testharnessreport.js"></script>
+<script src="../../resources/testhelper.js"></script>
+<script src="resources/testsuite.js"></script>
+<body>
+<div id="log"></div>
+<script>
+'use strict';
+
+runPropertyTests('flex-direction', [
+ { syntax: 'row' },
+ { syntax: 'row-reverse' },
+ { syntax: 'column' },
+ { syntax: 'column-reverse' },
+]);
+
+</script>
diff --git a/testing/web-platform/tests/css/css-typed-om/the-stylepropertymap/properties/flex-flow.html b/testing/web-platform/tests/css/css-typed-om/the-stylepropertymap/properties/flex-flow.html
new file mode 100644
index 0000000000..3d6b46f262
--- /dev/null
+++ b/testing/web-platform/tests/css/css-typed-om/the-stylepropertymap/properties/flex-flow.html
@@ -0,0 +1,20 @@
+<!doctype html>
+<meta charset="utf-8">
+<title>'flex-flow' property</title>
+<link rel="help" href="https://drafts.css-houdini.org/css-typed-om-1/#dom-stylepropertymap-get">
+<link rel="help" href="https://drafts.css-houdini.org/css-typed-om-1/#dom-stylepropertymap-set">
+<link rel="help" href="https://drafts.css-houdini.org/css-typed-om-1/#property-stle-value-normalization">
+<script src="/resources/testharness.js"></script>
+<script src="/resources/testharnessreport.js"></script>
+<script src="../../resources/testhelper.js"></script>
+<script src="resources/testsuite.js"></script>
+<body>
+<div id="log"></div>
+<script>
+'use strict';
+
+runUnsupportedPropertyTests('flex-flow', [
+ 'row', 'column wrap', 'row-reverse wrap-reverse'
+]);
+
+</script>
diff --git a/testing/web-platform/tests/css/css-typed-om/the-stylepropertymap/properties/flex-grow.html b/testing/web-platform/tests/css/css-typed-om/the-stylepropertymap/properties/flex-grow.html
new file mode 100644
index 0000000000..bee9e56eab
--- /dev/null
+++ b/testing/web-platform/tests/css/css-typed-om/the-stylepropertymap/properties/flex-grow.html
@@ -0,0 +1,33 @@
+<!doctype html>
+<meta charset="utf-8">
+<title>'flex-grow' property</title>
+<link rel="help" href="https://drafts.css-houdini.org/css-typed-om-1/#dom-stylepropertymap-get">
+<link rel="help" href="https://drafts.css-houdini.org/css-typed-om-1/#dom-stylepropertymap-set">
+<link rel="help" href="https://drafts.css-houdini.org/css-typed-om-1/#property-stle-value-normalization">
+<script src="/resources/testharness.js"></script>
+<script src="/resources/testharnessreport.js"></script>
+<script src="../../resources/testhelper.js"></script>
+<script src="resources/testsuite.js"></script>
+<body>
+<div id="log"></div>
+<script>
+'use strict';
+
+function assert_is_equal_with_clamping_number(input, result) {
+ const number = input.to('number');
+
+ if (number.value < 0)
+ assert_style_value_equals(result, new CSSUnitValue(0, 'number'));
+ else
+ assert_style_value_equals(result, number);
+}
+
+runPropertyTests('flex-grow', [
+ {
+ syntax: '<number>',
+ specified: assert_is_equal_with_range_handling,
+ computed: assert_is_equal_with_clamping_number
+ },
+]);
+
+</script>
diff --git a/testing/web-platform/tests/css/css-typed-om/the-stylepropertymap/properties/flex-shrink.html b/testing/web-platform/tests/css/css-typed-om/the-stylepropertymap/properties/flex-shrink.html
new file mode 100644
index 0000000000..3992fa4749
--- /dev/null
+++ b/testing/web-platform/tests/css/css-typed-om/the-stylepropertymap/properties/flex-shrink.html
@@ -0,0 +1,33 @@
+<!doctype html>
+<meta charset="utf-8">
+<title>'flex-shrink' property</title>
+<link rel="help" href="https://drafts.css-houdini.org/css-typed-om-1/#dom-stylepropertymap-get">
+<link rel="help" href="https://drafts.css-houdini.org/css-typed-om-1/#dom-stylepropertymap-set">
+<link rel="help" href="https://drafts.css-houdini.org/css-typed-om-1/#property-stle-value-normalization">
+<script src="/resources/testharness.js"></script>
+<script src="/resources/testharnessreport.js"></script>
+<script src="../../resources/testhelper.js"></script>
+<script src="resources/testsuite.js"></script>
+<body>
+<div id="log"></div>
+<script>
+'use strict';
+
+function assert_is_equal_with_clamping_number(input, result) {
+ const number = input.to('number');
+
+ if (number.value < 0)
+ assert_style_value_equals(result, new CSSUnitValue(0, 'number'));
+ else
+ assert_style_value_equals(result, number);
+}
+
+runPropertyTests('flex-shrink', [
+ {
+ syntax: '<number>',
+ specified: assert_is_equal_with_range_handling,
+ computed: assert_is_equal_with_clamping_number
+ },
+]);
+
+</script>
diff --git a/testing/web-platform/tests/css/css-typed-om/the-stylepropertymap/properties/flex-wrap.html b/testing/web-platform/tests/css/css-typed-om/the-stylepropertymap/properties/flex-wrap.html
new file mode 100644
index 0000000000..56d14f64cf
--- /dev/null
+++ b/testing/web-platform/tests/css/css-typed-om/the-stylepropertymap/properties/flex-wrap.html
@@ -0,0 +1,22 @@
+<!doctype html>
+<meta charset="utf-8">
+<title>'flex-wrap' property</title>
+<link rel="help" href="https://drafts.css-houdini.org/css-typed-om-1/#dom-stylepropertymap-get">
+<link rel="help" href="https://drafts.css-houdini.org/css-typed-om-1/#dom-stylepropertymap-set">
+<link rel="help" href="https://drafts.css-houdini.org/css-typed-om-1/#property-stle-value-normalization">
+<script src="/resources/testharness.js"></script>
+<script src="/resources/testharnessreport.js"></script>
+<script src="../../resources/testhelper.js"></script>
+<script src="resources/testsuite.js"></script>
+<body>
+<div id="log"></div>
+<script>
+'use strict';
+
+runPropertyTests('flex-wrap', [
+ { syntax: 'nowrap' },
+ { syntax: 'wrap' },
+ { syntax: 'wrap-reverse' },
+]);
+
+</script>
diff --git a/testing/web-platform/tests/css/css-typed-om/the-stylepropertymap/properties/flex.html b/testing/web-platform/tests/css/css-typed-om/the-stylepropertymap/properties/flex.html
new file mode 100644
index 0000000000..99a3e1219d
--- /dev/null
+++ b/testing/web-platform/tests/css/css-typed-om/the-stylepropertymap/properties/flex.html
@@ -0,0 +1,20 @@
+<!doctype html>
+<meta charset="utf-8">
+<title>'flex' property</title>
+<link rel="help" href="https://drafts.css-houdini.org/css-typed-om-1/#dom-stylepropertymap-get">
+<link rel="help" href="https://drafts.css-houdini.org/css-typed-om-1/#dom-stylepropertymap-set">
+<link rel="help" href="https://drafts.css-houdini.org/css-typed-om-1/#property-stle-value-normalization">
+<script src="/resources/testharness.js"></script>
+<script src="/resources/testharnessreport.js"></script>
+<script src="../../resources/testhelper.js"></script>
+<script src="resources/testsuite.js"></script>
+<body>
+<div id="log"></div>
+<script>
+'use strict';
+
+runUnsupportedPropertyTests('flex', [
+ 'auto', '2', '1 30px', '2 2 10%'
+]);
+
+</script>
diff --git a/testing/web-platform/tests/css/css-typed-om/the-stylepropertymap/properties/float.html b/testing/web-platform/tests/css/css-typed-om/the-stylepropertymap/properties/float.html
new file mode 100644
index 0000000000..569bae3439
--- /dev/null
+++ b/testing/web-platform/tests/css/css-typed-om/the-stylepropertymap/properties/float.html
@@ -0,0 +1,22 @@
+<!doctype html>
+<meta charset="utf-8">
+<title>'float' property</title>
+<link rel="help" href="https://drafts.css-houdini.org/css-typed-om-1/#dom-stylepropertymap-get">
+<link rel="help" href="https://drafts.css-houdini.org/css-typed-om-1/#dom-stylepropertymap-set">
+<link rel="help" href="https://drafts.css-houdini.org/css-typed-om-1/#property-stle-value-normalization">
+<script src="/resources/testharness.js"></script>
+<script src="/resources/testharnessreport.js"></script>
+<script src="../../resources/testhelper.js"></script>
+<script src="resources/testsuite.js"></script>
+<body>
+<div id="log"></div>
+<script>
+'use strict';
+
+runPropertyTests('float', [
+ { syntax: 'left' },
+ { syntax: 'right' },
+ { syntax: 'none' },
+]);
+
+</script>
diff --git a/testing/web-platform/tests/css/css-typed-om/the-stylepropertymap/properties/flood-color.html b/testing/web-platform/tests/css/css-typed-om/the-stylepropertymap/properties/flood-color.html
new file mode 100644
index 0000000000..bb3ddc9fc9
--- /dev/null
+++ b/testing/web-platform/tests/css/css-typed-om/the-stylepropertymap/properties/flood-color.html
@@ -0,0 +1,30 @@
+<!doctype html>
+<meta charset="utf-8">
+<title>'flood-color' property</title>
+<link rel="help" href="https://drafts.css-houdini.org/css-typed-om-1/#dom-stylepropertymap-get">
+<link rel="help" href="https://drafts.css-houdini.org/css-typed-om-1/#dom-stylepropertymap-set">
+<link rel="help" href="https://drafts.css-houdini.org/css-typed-om-1/#property-stle-value-normalization">
+<script src="/resources/testharness.js"></script>
+<script src="/resources/testharnessreport.js"></script>
+<script src="../../resources/testhelper.js"></script>
+<script src="resources/testsuite.js"></script>
+<body>
+<div id="log"></div>
+<script>
+'use strict';
+
+runPropertyTests('flood-color', [
+ {
+ syntax: 'currentcolor',
+ // computes to a <color>, which is not supported in level 1
+ computed: (_, result) => assert_class_string(result, 'CSSStyleValue')
+ }
+]);
+
+// <color>s are not supported in level 1
+runUnsupportedPropertyTests('flood-color', [
+ 'red', '#bbff00', 'rgb(255, 255, 128)', 'hsl(50, 33%, 25%)',
+ 'transparent'
+]);
+
+</script>
diff --git a/testing/web-platform/tests/css/css-typed-om/the-stylepropertymap/properties/flood-opacity.html b/testing/web-platform/tests/css/css-typed-om/the-stylepropertymap/properties/flood-opacity.html
new file mode 100644
index 0000000000..8a8275131e
--- /dev/null
+++ b/testing/web-platform/tests/css/css-typed-om/the-stylepropertymap/properties/flood-opacity.html
@@ -0,0 +1,50 @@
+<!doctype html>
+<meta charset="utf-8">
+<title>'flood-opacity' property</title>
+<link rel="help" href="https://drafts.css-houdini.org/css-typed-om-1/#dom-stylepropertymap-get">
+<link rel="help" href="https://drafts.css-houdini.org/css-typed-om-1/#dom-stylepropertymap-set">
+<link rel="help" href="https://drafts.css-houdini.org/css-typed-om-1/#property-stle-value-normalization">
+<script src="/resources/testharness.js"></script>
+<script src="/resources/testharnessreport.js"></script>
+<script src="../../resources/testhelper.js"></script>
+<script src="resources/testsuite.js"></script>
+<body>
+<div id="log"></div>
+<script>
+'use strict';
+
+function assert_is_equal_with_clamping_number(input, result) {
+ const number = input.to('number');
+
+ if (number.value < 0)
+ assert_style_value_equals(result, new CSSUnitValue(0, 'number'));
+ else if (number.value > 1)
+ assert_style_value_equals(result, new CSSUnitValue(1, 'number'));
+ else
+ assert_style_value_equals(result, input);
+}
+
+function assert_is_equal_with_clamping_percentage(input, result) {
+ const number = input.to('percent');
+ const value = number.value / 100.;
+
+ if (value < 0)
+ assert_style_value_equals(result, new CSSUnitValue(0, 'number'));
+ else if (value > 1)
+ assert_style_value_equals(result, new CSSUnitValue(1, 'number'));
+ else
+ assert_style_value_equals(result, new CSSUnitValue(value, 'number'));
+}
+
+runPropertyTests('flood-opacity', [
+ {
+ syntax: '<number>',
+ computed: assert_is_equal_with_clamping_number
+ },
+ {
+ syntax: '<percentage>',
+ computed: assert_is_equal_with_clamping_percentage
+ }
+]);
+
+</script>
diff --git a/testing/web-platform/tests/css/css-typed-om/the-stylepropertymap/properties/font-family.html b/testing/web-platform/tests/css/css-typed-om/the-stylepropertymap/properties/font-family.html
new file mode 100644
index 0000000000..eb35ef1799
--- /dev/null
+++ b/testing/web-platform/tests/css/css-typed-om/the-stylepropertymap/properties/font-family.html
@@ -0,0 +1,23 @@
+<!doctype html>
+<meta charset="utf-8">
+<title>'font-family' property</title>
+<link rel="help" href="https://drafts.css-houdini.org/css-typed-om-1/#dom-stylepropertymap-get">
+<link rel="help" href="https://drafts.css-houdini.org/css-typed-om-1/#dom-stylepropertymap-set">
+<link rel="help" href="https://drafts.css-houdini.org/css-typed-om-1/#property-stle-value-normalization">
+<script src="/resources/testharness.js"></script>
+<script src="/resources/testharnessreport.js"></script>
+<script src="../../resources/testhelper.js"></script>
+<script src="resources/testsuite.js"></script>
+<body>
+<div id="log"></div>
+<script>
+'use strict';
+
+// FIXME: font-family is list-valued. Run list-valued tests here too.
+runUnsupportedPropertyTests('font-family', [
+ 'Georgia',
+ '"Gill Sans"',
+ 'sans-serif',
+]);
+
+</script>
diff --git a/testing/web-platform/tests/css/css-typed-om/the-stylepropertymap/properties/font-feature-settings.html b/testing/web-platform/tests/css/css-typed-om/the-stylepropertymap/properties/font-feature-settings.html
new file mode 100644
index 0000000000..4edf7064f9
--- /dev/null
+++ b/testing/web-platform/tests/css/css-typed-om/the-stylepropertymap/properties/font-feature-settings.html
@@ -0,0 +1,25 @@
+<!doctype html>
+<meta charset="utf-8">
+<title>'font-feature-settings' property</title>
+<link rel="help" href="https://drafts.css-houdini.org/css-typed-om-1/#dom-stylepropertymap-get">
+<link rel="help" href="https://drafts.css-houdini.org/css-typed-om-1/#dom-stylepropertymap-set">
+<link rel="help" href="https://drafts.css-houdini.org/css-typed-om-1/#property-stle-value-normalization">
+<script src="/resources/testharness.js"></script>
+<script src="/resources/testharnessreport.js"></script>
+<script src="../../resources/testhelper.js"></script>
+<script src="resources/testsuite.js"></script>
+<body>
+<div id="log"></div>
+<script>
+'use strict';
+
+runPropertyTests('font-feature-settings', [
+ { syntax: 'normal' }
+]);
+
+runUnsupportedPropertyTests('font-feature-settings', [
+ '"dlig" 1',
+ '"smcp" on',
+]);
+
+</script>
diff --git a/testing/web-platform/tests/css/css-typed-om/the-stylepropertymap/properties/font-kerning.html b/testing/web-platform/tests/css/css-typed-om/the-stylepropertymap/properties/font-kerning.html
new file mode 100644
index 0000000000..4eea684892
--- /dev/null
+++ b/testing/web-platform/tests/css/css-typed-om/the-stylepropertymap/properties/font-kerning.html
@@ -0,0 +1,22 @@
+<!doctype html>
+<meta charset="utf-8">
+<title>'font-kerning' property</title>
+<link rel="help" href="https://drafts.css-houdini.org/css-typed-om-1/#dom-stylepropertymap-get">
+<link rel="help" href="https://drafts.css-houdini.org/css-typed-om-1/#dom-stylepropertymap-set">
+<link rel="help" href="https://drafts.css-houdini.org/css-typed-om-1/#property-stle-value-normalization">
+<script src="/resources/testharness.js"></script>
+<script src="/resources/testharnessreport.js"></script>
+<script src="../../resources/testhelper.js"></script>
+<script src="resources/testsuite.js"></script>
+<body>
+<div id="log"></div>
+<script>
+'use strict';
+
+runPropertyTests('font-kerning', [
+ { syntax: 'auto' },
+ { syntax: 'normal' },
+ { syntax: 'none' },
+]);
+
+</script>
diff --git a/testing/web-platform/tests/css/css-typed-om/the-stylepropertymap/properties/font-language-override.html b/testing/web-platform/tests/css/css-typed-om/the-stylepropertymap/properties/font-language-override.html
new file mode 100644
index 0000000000..daf380389e
--- /dev/null
+++ b/testing/web-platform/tests/css/css-typed-om/the-stylepropertymap/properties/font-language-override.html
@@ -0,0 +1,24 @@
+<!doctype html>
+<meta charset="utf-8">
+<title>'font-language-override' property</title>
+<link rel="help" href="https://drafts.css-houdini.org/css-typed-om-1/#dom-stylepropertymap-get">
+<link rel="help" href="https://drafts.css-houdini.org/css-typed-om-1/#dom-stylepropertymap-set">
+<link rel="help" href="https://drafts.css-houdini.org/css-typed-om-1/#property-stle-value-normalization">
+<script src="/resources/testharness.js"></script>
+<script src="/resources/testharnessreport.js"></script>
+<script src="../../resources/testhelper.js"></script>
+<script src="resources/testsuite.js"></script>
+<body>
+<div id="log"></div>
+<script>
+'use strict';
+
+runPropertyTests('font-language-override', [
+ { syntax: 'normal' },
+]);
+
+runUnsupportedPropertyTests('font-language-override', [
+ '"SRB"',
+]);
+
+</script>
diff --git a/testing/web-platform/tests/css/css-typed-om/the-stylepropertymap/properties/font-optical-sizing.html b/testing/web-platform/tests/css/css-typed-om/the-stylepropertymap/properties/font-optical-sizing.html
new file mode 100644
index 0000000000..0018ef1390
--- /dev/null
+++ b/testing/web-platform/tests/css/css-typed-om/the-stylepropertymap/properties/font-optical-sizing.html
@@ -0,0 +1,21 @@
+<!doctype html>
+<meta charset="utf-8">
+<title>'font-optical-sizing' property</title>
+<link rel="help" href="https://drafts.css-houdini.org/css-typed-om-1/#dom-stylepropertymap-get">
+<link rel="help" href="https://drafts.css-houdini.org/css-typed-om-1/#dom-stylepropertymap-set">
+<link rel="help" href="https://drafts.css-houdini.org/css-typed-om-1/#property-stle-value-normalization">
+<script src="/resources/testharness.js"></script>
+<script src="/resources/testharnessreport.js"></script>
+<script src="../../resources/testhelper.js"></script>
+<script src="resources/testsuite.js"></script>
+<body>
+<div id="log"></div>
+<script>
+'use strict';
+
+runPropertyTests('font-optical-sizing', [
+ { syntax: 'auto' },
+ { syntax: 'none' },
+]);
+
+</script>
diff --git a/testing/web-platform/tests/css/css-typed-om/the-stylepropertymap/properties/font-palette.html b/testing/web-platform/tests/css/css-typed-om/the-stylepropertymap/properties/font-palette.html
new file mode 100644
index 0000000000..ad62945f6b
--- /dev/null
+++ b/testing/web-platform/tests/css/css-typed-om/the-stylepropertymap/properties/font-palette.html
@@ -0,0 +1,26 @@
+<!doctype html>
+<meta charset="utf-8">
+<title>'font-palette' property</title>
+<link rel="help" href="https://drafts.css-houdini.org/css-typed-om-1/#dom-stylepropertymap-get">
+<link rel="help" href="https://drafts.css-houdini.org/css-typed-om-1/#dom-stylepropertymap-set">
+<link rel="help" href="https://drafts.css-houdini.org/css-typed-om-1/#property-stle-value-normalization">
+<script src="/resources/testharness.js"></script>
+<script src="/resources/testharnessreport.js"></script>
+<script src="../../resources/testhelper.js"></script>
+<script src="resources/testsuite.js"></script>
+<body>
+<div id="log"></div>
+<script>
+'use strict';
+
+runPropertyTests('font-palette', [
+ { syntax: 'normal' },
+ { syntax: 'light' },
+ { syntax: 'dark' },
+]);
+
+runUnsupportedPropertyTests('font-palette', [
+ 'Augusta'
+]);
+
+</script>
diff --git a/testing/web-platform/tests/css/css-typed-om/the-stylepropertymap/properties/font-presentation.html b/testing/web-platform/tests/css/css-typed-om/the-stylepropertymap/properties/font-presentation.html
new file mode 100644
index 0000000000..44484660d6
--- /dev/null
+++ b/testing/web-platform/tests/css/css-typed-om/the-stylepropertymap/properties/font-presentation.html
@@ -0,0 +1,22 @@
+<!doctype html>
+<meta charset="utf-8">
+<title>'font-presentation' property</title>
+<link rel="help" href="https://drafts.css-houdini.org/css-typed-om-1/#dom-stylepropertymap-get">
+<link rel="help" href="https://drafts.css-houdini.org/css-typed-om-1/#dom-stylepropertymap-set">
+<link rel="help" href="https://drafts.css-houdini.org/css-typed-om-1/#property-stle-value-normalization">
+<script src="/resources/testharness.js"></script>
+<script src="/resources/testharnessreport.js"></script>
+<script src="../../resources/testhelper.js"></script>
+<script src="resources/testsuite.js"></script>
+<body>
+<div id="log"></div>
+<script>
+'use strict';
+
+runPropertyTests('font-presentation', [
+ { syntax: 'auto' },
+ { syntax: 'text' },
+ { syntax: 'emoji' },
+]);
+
+</script>
diff --git a/testing/web-platform/tests/css/css-typed-om/the-stylepropertymap/properties/font-size-adjust.html b/testing/web-platform/tests/css/css-typed-om/the-stylepropertymap/properties/font-size-adjust.html
new file mode 100644
index 0000000000..be065987ce
--- /dev/null
+++ b/testing/web-platform/tests/css/css-typed-om/the-stylepropertymap/properties/font-size-adjust.html
@@ -0,0 +1,34 @@
+<!doctype html>
+<meta charset="utf-8">
+<title>'font-size-adjust' property</title>
+<link rel="help" href="https://drafts.css-houdini.org/css-typed-om-1/#dom-stylepropertymap-get">
+<link rel="help" href="https://drafts.css-houdini.org/css-typed-om-1/#dom-stylepropertymap-set">
+<link rel="help" href="https://drafts.css-houdini.org/css-typed-om-1/#property-stle-value-normalization">
+<script src="/resources/testharness.js"></script>
+<script src="/resources/testharnessreport.js"></script>
+<script src="../../resources/testhelper.js"></script>
+<script src="resources/testsuite.js"></script>
+<body>
+<div id="log"></div>
+<script>
+'use strict';
+
+function assert_is_equal_with_clamping_number(input, result) {
+ const number = input.to('number');
+
+ if (number.value < 0)
+ assert_style_value_equals(result, new CSSUnitValue(0, 'number'));
+ else
+ assert_style_value_equals(result, number);
+}
+
+runPropertyTests('font-size-adjust', [
+ { syntax: 'none' },
+ {
+ syntax: '<number>',
+ specified: assert_is_equal_with_range_handling,
+ computed: assert_is_equal_with_clamping_number
+ },
+]);
+
+</script>
diff --git a/testing/web-platform/tests/css/css-typed-om/the-stylepropertymap/properties/font-size.html b/testing/web-platform/tests/css/css-typed-om/the-stylepropertymap/properties/font-size.html
new file mode 100644
index 0000000000..fc76e0f876
--- /dev/null
+++ b/testing/web-platform/tests/css/css-typed-om/the-stylepropertymap/properties/font-size.html
@@ -0,0 +1,72 @@
+<!doctype html>
+<meta charset="utf-8">
+<title>'font-size' property</title>
+<link rel="help" href="https://drafts.css-houdini.org/css-typed-om-1/#dom-stylepropertymap-get">
+<link rel="help" href="https://drafts.css-houdini.org/css-typed-om-1/#dom-stylepropertymap-set">
+<link rel="help" href="https://drafts.css-houdini.org/css-typed-om-1/#property-stle-value-normalization">
+<script src="/resources/testharness.js"></script>
+<script src="/resources/testharnessreport.js"></script>
+<script src="../../resources/testhelper.js"></script>
+<script src="resources/testsuite.js"></script>
+<body>
+<div id="log"></div>
+<script>
+'use strict';
+
+for (const property of ['font-size', 'font-min-size', 'font-max-size']) {
+ // font-max-size also supports 'infinity' keyword
+ const infinity = property === 'font-max-size' ?
+ [{ syntax: 'infinity'}] : [];
+
+ runPropertyTests(property, [
+ ...infinity,
+ {
+ syntax: 'xx-small',
+ computed: (_, result) => assert_is_unit('px', result)
+ },
+ {
+ syntax: 'x-small',
+ computed: (_, result) => assert_is_unit('px', result)
+ },
+ {
+ syntax: 'small',
+ computed: (_, result) => assert_is_unit('px', result)
+ },
+ {
+ syntax: 'medium',
+ computed: (_, result) => assert_is_unit('px', result)
+ },
+ {
+ syntax: 'large',
+ computed: (_, result) => assert_is_unit('px', result)
+ },
+ {
+ syntax: 'x-large',
+ computed: (_, result) => assert_is_unit('px', result)
+ },
+ {
+ syntax: 'xx-large',
+ computed: (_, result) => assert_is_unit('px', result)
+ },
+ {
+ syntax: 'larger',
+ computed: (_, result) => assert_is_unit('px', result)
+ },
+ {
+ syntax: 'smaller',
+ computed: (_, result) => assert_is_unit('px', result)
+ },
+ {
+ syntax: '<length>',
+ specified: assert_is_equal_with_range_handling,
+ computed: (_, result) => assert_is_unit('px', result)
+ },
+ {
+ syntax: '<percentage>',
+ specified: assert_is_equal_with_range_handling,
+ computed: (_, result) => assert_is_unit('px', result)
+ },
+ ]);
+}
+
+</script>
diff --git a/testing/web-platform/tests/css/css-typed-om/the-stylepropertymap/properties/font-stretch.html b/testing/web-platform/tests/css/css-typed-om/the-stylepropertymap/properties/font-stretch.html
new file mode 100644
index 0000000000..40cffaf044
--- /dev/null
+++ b/testing/web-platform/tests/css/css-typed-om/the-stylepropertymap/properties/font-stretch.html
@@ -0,0 +1,42 @@
+<!doctype html>
+<meta charset="utf-8">
+<title>'font-stretch' property</title>
+<link rel="help" href="https://drafts.css-houdini.org/css-typed-om-1/#dom-stylepropertymap-get">
+<link rel="help" href="https://drafts.css-houdini.org/css-typed-om-1/#dom-stylepropertymap-set">
+<link rel="help" href="https://drafts.css-houdini.org/css-typed-om-1/#property-stle-value-normalization">
+<script src="/resources/testharness.js"></script>
+<script src="/resources/testharnessreport.js"></script>
+<script src="../../resources/testhelper.js"></script>
+<script src="resources/testsuite.js"></script>
+<body>
+<div id="log"></div>
+<script>
+'use strict';
+
+function assert_is_equal_with_clamping_percentage(input, result) {
+ const percent = input.to('percent').value;
+
+ if (percent < 0)
+ assert_style_value_equals(result, new CSSUnitValue(0, 'percent'));
+ else
+ assert_style_value_equals(result, new CSSUnitValue(percent, 'percent'));
+}
+
+runPropertyTests('font-stretch', [
+ { syntax: 'normal' },
+ { syntax: 'ultra-condensed' },
+ { syntax: 'extra-condensed' },
+ { syntax: 'condensed' },
+ { syntax: 'semi-condensed' },
+ { syntax: 'semi-expanded' },
+ { syntax: 'expanded' },
+ { syntax: 'extra-expanded' },
+ { syntax: 'ultra-expanded' },
+ {
+ syntax: '<percentage>',
+ specified: assert_is_equal_with_range_handling,
+ computed: assert_is_equal_with_clamping_percentage
+ },
+]);
+
+</script>
diff --git a/testing/web-platform/tests/css/css-typed-om/the-stylepropertymap/properties/font-style.html b/testing/web-platform/tests/css/css-typed-om/the-stylepropertymap/properties/font-style.html
new file mode 100644
index 0000000000..c361e21f42
--- /dev/null
+++ b/testing/web-platform/tests/css/css-typed-om/the-stylepropertymap/properties/font-style.html
@@ -0,0 +1,22 @@
+<!doctype html>
+<meta charset="utf-8">
+<title>'font-style' property</title>
+<link rel="help" href="https://drafts.css-houdini.org/css-typed-om-1/#dom-stylepropertymap-get">
+<link rel="help" href="https://drafts.css-houdini.org/css-typed-om-1/#dom-stylepropertymap-set">
+<link rel="help" href="https://drafts.css-houdini.org/css-typed-om-1/#property-stle-value-normalization">
+<script src="/resources/testharness.js"></script>
+<script src="/resources/testharnessreport.js"></script>
+<script src="../../resources/testhelper.js"></script>
+<script src="resources/testsuite.js"></script>
+<body>
+<div id="log"></div>
+<script>
+'use strict';
+
+runPropertyTests('font-style', [
+ { syntax: 'normal' },
+ { syntax: 'italic' },
+ { syntax: 'oblique' },
+]);
+
+</script>
diff --git a/testing/web-platform/tests/css/css-typed-om/the-stylepropertymap/properties/font-synthesis.html b/testing/web-platform/tests/css/css-typed-om/the-stylepropertymap/properties/font-synthesis.html
new file mode 100644
index 0000000000..0bcce9bd21
--- /dev/null
+++ b/testing/web-platform/tests/css/css-typed-om/the-stylepropertymap/properties/font-synthesis.html
@@ -0,0 +1,27 @@
+<!doctype html>
+<meta charset="utf-8">
+<title>'font-synthesis' property</title>
+<link rel="help" href="https://drafts.css-houdini.org/css-typed-om-1/#dom-stylepropertymap-get">
+<link rel="help" href="https://drafts.css-houdini.org/css-typed-om-1/#dom-stylepropertymap-set">
+<link rel="help" href="https://drafts.css-houdini.org/css-typed-om-1/#property-stle-value-normalization">
+<script src="/resources/testharness.js"></script>
+<script src="/resources/testharnessreport.js"></script>
+<script src="../../resources/testhelper.js"></script>
+<script src="resources/testsuite.js"></script>
+<body>
+<div id="log"></div>
+<script>
+'use strict';
+
+ for (const suffix of ['weight', 'style', 'small-caps']) {
+ runPropertyTests('font-synthesis-' + suffix, [
+ { syntax: 'auto' },
+ { syntax: 'none' },
+ ]);
+}
+
+runUnsupportedPropertyTests('font-synthesis', [
+ 'weight style', 'style small-caps', 'small-caps weight style'
+]);
+
+</script>
diff --git a/testing/web-platform/tests/css/css-typed-om/the-stylepropertymap/properties/font-variant-alternates.html b/testing/web-platform/tests/css/css-typed-om/the-stylepropertymap/properties/font-variant-alternates.html
new file mode 100644
index 0000000000..521eb3a68a
--- /dev/null
+++ b/testing/web-platform/tests/css/css-typed-om/the-stylepropertymap/properties/font-variant-alternates.html
@@ -0,0 +1,31 @@
+<!doctype html>
+<meta charset="utf-8">
+<title>'font-variant-alternates' property</title>
+<link rel="help" href="https://drafts.css-houdini.org/css-typed-om-1/#dom-stylepropertymap-get">
+<link rel="help" href="https://drafts.css-houdini.org/css-typed-om-1/#dom-stylepropertymap-set">
+<link rel="help" href="https://drafts.css-houdini.org/css-typed-om-1/#property-stle-value-normalization">
+<script src="/resources/testharness.js"></script>
+<script src="/resources/testharnessreport.js"></script>
+<script src="../../resources/testhelper.js"></script>
+<script src="resources/testsuite.js"></script>
+<body>
+<div id="log"></div>
+<script>
+'use strict';
+
+runPropertyTests('font-variant-alternates', [
+ { syntax: 'normal' },
+ { syntax: 'historical-forms' },
+]);
+
+runUnsupportedPropertyTests('font-variant-alternates', [
+ 'stylistic(foo)',
+ 'styleset(foo)',
+ 'character-variant(foo)',
+ 'swash(foo)',
+ 'ornaments(foo)',
+ 'annotation(foo)',
+ 'swash(foo) annotation(foo2)',
+]);
+
+</script>
diff --git a/testing/web-platform/tests/css/css-typed-om/the-stylepropertymap/properties/font-variant-caps.html b/testing/web-platform/tests/css/css-typed-om/the-stylepropertymap/properties/font-variant-caps.html
new file mode 100644
index 0000000000..6a84bbd6fb
--- /dev/null
+++ b/testing/web-platform/tests/css/css-typed-om/the-stylepropertymap/properties/font-variant-caps.html
@@ -0,0 +1,26 @@
+<!doctype html>
+<meta charset="utf-8">
+<title>'font-variant-caps' property</title>
+<link rel="help" href="https://drafts.css-houdini.org/css-typed-om-1/#dom-stylepropertymap-get">
+<link rel="help" href="https://drafts.css-houdini.org/css-typed-om-1/#dom-stylepropertymap-set">
+<link rel="help" href="https://drafts.css-houdini.org/css-typed-om-1/#property-stle-value-normalization">
+<script src="/resources/testharness.js"></script>
+<script src="/resources/testharnessreport.js"></script>
+<script src="../../resources/testhelper.js"></script>
+<script src="resources/testsuite.js"></script>
+<body>
+<div id="log"></div>
+<script>
+'use strict';
+
+runPropertyTests('font-variant-caps', [
+ { syntax: 'normal' },
+ { syntax: 'small-caps' },
+ { syntax: 'all-small-caps' },
+ { syntax: 'petite-caps' },
+ { syntax: 'all-petite-caps' },
+ { syntax: 'unicase' },
+ { syntax: 'titling-caps' },
+]);
+
+</script>
diff --git a/testing/web-platform/tests/css/css-typed-om/the-stylepropertymap/properties/font-variant-east-asian.html b/testing/web-platform/tests/css/css-typed-om/the-stylepropertymap/properties/font-variant-east-asian.html
new file mode 100644
index 0000000000..018624e4e4
--- /dev/null
+++ b/testing/web-platform/tests/css/css-typed-om/the-stylepropertymap/properties/font-variant-east-asian.html
@@ -0,0 +1,34 @@
+<!doctype html>
+<meta charset="utf-8">
+<title>'font-variant-east-asian' property</title>
+<link rel="help" href="https://drafts.css-houdini.org/css-typed-om-1/#dom-stylepropertymap-get">
+<link rel="help" href="https://drafts.css-houdini.org/css-typed-om-1/#dom-stylepropertymap-set">
+<link rel="help" href="https://drafts.css-houdini.org/css-typed-om-1/#property-stle-value-normalization">
+<script src="/resources/testharness.js"></script>
+<script src="/resources/testharnessreport.js"></script>
+<script src="../../resources/testhelper.js"></script>
+<script src="resources/testsuite.js"></script>
+<body>
+<div id="log"></div>
+<script>
+'use strict';
+
+runPropertyTests('font-variant-east-asian', [
+ { syntax: 'normal' },
+ { syntax: 'jis78' },
+ { syntax: 'jis83' },
+ { syntax: 'jis90' },
+ { syntax: 'jis04' },
+ { syntax: 'simplified' },
+ { syntax: 'traditional' },
+ { syntax: 'full-width' },
+ { syntax: 'proportional-width' },
+ { syntax: 'ruby' },
+]);
+
+runUnsupportedPropertyTests('font-variant-east-asian', [
+ 'jis78 full-width',
+ 'traditional proportional-width ruby',
+]);
+
+</script>
diff --git a/testing/web-platform/tests/css/css-typed-om/the-stylepropertymap/properties/font-variant-emoji.html b/testing/web-platform/tests/css/css-typed-om/the-stylepropertymap/properties/font-variant-emoji.html
new file mode 100644
index 0000000000..9433263fd9
--- /dev/null
+++ b/testing/web-platform/tests/css/css-typed-om/the-stylepropertymap/properties/font-variant-emoji.html
@@ -0,0 +1,23 @@
+<!doctype html>
+<meta charset="utf-8">
+<title>'font-variant-emoji' property</title>
+<link rel="help" href="https://drafts.css-houdini.org/css-typed-om-1/#dom-stylepropertymap-get">
+<link rel="help" href="https://drafts.css-houdini.org/css-typed-om-1/#dom-stylepropertymap-set">
+<link rel="help" href="https://drafts.css-houdini.org/css-typed-om-1/#property-stle-value-normalization">
+<script src="/resources/testharness.js"></script>
+<script src="/resources/testharnessreport.js"></script>
+<script src="../../resources/testhelper.js"></script>
+<script src="resources/testsuite.js"></script>
+<body>
+<div id="log"></div>
+<script>
+'use strict';
+
+runPropertyTests('font-variant-emoji', [
+ { syntax: 'normal' },
+ { syntax: 'text' },
+ { syntax: 'emoji' },
+ { syntax: 'unicode' },
+]);
+
+</script>
diff --git a/testing/web-platform/tests/css/css-typed-om/the-stylepropertymap/properties/font-variant-ligatures.html b/testing/web-platform/tests/css/css-typed-om/the-stylepropertymap/properties/font-variant-ligatures.html
new file mode 100644
index 0000000000..c640dc219b
--- /dev/null
+++ b/testing/web-platform/tests/css/css-typed-om/the-stylepropertymap/properties/font-variant-ligatures.html
@@ -0,0 +1,34 @@
+<!doctype html>
+<meta charset="utf-8">
+<title>'font-variant-ligatures' property</title>
+<link rel="help" href="https://drafts.css-houdini.org/css-typed-om-1/#dom-stylepropertymap-get">
+<link rel="help" href="https://drafts.css-houdini.org/css-typed-om-1/#dom-stylepropertymap-set">
+<link rel="help" href="https://drafts.css-houdini.org/css-typed-om-1/#property-stle-value-normalization">
+<script src="/resources/testharness.js"></script>
+<script src="/resources/testharnessreport.js"></script>
+<script src="../../resources/testhelper.js"></script>
+<script src="resources/testsuite.js"></script>
+<body>
+<div id="log"></div>
+<script>
+'use strict';
+
+runPropertyTests('font-variant-ligatures', [
+ { syntax: 'normal' },
+ { syntax: 'none' },
+ { syntax: 'common-ligatures' },
+ { syntax: 'no-common-ligatures' },
+ { syntax: 'discretionary-ligatures' },
+ { syntax: 'no-discretionary-ligatures' },
+ { syntax: 'historical-ligatures' },
+ { syntax: 'no-historical-ligatures' },
+ { syntax: 'contextual' },
+ { syntax: 'no-contextual' },
+]);
+
+runUnsupportedPropertyTests('font-variant-ligatures', [
+ 'common-ligatures contextual',
+ 'no-common-ligatures discretionary-ligatures no-historical-ligatures no-contextual',
+]);
+
+</script>
diff --git a/testing/web-platform/tests/css/css-typed-om/the-stylepropertymap/properties/font-variant-numeric.html b/testing/web-platform/tests/css/css-typed-om/the-stylepropertymap/properties/font-variant-numeric.html
new file mode 100644
index 0000000000..cbd454da95
--- /dev/null
+++ b/testing/web-platform/tests/css/css-typed-om/the-stylepropertymap/properties/font-variant-numeric.html
@@ -0,0 +1,32 @@
+<meta charset="utf-8">
+<title>'font-variant-numeric' property</title>
+<link rel="help" href="https://drafts.css-houdini.org/css-typed-om-1/#dom-stylepropertymap-get">
+<link rel="help" href="https://drafts.css-houdini.org/css-typed-om-1/#dom-stylepropertymap-set">
+<link rel="help" href="https://drafts.css-houdini.org/css-typed-om-1/#property-stle-value-normalization">
+<script src="/resources/testharness.js"></script>
+<script src="/resources/testharnessreport.js"></script>
+<script src="../../resources/testhelper.js"></script>
+<script src="resources/testsuite.js"></script>
+<body>
+<div id="log"></div>
+<script>
+'use strict';
+
+runPropertyTests('font-variant-numeric', [
+ { syntax: 'normal' },
+ { syntax: 'lining-nums' },
+ { syntax: 'oldstyle-nums' },
+ { syntax: 'proportional-nums' },
+ { syntax: 'tabular-nums' },
+ { syntax: 'diagonal-fractions' },
+ { syntax: 'stacked-fractions' },
+ { syntax: 'ordinal' },
+ { syntax: 'slashed-zero' },
+]);
+
+runUnsupportedPropertyTests('font-variant-numeric', [
+ 'lining-nums ordinal',
+ 'oldstyle-nums tabular-nums stacked-fractions ordinal slashed-zero',
+]);
+
+</script>
diff --git a/testing/web-platform/tests/css/css-typed-om/the-stylepropertymap/properties/font-variant.html b/testing/web-platform/tests/css/css-typed-om/the-stylepropertymap/properties/font-variant.html
new file mode 100644
index 0000000000..765ce28bd8
--- /dev/null
+++ b/testing/web-platform/tests/css/css-typed-om/the-stylepropertymap/properties/font-variant.html
@@ -0,0 +1,21 @@
+<!doctype html>
+<meta charset="utf-8">
+<title>'font-variant' property</title>
+<link rel="help" href="https://drafts.css-houdini.org/css-typed-om-1/#dom-stylepropertymap-get">
+<link rel="help" href="https://drafts.css-houdini.org/css-typed-om-1/#dom-stylepropertymap-set">
+<link rel="help" href="https://drafts.css-houdini.org/css-typed-om-1/#property-stle-value-normalization">
+<script src="/resources/testharness.js"></script>
+<script src="/resources/testharnessreport.js"></script>
+<script src="../../resources/testhelper.js"></script>
+<script src="resources/testsuite.js"></script>
+<body>
+<div id="log"></div>
+<script>
+'use strict';
+
+runUnsupportedPropertyTests('font-variant', [
+ 'normal', 'no-common-ligatures proportional-nums',
+ 'common-ligatures tabular-nums', 'small-caps slashed-zero'
+]);
+
+</script>
diff --git a/testing/web-platform/tests/css/css-typed-om/the-stylepropertymap/properties/font-variation-settings.html b/testing/web-platform/tests/css/css-typed-om/the-stylepropertymap/properties/font-variation-settings.html
new file mode 100644
index 0000000000..12d62618bc
--- /dev/null
+++ b/testing/web-platform/tests/css/css-typed-om/the-stylepropertymap/properties/font-variation-settings.html
@@ -0,0 +1,24 @@
+<!doctype html>
+<meta charset="utf-8">
+<title>'font-variation-settings' property</title>
+<link rel="help" href="https://drafts.css-houdini.org/css-typed-om-1/#dom-stylepropertymap-get">
+<link rel="help" href="https://drafts.css-houdini.org/css-typed-om-1/#dom-stylepropertymap-set">
+<link rel="help" href="https://drafts.css-houdini.org/css-typed-om-1/#property-stle-value-normalization">
+<script src="/resources/testharness.js"></script>
+<script src="/resources/testharnessreport.js"></script>
+<script src="../../resources/testhelper.js"></script>
+<script src="resources/testsuite.js"></script>
+<body>
+<div id="log"></div>
+<script>
+'use strict';
+
+runPropertyTests('font-variation-settings', [
+ { syntax: 'normal' },
+]);
+
+runUnsupportedPropertyTests('font-variation-settings', [
+ '"XHGT" 0.7',
+]);
+
+</script>
diff --git a/testing/web-platform/tests/css/css-typed-om/the-stylepropertymap/properties/font-weight.html b/testing/web-platform/tests/css/css-typed-om/the-stylepropertymap/properties/font-weight.html
new file mode 100644
index 0000000000..7230cfb721
--- /dev/null
+++ b/testing/web-platform/tests/css/css-typed-om/the-stylepropertymap/properties/font-weight.html
@@ -0,0 +1,50 @@
+<!doctype html>
+<meta charset="utf-8">
+<title>'font-weight' property</title>
+<link rel="help" href="https://drafts.css-houdini.org/css-typed-om-1/#dom-stylepropertymap-get">
+<link rel="help" href="https://drafts.css-houdini.org/css-typed-om-1/#dom-stylepropertymap-set">
+<link rel="help" href="https://drafts.css-houdini.org/css-typed-om-1/#property-stle-value-normalization">
+<script src="/resources/testharness.js"></script>
+<script src="/resources/testharnessreport.js"></script>
+<script src="../../resources/testhelper.js"></script>
+<script src="resources/testsuite.js"></script>
+<body>
+<div id="log"></div>
+<script>
+'use strict';
+
+function assert_is_font_weight(weight, result) {
+ assert_style_value_equals(result, new CSSUnitValue(weight, 'number'));
+}
+
+runPropertyTests('font-weight', [
+ {
+ syntax: 'normal',
+ computed: (_, result) => assert_is_font_weight(400, result)
+ },
+ {
+ syntax: 'bold',
+ computed: (_, result) => assert_is_font_weight(700, result)
+ },
+ {
+ syntax: 'bolder',
+ computed: (_, result) => assert_is_unit('number', result)
+ },
+ {
+ syntax: 'lighter',
+ computed: (_, result) => assert_is_unit('number', result)
+ },
+ {
+ syntax: '<number>',
+ specified: (input, result) => {
+ if (input instanceof CSSUnitValue &&
+ (input.value < 1 || input.value > 1000))
+ assert_style_value_equals(result, new CSSMathSum(input));
+ else
+ assert_style_value_equals(result, input);
+ }
+ },
+]);
+
+</script>
+
diff --git a/testing/web-platform/tests/css/css-typed-om/the-stylepropertymap/properties/font.html b/testing/web-platform/tests/css/css-typed-om/the-stylepropertymap/properties/font.html
new file mode 100644
index 0000000000..b8a1e88a27
--- /dev/null
+++ b/testing/web-platform/tests/css/css-typed-om/the-stylepropertymap/properties/font.html
@@ -0,0 +1,24 @@
+<!doctype html>
+<meta charset="utf-8">
+<title>'font' property</title>
+<link rel="help" href="https://drafts.css-houdini.org/css-typed-om-1/#dom-stylepropertymap-get">
+<link rel="help" href="https://drafts.css-houdini.org/css-typed-om-1/#dom-stylepropertymap-set">
+<link rel="help" href="https://drafts.css-houdini.org/css-typed-om-1/#property-stle-value-normalization">
+<script src="/resources/testharness.js"></script>
+<script src="/resources/testharnessreport.js"></script>
+<script src="../../resources/testhelper.js"></script>
+<script src="resources/testsuite.js"></script>
+<body>
+<div id="log"></div>
+<script>
+'use strict';
+
+runUnsupportedPropertyTests('font', [
+ '1.2em "Fira Sans", sans-serif',
+ 'italic 1.2em "Fira Sans", serif',
+ 'italic small-caps bold 16px/2 cursive',
+ 'small-caps bold 24px/1 sans-serif',
+ 'caption',
+]);
+
+</script>
diff --git a/testing/web-platform/tests/css/css-typed-om/the-stylepropertymap/properties/gap.html b/testing/web-platform/tests/css/css-typed-om/the-stylepropertymap/properties/gap.html
new file mode 100644
index 0000000000..20ff5816a7
--- /dev/null
+++ b/testing/web-platform/tests/css/css-typed-om/the-stylepropertymap/properties/gap.html
@@ -0,0 +1,40 @@
+<!doctype html>
+<meta charset="utf-8">
+<title>'*-gap' properties</title>
+<link rel="help" href="https://drafts.css-houdini.org/css-typed-om/#dom-stylepropertymapreadonly-get">
+<link rel="help" href="https://drafts.css-houdini.org/css-typed-om/#dom-stylepropertymap-set">
+<link rel="help" href="https://drafts.css-houdini.org/css-typed-om/#reify-stylevalue">
+<script src="/resources/testharness.js"></script>
+<script src="/resources/testharnessreport.js"></script>
+<script src="../../resources/testhelper.js"></script>
+<script src="resources/testsuite.js"></script>
+<body>
+<div id="log"></div>
+<script>
+'use strict';
+
+function assert_is_equal_with_clamping_percentage(input, result) {
+ const percent = input.to('percent').value;
+
+ if (percent < 0)
+ assert_style_value_equals(result, new CSSUnitValue(0, 'percent'));
+ else
+ assert_style_value_equals(result, new CSSUnitValue(percent, 'percent'));
+}
+
+for (const prefix of ['column', 'row']) {
+ runPropertyTests(`${prefix}-gap`, [
+ { syntax: 'normal' },
+ {
+ syntax: '<length>',
+ specified: assert_is_equal_with_range_handling
+ },
+ {
+ syntax: '<percentage>',
+ specified: assert_is_equal_with_range_handling,
+ computed: assert_is_equal_with_clamping_percentage
+ },
+ ]);
+}
+
+</script>
diff --git a/testing/web-platform/tests/css/css-typed-om/the-stylepropertymap/properties/grid-area.html b/testing/web-platform/tests/css/css-typed-om/the-stylepropertymap/properties/grid-area.html
new file mode 100644
index 0000000000..16ac4d517d
--- /dev/null
+++ b/testing/web-platform/tests/css/css-typed-om/the-stylepropertymap/properties/grid-area.html
@@ -0,0 +1,21 @@
+<!doctype html>
+<meta charset="utf-8">
+<title>'grid-area' property</title>
+<link rel="help" href="https://drafts.css-houdini.org/css-typed-om-1/#dom-stylepropertymap-get">
+<link rel="help" href="https://drafts.css-houdini.org/css-typed-om-1/#dom-stylepropertymap-set">
+<link rel="help" href="https://drafts.css-houdini.org/css-typed-om-1/#property-stle-value-normalization">
+<script src="/resources/testharness.js"></script>
+<script src="/resources/testharnessreport.js"></script>
+<script src="../../resources/testhelper.js"></script>
+<script src="resources/testsuite.js"></script>
+<body>
+<div id="log"></div>
+<script>
+'use strict';
+
+runUnsupportedPropertyTests('grid-area', [
+ 'a', 'a / a', 'auto', 'auto / auto', '2 / 1 / 2',
+ 'span 3', '2 span / a span'
+]);
+
+</script>
diff --git a/testing/web-platform/tests/css/css-typed-om/the-stylepropertymap/properties/grid-auto-columns-rows.html b/testing/web-platform/tests/css/css-typed-om/the-stylepropertymap/properties/grid-auto-columns-rows.html
new file mode 100644
index 0000000000..37fb103ba3
--- /dev/null
+++ b/testing/web-platform/tests/css/css-typed-om/the-stylepropertymap/properties/grid-auto-columns-rows.html
@@ -0,0 +1,49 @@
+<!doctype html>
+<meta charset="utf-8">
+<title>'grid-auto-columns' and 'grid-auto-rows' properties</title>
+<link rel="help" href="https://drafts.css-houdini.org/css-typed-om-1/#dom-stylepropertymap-get">
+<link rel="help" href="https://drafts.css-houdini.org/css-typed-om-1/#dom-stylepropertymap-set">
+<link rel="help" href="https://drafts.css-houdini.org/css-typed-om-1/#property-stle-value-normalization">
+<script src="/resources/testharness.js"></script>
+<script src="/resources/testharnessreport.js"></script>
+<script src="../../resources/testhelper.js"></script>
+<script src="resources/testsuite.js"></script>
+<body>
+<div id="log"></div>
+<script>
+'use strict';
+
+function assert_is_equal_with_clamping_percentage(input, result) {
+ const percent = input.to('percent').value;
+
+ if (percent < 0)
+ assert_style_value_equals(result, new CSSUnitValue(0, 'percent'));
+ else
+ assert_style_value_equals(result, new CSSUnitValue(percent, 'percent'));
+}
+
+// grid-auto-columns/rows are list-valued.
+// Run list-valued tests here too.
+for (const suffix of ['columns', 'rows']) {
+ runPropertyTests(`grid-auto-${suffix}`, [
+ { syntax: 'min-content' },
+ { syntax: 'max-content' },
+ { syntax: 'auto' },
+ {
+ syntax: '<length>',
+ specified: assert_is_equal_with_range_handling
+ },
+ {
+ syntax: '<percentage>',
+ specified: assert_is_equal_with_range_handling,
+ computed: assert_is_equal_with_clamping_percentage
+ },
+ { syntax: '<flex>' },
+ ]);
+
+ runUnsupportedPropertyTests(`grid-auto-${suffix}`, [
+ 'minmax(100px, auto)', 'fit-content(400px)'
+ ]);
+}
+
+</script>
diff --git a/testing/web-platform/tests/css/css-typed-om/the-stylepropertymap/properties/grid-auto-flow.html b/testing/web-platform/tests/css/css-typed-om/the-stylepropertymap/properties/grid-auto-flow.html
new file mode 100644
index 0000000000..d01d0257b3
--- /dev/null
+++ b/testing/web-platform/tests/css/css-typed-om/the-stylepropertymap/properties/grid-auto-flow.html
@@ -0,0 +1,25 @@
+<!doctype html>
+<meta charset="utf-8">
+<title>'grid-auto-flow' property</title>
+<link rel="help" href="https://drafts.css-houdini.org/css-typed-om-1/#dom-stylepropertymap-get">
+<link rel="help" href="https://drafts.css-houdini.org/css-typed-om-1/#dom-stylepropertymap-set">
+<link rel="help" href="https://drafts.css-houdini.org/css-typed-om-1/#property-stle-value-normalization">
+<script src="/resources/testharness.js"></script>
+<script src="/resources/testharnessreport.js"></script>
+<script src="../../resources/testhelper.js"></script>
+<script src="resources/testsuite.js"></script>
+<body>
+<div id="log"></div>
+<script>
+'use strict';
+
+runPropertyTests('grid-auto-flow', [
+ { syntax: 'row' },
+ { syntax: 'column' },
+]);
+
+runUnsupportedPropertyTests('grid-auto-flow', [
+ 'column dense',
+]);
+
+</script>
diff --git a/testing/web-platform/tests/css/css-typed-om/the-stylepropertymap/properties/grid-gap.html b/testing/web-platform/tests/css/css-typed-om/the-stylepropertymap/properties/grid-gap.html
new file mode 100644
index 0000000000..c4a41acf59
--- /dev/null
+++ b/testing/web-platform/tests/css/css-typed-om/the-stylepropertymap/properties/grid-gap.html
@@ -0,0 +1,20 @@
+<!doctype html>
+<meta charset="utf-8">
+<title>'grid-gap' property</title>
+<link rel="help" href="https://drafts.css-houdini.org/css-typed-om-1/#dom-stylepropertymap-get">
+<link rel="help" href="https://drafts.css-houdini.org/css-typed-om-1/#dom-stylepropertymap-set">
+<link rel="help" href="https://drafts.css-houdini.org/css-typed-om-1/#property-stle-value-normalization">
+<script src="/resources/testharness.js"></script>
+<script src="/resources/testharnessreport.js"></script>
+<script src="../../resources/testhelper.js"></script>
+<script src="resources/testsuite.js"></script>
+<body>
+<div id="log"></div>
+<script>
+'use strict';
+
+runUnsupportedPropertyTests('grid-gap', [
+ '20px', '16%', '20px 10px', '15% 100%', '21px 82%'
+]);
+
+</script>
diff --git a/testing/web-platform/tests/css/css-typed-om/the-stylepropertymap/properties/grid-start-end.html b/testing/web-platform/tests/css/css-typed-om/the-stylepropertymap/properties/grid-start-end.html
new file mode 100644
index 0000000000..baa48cfb70
--- /dev/null
+++ b/testing/web-platform/tests/css/css-typed-om/the-stylepropertymap/properties/grid-start-end.html
@@ -0,0 +1,28 @@
+<!doctype html>
+<meta charset="utf-8">
+<title>'grid-{row/column}-{start/end}' properties</title>
+<link rel="help" href="https://drafts.css-houdini.org/css-typed-om-1/#dom-stylepropertymap-get">
+<link rel="help" href="https://drafts.css-houdini.org/css-typed-om-1/#dom-stylepropertymap-set">
+<link rel="help" href="https://drafts.css-houdini.org/css-typed-om-1/#property-stle-value-normalization">
+<script src="/resources/testharness.js"></script>
+<script src="/resources/testharnessreport.js"></script>
+<script src="../../resources/testhelper.js"></script>
+<script src="resources/testsuite.js"></script>
+<body>
+<div id="log"></div>
+<script>
+'use strict';
+
+for (const orientation of ['row', 'column']) {
+ for (const suffix of ['start', 'end']) {
+ runPropertyTests(`grid-${orientation}-${suffix}`, [
+ { syntax: 'auto' },
+ ]);
+
+ runUnsupportedPropertyTests(`grid-${orientation}-${suffix}`, [
+ '3', 'span 2', '5 somegridarea span'
+ ]);
+ }
+}
+
+</script>
diff --git a/testing/web-platform/tests/css/css-typed-om/the-stylepropertymap/properties/grid-template-areas.html b/testing/web-platform/tests/css/css-typed-om/the-stylepropertymap/properties/grid-template-areas.html
new file mode 100644
index 0000000000..d367f8264b
--- /dev/null
+++ b/testing/web-platform/tests/css/css-typed-om/the-stylepropertymap/properties/grid-template-areas.html
@@ -0,0 +1,24 @@
+<!doctype html>
+<meta charset="utf-8">
+<title>'grid-template-areas' property</title>
+<link rel="help" href="https://drafts.css-houdini.org/css-typed-om-1/#dom-stylepropertymap-get">
+<link rel="help" href="https://drafts.css-houdini.org/css-typed-om-1/#dom-stylepropertymap-set">
+<link rel="help" href="https://drafts.css-houdini.org/css-typed-om-1/#property-stle-value-normalization">
+<script src="/resources/testharness.js"></script>
+<script src="/resources/testharnessreport.js"></script>
+<script src="../../resources/testhelper.js"></script>
+<script src="resources/testsuite.js"></script>
+<body>
+<div id="log"></div>
+<script>
+'use strict';
+
+runPropertyTests('grid-template-areas', [
+ { syntax: 'none' },
+]);
+
+runUnsupportedPropertyTests('grid-template-areas', [
+ '"a a a"', '"a a a" "b b b"',
+]);
+
+</script>
diff --git a/testing/web-platform/tests/css/css-typed-om/the-stylepropertymap/properties/grid-template-columns-rows.html b/testing/web-platform/tests/css/css-typed-om/the-stylepropertymap/properties/grid-template-columns-rows.html
new file mode 100644
index 0000000000..5a37d2befb
--- /dev/null
+++ b/testing/web-platform/tests/css/css-typed-om/the-stylepropertymap/properties/grid-template-columns-rows.html
@@ -0,0 +1,49 @@
+<!doctype html>
+<meta charset="utf-8">
+<title>'grid-template-columns' and 'grid-template-rows' properties</title>
+<link rel="help" href="https://drafts.css-houdini.org/css-typed-om-1/#dom-stylepropertymap-get">
+<link rel="help" href="https://drafts.css-houdini.org/css-typed-om-1/#dom-stylepropertymap-set">
+<link rel="help" href="https://drafts.css-houdini.org/css-typed-om-1/#property-stle-value-normalization">
+<script src="/resources/testharness.js"></script>
+<script src="/resources/testharnessreport.js"></script>
+<script src="../../resources/testhelper.js"></script>
+<script src="resources/testsuite.js"></script>
+<body>
+<div id="log"></div>
+<script>
+'use strict';
+
+function assert_is_equal_with_clamping_percentage(input, result) {
+ const percent = input.to('percent').value;
+
+ if (percent < 0)
+ assert_style_value_equals(result, new CSSUnitValue(0, 'percent'));
+ else
+ assert_style_value_equals(result, new CSSUnitValue(percent, 'percent'));
+}
+
+for (const suffix of ['columns', 'rows']) {
+ runPropertyTests(`grid-template-${suffix}`, [
+ { syntax: 'none' },
+ {
+ syntax: '<length>',
+ specified: assert_is_equal_with_range_handling
+ },
+ {
+ syntax: '<percentage>',
+ specified: assert_is_equal_with_range_handling,
+ computed: assert_is_equal_with_clamping_percentage
+ },
+ {
+ syntax: '<flex>',
+ specified: assert_is_equal_with_range_handling
+ }
+ ]);
+
+ runUnsupportedPropertyTests(`grid-template-${suffix}`, [
+ '[linename1] 100px [linename2 linename3]',
+ '200px repeat(auto-fill, 100px) 300px'
+ ]);
+}
+
+</script>
diff --git a/testing/web-platform/tests/css/css-typed-om/the-stylepropertymap/properties/grid-template.html b/testing/web-platform/tests/css/css-typed-om/the-stylepropertymap/properties/grid-template.html
new file mode 100644
index 0000000000..669b1bd92e
--- /dev/null
+++ b/testing/web-platform/tests/css/css-typed-om/the-stylepropertymap/properties/grid-template.html
@@ -0,0 +1,22 @@
+<!doctype html>
+<meta charset="utf-8">
+<title>'grid-template' property</title>
+<link rel="help" href="https://drafts.css-houdini.org/css-typed-om-1/#dom-stylepropertymap-get">
+<link rel="help" href="https://drafts.css-houdini.org/css-typed-om-1/#dom-stylepropertymap-set">
+<link rel="help" href="https://drafts.css-houdini.org/css-typed-om-1/#property-stle-value-normalization">
+<script src="/resources/testharness.js"></script>
+<script src="/resources/testharnessreport.js"></script>
+<script src="../../resources/testhelper.js"></script>
+<script src="resources/testsuite.js"></script>
+<body>
+<div id="log"></div>
+<script>
+'use strict';
+
+runUnsupportedPropertyTests('grid-template', [
+ 'none', '100px 1fr / 50px 1fr', '[linename] 100px / [columnname1] 30% [columname2] 70%',
+ 'fit-content(100px) / fit-content(40%)', '"a a a" "b b b"',
+ '[header-top] "a a a" [header-bottom] [main-top] "b b b" 1fr [main-bottom] / auto 1fr auto'
+]);
+
+</script>
diff --git a/testing/web-platform/tests/css/css-typed-om/the-stylepropertymap/properties/grid.html b/testing/web-platform/tests/css/css-typed-om/the-stylepropertymap/properties/grid.html
new file mode 100644
index 0000000000..e6e5148e9e
--- /dev/null
+++ b/testing/web-platform/tests/css/css-typed-om/the-stylepropertymap/properties/grid.html
@@ -0,0 +1,21 @@
+<!doctype html>
+<meta charset="utf-8">
+<title>'grid' property</title>
+<link rel="help" href="https://drafts.css-houdini.org/css-typed-om-1/#dom-stylepropertymap-get">
+<link rel="help" href="https://drafts.css-houdini.org/css-typed-om-1/#dom-stylepropertymap-set">
+<link rel="help" href="https://drafts.css-houdini.org/css-typed-om-1/#property-stle-value-normalization">
+<script src="/resources/testharness.js"></script>
+<script src="/resources/testharnessreport.js"></script>
+<script src="../../resources/testhelper.js"></script>
+<script src="resources/testsuite.js"></script>
+<body>
+<div id="log"></div>
+<script>
+'use strict';
+
+runUnsupportedPropertyTests('grid', [
+ 'auto-flow / 1fr 1fr 1fr', 'auto-flow dense / 40px 40px 1fr',
+ 'repeat(3, 80px) / auto-flow'
+]);
+
+</script>
diff --git a/testing/web-platform/tests/css/css-typed-om/the-stylepropertymap/properties/height.html b/testing/web-platform/tests/css/css-typed-om/the-stylepropertymap/properties/height.html
new file mode 100644
index 0000000000..51a520c7ff
--- /dev/null
+++ b/testing/web-platform/tests/css/css-typed-om/the-stylepropertymap/properties/height.html
@@ -0,0 +1,63 @@
+<!doctype html>
+<meta charset="utf-8">
+<title>'height' property</title>
+<link rel="help" href="https://drafts.css-houdini.org/css-typed-om-1/#dom-stylepropertymap-get">
+<link rel="help" href="https://drafts.css-houdini.org/css-typed-om-1/#dom-stylepropertymap-set">
+<link rel="help" href="https://drafts.css-houdini.org/css-typed-om-1/#property-stle-value-normalization">
+<script src="/resources/testharness.js"></script>
+<script src="/resources/testharnessreport.js"></script>
+<script src="../../resources/testhelper.js"></script>
+<script src="resources/testsuite.js"></script>
+<body>
+<div id="log"></div>
+<script>
+'use strict';
+
+function assert_is_equal_with_clamping_percentage(input, result) {
+ const percent = input.to('percent').value;
+
+ if (percent < 0)
+ assert_style_value_equals(result, new CSSUnitValue(0, 'percent'));
+ else
+ assert_style_value_equals(result, new CSSUnitValue(percent, 'percent'));
+}
+
+runPropertyTests('height', [
+ { syntax: 'auto' },
+ {
+ syntax: '<percentage>',
+ specified: assert_is_equal_with_range_handling,
+ computed: assert_is_equal_with_clamping_percentage
+ },
+ {
+ syntax: '<length>',
+ specified: assert_is_equal_with_range_handling
+ },
+]);
+
+runPropertyTests('min-height', [
+ {
+ syntax: '<percentage>',
+ specified: assert_is_equal_with_range_handling,
+ computed: assert_is_equal_with_clamping_percentage
+ },
+ {
+ syntax: '<length>',
+ specified: assert_is_equal_with_range_handling
+ },
+]);
+
+runPropertyTests('max-height', [
+ { syntax: 'none' },
+ {
+ syntax: '<percentage>',
+ specified: assert_is_equal_with_range_handling,
+ computed: assert_is_equal_with_clamping_percentage
+ },
+ {
+ syntax: '<length>',
+ specified: assert_is_equal_with_range_handling
+ },
+]);
+
+</script>
diff --git a/testing/web-platform/tests/css/css-typed-om/the-stylepropertymap/properties/hyphens.html b/testing/web-platform/tests/css/css-typed-om/the-stylepropertymap/properties/hyphens.html
new file mode 100644
index 0000000000..cbbcd0c93f
--- /dev/null
+++ b/testing/web-platform/tests/css/css-typed-om/the-stylepropertymap/properties/hyphens.html
@@ -0,0 +1,22 @@
+<!doctype html>
+<meta charset="utf-8">
+<title>'hyphens' property</title>
+<link rel="help" href="https://drafts.css-houdini.org/css-typed-om-1/#dom-stylepropertymap-get">
+<link rel="help" href="https://drafts.css-houdini.org/css-typed-om-1/#dom-stylepropertymap-set">
+<link rel="help" href="https://drafts.css-houdini.org/css-typed-om-1/#property-stle-value-normalization">
+<script src="/resources/testharness.js"></script>
+<script src="/resources/testharnessreport.js"></script>
+<script src="../../resources/testhelper.js"></script>
+<script src="resources/testsuite.js"></script>
+<body>
+<div id="log"></div>
+<script>
+'use strict';
+
+runPropertyTests('hyphens', [
+ { syntax: 'none' },
+ { syntax: 'manual' },
+ { syntax: 'auto' }
+]);
+
+</script>
diff --git a/testing/web-platform/tests/css/css-typed-om/the-stylepropertymap/properties/image-rendering.html b/testing/web-platform/tests/css/css-typed-om/the-stylepropertymap/properties/image-rendering.html
new file mode 100644
index 0000000000..c96aa9b370
--- /dev/null
+++ b/testing/web-platform/tests/css/css-typed-om/the-stylepropertymap/properties/image-rendering.html
@@ -0,0 +1,24 @@
+<!doctype html>
+<meta charset="utf-8">
+<title>'image-rendering' property</title>
+<link rel="help" href="https://drafts.css-houdini.org/css-typed-om-1/#dom-stylepropertymap-get">
+<link rel="help" href="https://drafts.css-houdini.org/css-typed-om-1/#dom-stylepropertymap-set">
+<link rel="help" href="https://drafts.css-houdini.org/css-typed-om-1/#property-stle-value-normalization">
+<script src="/resources/testharness.js"></script>
+<script src="/resources/testharnessreport.js"></script>
+<script src="../../resources/testhelper.js"></script>
+<script src="resources/testsuite.js"></script>
+<body>
+<div id="log"></div>
+<script>
+'use strict';
+
+runPropertyTests('image-rendering', [
+ { syntax: 'auto' },
+ { syntax: 'smooth' },
+ { syntax: 'high-quality' },
+ { syntax: 'crisp-edges' },
+ { syntax: 'pixelated' },
+]);
+
+</script>
diff --git a/testing/web-platform/tests/css/css-typed-om/the-stylepropertymap/properties/inline-size.html b/testing/web-platform/tests/css/css-typed-om/the-stylepropertymap/properties/inline-size.html
new file mode 100644
index 0000000000..ba3b07d411
--- /dev/null
+++ b/testing/web-platform/tests/css/css-typed-om/the-stylepropertymap/properties/inline-size.html
@@ -0,0 +1,63 @@
+<!doctype html>
+<meta charset="utf-8">
+<title>'inline-size' property</title>
+<link rel="help" href="https://drafts.css-houdini.org/css-typed-om-1/#dom-stylepropertymap-get">
+<link rel="help" href="https://drafts.css-houdini.org/css-typed-om-1/#dom-stylepropertymap-set">
+<link rel="help" href="https://drafts.css-houdini.org/css-typed-om-1/#property-stle-value-normalization">
+<script src="/resources/testharness.js"></script>
+<script src="/resources/testharnessreport.js"></script>
+<script src="../../resources/testhelper.js"></script>
+<script src="resources/testsuite.js"></script>
+<body>
+<div id="log"></div>
+<script>
+'use strict';
+
+function assert_is_equal_with_clamping_percentage(input, result) {
+ const percent = input.to('percent').value;
+
+ if (percent < 0)
+ assert_style_value_equals(result, new CSSUnitValue(0, 'percent'));
+ else
+ assert_style_value_equals(result, new CSSUnitValue(percent, 'percent'));
+}
+
+runPropertyTests('inline-size', [
+ { syntax: 'auto' },
+ {
+ syntax: '<percentage>',
+ specified: assert_is_equal_with_range_handling,
+ computed: assert_is_equal_with_clamping_percentage
+ },
+ {
+ syntax: '<length>',
+ specified: assert_is_equal_with_range_handling
+ },
+]);
+
+runPropertyTests('min-inline-size', [
+ {
+ syntax: '<percentage>',
+ specified: assert_is_equal_with_range_handling,
+ computed: assert_is_equal_with_clamping_percentage
+ },
+ {
+ syntax: '<length>',
+ specified: assert_is_equal_with_range_handling
+ },
+]);
+
+runPropertyTests('max-inline-size', [
+ { syntax: 'none' },
+ {
+ syntax: '<percentage>',
+ specified: assert_is_equal_with_range_handling,
+ computed: assert_is_equal_with_clamping_percentage
+ },
+ {
+ syntax: '<length>',
+ specified: assert_is_equal_with_range_handling
+ },
+]);
+
+</script>
diff --git a/testing/web-platform/tests/css/css-typed-om/the-stylepropertymap/properties/isolation.html b/testing/web-platform/tests/css/css-typed-om/the-stylepropertymap/properties/isolation.html
new file mode 100644
index 0000000000..85f5749f94
--- /dev/null
+++ b/testing/web-platform/tests/css/css-typed-om/the-stylepropertymap/properties/isolation.html
@@ -0,0 +1,21 @@
+<!doctype html>
+<meta charset="utf-8">
+<title>'isolation' property</title>
+<link rel="help" href="https://drafts.css-houdini.org/css-typed-om-1/#dom-stylepropertymap-get">
+<link rel="help" href="https://drafts.css-houdini.org/css-typed-om-1/#dom-stylepropertymap-set">
+<link rel="help" href="https://drafts.css-houdini.org/css-typed-om-1/#property-stle-value-normalization">
+<script src="/resources/testharness.js"></script>
+<script src="/resources/testharnessreport.js"></script>
+<script src="../../resources/testhelper.js"></script>
+<script src="resources/testsuite.js"></script>
+<body>
+<div id="log"></div>
+<script>
+'use strict';
+
+runPropertyTests('isolation', [
+ { syntax: 'auto' },
+ { syntax: 'isolate' },
+]);
+
+</script>
diff --git a/testing/web-platform/tests/css/css-typed-om/the-stylepropertymap/properties/left.html b/testing/web-platform/tests/css/css-typed-om/the-stylepropertymap/properties/left.html
new file mode 100644
index 0000000000..6e82d2eeb7
--- /dev/null
+++ b/testing/web-platform/tests/css/css-typed-om/the-stylepropertymap/properties/left.html
@@ -0,0 +1,22 @@
+<!doctype html>
+<meta charset="utf-8">
+<title>'left' property</title>
+<link rel="help" href="https://drafts.css-houdini.org/css-typed-om-1/#dom-stylepropertymap-get">
+<link rel="help" href="https://drafts.css-houdini.org/css-typed-om-1/#dom-stylepropertymap-set">
+<link rel="help" href="https://drafts.css-houdini.org/css-typed-om-1/#property-stle-value-normalization">
+<script src="/resources/testharness.js"></script>
+<script src="/resources/testharnessreport.js"></script>
+<script src="../../resources/testhelper.js"></script>
+<script src="resources/testsuite.js"></script>
+<body>
+<div id="log"></div>
+<script>
+'use strict';
+
+runPropertyTests('left', [
+ { syntax: 'auto' },
+ { syntax: '<percentage>' },
+ { syntax: '<length>' },
+]);
+
+</script>
diff --git a/testing/web-platform/tests/css/css-typed-om/the-stylepropertymap/properties/letter-spacing.html b/testing/web-platform/tests/css/css-typed-om/the-stylepropertymap/properties/letter-spacing.html
new file mode 100644
index 0000000000..9d313c1395
--- /dev/null
+++ b/testing/web-platform/tests/css/css-typed-om/the-stylepropertymap/properties/letter-spacing.html
@@ -0,0 +1,40 @@
+<!doctype html>
+<meta charset="utf-8">
+<title>'letter-spacing' property</title>
+<link rel="help" href="https://drafts.css-houdini.org/css-typed-om-1/#dom-stylepropertymap-get">
+<link rel="help" href="https://drafts.css-houdini.org/css-typed-om-1/#dom-stylepropertymap-set">
+<link rel="help" href="https://drafts.css-houdini.org/css-typed-om-1/#property-stle-value-normalization">
+<script src="/resources/testharness.js"></script>
+<script src="/resources/testharnessreport.js"></script>
+<script src="../../resources/testhelper.js"></script>
+<script src="resources/testsuite.js"></script>
+<body>
+<div id="log"></div>
+<script>
+'use strict';
+
+function assert_is_equal_with_zero_special_handling(input, result) {
+ let is_zero_length = true;
+ if (input instanceof CSSMathSum) {
+ for (let operand of input.values)
+ is_zero_length &&= (operand.value == 0);
+ } else
+ is_zero_length = input.value == 0;
+
+ // Per the specification, a computed letter-spacing of zero yields a resolved value (getComputedStyle()
+ // return value) of normal.
+ if (is_zero_length)
+ assert_style_value_equals(result, new CSSKeywordValue("normal"));
+ else
+ assert_is_unit('px', result); // Same check as in testsuite.js
+}
+
+runPropertyTests('letter-spacing', [
+ { syntax: 'normal' },
+ {
+ syntax: '<length>',
+ computed: assert_is_equal_with_zero_special_handling
+ },
+]);
+
+</script>
diff --git a/testing/web-platform/tests/css/css-typed-om/the-stylepropertymap/properties/lighting-color.html b/testing/web-platform/tests/css/css-typed-om/the-stylepropertymap/properties/lighting-color.html
new file mode 100644
index 0000000000..aec1643372
--- /dev/null
+++ b/testing/web-platform/tests/css/css-typed-om/the-stylepropertymap/properties/lighting-color.html
@@ -0,0 +1,30 @@
+<!doctype html>
+<meta charset="utf-8">
+<title>'lighting-color' property</title>
+<link rel="help" href="https://drafts.css-houdini.org/css-typed-om-1/#dom-stylepropertymap-get">
+<link rel="help" href="https://drafts.css-houdini.org/css-typed-om-1/#dom-stylepropertymap-set">
+<link rel="help" href="https://drafts.css-houdini.org/css-typed-om-1/#property-stle-value-normalization">
+<script src="/resources/testharness.js"></script>
+<script src="/resources/testharnessreport.js"></script>
+<script src="../../resources/testhelper.js"></script>
+<script src="resources/testsuite.js"></script>
+<body>
+<div id="log"></div>
+<script>
+'use strict';
+
+runPropertyTests('lighting-color', [
+ {
+ syntax: 'currentcolor',
+ // computes to a <color>, which is not supported in level 1
+ computed: (_, result) => assert_class_string(result, 'CSSStyleValue')
+ }
+]);
+
+// <color>s are not supported in level 1
+runUnsupportedPropertyTests('lighting-color', [
+ 'red', '#bbff00', 'rgb(255, 255, 128)', 'hsl(50, 33%, 25%)',
+ 'transparent'
+]);
+
+</script>
diff --git a/testing/web-platform/tests/css/css-typed-om/the-stylepropertymap/properties/line-break.html b/testing/web-platform/tests/css/css-typed-om/the-stylepropertymap/properties/line-break.html
new file mode 100644
index 0000000000..481a9e97fe
--- /dev/null
+++ b/testing/web-platform/tests/css/css-typed-om/the-stylepropertymap/properties/line-break.html
@@ -0,0 +1,24 @@
+<!doctype html>
+<meta charset="utf-8">
+<title>'line-break' property</title>
+<link rel="help" href="https://drafts.css-houdini.org/css-typed-om-1/#dom-stylepropertymap-get">
+<link rel="help" href="https://drafts.css-houdini.org/css-typed-om-1/#dom-stylepropertymap-set">
+<link rel="help" href="https://drafts.css-houdini.org/css-typed-om-1/#property-stle-value-normalization">
+<script src="/resources/testharness.js"></script>
+<script src="/resources/testharnessreport.js"></script>
+<script src="../../resources/testhelper.js"></script>
+<script src="resources/testsuite.js"></script>
+<body>
+<div id="log"></div>
+<script>
+'use strict';
+
+runPropertyTests('line-break', [
+ { syntax: 'auto' },
+ { syntax: 'loose' },
+ { syntax: 'normal' },
+ { syntax: 'strict' },
+ { syntax: 'anywhere' },
+]);
+
+</script>
diff --git a/testing/web-platform/tests/css/css-typed-om/the-stylepropertymap/properties/line-height.html b/testing/web-platform/tests/css/css-typed-om/the-stylepropertymap/properties/line-height.html
new file mode 100644
index 0000000000..c09c404617
--- /dev/null
+++ b/testing/web-platform/tests/css/css-typed-om/the-stylepropertymap/properties/line-height.html
@@ -0,0 +1,35 @@
+<!doctype html>
+<meta charset="utf-8">
+<title>'line-height' property</title>
+<link rel="help" href="https://drafts.css-houdini.org/css-typed-om-1/#dom-stylepropertymap-get">
+<link rel="help" href="https://drafts.css-houdini.org/css-typed-om-1/#dom-stylepropertymap-set">
+<link rel="help" href="https://drafts.css-houdini.org/css-typed-om-1/#property-stle-value-normalization">
+<script src="/resources/testharness.js"></script>
+<script src="/resources/testharnessreport.js"></script>
+<script src="../../resources/testhelper.js"></script>
+<script src="resources/testsuite.js"></script>
+<body>
+<div id="log"></div>
+<script>
+'use strict';
+
+runPropertyTests('line-height', [
+ { syntax: 'normal' },
+ {
+ syntax: '<length>',
+ specified: assert_is_equal_with_range_handling,
+ computed: (_, result) => assert_is_unit('px', result)
+ },
+ {
+ syntax: '<number>',
+ specified: assert_is_equal_with_range_handling,
+ computed: (_, result) => assert_is_unit('number', result)
+ },
+ {
+ syntax: '<percentage>',
+ specified: assert_is_equal_with_range_handling,
+ computed: (_, result) => assert_is_unit('px', result)
+ },
+]);
+
+</script>
diff --git a/testing/web-platform/tests/css/css-typed-om/the-stylepropertymap/properties/list-style-image.html b/testing/web-platform/tests/css/css-typed-om/the-stylepropertymap/properties/list-style-image.html
new file mode 100644
index 0000000000..a7f8850972
--- /dev/null
+++ b/testing/web-platform/tests/css/css-typed-om/the-stylepropertymap/properties/list-style-image.html
@@ -0,0 +1,21 @@
+<!doctype html>
+<meta charset="utf-8">
+<title>'list-style-image' property</title>
+<link rel="help" href="https://drafts.css-houdini.org/css-typed-om-1/#dom-stylepropertymap-get">
+<link rel="help" href="https://drafts.css-houdini.org/css-typed-om-1/#dom-stylepropertymap-set">
+<link rel="help" href="https://drafts.css-houdini.org/css-typed-om-1/#property-stle-value-normalization">
+<script src="/resources/testharness.js"></script>
+<script src="/resources/testharnessreport.js"></script>
+<script src="../../resources/testhelper.js"></script>
+<script src="resources/testsuite.js"></script>
+<body>
+<div id="log"></div>
+<script>
+'use strict';
+
+runPropertyTests('list-style-image', [
+ { syntax: 'none' },
+ { syntax: '<image>' },
+]);
+
+</script>
diff --git a/testing/web-platform/tests/css/css-typed-om/the-stylepropertymap/properties/list-style-position.html b/testing/web-platform/tests/css/css-typed-om/the-stylepropertymap/properties/list-style-position.html
new file mode 100644
index 0000000000..3c6724fcb6
--- /dev/null
+++ b/testing/web-platform/tests/css/css-typed-om/the-stylepropertymap/properties/list-style-position.html
@@ -0,0 +1,21 @@
+<!doctype html>
+<meta charset="utf-8">
+<title>'list-style-position' property</title>
+<link rel="help" href="https://drafts.css-houdini.org/css-typed-om-1/#dom-stylepropertymap-get">
+<link rel="help" href="https://drafts.css-houdini.org/css-typed-om-1/#dom-stylepropertymap-set">
+<link rel="help" href="https://drafts.css-houdini.org/css-typed-om-1/#property-stle-value-normalization">
+<script src="/resources/testharness.js"></script>
+<script src="/resources/testharnessreport.js"></script>
+<script src="../../resources/testhelper.js"></script>
+<script src="resources/testsuite.js"></script>
+<body>
+<div id="log"></div>
+<script>
+'use strict';
+
+runPropertyTests('list-style-position', [
+ { syntax: 'inside' },
+ { syntax: 'outside' },
+]);
+
+</script>
diff --git a/testing/web-platform/tests/css/css-typed-om/the-stylepropertymap/properties/list-style-type.html b/testing/web-platform/tests/css/css-typed-om/the-stylepropertymap/properties/list-style-type.html
new file mode 100644
index 0000000000..61e75407b3
--- /dev/null
+++ b/testing/web-platform/tests/css/css-typed-om/the-stylepropertymap/properties/list-style-type.html
@@ -0,0 +1,27 @@
+<!doctype html>
+<meta charset="utf-8">
+<title>'list-style-type' property</title>
+<link rel="help" href="https://drafts.css-houdini.org/css-typed-om-1/#dom-stylepropertymap-get">
+<link rel="help" href="https://drafts.css-houdini.org/css-typed-om-1/#dom-stylepropertymap-set">
+<link rel="help" href="https://drafts.css-houdini.org/css-typed-om-1/#property-stle-value-normalization">
+<script src="/resources/testharness.js"></script>
+<script src="/resources/testharnessreport.js"></script>
+<script src="../../resources/testhelper.js"></script>
+<script src="resources/testsuite.js"></script>
+<body>
+<div id="log"></div>
+<script>
+'use strict';
+
+runPropertyTests('list-style-type', [
+ { syntax: 'none' },
+ // FIXME: This should be <custom-ident>, but the test harness doesn't
+ // currently support it.
+ { syntax: 'custom-ident' },
+]);
+
+runUnsupportedPropertyTests('list-style-type', [
+ '"Note: "', 'symbols("*" "A" "B" "C")'
+]);
+
+</script>
diff --git a/testing/web-platform/tests/css/css-typed-om/the-stylepropertymap/properties/logical.html b/testing/web-platform/tests/css/css-typed-om/the-stylepropertymap/properties/logical.html
new file mode 100644
index 0000000000..2e451d6aa9
--- /dev/null
+++ b/testing/web-platform/tests/css/css-typed-om/the-stylepropertymap/properties/logical.html
@@ -0,0 +1,105 @@
+<!doctype html>
+<meta charset="utf-8">
+<title>logical margin, inset, padding & border properties</title>
+<link rel="help" href="https://drafts.css-houdini.org/css-typed-om-1/#dom-stylepropertymap-get">
+<link rel="help" href="https://drafts.css-houdini.org/css-typed-om-1/#dom-stylepropertymap-set">
+<link rel="help" href="https://drafts.css-houdini.org/css-typed-om-1/#property-stle-value-normalization">
+<script src="/resources/testharness.js"></script>
+<script src="/resources/testharnessreport.js"></script>
+<script src="../../resources/testhelper.js"></script>
+<script src="resources/testsuite.js"></script>
+<body>
+<div id="log"></div>
+<script>
+'use strict';
+
+function assert_is_equal_with_clamping_percentage(input, result) {
+ const percent = input.to('percent').value;
+
+ if (percent < 0)
+ assert_style_value_equals(result, new CSSUnitValue(0, 'percent'));
+ else
+ assert_style_value_equals(result, new CSSUnitValue(percent, 'percent'));
+}
+
+const logical = {
+ axes: ['block', 'inline'],
+ sides: ['block-start', 'block-end', 'inline-start', 'inline-end'],
+ corners: ['start-start', 'start-end', 'end-start', 'end-end'],
+};
+
+for (const side of [...logical.sides, ...logical.axes]) {
+ runPropertyTests('margin-' + side, [
+ // TODO: Test 'auto'
+ { syntax: '<percentage>' },
+ { syntax: '<length>' }
+ ]);
+}
+
+for (const side of [...logical.sides, ...logical.axes]) {
+ runPropertyTests('padding-' + side, [
+ // TODO: Test 'auto'
+ {
+ syntax: '<percentage>',
+ specified: assert_is_equal_with_range_handling,
+ computed: assert_is_equal_with_clamping_percentage
+ },
+ {
+ syntax: '<length>',
+ specified: assert_is_equal_with_range_handling
+ },
+ ]);
+}
+
+for (const side of [...logical.sides, ...logical.axes]) {
+ runPropertyTests('inset-' + side, [
+ // TODO: Test 'auto'
+ { syntax: '<percentage>' },
+ { syntax: '<length>' }
+ ]);
+}
+
+// BORDERS
+for (const side of [...logical.sides, ...logical.axes]) {
+ runPropertyTests('border-' + side, [
+ //{ syntax: 'thin solid green' },
+ //{ syntax: 'thin solid' },
+ //{ syntax: 'thick' },
+ { syntax: 'none' },
+ ]);
+
+ runPropertyTests(`border-${side}-width`, [
+ { syntax: 'thin' },
+ { syntax: 'medium' },
+ { syntax: 'thick' },
+ {
+ syntax: '<length>',
+ specified: assert_is_equal_with_range_handling
+ },
+ ]);
+
+ runPropertyTests(`border-${side}-color`, [
+ { syntax: 'currentcolor' },
+ //{ syntax: '<color>' },
+ ]);
+
+ runPropertyTests(`border-${side}-style`, [
+ { syntax: 'none' },
+ { syntax: 'solid' },
+ ]);
+}
+
+// border radius
+for (const side of logical.corners) {
+ runPropertyTests(`border-${side}-radius`, [
+ {
+ syntax: '<percentage>',
+ specified: assert_is_equal_with_range_handling
+ },
+ {
+ syntax: '<length>',
+ specified: assert_is_equal_with_range_handling
+ },
+ ]);
+}
+</script>
diff --git a/testing/web-platform/tests/css/css-typed-om/the-stylepropertymap/properties/margin.html b/testing/web-platform/tests/css/css-typed-om/the-stylepropertymap/properties/margin.html
new file mode 100644
index 0000000000..3ad126eaf1
--- /dev/null
+++ b/testing/web-platform/tests/css/css-typed-om/the-stylepropertymap/properties/margin.html
@@ -0,0 +1,35 @@
+<!doctype html>
+<meta charset="utf-8">
+<title>margin properties</title>
+<link rel="help" href="https://drafts.css-houdini.org/css-typed-om-1/#dom-stylepropertymap-get">
+<link rel="help" href="https://drafts.css-houdini.org/css-typed-om-1/#dom-stylepropertymap-set">
+<link rel="help" href="https://drafts.css-houdini.org/css-typed-om-1/#property-stle-value-normalization">
+<script src="/resources/testharness.js"></script>
+<script src="/resources/testharnessreport.js"></script>
+<script src="../../resources/testhelper.js"></script>
+<script src="resources/testsuite.js"></script>
+<body>
+<div id="log"></div>
+<script>
+'use strict';
+
+for (const suffix of ['top', 'left', 'right', 'bottom']) {
+ runPropertyTests('margin-' + suffix, [
+ {
+ syntax: 'auto',
+ // Depending on which CSS spec is implemented, the computed value
+ // can be 'auto' or a browser specific value.
+ // FIXME: Figure out how to test this.
+ computed: () => {}
+ },
+ { syntax: '<percentage>' },
+ { syntax: '<length>' },
+ ]);
+}
+
+runPropertyTests('margin', []);
+runUnsupportedPropertyTests('margin',
+ ['1px', '1px 2px 3px 4px']
+);
+
+</script>
diff --git a/testing/web-platform/tests/css/css-typed-om/the-stylepropertymap/properties/marker.html b/testing/web-platform/tests/css/css-typed-om/the-stylepropertymap/properties/marker.html
new file mode 100644
index 0000000000..9b264613c8
--- /dev/null
+++ b/testing/web-platform/tests/css/css-typed-om/the-stylepropertymap/properties/marker.html
@@ -0,0 +1,27 @@
+<!doctype html>
+<meta charset="utf-8">
+<title>'marker-*' properties</title>
+<link rel="help" href="https://drafts.css-houdini.org/css-typed-om-1/#dom-stylepropertymap-get">
+<link rel="help" href="https://drafts.css-houdini.org/css-typed-om-1/#dom-stylepropertymap-set">
+<link rel="help" href="https://drafts.css-houdini.org/css-typed-om-1/#property-stle-value-normalization">
+<script src="/resources/testharness.js"></script>
+<script src="/resources/testharnessreport.js"></script>
+<script src="../../resources/testhelper.js"></script>
+<script src="resources/testsuite.js"></script>
+<body>
+<div id="log"></div>
+<script>
+'use strict';
+
+runUnsupportedPropertyTests('marker', [
+ 'none', 'url(#m1)'
+]);
+
+for (const suffix of ['start', 'mid', 'end']) {
+ runPropertyTests(`marker-${suffix}`, [
+ { syntax: 'none' },
+ { syntax: '<url>' },
+ ]);
+}
+
+</script>
diff --git a/testing/web-platform/tests/css/css-typed-om/the-stylepropertymap/properties/mask-image.html b/testing/web-platform/tests/css/css-typed-om/the-stylepropertymap/properties/mask-image.html
new file mode 100644
index 0000000000..aa858d2e46
--- /dev/null
+++ b/testing/web-platform/tests/css/css-typed-om/the-stylepropertymap/properties/mask-image.html
@@ -0,0 +1,21 @@
+<!doctype html>
+<meta charset="utf-8">
+<title>'mask-image' property</title>
+<link rel="help" href="https://drafts.css-houdini.org/css-typed-om-1/#dom-stylepropertymap-get">
+<link rel="help" href="https://drafts.css-houdini.org/css-typed-om-1/#dom-stylepropertymap-set">
+<link rel="help" href="https://drafts.css-houdini.org/css-typed-om-1/#property-stle-value-normalization">
+<script src="/resources/testharness.js"></script>
+<script src="/resources/testharnessreport.js"></script>
+<script src="../../resources/testhelper.js"></script>
+<script src="resources/testsuite.js"></script>
+<body>
+<div id="log"></div>
+<script>
+'use strict';
+
+runListValuedPropertyTests('mask-image', [
+ { syntax: 'none' },
+ { syntax: '<image>' },
+]);
+
+</script>
diff --git a/testing/web-platform/tests/css/css-typed-om/the-stylepropertymap/properties/mask-type.html b/testing/web-platform/tests/css/css-typed-om/the-stylepropertymap/properties/mask-type.html
new file mode 100644
index 0000000000..35e81fb81c
--- /dev/null
+++ b/testing/web-platform/tests/css/css-typed-om/the-stylepropertymap/properties/mask-type.html
@@ -0,0 +1,21 @@
+<!doctype html>
+<meta charset="utf-8">
+<title>'mask-type' property</title>
+<link rel="help" href="https://drafts.css-houdini.org/css-typed-om-1/#dom-stylepropertymap-get">
+<link rel="help" href="https://drafts.css-houdini.org/css-typed-om-1/#dom-stylepropertymap-set">
+<link rel="help" href="https://drafts.css-houdini.org/css-typed-om-1/#property-stle-value-normalization">
+<script src="/resources/testharness.js"></script>
+<script src="/resources/testharnessreport.js"></script>
+<script src="../../resources/testhelper.js"></script>
+<script src="resources/testsuite.js"></script>
+<body>
+<div id="log"></div>
+<script>
+'use strict';
+
+runPropertyTests('mask-type', [
+ { syntax: 'luminance' },
+ { syntax: 'alpha' },
+]);
+
+</script>
diff --git a/testing/web-platform/tests/css/css-typed-om/the-stylepropertymap/properties/mask.html b/testing/web-platform/tests/css/css-typed-om/the-stylepropertymap/properties/mask.html
new file mode 100644
index 0000000000..bfdc4c4fd3
--- /dev/null
+++ b/testing/web-platform/tests/css/css-typed-om/the-stylepropertymap/properties/mask.html
@@ -0,0 +1,20 @@
+<!doctype html>
+<meta charset="utf-8">
+<title>'mask' property</title>
+<link rel="help" href="https://drafts.css-houdini.org/css-typed-om-1/#dom-stylepropertymap-get">
+<link rel="help" href="https://drafts.css-houdini.org/css-typed-om-1/#dom-stylepropertymap-set">
+<link rel="help" href="https://drafts.css-houdini.org/css-typed-om-1/#property-stle-value-normalization">
+<script src="/resources/testharness.js"></script>
+<script src="/resources/testharnessreport.js"></script>
+<script src="../../resources/testhelper.js"></script>
+<script src="resources/testsuite.js"></script>
+<body>
+<div id="log"></div>
+<script>
+'use strict';
+
+runUnsupportedPropertyTests('mask', [
+ 'none', 'url(mask.png)'
+]);
+
+</script>
diff --git a/testing/web-platform/tests/css/css-typed-om/the-stylepropertymap/properties/mix-blend-mode.html b/testing/web-platform/tests/css/css-typed-om/the-stylepropertymap/properties/mix-blend-mode.html
new file mode 100644
index 0000000000..5509d87813
--- /dev/null
+++ b/testing/web-platform/tests/css/css-typed-om/the-stylepropertymap/properties/mix-blend-mode.html
@@ -0,0 +1,35 @@
+<!doctype html>
+<meta charset="utf-8">
+<title>'mix-blend-mode' property</title>
+<link rel="help" href="https://drafts.css-houdini.org/css-typed-om-1/#dom-stylepropertymap-get">
+<link rel="help" href="https://drafts.css-houdini.org/css-typed-om-1/#dom-stylepropertymap-set">
+<link rel="help" href="https://drafts.css-houdini.org/css-typed-om-1/#property-stle-value-normalization">
+<script src="/resources/testharness.js"></script>
+<script src="/resources/testharnessreport.js"></script>
+<script src="../../resources/testhelper.js"></script>
+<script src="resources/testsuite.js"></script>
+<body>
+<div id="log"></div>
+<script>
+'use strict';
+
+runPropertyTests('mix-blend-mode', [
+ { syntax: 'normal' },
+ { syntax: 'multiply' },
+ { syntax: 'screen' },
+ { syntax: 'overlay' },
+ { syntax: 'darken' },
+ { syntax: 'lighten' },
+ { syntax: 'color-dodge' },
+ { syntax: 'color-burn' },
+ { syntax: 'hard-light' },
+ { syntax: 'soft-light' },
+ { syntax: 'difference' },
+ { syntax: 'exclusion' },
+ { syntax: 'hue' },
+ { syntax: 'saturation' },
+ { syntax: 'color' },
+ { syntax: 'luminosity' },
+]);
+
+</script>
diff --git a/testing/web-platform/tests/css/css-typed-om/the-stylepropertymap/properties/object-fit.html b/testing/web-platform/tests/css/css-typed-om/the-stylepropertymap/properties/object-fit.html
new file mode 100644
index 0000000000..1d1ee0afd1
--- /dev/null
+++ b/testing/web-platform/tests/css/css-typed-om/the-stylepropertymap/properties/object-fit.html
@@ -0,0 +1,24 @@
+<!doctype html>
+<meta charset="utf-8">
+<title>'object-fit' property</title>
+<link rel="help" href="https://drafts.css-houdini.org/css-typed-om-1/#dom-stylepropertymap-get">
+<link rel="help" href="https://drafts.css-houdini.org/css-typed-om-1/#dom-stylepropertymap-set">
+<link rel="help" href="https://drafts.css-houdini.org/css-typed-om-1/#property-stle-value-normalization">
+<script src="/resources/testharness.js"></script>
+<script src="/resources/testharnessreport.js"></script>
+<script src="../../resources/testhelper.js"></script>
+<script src="resources/testsuite.js"></script>
+<body>
+<div id="log"></div>
+<script>
+'use strict';
+
+runPropertyTests('object-fit', [
+ { syntax: 'fill' },
+ { syntax: 'contain' },
+ { syntax: 'cover' },
+ { syntax: 'none' },
+ { syntax: 'scale-down' },
+]);
+
+</script>
diff --git a/testing/web-platform/tests/css/css-typed-om/the-stylepropertymap/properties/object-position.html b/testing/web-platform/tests/css/css-typed-om/the-stylepropertymap/properties/object-position.html
new file mode 100644
index 0000000000..0dd30e9015
--- /dev/null
+++ b/testing/web-platform/tests/css/css-typed-om/the-stylepropertymap/properties/object-position.html
@@ -0,0 +1,20 @@
+<!doctype html>
+<meta charset="utf-8">
+<title>'object-position' property</title>
+<link rel="help" href="https://drafts.css-houdini.org/css-typed-om-1/#dom-stylepropertymap-get">
+<link rel="help" href="https://drafts.css-houdini.org/css-typed-om-1/#dom-stylepropertymap-set">
+<link rel="help" href="https://drafts.css-houdini.org/css-typed-om-1/#property-stle-value-normalization">
+<script src="/resources/testharness.js"></script>
+<script src="/resources/testharnessreport.js"></script>
+<script src="../../resources/testhelper.js"></script>
+<script src="resources/testsuite.js"></script>
+<body>
+<div id="log"></div>
+<script>
+'use strict';
+
+runPropertyTests('object-position', [
+ { syntax: '<position>' },
+]);
+
+</script>
diff --git a/testing/web-platform/tests/css/css-typed-om/the-stylepropertymap/properties/offset-anchor.html b/testing/web-platform/tests/css/css-typed-om/the-stylepropertymap/properties/offset-anchor.html
new file mode 100644
index 0000000000..590e9eb776
--- /dev/null
+++ b/testing/web-platform/tests/css/css-typed-om/the-stylepropertymap/properties/offset-anchor.html
@@ -0,0 +1,20 @@
+<meta charset="utf-8">
+<title>'offset-anchor' property</title>
+<link rel="help" href="https://drafts.css-houdini.org/css-typed-om-1/#dom-stylepropertymap-get">
+<link rel="help" href="https://drafts.css-houdini.org/css-typed-om-1/#dom-stylepropertymap-set">
+<link rel="help" href="https://drafts.css-houdini.org/css-typed-om-1/#property-stle-value-normalization">
+<script src="/resources/testharness.js"></script>
+<script src="/resources/testharnessreport.js"></script>
+<script src="../../resources/testhelper.js"></script>
+<script src="resources/testsuite.js"></script>
+<body>
+<div id="log"></div>
+<script>
+'use strict';
+
+runPropertyTests('offset-anchor', [
+ { syntax: 'auto' },
+ { syntax: '<position>' },
+]);
+
+</script>
diff --git a/testing/web-platform/tests/css/css-typed-om/the-stylepropertymap/properties/offset-distance.html b/testing/web-platform/tests/css/css-typed-om/the-stylepropertymap/properties/offset-distance.html
new file mode 100644
index 0000000000..fc4adaff9d
--- /dev/null
+++ b/testing/web-platform/tests/css/css-typed-om/the-stylepropertymap/properties/offset-distance.html
@@ -0,0 +1,21 @@
+<!doctype html>
+<meta charset="utf-8">
+<title>'offset-distance' property</title>
+<link rel="help" href="https://drafts.css-houdini.org/css-typed-om-1/#dom-stylepropertymap-get">
+<link rel="help" href="https://drafts.css-houdini.org/css-typed-om-1/#dom-stylepropertymap-set">
+<link rel="help" href="https://drafts.css-houdini.org/css-typed-om-1/#property-stle-value-normalization">
+<script src="/resources/testharness.js"></script>
+<script src="/resources/testharnessreport.js"></script>
+<script src="../../resources/testhelper.js"></script>
+<script src="resources/testsuite.js"></script>
+<body>
+<div id="log"></div>
+<script>
+'use strict';
+
+runPropertyTests('offset-distance', [
+ { syntax: '<length>' },
+ { syntax: '<percentage>' },
+]);
+
+</script>
diff --git a/testing/web-platform/tests/css/css-typed-om/the-stylepropertymap/properties/offset-path.html b/testing/web-platform/tests/css/css-typed-om/the-stylepropertymap/properties/offset-path.html
new file mode 100644
index 0000000000..1cf1b094bb
--- /dev/null
+++ b/testing/web-platform/tests/css/css-typed-om/the-stylepropertymap/properties/offset-path.html
@@ -0,0 +1,25 @@
+<!doctype html>
+<meta charset="utf-8">
+<title>'offset-path' property</title>
+<link rel="help" href="https://drafts.css-houdini.org/css-typed-om-1/#dom-stylepropertymap-get">
+<link rel="help" href="https://drafts.css-houdini.org/css-typed-om-1/#dom-stylepropertymap-set">
+<link rel="help" href="https://drafts.css-houdini.org/css-typed-om-1/#property-stle-value-normalization">
+<script src="/resources/testharness.js"></script>
+<script src="/resources/testharnessreport.js"></script>
+<script src="../../resources/testhelper.js"></script>
+<script src="resources/testsuite.js"></script>
+<body>
+<div id="log"></div>
+<script>
+'use strict';
+
+runPropertyTests('offset-path', [
+ { syntax: 'none' },
+]);
+
+runUnsupportedPropertyTests('offset-path', [
+ 'ray(45deg closest-side)',
+ 'path("M 100 100 L 300 100 L 200 300 Z")',
+]);
+
+</script>
diff --git a/testing/web-platform/tests/css/css-typed-om/the-stylepropertymap/properties/offset-position.html b/testing/web-platform/tests/css/css-typed-om/the-stylepropertymap/properties/offset-position.html
new file mode 100644
index 0000000000..ca36226e76
--- /dev/null
+++ b/testing/web-platform/tests/css/css-typed-om/the-stylepropertymap/properties/offset-position.html
@@ -0,0 +1,22 @@
+<!doctype html>
+<meta charset="utf-8">
+<title>'offset-position' property</title>
+<link rel="help" href="https://drafts.css-houdini.org/css-typed-om-1/#dom-stylepropertymap-get">
+<link rel="help" href="https://drafts.css-houdini.org/css-typed-om-1/#dom-stylepropertymap-set">
+<link rel="help" href="https://drafts.css-houdini.org/css-typed-om-1/#property-stle-value-normalization">
+<script src="/resources/testharness.js"></script>
+<script src="/resources/testharnessreport.js"></script>
+<script src="../../resources/testhelper.js"></script>
+<script src="resources/testsuite.js"></script>
+<body>
+<div id="log"></div>
+<script>
+'use strict';
+
+runPropertyTests('offset-position', [
+ { syntax: 'normal' },
+ { syntax: 'auto' },
+ { syntax: '<position>' },
+]);
+
+</script>
diff --git a/testing/web-platform/tests/css/css-typed-om/the-stylepropertymap/properties/offset-rotate.html b/testing/web-platform/tests/css/css-typed-om/the-stylepropertymap/properties/offset-rotate.html
new file mode 100644
index 0000000000..c91e27c13c
--- /dev/null
+++ b/testing/web-platform/tests/css/css-typed-om/the-stylepropertymap/properties/offset-rotate.html
@@ -0,0 +1,26 @@
+<meta charset="utf-8">
+<title>'offset-rotate' property</title>
+<link rel="help" href="https://drafts.css-houdini.org/css-typed-om-1/#dom-stylepropertymap-get">
+<link rel="help" href="https://drafts.css-houdini.org/css-typed-om-1/#dom-stylepropertymap-set">
+<link rel="help" href="https://drafts.css-houdini.org/css-typed-om-1/#property-stle-value-normalization">
+<script src="/resources/testharness.js"></script>
+<script src="/resources/testharnessreport.js"></script>
+<script src="../../resources/testhelper.js"></script>
+<script src="resources/testsuite.js"></script>
+<body>
+<div id="log"></div>
+<script>
+'use strict';
+
+runPropertyTests('offset-rotate', [
+ { syntax: 'auto' },
+ { syntax: 'reverse' },
+ { syntax: '<angle>' },
+]);
+
+runUnsupportedPropertyTests('offset-rotate', [
+ 'auto 90deg',
+ 'reverse -90deg',
+]);
+
+</script>
diff --git a/testing/web-platform/tests/css/css-typed-om/the-stylepropertymap/properties/offset.html b/testing/web-platform/tests/css/css-typed-om/the-stylepropertymap/properties/offset.html
new file mode 100644
index 0000000000..5b7e713bec
--- /dev/null
+++ b/testing/web-platform/tests/css/css-typed-om/the-stylepropertymap/properties/offset.html
@@ -0,0 +1,23 @@
+<!doctype html>
+<meta charset="utf-8">
+<title>'offset' property</title>
+<link rel="help" href="https://drafts.css-houdini.org/css-typed-om-1/#dom-stylepropertymap-get">
+<link rel="help" href="https://drafts.css-houdini.org/css-typed-om-1/#dom-stylepropertymap-set">
+<link rel="help" href="https://drafts.css-houdini.org/css-typed-om-1/#property-stle-value-normalization">
+<script src="/resources/testharness.js"></script>
+<script src="/resources/testharnessreport.js"></script>
+<script src="../../resources/testhelper.js"></script>
+<script src="resources/testsuite.js"></script>
+<body>
+<div id="log"></div>
+<script>
+'use strict';
+
+runUnsupportedPropertyTests('offset', [
+ 'auto', '10px 30px', 'none',
+ 'ray(45deg closest-side)',
+ 'path("M 100 100 L 300 100 L 200 300 z")',
+ 'ray(45deg closest-side) / 40px 20px'
+]);
+
+</script>
diff --git a/testing/web-platform/tests/css/css-typed-om/the-stylepropertymap/properties/opacity.html b/testing/web-platform/tests/css/css-typed-om/the-stylepropertymap/properties/opacity.html
new file mode 100644
index 0000000000..448040292d
--- /dev/null
+++ b/testing/web-platform/tests/css/css-typed-om/the-stylepropertymap/properties/opacity.html
@@ -0,0 +1,48 @@
+<!doctype html>
+<meta charset="utf-8">
+<title>'opacity' property</title>
+<link rel="help" href="https://drafts.css-houdini.org/css-typed-om-1/#dom-stylepropertymap-get">
+<link rel="help" href="https://drafts.css-houdini.org/css-typed-om-1/#dom-stylepropertymap-set">
+<link rel="help" href="https://drafts.css-houdini.org/css-typed-om-1/#property-stle-value-normalization">
+<script src="/resources/testharness.js"></script>
+<script src="/resources/testharnessreport.js"></script>
+<script src="../../resources/testhelper.js"></script>
+<script src="resources/testsuite.js"></script>
+<body>
+<div id="log"></div>
+<script>
+'use strict';
+
+function assert_is_equal_with_clamping_number(input, result) {
+ const number = input.to('number');
+
+ if (number.value < 0)
+ assert_style_value_equals(result, new CSSUnitValue(0, 'number'));
+ else if (number.value > 1)
+ assert_style_value_equals(result, new CSSUnitValue(1, 'number'));
+ else
+ assert_style_value_equals(result, input);
+}
+
+function assert_is_equal_with_clamping_percentage(input, result) {
+ const number = input.to('percent').value / 100.;
+
+ if (number < 0)
+ assert_style_value_equals(result, new CSSUnitValue(0, 'number'));
+ else if (number > 1)
+ assert_style_value_equals(result, new CSSUnitValue(100, 'number'));
+ else
+ assert_style_value_equals(result, new CSSUnitValue(number, 'number'));
+}
+
+runPropertyTests('opacity', [
+ {
+ syntax: '<number>',
+ computed: assert_is_equal_with_clamping_number
+ },
+ { syntax: '<percentage>',
+ computed: assert_is_equal_with_clamping_percentage
+ }
+]);
+
+</script>
diff --git a/testing/web-platform/tests/css/css-typed-om/the-stylepropertymap/properties/order.html b/testing/web-platform/tests/css/css-typed-om/the-stylepropertymap/properties/order.html
new file mode 100644
index 0000000000..35b9d26a39
--- /dev/null
+++ b/testing/web-platform/tests/css/css-typed-om/the-stylepropertymap/properties/order.html
@@ -0,0 +1,35 @@
+<meta charset="utf-8">
+<title>'order' property</title>
+<link rel="help" href="https://drafts.css-houdini.org/css-typed-om-1/#dom-stylepropertymap-get">
+<link rel="help" href="https://drafts.css-houdini.org/css-typed-om-1/#dom-stylepropertymap-set">
+<link rel="help" href="https://drafts.css-houdini.org/css-typed-om-1/#property-stle-value-normalization">
+<script src="/resources/testharness.js"></script>
+<script src="/resources/testharnessreport.js"></script>
+<script src="../../resources/testhelper.js"></script>
+<script src="resources/testsuite.js"></script>
+<body>
+<div id="log"></div>
+<script>
+'use strict';
+
+runPropertyTests('order', [
+ {
+ syntax: '<number>',
+ // order needs to be an integer
+ specified: (input, result) => {
+ if (input instanceof CSSUnitValue && !Number.isInteger(input.value))
+ assert_style_value_equals(result, new CSSMathSum(input));
+ else
+ assert_style_value_equals(result, input);
+ },
+ computed: (input, result) => {
+ const number = input.to('number');
+ if (!Number.isInteger(number.value))
+ assert_style_value_equals(result, new CSSUnitValue(Math.round(number.value), 'number'));
+ else
+ assert_style_value_equals(result, number);
+ }
+ },
+]);
+
+</script>
diff --git a/testing/web-platform/tests/css/css-typed-om/the-stylepropertymap/properties/orphans.html b/testing/web-platform/tests/css/css-typed-om/the-stylepropertymap/properties/orphans.html
new file mode 100644
index 0000000000..7d7558407a
--- /dev/null
+++ b/testing/web-platform/tests/css/css-typed-om/the-stylepropertymap/properties/orphans.html
@@ -0,0 +1,37 @@
+<meta charset="utf-8">
+<title>'orphans' property</title>
+<link rel="help" href="https://drafts.css-houdini.org/css-typed-om-1/#dom-stylepropertymap-get">
+<link rel="help" href="https://drafts.css-houdini.org/css-typed-om-1/#dom-stylepropertymap-set">
+<link rel="help" href="https://drafts.css-houdini.org/css-typed-om-1/#property-stle-value-normalization">
+<script src="/resources/testharness.js"></script>
+<script src="/resources/testharnessreport.js"></script>
+<script src="../../resources/testhelper.js"></script>
+<script src="resources/testsuite.js"></script>
+<body>
+<div id="log"></div>
+<script>
+'use strict';
+
+runPropertyTests('orphans', [
+ {
+ syntax: '<number>',
+ // orphans needs to be a positive integer
+ specified: (input, result) => {
+ if (input instanceof CSSUnitValue && (!Number.isInteger(input.value) || input.value < 1))
+ assert_style_value_equals(result, new CSSMathSum(input));
+ else
+ assert_style_value_equals(result, input);
+ },
+ computed: (input, result) => {
+ const number = input.to('number');
+ if (number < 1)
+ assert_style_value_equals(result, new CSSUnitValue(1, 'number'));
+ else if (!Number.isInteger(number.value))
+ assert_style_value_equals(result, new CSSUnitValue(Math.round(number.value), 'number'));
+ else
+ assert_style_value_equals(result, number);
+ }
+ },
+]);
+
+</script>
diff --git a/testing/web-platform/tests/css/css-typed-om/the-stylepropertymap/properties/outline-color.html b/testing/web-platform/tests/css/css-typed-om/the-stylepropertymap/properties/outline-color.html
new file mode 100644
index 0000000000..6bfec87a8c
--- /dev/null
+++ b/testing/web-platform/tests/css/css-typed-om/the-stylepropertymap/properties/outline-color.html
@@ -0,0 +1,31 @@
+<!doctype html>
+<meta charset="utf-8">
+<title>'outline-color' property</title>
+<link rel="help" href="https://drafts.css-houdini.org/css-typed-om-1/#dom-stylepropertymap-get">
+<link rel="help" href="https://drafts.css-houdini.org/css-typed-om-1/#dom-stylepropertymap-set">
+<link rel="help" href="https://drafts.css-houdini.org/css-typed-om-1/#property-stle-value-normalization">
+<script src="/resources/testharness.js"></script>
+<script src="/resources/testharnessreport.js"></script>
+<script src="../../resources/testhelper.js"></script>
+<script src="resources/testsuite.js"></script>
+<body>
+<div id="log"></div>
+<script>
+'use strict';
+
+runPropertyTests('outline-color', [
+ {
+ syntax: 'currentcolor',
+ // computes to a <color>, which is not supported in level 1
+ computed: (_, result) => assert_class_string(result, 'CSSStyleValue')
+ }
+ // FIXME: browsers may or may not support 'invert' keyword.
+]);
+
+// <color>s are not supported in level 1
+runUnsupportedPropertyTests('outline-color', [
+ 'red', '#bbff00', 'rgb(255, 255, 128)', 'hsl(50, 33%, 25%)',
+ 'transparent'
+]);
+
+</script>
diff --git a/testing/web-platform/tests/css/css-typed-om/the-stylepropertymap/properties/outline-offset.html b/testing/web-platform/tests/css/css-typed-om/the-stylepropertymap/properties/outline-offset.html
new file mode 100644
index 0000000000..f9c0f5643f
--- /dev/null
+++ b/testing/web-platform/tests/css/css-typed-om/the-stylepropertymap/properties/outline-offset.html
@@ -0,0 +1,20 @@
+<!doctype html>
+<meta charset="utf-8">
+<title>'outline-offset' property</title>
+<link rel="help" href="https://drafts.css-houdini.org/css-typed-om-1/#dom-stylepropertymap-get">
+<link rel="help" href="https://drafts.css-houdini.org/css-typed-om-1/#dom-stylepropertymap-set">
+<link rel="help" href="https://drafts.css-houdini.org/css-typed-om-1/#property-stle-value-normalization">
+<script src="/resources/testharness.js"></script>
+<script src="/resources/testharnessreport.js"></script>
+<script src="../../resources/testhelper.js"></script>
+<script src="resources/testsuite.js"></script>
+<body>
+<div id="log"></div>
+<script>
+'use strict';
+
+runPropertyTests('outline-offset', [
+ { syntax: '<length>' },
+]);
+
+</script>
diff --git a/testing/web-platform/tests/css/css-typed-om/the-stylepropertymap/properties/outline-style.html b/testing/web-platform/tests/css/css-typed-om/the-stylepropertymap/properties/outline-style.html
new file mode 100644
index 0000000000..2d793f36ae
--- /dev/null
+++ b/testing/web-platform/tests/css/css-typed-om/the-stylepropertymap/properties/outline-style.html
@@ -0,0 +1,29 @@
+<!doctype html>
+<meta charset="utf-8">
+<title>'outline-style' property</title>
+<link rel="help" href="https://drafts.css-houdini.org/css-typed-om-1/#dom-stylepropertymap-get">
+<link rel="help" href="https://drafts.css-houdini.org/css-typed-om-1/#dom-stylepropertymap-set">
+<link rel="help" href="https://drafts.css-houdini.org/css-typed-om-1/#property-stle-value-normalization">
+<script src="/resources/testharness.js"></script>
+<script src="/resources/testharnessreport.js"></script>
+<script src="../../resources/testhelper.js"></script>
+<script src="resources/testsuite.js"></script>
+<body>
+<div id="log"></div>
+<script>
+'use strict';
+
+runPropertyTests('outline-style', [
+ { syntax: 'auto' },
+ { syntax: 'none' },
+ { syntax: 'dotted' },
+ { syntax: 'dashed' },
+ { syntax: 'solid' },
+ { syntax: 'double' },
+ { syntax: 'groove' },
+ { syntax: 'ridge' },
+ { syntax: 'inset' },
+ { syntax: 'outset' },
+]);
+
+</script>
diff --git a/testing/web-platform/tests/css/css-typed-om/the-stylepropertymap/properties/outline-width.html b/testing/web-platform/tests/css/css-typed-om/the-stylepropertymap/properties/outline-width.html
new file mode 100644
index 0000000000..3686741ad1
--- /dev/null
+++ b/testing/web-platform/tests/css/css-typed-om/the-stylepropertymap/properties/outline-width.html
@@ -0,0 +1,41 @@
+<meta charset="utf-8">
+<title>'outline-width' property</title>
+<link rel="help" href="https://drafts.css-houdini.org/css-typed-om-1/#dom-stylepropertymap-get">
+<link rel="help" href="https://drafts.css-houdini.org/css-typed-om-1/#dom-stylepropertymap-set">
+<link rel="help" href="https://drafts.css-houdini.org/css-typed-om-1/#property-stle-value-normalization">
+<script src="/resources/testharness.js"></script>
+<script src="/resources/testharnessreport.js"></script>
+<script src="../../resources/testhelper.js"></script>
+<script src="resources/testsuite.js"></script>
+<body>
+<div id="log"></div>
+<script>
+'use strict';
+
+function assert_is_zero_px(result) {
+ assert_style_value_equals(result, new CSSUnitValue(0, 'px'));
+}
+
+runPropertyTests('outline-width', [
+ // Computed value is 0 when outline-style is 'none'.
+ // FIXME: Add separate test where outline-style is not 'none' or 'hidden'.
+ {
+ syntax: 'thin',
+ computed: (_, result) => assert_is_zero_px(result)
+ },
+ {
+ syntax: 'medium',
+ computed: (_, result) => assert_is_zero_px(result)
+ },
+ {
+ syntax: 'thick',
+ computed: (_, result) => assert_is_zero_px(result)
+ },
+ {
+ syntax: '<length>',
+ specified: assert_is_equal_with_range_handling,
+ computed: (_, result) => assert_is_zero_px(result)
+ },
+]);
+
+</script>
diff --git a/testing/web-platform/tests/css/css-typed-om/the-stylepropertymap/properties/overflow-anchor.html b/testing/web-platform/tests/css/css-typed-om/the-stylepropertymap/properties/overflow-anchor.html
new file mode 100644
index 0000000000..f037469fbd
--- /dev/null
+++ b/testing/web-platform/tests/css/css-typed-om/the-stylepropertymap/properties/overflow-anchor.html
@@ -0,0 +1,21 @@
+<!doctype html>
+<meta charset="utf-8">
+<title>'overflow-anchor' property</title>
+<link rel="help" href="https://drafts.css-houdini.org/css-typed-om-1/#dom-stylepropertymap-get">
+<link rel="help" href="https://drafts.css-houdini.org/css-typed-om-1/#dom-stylepropertymap-set">
+<link rel="help" href="https://drafts.css-houdini.org/css-typed-om-1/#property-stle-value-normalization">
+<script src="/resources/testharness.js"></script>
+<script src="/resources/testharnessreport.js"></script>
+<script src="../../resources/testhelper.js"></script>
+<script src="resources/testsuite.js"></script>
+<body>
+<div id="log"></div>
+<script>
+'use strict';
+
+runPropertyTests('overflow-anchor', [
+ { syntax: 'auto' },
+ { syntax: 'none' },
+]);
+
+</script>
diff --git a/testing/web-platform/tests/css/css-typed-om/the-stylepropertymap/properties/overflow-clip-margin.html b/testing/web-platform/tests/css/css-typed-om/the-stylepropertymap/properties/overflow-clip-margin.html
new file mode 100644
index 0000000000..d119641364
--- /dev/null
+++ b/testing/web-platform/tests/css/css-typed-om/the-stylepropertymap/properties/overflow-clip-margin.html
@@ -0,0 +1,26 @@
+<!doctype html>
+<meta charset="utf-8">
+<title>'overflow-clip-margin' property</title>
+<link rel="help" href="https://drafts.css-houdini.org/css-typed-om-1/#dom-stylepropertymap-get">
+<link rel="help" href="https://drafts.css-houdini.org/css-typed-om-1/#dom-stylepropertymap-set">
+<link rel="help" href="https://drafts.css-houdini.org/css-typed-om-1/#property-stle-value-normalization">
+<script src="/resources/testharness.js"></script>
+<script src="/resources/testharnessreport.js"></script>
+<script src="../../resources/testhelper.js"></script>
+<script src="resources/testsuite.js"></script>
+<body>
+<div id="log"></div>
+<script>
+'use strict';
+
+runUnsupportedPropertyTests('overflow-clip-margin', [
+ 'border-box',
+ 'content-box',
+ 'padding-box',
+ 'padding-box 10px',
+ '10px content-box',
+ '0px',
+ '10px',
+]);
+
+</script>
diff --git a/testing/web-platform/tests/css/css-typed-om/the-stylepropertymap/properties/overflow-wrap.html b/testing/web-platform/tests/css/css-typed-om/the-stylepropertymap/properties/overflow-wrap.html
new file mode 100644
index 0000000000..0a7bcc7ac3
--- /dev/null
+++ b/testing/web-platform/tests/css/css-typed-om/the-stylepropertymap/properties/overflow-wrap.html
@@ -0,0 +1,26 @@
+<!doctype html>
+<meta charset="utf-8">
+<title>'overflow-wrap' property</title>
+<link rel="help" href="https://drafts.css-houdini.org/css-typed-om-1/#dom-stylepropertymap-get">
+<link rel="help" href="https://drafts.css-houdini.org/css-typed-om-1/#dom-stylepropertymap-set">
+<link rel="help" href="https://drafts.css-houdini.org/css-typed-om-1/#property-stle-value-normalization">
+<script src="/resources/testharness.js"></script>
+<script src="/resources/testharnessreport.js"></script>
+<script src="../../resources/testhelper.js"></script>
+<script src="resources/testsuite.js"></script>
+<body>
+<div id="log"></div>
+<script>
+'use strict';
+
+runPropertyTests('overflow-wrap', [
+ { syntax: 'normal' },
+ { syntax: 'break-word' },
+ { syntax: 'break-spaces' },
+]);
+
+runUnsupportedPropertyTests('overflow-wrap', [
+ 'break-overflow break-spaces'
+]);
+
+</script>
diff --git a/testing/web-platform/tests/css/css-typed-om/the-stylepropertymap/properties/overflow.html b/testing/web-platform/tests/css/css-typed-om/the-stylepropertymap/properties/overflow.html
new file mode 100644
index 0000000000..a4692fc178
--- /dev/null
+++ b/testing/web-platform/tests/css/css-typed-om/the-stylepropertymap/properties/overflow.html
@@ -0,0 +1,26 @@
+<!doctype html>
+<meta charset="utf-8">
+<title>'overflow' properties</title>
+<link rel="help" href="https://drafts.css-houdini.org/css-typed-om-1/#dom-stylepropertymap-get">
+<link rel="help" href="https://drafts.css-houdini.org/css-typed-om-1/#dom-stylepropertymap-set">
+<link rel="help" href="https://drafts.css-houdini.org/css-typed-om-1/#property-stle-value-normalization">
+<script src="/resources/testharness.js"></script>
+<script src="/resources/testharnessreport.js"></script>
+<script src="../../resources/testhelper.js"></script>
+<script src="resources/testsuite.js"></script>
+<body>
+<div id="log"></div>
+<script>
+'use strict';
+
+for (const suffix of ['x', 'y']) {
+ runPropertyTests(`overflow-${suffix}`, [
+ { syntax: 'visible' },
+ { syntax: 'hidden' },
+ { syntax: 'clip' },
+ { syntax: 'scroll' },
+ { syntax: 'auto' },
+ ]);
+}
+
+</script>
diff --git a/testing/web-platform/tests/css/css-typed-om/the-stylepropertymap/properties/overscroll-behavior.html b/testing/web-platform/tests/css/css-typed-om/the-stylepropertymap/properties/overscroll-behavior.html
new file mode 100644
index 0000000000..5e440b2595
--- /dev/null
+++ b/testing/web-platform/tests/css/css-typed-om/the-stylepropertymap/properties/overscroll-behavior.html
@@ -0,0 +1,24 @@
+<!doctype html>
+<meta charset="utf-8">
+<title>'overscroll-behavior' property</title>
+<link rel="help" href="https://drafts.css-houdini.org/css-typed-om-1/#dom-stylepropertymap-get">
+<link rel="help" href="https://drafts.css-houdini.org/css-typed-om-1/#dom-stylepropertymap-set">
+<link rel="help" href="https://drafts.css-houdini.org/css-typed-om-1/#property-stle-value-normalization">
+<script src="/resources/testharness.js"></script>
+<script src="/resources/testharnessreport.js"></script>
+<script src="../../resources/testhelper.js"></script>
+<script src="resources/testsuite.js"></script>
+<body>
+<div id="log"></div>
+<script>
+'use strict';
+
+for (const suffix of ['x', 'y']) {
+ runPropertyTests(`overscroll-behavior-${suffix}`, [
+ { syntax: 'contain' },
+ { syntax: 'none' },
+ { syntax: 'auto' }
+ ]);
+}
+
+</script>
diff --git a/testing/web-platform/tests/css/css-typed-om/the-stylepropertymap/properties/padding.html b/testing/web-platform/tests/css/css-typed-om/the-stylepropertymap/properties/padding.html
new file mode 100644
index 0000000000..9e183f440a
--- /dev/null
+++ b/testing/web-platform/tests/css/css-typed-om/the-stylepropertymap/properties/padding.html
@@ -0,0 +1,39 @@
+<!doctype html>
+<meta charset="utf-8">
+<title>padding properties</title>
+<link rel="help" href="https://drafts.css-houdini.org/css-typed-om-1/#dom-stylepropertymap-get">
+<link rel="help" href="https://drafts.css-houdini.org/css-typed-om-1/#dom-stylepropertymap-set">
+<link rel="help" href="https://drafts.css-houdini.org/css-typed-om-1/#property-stle-value-normalization">
+<script src="/resources/testharness.js"></script>
+<script src="/resources/testharnessreport.js"></script>
+<script src="../../resources/testhelper.js"></script>
+<script src="resources/testsuite.js"></script>
+<body>
+<div id="log"></div>
+<script>
+'use strict';
+
+function assert_is_equal_with_clamping_percentage(input, result) {
+ const percent = input.to('percent').value;
+
+ if (percent < 0)
+ assert_style_value_equals(result, new CSSUnitValue(0, 'percent'));
+ else
+ assert_style_value_equals(result, new CSSUnitValue(percent, 'percent'));
+}
+
+for (const suffix of ['top', 'left', 'right', 'bottom']) {
+ runPropertyTests('padding-' + suffix, [
+ {
+ syntax: '<percentage>',
+ specified: assert_is_equal_with_range_handling,
+ computed: assert_is_equal_with_clamping_percentage
+ },
+ {
+ syntax: '<length>',
+ specified: assert_is_equal_with_range_handling
+ },
+ ]);
+}
+
+</script>
diff --git a/testing/web-platform/tests/css/css-typed-om/the-stylepropertymap/properties/page.html b/testing/web-platform/tests/css/css-typed-om/the-stylepropertymap/properties/page.html
new file mode 100644
index 0000000000..93255b8a67
--- /dev/null
+++ b/testing/web-platform/tests/css/css-typed-om/the-stylepropertymap/properties/page.html
@@ -0,0 +1,23 @@
+<!doctype html>
+<meta charset="utf-8">
+<title>'page' property</title>
+<link rel="help" href="https://drafts.css-houdini.org/css-typed-om-1/#dom-stylepropertymap-get">
+<link rel="help" href="https://drafts.css-houdini.org/css-typed-om-1/#dom-stylepropertymap-set">
+<link rel="help" href="https://drafts.css-houdini.org/css-typed-om-1/#property-stle-value-normalization">
+<script src="/resources/testharness.js"></script>
+<script src="/resources/testharnessreport.js"></script>
+<script src="../../resources/testhelper.js"></script>
+<script src="resources/testsuite.js"></script>
+<body>
+<div id="log"></div>
+<script>
+'use strict';
+
+runPropertyTests('page', [
+ { syntax: 'auto' },
+ // FIXME: This should be <custom-ident>, but the test harness doesn't
+ // currently support it.
+ { syntax: 'custom-ident' },
+]);
+
+</script>
diff --git a/testing/web-platform/tests/css/css-typed-om/the-stylepropertymap/properties/paint-order.html b/testing/web-platform/tests/css/css-typed-om/the-stylepropertymap/properties/paint-order.html
new file mode 100644
index 0000000000..a547a75112
--- /dev/null
+++ b/testing/web-platform/tests/css/css-typed-om/the-stylepropertymap/properties/paint-order.html
@@ -0,0 +1,27 @@
+<!doctype html>
+<meta charset="utf-8">
+<title>'paint-order' property</title>
+<link rel="help" href="https://drafts.css-houdini.org/css-typed-om-1/#dom-stylepropertymap-get">
+<link rel="help" href="https://drafts.css-houdini.org/css-typed-om-1/#dom-stylepropertymap-set">
+<link rel="help" href="https://drafts.css-houdini.org/css-typed-om-1/#property-stle-value-normalization">
+<script src="/resources/testharness.js"></script>
+<script src="/resources/testharnessreport.js"></script>
+<script src="../../resources/testhelper.js"></script>
+<script src="resources/testsuite.js"></script>
+<body>
+<div id="log"></div>
+<script>
+'use strict';
+
+runPropertyTests('paint-order', [
+ { syntax: 'normal' },
+ { syntax: 'fill' },
+ { syntax: 'stroke' },
+ { syntax: 'markers' },
+]);
+
+runUnsupportedPropertyTests('paint-order', [
+ 'fill stroke', 'markers fill stroke'
+]);
+
+</script>
diff --git a/testing/web-platform/tests/css/css-typed-om/the-stylepropertymap/properties/perspective-origin.html b/testing/web-platform/tests/css/css-typed-om/the-stylepropertymap/properties/perspective-origin.html
new file mode 100644
index 0000000000..a72f79c503
--- /dev/null
+++ b/testing/web-platform/tests/css/css-typed-om/the-stylepropertymap/properties/perspective-origin.html
@@ -0,0 +1,21 @@
+<!doctype html>
+<meta charset="utf-8">
+<title>'perspective-origin' property</title>
+<link rel="help" href="https://drafts.css-houdini.org/css-typed-om-1/#dom-stylepropertymap-get">
+<link rel="help" href="https://drafts.css-houdini.org/css-typed-om-1/#dom-stylepropertymap-set">
+<link rel="help" href="https://drafts.css-houdini.org/css-typed-om-1/#property-stle-value-normalization">
+<script src="/resources/testharness.js"></script>
+<script src="/resources/testharnessreport.js"></script>
+<script src="../../resources/testhelper.js"></script>
+<script src="resources/testsuite.js"></script>
+<body>
+<div id="log"></div>
+<script>
+'use strict';
+
+runPropertyTests('perspective-origin', [
+ { syntax: 'none' },
+ { syntax: '<position>' },
+]);
+
+</script>
diff --git a/testing/web-platform/tests/css/css-typed-om/the-stylepropertymap/properties/perspective.html b/testing/web-platform/tests/css/css-typed-om/the-stylepropertymap/properties/perspective.html
new file mode 100644
index 0000000000..d90d9392be
--- /dev/null
+++ b/testing/web-platform/tests/css/css-typed-om/the-stylepropertymap/properties/perspective.html
@@ -0,0 +1,24 @@
+<!doctype html>
+<meta charset="utf-8">
+<title>'perspective' property</title>
+<link rel="help" href="https://drafts.css-houdini.org/css-typed-om-1/#dom-stylepropertymap-get">
+<link rel="help" href="https://drafts.css-houdini.org/css-typed-om-1/#dom-stylepropertymap-set">
+<link rel="help" href="https://drafts.css-houdini.org/css-typed-om-1/#property-stle-value-normalization">
+<script src="/resources/testharness.js"></script>
+<script src="/resources/testharnessreport.js"></script>
+<script src="../../resources/testhelper.js"></script>
+<script src="resources/testsuite.js"></script>
+<body>
+<div id="log"></div>
+<script>
+'use strict';
+
+runPropertyTests('perspective', [
+ { syntax: 'none' },
+ {
+ syntax: '<length>',
+ specified: assert_is_equal_with_range_handling
+ },
+]);
+
+</script>
diff --git a/testing/web-platform/tests/css/css-typed-om/the-stylepropertymap/properties/pointer-events.html b/testing/web-platform/tests/css/css-typed-om/the-stylepropertymap/properties/pointer-events.html
new file mode 100644
index 0000000000..091e985406
--- /dev/null
+++ b/testing/web-platform/tests/css/css-typed-om/the-stylepropertymap/properties/pointer-events.html
@@ -0,0 +1,29 @@
+<!doctype html>
+<meta charset="utf-8">
+<title>'pointer-events' property</title>
+<link rel="help" href="https://drafts.css-houdini.org/css-typed-om-1/#dom-stylepropertymap-get">
+<link rel="help" href="https://drafts.css-houdini.org/css-typed-om-1/#dom-stylepropertymap-set">
+<link rel="help" href="https://drafts.css-houdini.org/css-typed-om-1/#property-stle-value-normalization">
+<script src="/resources/testharness.js"></script>
+<script src="/resources/testharnessreport.js"></script>
+<script src="../../resources/testhelper.js"></script>
+<script src="resources/testsuite.js"></script>
+<body>
+<div id="log"></div>
+<script>
+'use strict';
+
+runPropertyTests('pointer-events', [
+ { syntax: 'bounding-box' },
+ { syntax: 'visiblepainted' },
+ { syntax: 'visiblefill' },
+ { syntax: 'visiblestroke' },
+ { syntax: 'visible' },
+ { syntax: 'painted' },
+ { syntax: 'fill' },
+ { syntax: 'stroke' },
+ { syntax: 'all' },
+ { syntax: 'none' },
+]);
+
+</script>
diff --git a/testing/web-platform/tests/css/css-typed-om/the-stylepropertymap/properties/position.html b/testing/web-platform/tests/css/css-typed-om/the-stylepropertymap/properties/position.html
new file mode 100644
index 0000000000..4b36ec7bb2
--- /dev/null
+++ b/testing/web-platform/tests/css/css-typed-om/the-stylepropertymap/properties/position.html
@@ -0,0 +1,22 @@
+<!doctype html>
+<meta charset="utf-8">
+<title>'position' property</title>
+<link rel="help" href="https://drafts.css-houdini.org/css-typed-om-1/#dom-stylepropertymap-get">
+<link rel="help" href="https://drafts.css-houdini.org/css-typed-om-1/#dom-stylepropertymap-set">
+<link rel="help" href="https://drafts.css-houdini.org/css-typed-om-1/#property-stle-value-normalization">
+<script src="/resources/testharness.js"></script>
+<script src="/resources/testharnessreport.js"></script>
+<script src="../../resources/testhelper.js"></script>
+<script src="resources/testsuite.js"></script>
+<body>
+<div id="log"></div>
+<script>
+'use strict';
+
+runPropertyTests('position', [
+ { syntax: 'relative' },
+ { syntax: 'absolute' },
+ // and other keywords
+]);
+
+</script>
diff --git a/testing/web-platform/tests/css/css-typed-om/the-stylepropertymap/properties/quotes.html b/testing/web-platform/tests/css/css-typed-om/the-stylepropertymap/properties/quotes.html
new file mode 100644
index 0000000000..99e844265d
--- /dev/null
+++ b/testing/web-platform/tests/css/css-typed-om/the-stylepropertymap/properties/quotes.html
@@ -0,0 +1,24 @@
+<!doctype html>
+<meta charset="utf-8">
+<title>'quotes' property</title>
+<link rel="help" href="https://drafts.css-houdini.org/css-typed-om-1/#dom-stylepropertymap-get">
+<link rel="help" href="https://drafts.css-houdini.org/css-typed-om-1/#dom-stylepropertymap-set">
+<link rel="help" href="https://drafts.css-houdini.org/css-typed-om-1/#property-stle-value-normalization">
+<script src="/resources/testharness.js"></script>
+<script src="/resources/testharnessreport.js"></script>
+<script src="../../resources/testhelper.js"></script>
+<script src="resources/testsuite.js"></script>
+<body>
+<div id="log"></div>
+<script>
+'use strict';
+
+runPropertyTests('quotes', [
+ { syntax: 'none' },
+]);
+
+runUnsupportedPropertyTests('quotes', [
+ '"<<" ">>" "<" ">"'
+]);
+
+</script>
diff --git a/testing/web-platform/tests/css/css-typed-om/the-stylepropertymap/properties/radius.html b/testing/web-platform/tests/css/css-typed-om/the-stylepropertymap/properties/radius.html
new file mode 100644
index 0000000000..a5cea15de0
--- /dev/null
+++ b/testing/web-platform/tests/css/css-typed-om/the-stylepropertymap/properties/radius.html
@@ -0,0 +1,63 @@
+<!doctype html>
+<meta charset="utf-8">
+<title>'radius' property</title>
+<link rel="help" href="https://drafts.css-houdini.org/css-typed-om-1/#dom-stylepropertymap-get">
+<link rel="help" href="https://drafts.css-houdini.org/css-typed-om-1/#dom-stylepropertymap-set">
+<link rel="help" href="https://drafts.css-houdini.org/css-typed-om-1/#property-stle-value-normalization">
+<script src="/resources/testharness.js"></script>
+<script src="/resources/testharnessreport.js"></script>
+<script src="../../resources/testhelper.js"></script>
+<script src="resources/testsuite.js"></script>
+<body>
+<div id="log"></div>
+<script>
+'use strict';
+
+function assert_is_equal_with_clamping_percentage(input, result) {
+ const percent = input.to('percent').value;
+
+ if (percent < 0)
+ assert_style_value_equals(result, new CSSUnitValue(0, 'percent'));
+ else
+ assert_style_value_equals(result, new CSSUnitValue(percent, 'percent'));
+}
+
+runPropertyTests('r', [
+ {
+ syntax: '<percentage>',
+ specified: assert_is_equal_with_range_handling,
+ computed: assert_is_equal_with_clamping_percentage
+ },
+ {
+ syntax: '<length>',
+ specified: assert_is_equal_with_range_handling
+ },
+]);
+
+runPropertyTests('rx', [
+ { syntax: 'auto' },
+ {
+ syntax: '<percentage>',
+ specified: assert_is_equal_with_range_handling,
+ computed: assert_is_equal_with_clamping_percentage
+ },
+ {
+ syntax: '<length>',
+ specified: assert_is_equal_with_range_handling
+ },
+]);
+
+runPropertyTests('ry', [
+ { syntax: 'auto' },
+ {
+ syntax: '<percentage>',
+ specified: assert_is_equal_with_range_handling,
+ computed: assert_is_equal_with_clamping_percentage
+ },
+ {
+ syntax: '<length>',
+ specified: assert_is_equal_with_range_handling
+ },
+]);
+
+</script>
diff --git a/testing/web-platform/tests/css/css-typed-om/the-stylepropertymap/properties/resize.html b/testing/web-platform/tests/css/css-typed-om/the-stylepropertymap/properties/resize.html
new file mode 100644
index 0000000000..c5e0eac70d
--- /dev/null
+++ b/testing/web-platform/tests/css/css-typed-om/the-stylepropertymap/properties/resize.html
@@ -0,0 +1,23 @@
+<!doctype html>
+<meta charset="utf-8">
+<title>'resize' property</title>
+<link rel="help" href="https://drafts.css-houdini.org/css-typed-om-1/#dom-stylepropertymap-get">
+<link rel="help" href="https://drafts.css-houdini.org/css-typed-om-1/#dom-stylepropertymap-set">
+<link rel="help" href="https://drafts.css-houdini.org/css-typed-om-1/#property-stle-value-normalization">
+<script src="/resources/testharness.js"></script>
+<script src="/resources/testharnessreport.js"></script>
+<script src="../../resources/testhelper.js"></script>
+<script src="resources/testsuite.js"></script>
+<body>
+<div id="log"></div>
+<script>
+'use strict';
+
+runPropertyTests('resize', [
+ { syntax: 'none' },
+ { syntax: 'both' },
+ { syntax: 'horizontal' },
+ { syntax: 'vertical' },
+]);
+
+</script>
diff --git a/testing/web-platform/tests/css/css-typed-om/the-stylepropertymap/properties/resources/testsuite.js b/testing/web-platform/tests/css/css-typed-om/the-stylepropertymap/properties/resources/testsuite.js
new file mode 100644
index 0000000000..cecd72ad92
--- /dev/null
+++ b/testing/web-platform/tests/css/css-typed-om/the-stylepropertymap/properties/resources/testsuite.js
@@ -0,0 +1,485 @@
+function assert_is_unit(unit, result) {
+ assert_class_string(result, 'CSSUnitValue',
+ 'relative lengths must compute to a CSSUnitValue');
+ assert_equals(result.unit, unit, 'unit');
+}
+
+function assert_is_calc_sum(result) {
+ assert_class_string(result, 'CSSMathSum',
+ 'specified calc must be a CSSMathSum');
+}
+
+function assert_is_equal_with_range_handling(input, result) {
+ if (input instanceof CSSUnitValue && input.value < 0)
+ assert_style_value_equals(result, new CSSMathSum(input));
+ else
+ assert_style_value_equals(result, input);
+}
+
+function assert_is_unsupported(result) {
+ assert_class_string(result, 'CSSStyleValue');
+}
+
+const gCssWideKeywordsExamples = [
+ {
+ description: 'initial keyword',
+ input: new CSSKeywordValue('initial')
+ },
+ {
+ description: 'inherit keyword',
+ input: new CSSKeywordValue('inherit')
+ },
+ {
+ description: 'unset keyword',
+ input: new CSSKeywordValue('unset')
+ },
+ {
+ description: 'revert keyword',
+ input: new CSSKeywordValue('revert')
+ },
+];
+
+const gVarReferenceExamples = [
+ {
+ description: 'a var() reference',
+ input: new CSSUnparsedValue([' ', new CSSVariableReferenceValue('--A')])
+ },
+];
+
+const gTestSyntaxExamples = {
+ '<length>': {
+ description: 'a length',
+ examples: [
+ {
+ description: "zero px",
+ input: new CSSUnitValue(0, 'px')
+ },
+ {
+ description: "a negative em",
+ input: new CSSUnitValue(-3.14, 'em'),
+ // 'ems' are relative units, so just check that it computes to px
+ defaultComputed: (_, result) => assert_is_unit('px', result)
+ },
+ {
+ description: "a positive cm",
+ input: new CSSUnitValue(3.14, 'cm'),
+ // 'cms' are relative units, so just check that it computes to px
+ defaultComputed: (_, result) => assert_is_unit('px', result)
+ },
+ {
+ description: "a calc length",
+ input: new CSSMathSum(new CSSUnitValue(0, 'px'), new CSSUnitValue(0, 'em')),
+ // Specified/computed calcs are usually simplified.
+ // FIXME: Test this properly
+ defaultSpecified: (_, result) => assert_is_calc_sum(result),
+ defaultComputed: (_, result) => assert_is_unit('px', result)
+ }
+ ],
+ },
+ '<percentage>': {
+ description: 'a percent',
+ examples: [
+ {
+ description: "zero percent",
+ input: new CSSUnitValue(0, 'percent')
+ },
+ {
+ description: "a negative percent",
+ input: new CSSUnitValue(-3.14, 'percent')
+ },
+ {
+ description: "a positive percent",
+ input: new CSSUnitValue(3.14, 'percent')
+ },
+ {
+ description: "a calc percent",
+ input: new CSSMathSum(new CSSUnitValue(0, 'percent'), new CSSUnitValue(0, 'percent')),
+ // Specified/computed calcs are usually simplified.
+ // FIXME: Test this properly
+ defaultSpecified: (_, result) => assert_is_calc_sum(result),
+ defaultComputed: (_, result) => assert_is_unit('percent', result)
+ }
+ ],
+ },
+ '<time>': {
+ description: 'a time',
+ examples: [
+ {
+ description: "zero seconds",
+ input: new CSSUnitValue(0, 's')
+ },
+ {
+ description: "negative milliseconds",
+ input: new CSSUnitValue(-3.14, 'ms'),
+ // Computed values use canonical units
+ defaultComputed: (_, result) => assert_style_value_equals(result, new CSSUnitValue(-0.00314, 's'))
+ },
+ {
+ description: "positive seconds",
+ input: new CSSUnitValue(3.14, 's')
+ },
+ {
+ description: "a calc time",
+ input: new CSSMathSum(new CSSUnitValue(0, 's'), new CSSUnitValue(0, 'ms')),
+ // Specified/computed calcs are usually simplified.
+ // FIXME: Test this properly
+ defaultSpecified: (_, result) => assert_is_calc_sum(result),
+ defaultComputed: (_, result) => assert_is_unit('s', result)
+ }
+ ],
+ },
+ '<time>': {
+ description: 'a time',
+ examples: [
+ {
+ description: "zero seconds",
+ input: new CSSUnitValue(0, 's')
+ },
+ {
+ description: "negative milliseconds",
+ input: new CSSUnitValue(-3.14, 'ms'),
+ // Computed values use canonical units
+ defaultComputed: (_, result) => assert_style_value_equals(result, new CSSUnitValue(-0.00314, 's'))
+ },
+ {
+ description: "positive seconds",
+ input: new CSSUnitValue(3.14, 's')
+ },
+ {
+ description: "a calc time",
+ input: new CSSMathSum(new CSSUnitValue(0, 's'), new CSSUnitValue(0, 'ms')),
+ specifiedExpected: new CSSMathSum(new CSSUnitValue(0, 's'), new CSSUnitValue(0, 's')),
+ defaultSpecified: (_, result) => assert_is_calc_sum(result),
+ defaultComputed: (_, result) => assert_is_unit('s', result)
+ }
+ ],
+ },
+ '<angle>': {
+ description: 'an angle',
+ examples: [
+ {
+ description: "zero degrees",
+ input: new CSSUnitValue(0, 'deg')
+ },
+ {
+ description: "positive radians",
+ input: new CSSUnitValue(3.14, 'rad'),
+ // Computed values use canonical units
+ defaultComputed: (_, result) => assert_style_value_equals(result, new CSSUnitValue(179.908752, 'deg'))
+ },
+ {
+ description: "negative degrees",
+ input: new CSSUnitValue(-3.14, 'deg')
+ },
+ {
+ description: "a calc angle",
+ input: new CSSMathSum(new CSSUnitValue(0, 'rad'), new CSSUnitValue(0, 'deg')),
+ // Specified/computed calcs are usually simplified.
+ // FIXME: Test this properly
+ defaultSpecified: (_, result) => assert_is_calc_sum(result),
+ defaultComputed: (_, result) => assert_is_unit('deg', result)
+ }
+ ],
+ },
+ '<flex>': {
+ description: 'a flexible length',
+ examples: [
+ {
+ description: "zero fractions",
+ input: new CSSUnitValue(0, 'fr')
+ },
+ {
+ description: "one fraction",
+ input: new CSSUnitValue(1, 'fr')
+ },
+ // TODO(https://github.com/w3c/css-houdini-drafts/issues/734):
+ // Add calc tests involving 'fr' when that is spec'd in CSS.
+ ],
+ },
+ '<negative-flex>': {
+ description: 'a flexible length',
+ examples: [
+ {
+ description: "negative fraction",
+ input: new CSSUnitValue(-3.14, 'fr')
+ },
+ ],
+ },
+ '<number>': {
+ description: 'a number',
+ examples: [
+ {
+ description: 'the number zero',
+ input: new CSSUnitValue(0, 'number')
+ },
+ {
+ description: 'a negative number',
+ input: new CSSUnitValue(-3.14, 'number')
+ },
+ {
+ description: 'a positive number',
+ input: new CSSUnitValue(3.14, 'number')
+ },
+ {
+ description: "a calc number",
+ input: new CSSMathSum(new CSSUnitValue(2, 'number'), new CSSUnitValue(3, 'number')),
+ defaultSpecified: (_, result) => assert_is_calc_sum(result),
+ defaultComputed: (_, result) => {
+ assert_style_value_equals(result, new CSSUnitValue(5, 'number'));
+ }
+ }
+ ],
+ },
+ '<url>': {
+ description: 'a URL',
+ examples: [
+ // TODO(https://github.com/w3c/css-houdini-drafts/issues/716):
+ // We can't test this until CSSURLValue is spec'd.
+ ],
+ },
+ '<transform>': {
+ description: 'a transform',
+ examples: [
+ {
+ description: 'a transform containing percents',
+ input: new CSSTransformValue([
+ new CSSTranslate(
+ new CSSUnitValue(50, 'percent'),
+ new CSSUnitValue(50, 'percent'),
+ )
+ ]),
+ },
+ {
+ description: 'a transform containing relative values',
+ input: new CSSTransformValue([
+ new CSSPerspective(new CSSUnitValue(10, 'em'))
+ ]),
+ defaultComputed: (_, result) => {
+ // Relative units compute to absolute.
+ assert_class_string(result, 'CSSTransformValue',
+ 'Result must be a CSSTransformValue');
+ assert_class_string(result[0], 'CSSPerspective',
+ 'First component must be a CSSTransformValue');
+ assert_is_unit('px', result[0].length);
+ }
+ },
+ {
+ description: 'a transform containing all the transform components',
+ input: new CSSTransformValue([
+ new CSSTranslate(
+ new CSSUnitValue(0, 'px'),
+ new CSSUnitValue(1, 'px'),
+ new CSSUnitValue(2, 'px'),
+ ),
+ new CSSTranslate(
+ new CSSUnitValue(0, 'px'),
+ new CSSUnitValue(1, 'px'),
+ ),
+ new CSSRotate(1, 2, 3, new CSSUnitValue(45, 'deg')),
+ new CSSRotate(new CSSUnitValue(45, 'deg')),
+ new CSSScale(1, 2, 3),
+ new CSSScale(1, 2),
+ new CSSSkew(new CSSUnitValue(1, 'deg'), new CSSUnitValue(1, 'deg')),
+ new CSSSkewX(new CSSUnitValue(1, 'deg')),
+ new CSSSkewY(new CSSUnitValue(45, 'deg')),
+ new CSSPerspective(new CSSUnitValue(1, 'px')),
+ new CSSMatrixComponent(new DOMMatrixReadOnly(
+ [1, 2, 3, 4, 5, 6, 7, 8, 9, 10, 11, 12, 13, 14, 15, 16])
+ ),
+ new CSSMatrixComponent(new DOMMatrixReadOnly([1, 2, 3, 4, 5, 6])),
+ ]),
+ }
+ ],
+ },
+};
+
+// Test setting a value in a style map and then getting it from the inline and
+// computed styles.
+function testPropertyValid(propertyName, examples, specified, computed, description) {
+ for (const example of examples) {
+ test(t => {
+ let element = createDivWithStyle(t);
+
+ element.attributeStyleMap.set(propertyName, example.input);
+
+ // specified style
+ const specifiedResult = element.attributeStyleMap.get(propertyName);
+ assert_not_equals(specifiedResult, null,
+ 'Specified value must not be null');
+ assert_true(specifiedResult instanceof CSSStyleValue,
+ 'Specified value must be a CSSStyleValue');
+
+ if (specified || example.defaultSpecified) {
+ (specified || example.defaultSpecified)(example.specifiedExpected || example.input, specifiedResult);
+ } else {
+ assert_style_value_equals(specifiedResult, example.input,
+ `Setting ${example.description} and getting its specified value`);
+ }
+
+ // computed style
+ const computedResult = element.computedStyleMap().get(propertyName);
+ assert_not_equals(computedResult, null,
+ 'Computed value must not be null');
+ assert_true(computedResult instanceof CSSStyleValue,
+ 'Computed value must be a CSSStyleValue');
+
+ if (computed || example.defaultComputed) {
+ (computed || example.defaultComputed)(example.input, computedResult);
+ } else {
+ assert_style_value_equals(computedResult, example.input,
+ `Setting ${example.description} and getting its computed value`);
+ }
+ }, `Can set '${propertyName}' to ${description}: ${example.input}`);
+ }
+}
+
+// We have to special case CSSImageValue as they cannot be created with a
+// constructor and are completely opaque.
+function testIsImageValidForProperty(propertyName) {
+ test(t => {
+ let element1 = createDivWithStyle(t, `${propertyName}: url("/media/1x1-green.png")`);
+ let element2 = createDivWithStyle(t);
+
+ const result = element1.attributeStyleMap.get(propertyName);
+ assert_not_equals(result, null, 'Image value must not be null');
+ assert_class_string(result, 'CSSImageValue',
+ 'Image value must be a CSSImageValue');
+
+ element2.attributeStyleMap.set(propertyName, result);
+ assert_equals(element2.style[propertyName], element1.style[propertyName],
+ 'Image value can be set on different element');
+ }, `Can set '${propertyName}' to an image`);
+}
+
+// Test that styleMap.set throws for invalid values
+function testPropertyInvalid(propertyName, examples, description) {
+ for (const example of examples) {
+ test(t => {
+ let styleMap = createInlineStyleMap(t);
+ assert_throws_js(TypeError, () => styleMap.set(propertyName, example.input));
+ }, `Setting '${propertyName}' to ${description}: ${example.input} throws TypeError`);
+ }
+}
+
+// Test that styleMap.get/.set roundtrips correctly for unsupported values.
+function testUnsupportedValue(propertyName, cssText) {
+ test(t => {
+ let element1 = createDivWithStyle(t);
+ let element2 = createDivWithStyle(t);
+
+ element1.style[propertyName] = cssText;
+ const result = element1.attributeStyleMap.get(propertyName);
+ assert_not_equals(result, null,
+ 'Unsupported value must not be null');
+ assert_class_string(result, 'CSSStyleValue',
+ 'Unsupported value must be a CSSStyleValue and not one of its subclasses');
+
+ element2.attributeStyleMap.set(propertyName, result);
+ assert_equals(element2.style[propertyName], element1.style[propertyName],
+ 'Unsupported value can be set on different element');
+
+ const resultAll = element2.attributeStyleMap.getAll(propertyName);
+ assert_style_value_equals(resultAll[0], result,
+ `getAll() with single unsupported value returns single-item list ` +
+ `with same result as get()`);
+ }, `'${propertyName}' does not support '${cssText}'`);
+}
+
+function createKeywordExample(keyword) {
+ return {
+ description: `the '${keyword}' keyword`,
+ examples: [ { input: new CSSKeywordValue(keyword) } ]
+ };
+}
+
+// Run a battery of StylePropertyMap tests on |propertyName|.
+// Second argument is a list of test cases. A test case has the form:
+//
+// {
+// syntax: "<length>",
+// specified: /* a callback */ (optional)
+// computed: /* a callback */ (optional)
+// }
+//
+// If a callback is passed to |specified|, then the callback will be passed
+// two arguments:
+// 1. The input test case
+// 2. The result of calling get() on the inline style map (specified values).
+//
+// The callback should check if the result is expected using assert_* functions.
+// If no callback is passed, then we assert that the result is the same as
+// the input.
+//
+// Same goes for |computed|, but with the computed style map (computed values).
+//
+// FIXME: The reason we pass argument #2 is that it's sometimes difficult to
+// compute exactly what the expected result should be (e.g. browser-specific
+// values). Once we can do that, we can remove argument #2 and just return
+// the expected result.
+function runPropertyTests(propertyName, testCases) {
+ let syntaxTested = new Set();
+
+ // Every property should at least support CSS-wide keywords.
+ testPropertyValid(propertyName,
+ gCssWideKeywordsExamples,
+ null, // should be as specified
+ () => {}, // could be anything
+ 'CSS-wide keywords');
+
+ // Every property should support values containing var() references.
+ testPropertyValid(propertyName,
+ gVarReferenceExamples,
+ null, // should be as specified
+ () => {}, // could compute to anything
+ 'var() references');
+
+ for (const testCase of testCases) {
+ // <image> is a special case
+ if (testCase.syntax === '<image>') {
+ testIsImageValidForProperty(propertyName);
+ continue;
+ }
+
+ // Retrieve test examples for this test case's syntax. If the syntax
+ // looks like a keyword, then create an example on the fly.
+ const syntaxExamples = testCase.syntax.toLowerCase().match(/^[a-z0-9\-]+$/) ?
+ createKeywordExample(testCase.syntax) :
+ gTestSyntaxExamples[testCase.syntax];
+
+ if (!syntaxExamples)
+ throw new Error(`'${testCase.syntax}' is not a valid CSS component`);
+
+ testPropertyValid(propertyName,
+ syntaxExamples.examples,
+ testCase.specified,
+ testCase.computed,
+ syntaxExamples.description);
+
+ syntaxTested.add(testCase.syntax);
+ }
+
+ // Also test that styleMap.set rejects invalid CSSStyleValues.
+ for (const [syntax, syntaxExamples] of Object.entries(gTestSyntaxExamples)) {
+ if (!syntaxTested.has(syntax)) {
+ testPropertyInvalid(propertyName,
+ syntaxExamples.examples,
+ syntaxExamples.description);
+ }
+ }
+}
+
+// Same as runPropertyTests but for list-valued properties.
+function runListValuedPropertyTests(propertyName, testCases) {
+ // TODO(https://crbug.com/545318): Run list-valued tests as well.
+ runPropertyTests(propertyName, testCases);
+}
+
+// Check that |propertyName| doesn't "support" examples in |testExamples|.
+// |testExamples| is a list of CSS string values. An "unsupported" value
+// doesn't have a corresponding Typed OM representation. It normalizes as
+// the base CSSStyleValue.
+function runUnsupportedPropertyTests(propertyName, testExamples) {
+ for (const cssText of testExamples) {
+ testUnsupportedValue(propertyName, cssText);
+ }
+}
diff --git a/testing/web-platform/tests/css/css-typed-om/the-stylepropertymap/properties/right.html b/testing/web-platform/tests/css/css-typed-om/the-stylepropertymap/properties/right.html
new file mode 100644
index 0000000000..17488dfb02
--- /dev/null
+++ b/testing/web-platform/tests/css/css-typed-om/the-stylepropertymap/properties/right.html
@@ -0,0 +1,22 @@
+<!doctype html>
+<meta charset="utf-8">
+<title>'right' property</title>
+<link rel="help" href="https://drafts.css-houdini.org/css-typed-om-1/#dom-stylepropertymap-get">
+<link rel="help" href="https://drafts.css-houdini.org/css-typed-om-1/#dom-stylepropertymap-set">
+<link rel="help" href="https://drafts.css-houdini.org/css-typed-om-1/#property-stle-value-normalization">
+<script src="/resources/testharness.js"></script>
+<script src="/resources/testharnessreport.js"></script>
+<script src="../../resources/testhelper.js"></script>
+<script src="resources/testsuite.js"></script>
+<body>
+<div id="log"></div>
+<script>
+'use strict';
+
+runPropertyTests('right', [
+ { syntax: 'auto' },
+ { syntax: '<percentage>' },
+ { syntax: '<length>' },
+]);
+
+</script>
diff --git a/testing/web-platform/tests/css/css-typed-om/the-stylepropertymap/properties/scroll-behavior.html b/testing/web-platform/tests/css/css-typed-om/the-stylepropertymap/properties/scroll-behavior.html
new file mode 100644
index 0000000000..83baeb0d26
--- /dev/null
+++ b/testing/web-platform/tests/css/css-typed-om/the-stylepropertymap/properties/scroll-behavior.html
@@ -0,0 +1,21 @@
+<!doctype html>
+<meta charset="utf-8">
+<title>'scroll-behavior' property</title>
+<link rel="help" href="https://drafts.css-houdini.org/css-typed-om-1/#dom-stylepropertymap-get">
+<link rel="help" href="https://drafts.css-houdini.org/css-typed-om-1/#dom-stylepropertymap-set">
+<link rel="help" href="https://drafts.css-houdini.org/css-typed-om-1/#property-stle-value-normalization">
+<script src="/resources/testharness.js"></script>
+<script src="/resources/testharnessreport.js"></script>
+<script src="../../resources/testhelper.js"></script>
+<script src="resources/testsuite.js"></script>
+<body>
+<div id="log"></div>
+<script>
+'use strict';
+
+runPropertyTests('scroll-behavior', [
+ { syntax: 'auto' },
+ { syntax: 'smooth' },
+]);
+
+</script>
diff --git a/testing/web-platform/tests/css/css-typed-om/the-stylepropertymap/properties/scroll-margin.html b/testing/web-platform/tests/css/css-typed-om/the-stylepropertymap/properties/scroll-margin.html
new file mode 100644
index 0000000000..8f2cc07593
--- /dev/null
+++ b/testing/web-platform/tests/css/css-typed-om/the-stylepropertymap/properties/scroll-margin.html
@@ -0,0 +1,32 @@
+<!doctype html>
+<meta charset="utf-8">
+<title>scroll-margin related properties</title>
+<link rel="help" href="https://drafts.css-houdini.org/css-typed-om-1/#dom-stylepropertymap-get">
+<link rel="help" href="https://drafts.css-houdini.org/css-typed-om-1/#dom-stylepropertymap-set">
+<link rel="help" href="https://drafts.css-houdini.org/css-typed-om-1/#property-stle-value-normalization">
+<script src="/resources/testharness.js"></script>
+<script src="/resources/testharnessreport.js"></script>
+<script src="../../resources/testhelper.js"></script>
+<script src="resources/testsuite.js"></script>
+<body>
+<div id="log"></div>
+<script>
+'use strict';
+
+for (const suffix of ['top', 'left', 'right', 'bottom']) {
+ runPropertyTests('scroll-margin-' + suffix, [
+ { syntax: '<length>' },
+ ]);
+}
+
+for (const suffix of ['inline-start', 'block-start', 'inline-end', 'block-end']) {
+ runPropertyTests('scroll-margin-' + suffix, [
+ { syntax: '<length>' },
+ ]);
+}
+
+runUnsupportedPropertyTests('scroll-margin',
+ ['0px', '1px 2px', '3px 4px 5px', '6px 7px 8px 9px']
+);
+
+</script>
diff --git a/testing/web-platform/tests/css/css-typed-om/the-stylepropertymap/properties/scroll-padding.html b/testing/web-platform/tests/css/css-typed-om/the-stylepropertymap/properties/scroll-padding.html
new file mode 100644
index 0000000000..f4207a0803
--- /dev/null
+++ b/testing/web-platform/tests/css/css-typed-om/the-stylepropertymap/properties/scroll-padding.html
@@ -0,0 +1,57 @@
+<!doctype html>
+<meta charset="utf-8">
+<title>scroll-padding related properties</title>
+<link rel="help" href="https://drafts.css-houdini.org/css-typed-om-1/#dom-stylepropertymap-get">
+<link rel="help" href="https://drafts.css-houdini.org/css-typed-om-1/#dom-stylepropertymap-set">
+<link rel="help" href="https://drafts.css-houdini.org/css-typed-om-1/#property-stle-value-normalization">
+<script src="/resources/testharness.js"></script>
+<script src="/resources/testharnessreport.js"></script>
+<script src="../../resources/testhelper.js"></script>
+<script src="resources/testsuite.js"></script>
+<body>
+<div id="log"></div>
+<script>
+'use strict';
+
+function assert_is_equal_with_clamping_percentage(input, result) {
+ const percent = input.to('percent').value;
+
+ if (percent < 0)
+ assert_style_value_equals(result, new CSSUnitValue(0, 'percent'));
+ else
+ assert_style_value_equals(result, new CSSUnitValue(percent, 'percent'));
+}
+
+for (const suffix of ['top', 'left', 'right', 'bottom']) {
+ runPropertyTests('scroll-padding-' + suffix, [
+ {
+ syntax: '<percentage>',
+ specified: assert_is_equal_with_range_handling,
+ computed: assert_is_equal_with_clamping_percentage
+ },
+ {
+ syntax: '<length>',
+ specified: assert_is_equal_with_range_handling
+ },
+ ]);
+}
+
+for (const suffix of ['inline-start', 'block-start', 'inline-end', 'block-end']) {
+ runPropertyTests('scroll-padding-' + suffix, [
+ {
+ syntax: '<percentage>',
+ specified: assert_is_equal_with_range_handling,
+ computed: assert_is_equal_with_clamping_percentage
+ },
+ {
+ syntax: '<length>',
+ specified: assert_is_equal_with_range_handling,
+ },
+ ]);
+}
+
+runUnsupportedPropertyTests('scroll-padding',
+ ['0%', '1px 2px', '3% 4px 5%', '6px 7% 8% 9px']
+);
+
+</script>
diff --git a/testing/web-platform/tests/css/css-typed-om/the-stylepropertymap/properties/scroll-snap-align.html b/testing/web-platform/tests/css/css-typed-om/the-stylepropertymap/properties/scroll-snap-align.html
new file mode 100644
index 0000000000..fd92a90a0c
--- /dev/null
+++ b/testing/web-platform/tests/css/css-typed-om/the-stylepropertymap/properties/scroll-snap-align.html
@@ -0,0 +1,39 @@
+<!doctype html>
+<meta charset="utf-8">
+<title>'scroll-snap-align' property</title>
+<link rel="help" href="https://drafts.css-houdini.org/css-typed-om-1/#dom-stylepropertymap-get">
+<link rel="help" href="https://drafts.css-houdini.org/css-typed-om-1/#dom-stylepropertymap-set">
+<link rel="help" href="https://drafts.css-houdini.org/css-typed-om-1/#property-stle-value-normalization">
+<script src="/resources/testharness.js"></script>
+<script src="/resources/testharnessreport.js"></script>
+<script src="../../resources/testhelper.js"></script>
+<script src="resources/testsuite.js"></script>
+<body>
+<div id="log"></div>
+<script>
+'use strict';
+
+runPropertyTests('scroll-snap-align', [
+ {
+ syntax: 'none',
+ computed: assert_is_unsupported
+ },
+ {
+ syntax: 'start',
+ computed: assert_is_unsupported
+ },
+ {
+ syntax: 'end',
+ computed: assert_is_unsupported
+ },
+ {
+ syntax: 'center',
+ computed: assert_is_unsupported
+ },
+]);
+
+runUnsupportedPropertyTests('scroll-snap-align', [
+ 'none center', 'end start'
+]);
+
+</script>
diff --git a/testing/web-platform/tests/css/css-typed-om/the-stylepropertymap/properties/scroll-snap-stop.html b/testing/web-platform/tests/css/css-typed-om/the-stylepropertymap/properties/scroll-snap-stop.html
new file mode 100644
index 0000000000..959a240a4f
--- /dev/null
+++ b/testing/web-platform/tests/css/css-typed-om/the-stylepropertymap/properties/scroll-snap-stop.html
@@ -0,0 +1,21 @@
+<!doctype html>
+<meta charset="utf-8">
+<title>'scroll-snap-stop' property</title>
+<link rel="help" href="https://drafts.css-houdini.org/css-typed-om-1/#dom-stylepropertymap-get">
+<link rel="help" href="https://drafts.css-houdini.org/css-typed-om-1/#dom-stylepropertymap-set">
+<link rel="help" href="https://drafts.css-houdini.org/css-typed-om-1/#property-stle-value-normalization">
+<script src="/resources/testharness.js"></script>
+<script src="/resources/testharnessreport.js"></script>
+<script src="../../resources/testhelper.js"></script>
+<script src="resources/testsuite.js"></script>
+<body>
+<div id="log"></div>
+<script>
+'use strict';
+
+runPropertyTests('scroll-snap-stop', [
+ { syntax: 'normal' },
+ { syntax: 'always' },
+]);
+
+</script>
diff --git a/testing/web-platform/tests/css/css-typed-om/the-stylepropertymap/properties/scroll-snap-type.html b/testing/web-platform/tests/css/css-typed-om/the-stylepropertymap/properties/scroll-snap-type.html
new file mode 100644
index 0000000000..4f9c4a46b6
--- /dev/null
+++ b/testing/web-platform/tests/css/css-typed-om/the-stylepropertymap/properties/scroll-snap-type.html
@@ -0,0 +1,29 @@
+<!doctype html>
+<meta charset="utf-8">
+<title>'scroll-snap-type' property</title>
+<link rel="help" href="https://drafts.css-houdini.org/css-typed-om-1/#dom-stylepropertymap-get">
+<link rel="help" href="https://drafts.css-houdini.org/css-typed-om-1/#dom-stylepropertymap-set">
+<link rel="help" href="https://drafts.css-houdini.org/css-typed-om-1/#property-stle-value-normalization">
+<script src="/resources/testharness.js"></script>
+<script src="/resources/testharnessreport.js"></script>
+<script src="../../resources/testhelper.js"></script>
+<script src="resources/testsuite.js"></script>
+<body>
+<div id="log"></div>
+<script>
+'use strict';
+
+runPropertyTests('scroll-snap-type', [
+ { syntax: 'none' },
+ { syntax: 'x' },
+ { syntax: 'y' },
+ { syntax: 'block' },
+ { syntax: 'inline' },
+ { syntax: 'both' },
+]);
+
+runUnsupportedPropertyTests('scroll-snap-type', [
+ 'x mandatory', 'inline proximity'
+]);
+
+</script>
diff --git a/testing/web-platform/tests/css/css-typed-om/the-stylepropertymap/properties/scrollbar-gutter.html b/testing/web-platform/tests/css/css-typed-om/the-stylepropertymap/properties/scrollbar-gutter.html
new file mode 100644
index 0000000000..8bcdf0f288
--- /dev/null
+++ b/testing/web-platform/tests/css/css-typed-om/the-stylepropertymap/properties/scrollbar-gutter.html
@@ -0,0 +1,24 @@
+<!doctype html>
+<meta charset="utf-8">
+<title>'scrollbar-gutter' property</title>
+<link rel="help" href="https://drafts.css-houdini.org/css-typed-om-1/#dom-stylepropertymap-get">
+<link rel="help" href="https://drafts.css-houdini.org/css-typed-om-1/#dom-stylepropertymap-set">
+<link rel="help" href="https://drafts.css-houdini.org/css-typed-om-1/#property-stle-value-normalization">
+<script src="/resources/testharness.js"></script>
+<script src="/resources/testharnessreport.js"></script>
+<script src="../../resources/testhelper.js"></script>
+<script src="resources/testsuite.js"></script>
+<body>
+<div id="log"></div>
+<script>
+'use strict';
+
+runPropertyTests('scrollbar-gutter', [
+ { syntax: 'auto' },
+ { syntax: 'stable' }
+]);
+runUnsupportedPropertyTests('scrollbar-gutter', [
+ 'stable both-edges'
+]);
+
+</script>
diff --git a/testing/web-platform/tests/css/css-typed-om/the-stylepropertymap/properties/scrollbar-width.html b/testing/web-platform/tests/css/css-typed-om/the-stylepropertymap/properties/scrollbar-width.html
new file mode 100644
index 0000000000..19a6ebd5b9
--- /dev/null
+++ b/testing/web-platform/tests/css/css-typed-om/the-stylepropertymap/properties/scrollbar-width.html
@@ -0,0 +1,22 @@
+<!doctype html>
+<meta charset="utf-8">
+<title>'scrollbar-width' property</title>
+<link rel="help" href="https://drafts.css-houdini.org/css-typed-om-1/#dom-stylepropertymap-get">
+<link rel="help" href="https://drafts.css-houdini.org/css-typed-om-1/#dom-stylepropertymap-set">
+<link rel="help" href="https://drafts.css-houdini.org/css-typed-om-1/#property-stle-value-normalization">
+<script src="/resources/testharness.js"></script>
+<script src="/resources/testharnessreport.js"></script>
+<script src="../../resources/testhelper.js"></script>
+<script src="resources/testsuite.js"></script>
+<body>
+<div id="log"></div>
+<script>
+'use strict';
+
+runPropertyTests('scrollbar-width', [
+ { syntax: 'auto' },
+ { syntax: 'thin' },
+ { syntax: 'none' },
+]);
+
+</script>
diff --git a/testing/web-platform/tests/css/css-typed-om/the-stylepropertymap/properties/shape-image-threshold.html b/testing/web-platform/tests/css/css-typed-om/the-stylepropertymap/properties/shape-image-threshold.html
new file mode 100644
index 0000000000..d16d892c46
--- /dev/null
+++ b/testing/web-platform/tests/css/css-typed-om/the-stylepropertymap/properties/shape-image-threshold.html
@@ -0,0 +1,34 @@
+<!doctype html>
+<meta charset="utf-8">
+<title>'shape-image-threshold' property</title>
+<link rel="help" href="https://drafts.css-houdini.org/css-typed-om-1/#dom-stylepropertymap-get">
+<link rel="help" href="https://drafts.css-houdini.org/css-typed-om-1/#dom-stylepropertymap-set">
+<link rel="help" href="https://drafts.css-houdini.org/css-typed-om-1/#property-stle-value-normalization">
+<script src="/resources/testharness.js"></script>
+<script src="/resources/testharnessreport.js"></script>
+<script src="../../resources/testhelper.js"></script>
+<script src="resources/testsuite.js"></script>
+<body>
+<div id="log"></div>
+<script>
+'use strict';
+
+function assert_is_equal_with_clamping(input, result) {
+ const number = input.to('number');
+
+ if (number.value < 0)
+ assert_style_value_equals(result, new CSSUnitValue(0, 'number'));
+ else if (number.value > 1)
+ assert_style_value_equals(result, new CSSUnitValue(1, 'number'));
+ else
+ assert_style_value_equals(result, input);
+}
+
+runPropertyTests('shape-image-threshold', [
+ {
+ syntax: '<number>',
+ computed: assert_is_equal_with_clamping
+ },
+]);
+
+</script>
diff --git a/testing/web-platform/tests/css/css-typed-om/the-stylepropertymap/properties/shape-margin.html b/testing/web-platform/tests/css/css-typed-om/the-stylepropertymap/properties/shape-margin.html
new file mode 100644
index 0000000000..60adc7aff5
--- /dev/null
+++ b/testing/web-platform/tests/css/css-typed-om/the-stylepropertymap/properties/shape-margin.html
@@ -0,0 +1,37 @@
+<!doctype html>
+<meta charset="utf-8">
+<title>'shape-margin' property</title>
+<link rel="help" href="https://drafts.css-houdini.org/css-typed-om-1/#dom-stylepropertymap-get">
+<link rel="help" href="https://drafts.css-houdini.org/css-typed-om-1/#dom-stylepropertymap-set">
+<link rel="help" href="https://drafts.css-houdini.org/css-typed-om-1/#property-stle-value-normalization">
+<script src="/resources/testharness.js"></script>
+<script src="/resources/testharnessreport.js"></script>
+<script src="../../resources/testhelper.js"></script>
+<script src="resources/testsuite.js"></script>
+<body>
+<div id="log"></div>
+<script>
+'use strict';
+
+function assert_is_equal_with_clamping_percentage(input, result) {
+ const percent = input.to('percent').value;
+
+ if (percent < 0)
+ assert_style_value_equals(result, new CSSUnitValue(0, 'percent'));
+ else
+ assert_style_value_equals(result, new CSSUnitValue(percent, 'percent'));
+}
+
+runPropertyTests('shape-margin', [
+ {
+ syntax: '<length>',
+ specified: assert_is_equal_with_range_handling
+ },
+ {
+ syntax: '<percentage>',
+ specified: assert_is_equal_with_range_handling,
+ computed: assert_is_equal_with_clamping_percentage
+ },
+]);
+
+</script>
diff --git a/testing/web-platform/tests/css/css-typed-om/the-stylepropertymap/properties/shape-outside.html b/testing/web-platform/tests/css/css-typed-om/the-stylepropertymap/properties/shape-outside.html
new file mode 100644
index 0000000000..d514c83806
--- /dev/null
+++ b/testing/web-platform/tests/css/css-typed-om/the-stylepropertymap/properties/shape-outside.html
@@ -0,0 +1,33 @@
+<!doctype html>
+<meta charset="utf-8">
+<title>'shape-outside' property</title>
+<link rel="help" href="https://drafts.css-houdini.org/css-typed-om-1/#dom-stylepropertymap-get">
+<link rel="help" href="https://drafts.css-houdini.org/css-typed-om-1/#dom-stylepropertymap-set">
+<link rel="help" href="https://drafts.css-houdini.org/css-typed-om-1/#property-stle-value-normalization">
+<script src="/resources/testharness.js"></script>
+<script src="/resources/testharnessreport.js"></script>
+<script src="../../resources/testhelper.js"></script>
+<script src="resources/testsuite.js"></script>
+<body>
+<div id="log"></div>
+<script>
+'use strict';
+
+runPropertyTests('shape-outside', [
+ { syntax: 'none' },
+ { syntax: 'margin-box' },
+ { syntax: 'border-box' },
+ { syntax: 'padding-box' },
+ { syntax: 'content-box' },
+ { syntax: '<image>' },
+]);
+
+// <basic-shape>s are not supported in level 1
+runUnsupportedPropertyTests('shape-outside', [
+ 'inset(22% 12% 15px 35px)',
+ 'circle(6rem at 12rem 6rem)',
+ 'ellipse(115px 55px at 50% 40%)',
+ 'polygon(50% 20%, 90% 80%, 10% 80%)',
+]);
+
+</script>
diff --git a/testing/web-platform/tests/css/css-typed-om/the-stylepropertymap/properties/shape-rendering.html b/testing/web-platform/tests/css/css-typed-om/the-stylepropertymap/properties/shape-rendering.html
new file mode 100644
index 0000000000..f7cb4199a5
--- /dev/null
+++ b/testing/web-platform/tests/css/css-typed-om/the-stylepropertymap/properties/shape-rendering.html
@@ -0,0 +1,23 @@
+<!doctype html>
+<meta charset="utf-8">
+<title>'shape-rendering' property</title>
+<link rel="help" href="https://drafts.css-houdini.org/css-typed-om-1/#dom-stylepropertymap-get">
+<link rel="help" href="https://drafts.css-houdini.org/css-typed-om-1/#dom-stylepropertymap-set">
+<link rel="help" href="https://drafts.css-houdini.org/css-typed-om-1/#property-stle-value-normalization">
+<script src="/resources/testharness.js"></script>
+<script src="/resources/testharnessreport.js"></script>
+<script src="../../resources/testhelper.js"></script>
+<script src="resources/testsuite.js"></script>
+<body>
+<div id="log"></div>
+<script>
+'use strict';
+
+runPropertyTests('shape-rendering', [
+ { syntax: 'auto' },
+ { syntax: 'optimizespeed' },
+ { syntax: 'crispedges' },
+ { syntax: 'geometricprecision' },
+]);
+
+</script>
diff --git a/testing/web-platform/tests/css/css-typed-om/the-stylepropertymap/properties/speak.html b/testing/web-platform/tests/css/css-typed-om/the-stylepropertymap/properties/speak.html
new file mode 100644
index 0000000000..33512fe24a
--- /dev/null
+++ b/testing/web-platform/tests/css/css-typed-om/the-stylepropertymap/properties/speak.html
@@ -0,0 +1,22 @@
+<!doctype html>
+<meta charset="utf-8">
+<title>'speak' property</title>
+<link rel="help" href="https://drafts.css-houdini.org/css-typed-om-1/#dom-stylepropertymap-get">
+<link rel="help" href="https://drafts.css-houdini.org/css-typed-om-1/#dom-stylepropertymap-set">
+<link rel="help" href="https://drafts.css-houdini.org/css-typed-om-1/#property-stle-value-normalization">
+<script src="/resources/testharness.js"></script>
+<script src="/resources/testharnessreport.js"></script>
+<script src="../../resources/testhelper.js"></script>
+<script src="resources/testsuite.js"></script>
+<body>
+<div id="log"></div>
+<script>
+'use strict';
+
+runPropertyTests('speak', [
+ { syntax: 'auto' },
+ { syntax: 'never' },
+ { syntax: 'always' },
+]);
+
+</script>
diff --git a/testing/web-platform/tests/css/css-typed-om/the-stylepropertymap/properties/stop-color.html b/testing/web-platform/tests/css/css-typed-om/the-stylepropertymap/properties/stop-color.html
new file mode 100644
index 0000000000..83dcf0218a
--- /dev/null
+++ b/testing/web-platform/tests/css/css-typed-om/the-stylepropertymap/properties/stop-color.html
@@ -0,0 +1,30 @@
+<!doctype html>
+<meta charset="utf-8">
+<title>'stop-color' property</title>
+<link rel="help" href="https://drafts.css-houdini.org/css-typed-om-1/#dom-stylepropertymap-get">
+<link rel="help" href="https://drafts.css-houdini.org/css-typed-om-1/#dom-stylepropertymap-set">
+<link rel="help" href="https://drafts.css-houdini.org/css-typed-om-1/#property-stle-value-normalization">
+<script src="/resources/testharness.js"></script>
+<script src="/resources/testharnessreport.js"></script>
+<script src="../../resources/testhelper.js"></script>
+<script src="resources/testsuite.js"></script>
+<body>
+<div id="log"></div>
+<script>
+'use strict';
+
+runPropertyTests('stop-color', [
+ {
+ syntax: 'currentcolor',
+ // computes to a <color>, which is not supported in level 1
+ computed: (_, result) => assert_class_string(result, 'CSSStyleValue')
+ }
+]);
+
+// <color>s are not supported in level 1
+runUnsupportedPropertyTests('stop-color', [
+ 'red', '#bbff00', 'rgb(255, 255, 128)', 'hsl(50, 33%, 25%)',
+ 'transparent'
+]);
+
+</script>
diff --git a/testing/web-platform/tests/css/css-typed-om/the-stylepropertymap/properties/stop-opacity.html b/testing/web-platform/tests/css/css-typed-om/the-stylepropertymap/properties/stop-opacity.html
new file mode 100644
index 0000000000..9baf40dd0b
--- /dev/null
+++ b/testing/web-platform/tests/css/css-typed-om/the-stylepropertymap/properties/stop-opacity.html
@@ -0,0 +1,49 @@
+<!doctype html>
+<meta charset="utf-8">
+<title>'stop-opacity' property</title>
+<link rel="help" href="https://drafts.css-houdini.org/css-typed-om-1/#dom-stylepropertymap-get">
+<link rel="help" href="https://drafts.css-houdini.org/css-typed-om-1/#dom-stylepropertymap-set">
+<link rel="help" href="https://drafts.css-houdini.org/css-typed-om-1/#property-stle-value-normalization">
+<script src="/resources/testharness.js"></script>
+<script src="/resources/testharnessreport.js"></script>
+<script src="../../resources/testhelper.js"></script>
+<script src="resources/testsuite.js"></script>
+<body>
+<div id="log"></div>
+<script>
+'use strict';
+
+function assert_is_equal_with_clamping_number(input, result) {
+ const number = input.to('number');
+
+ if (number.value < 0)
+ assert_style_value_equals(result, new CSSUnitValue(0, 'number'));
+ else if (number.value > 1)
+ assert_style_value_equals(result, new CSSUnitValue(1, 'number'));
+ else
+ assert_style_value_equals(result, input);
+}
+
+function assert_is_equal_with_clamping_percentage(input, result) {
+ const number = input.to('percent').value / 100.;
+
+ if (number < 0)
+ assert_style_value_equals(result, new CSSUnitValue(0, 'number'));
+ else if (number > 1)
+ assert_style_value_equals(result, new CSSUnitValue(1, 'number'));
+ else
+ assert_style_value_equals(result, new CSSUnitValue(number, 'number'));
+}
+
+runPropertyTests('stop-opacity', [
+ {
+ syntax: '<number>',
+ computed: assert_is_equal_with_clamping_number
+ },
+ {
+ syntax: '<percentage>',
+ computed: assert_is_equal_with_clamping_percentage
+ },
+]);
+
+</script>
diff --git a/testing/web-platform/tests/css/css-typed-om/the-stylepropertymap/properties/stroke-dasharray.html b/testing/web-platform/tests/css/css-typed-om/the-stylepropertymap/properties/stroke-dasharray.html
new file mode 100644
index 0000000000..6c3731cc48
--- /dev/null
+++ b/testing/web-platform/tests/css/css-typed-om/the-stylepropertymap/properties/stroke-dasharray.html
@@ -0,0 +1,47 @@
+<!doctype html>
+<meta charset="utf-8">
+<title>'stroke-dasharray' property</title>
+<link rel="help" href="https://drafts.css-houdini.org/css-typed-om-1/#dom-stylepropertymap-get">
+<link rel="help" href="https://drafts.css-houdini.org/css-typed-om-1/#dom-stylepropertymap-set">
+<link rel="help" href="https://drafts.css-houdini.org/css-typed-om-1/#property-stle-value-normalization">
+<script src="/resources/testharness.js"></script>
+<script src="/resources/testharnessreport.js"></script>
+<script src="../../resources/testhelper.js"></script>
+<script src="resources/testsuite.js"></script>
+<body>
+<div id="log"></div>
+<script>
+'use strict';
+
+function assert_is_equal_with_clamping_percentage(input, result) {
+ const percent = input.to('percent').value;
+
+ if (percent < 0)
+ assert_style_value_equals(result, new CSSUnitValue(0, 'percent'));
+ else
+ assert_style_value_equals(result, new CSSUnitValue(percent, 'percent'));
+}
+
+runPropertyTests('stroke-dasharray', [
+ { syntax: 'none' },
+ {
+ syntax: '<length>',
+ specified: assert_is_equal_with_range_handling,
+ },
+ {
+ syntax: '<percentage>',
+ specified: assert_is_equal_with_range_handling,
+ computed: assert_is_equal_with_clamping_percentage
+ },
+ {
+ syntax: '<number>',
+ specified: assert_is_equal_with_range_handling,
+ computed: (_, result) => assert_is_unit('px', result)
+ },
+]);
+
+runUnsupportedPropertyTests('stroke-dasharray', [
+ '5% 1em 2%',
+]);
+
+</script>
diff --git a/testing/web-platform/tests/css/css-typed-om/the-stylepropertymap/properties/stroke-dashoffset.html b/testing/web-platform/tests/css/css-typed-om/the-stylepropertymap/properties/stroke-dashoffset.html
new file mode 100644
index 0000000000..f537d8049b
--- /dev/null
+++ b/testing/web-platform/tests/css/css-typed-om/the-stylepropertymap/properties/stroke-dashoffset.html
@@ -0,0 +1,25 @@
+<!doctype html>
+<meta charset="utf-8">
+<title>'stroke-dashoffset' property</title>
+<link rel="help" href="https://drafts.css-houdini.org/css-typed-om-1/#dom-stylepropertymap-get">
+<link rel="help" href="https://drafts.css-houdini.org/css-typed-om-1/#dom-stylepropertymap-set">
+<link rel="help" href="https://drafts.css-houdini.org/css-typed-om-1/#property-stle-value-normalization">
+<script src="/resources/testharness.js"></script>
+<script src="/resources/testharnessreport.js"></script>
+<script src="../../resources/testhelper.js"></script>
+<script src="resources/testsuite.js"></script>
+<body>
+<div id="log"></div>
+<script>
+'use strict';
+
+runPropertyTests('stroke-dashoffset', [
+ { syntax: '<length>' },
+ { syntax: '<percentage>' },
+ {
+ syntax: '<number>',
+ computed: (_, result) => assert_is_unit('px', result)
+ },
+]);
+
+</script>
diff --git a/testing/web-platform/tests/css/css-typed-om/the-stylepropertymap/properties/stroke-linecap.html b/testing/web-platform/tests/css/css-typed-om/the-stylepropertymap/properties/stroke-linecap.html
new file mode 100644
index 0000000000..227b92274d
--- /dev/null
+++ b/testing/web-platform/tests/css/css-typed-om/the-stylepropertymap/properties/stroke-linecap.html
@@ -0,0 +1,22 @@
+<!doctype html>
+<meta charset="utf-8">
+<title>'stroke-linecap' property</title>
+<link rel="help" href="https://drafts.css-houdini.org/css-typed-om-1/#dom-stylepropertymap-get">
+<link rel="help" href="https://drafts.css-houdini.org/css-typed-om-1/#dom-stylepropertymap-set">
+<link rel="help" href="https://drafts.css-houdini.org/css-typed-om-1/#property-stle-value-normalization">
+<script src="/resources/testharness.js"></script>
+<script src="/resources/testharnessreport.js"></script>
+<script src="../../resources/testhelper.js"></script>
+<script src="resources/testsuite.js"></script>
+<body>
+<div id="log"></div>
+<script>
+'use strict';
+
+runPropertyTests('stroke-linecap', [
+ { syntax: 'butt' },
+ { syntax: 'round' },
+ { syntax: 'square' },
+]);
+
+</script>
diff --git a/testing/web-platform/tests/css/css-typed-om/the-stylepropertymap/properties/stroke-linejoin.html b/testing/web-platform/tests/css/css-typed-om/the-stylepropertymap/properties/stroke-linejoin.html
new file mode 100644
index 0000000000..2f01ee7f2a
--- /dev/null
+++ b/testing/web-platform/tests/css/css-typed-om/the-stylepropertymap/properties/stroke-linejoin.html
@@ -0,0 +1,29 @@
+<!doctype html>
+<meta charset="utf-8">
+<title>'stroke-linejoin' property</title>
+<link rel="help" href="https://drafts.css-houdini.org/css-typed-om-1/#dom-stylepropertymap-get">
+<link rel="help" href="https://drafts.css-houdini.org/css-typed-om-1/#dom-stylepropertymap-set">
+<link rel="help" href="https://drafts.css-houdini.org/css-typed-om-1/#property-stle-value-normalization">
+<script src="/resources/testharness.js"></script>
+<script src="/resources/testharnessreport.js"></script>
+<script src="../../resources/testhelper.js"></script>
+<script src="resources/testsuite.js"></script>
+<body>
+<div id="log"></div>
+<script>
+'use strict';
+
+runPropertyTests('stroke-linejoin', [
+ { syntax: 'crop' },
+ { syntax: 'arcs' },
+ { syntax: 'miter' },
+ { syntax: 'bevel' },
+ { syntax: 'round' },
+ { syntax: 'stupid' },
+]);
+
+runUnsupportedPropertyTests('stroke-linejoin', [
+ 'crop bevel', 'round arcs'
+]);
+
+</script>
diff --git a/testing/web-platform/tests/css/css-typed-om/the-stylepropertymap/properties/stroke-miterlimit.html b/testing/web-platform/tests/css/css-typed-om/the-stylepropertymap/properties/stroke-miterlimit.html
new file mode 100644
index 0000000000..914422c93d
--- /dev/null
+++ b/testing/web-platform/tests/css/css-typed-om/the-stylepropertymap/properties/stroke-miterlimit.html
@@ -0,0 +1,30 @@
+<!doctype html>
+<meta charset="utf-8">
+<title>'stroke-miterlimit' property</title>
+<link rel="help" href="https://drafts.css-houdini.org/css-typed-om-1/#dom-stylepropertymap-get">
+<link rel="help" href="https://drafts.css-houdini.org/css-typed-om-1/#dom-stylepropertymap-set">
+<link rel="help" href="https://drafts.css-houdini.org/css-typed-om-1/#property-stle-value-normalization">
+<script src="/resources/testharness.js"></script>
+<script src="/resources/testharnessreport.js"></script>
+<script src="../../resources/testhelper.js"></script>
+<script src="resources/testsuite.js"></script>
+<body>
+<div id="log"></div>
+<script>
+'use strict';
+
+runPropertyTests('stroke-miterlimit', [
+ {
+ syntax: '<number>',
+ specified: assert_is_equal_with_range_handling,
+ computed: (input, result) => {
+ const number = input.to('number');
+ if (number.value < 0)
+ assert_style_value_equals(result, new CSSUnitValue(0, 'number'));
+ else
+ assert_style_value_equals(result, new CSSUnitValue(number.value, 'number'));
+ }
+ },
+]);
+
+</script>
diff --git a/testing/web-platform/tests/css/css-typed-om/the-stylepropertymap/properties/stroke-opacity.html b/testing/web-platform/tests/css/css-typed-om/the-stylepropertymap/properties/stroke-opacity.html
new file mode 100644
index 0000000000..94f5cba025
--- /dev/null
+++ b/testing/web-platform/tests/css/css-typed-om/the-stylepropertymap/properties/stroke-opacity.html
@@ -0,0 +1,48 @@
+<!doctype html>
+<meta charset="utf-8">
+<title>'stroke-opacity' property</title>
+<link rel="help" href="https://drafts.css-houdini.org/css-typed-om-1/#dom-stylepropertymap-get">
+<link rel="help" href="https://drafts.css-houdini.org/css-typed-om-1/#dom-stylepropertymap-set">
+<link rel="help" href="https://drafts.css-houdini.org/css-typed-om-1/#property-stle-value-normalization">
+<script src="/resources/testharness.js"></script>
+<script src="/resources/testharnessreport.js"></script>
+<script src="../../resources/testhelper.js"></script>
+<script src="resources/testsuite.js"></script>
+<body>
+<div id="log"></div>
+<script>
+'use strict';
+
+function assert_is_equal_with_clamping_number(input, result) {
+ const number = input.to('number');
+
+ if (number.value < 0)
+ assert_style_value_equals(result, new CSSUnitValue(0, 'number'));
+ else if (number.value > 1)
+ assert_style_value_equals(result, new CSSUnitValue(1, 'number'));
+ else
+ assert_style_value_equals(result, input);
+}
+
+function assert_is_equal_with_clamping_percentage(input, result) {
+ const number = input.to('percent').value / 100.;
+
+ if (number < 0)
+ assert_style_value_equals(result, new CSSUnitValue(0, 'number'));
+ else if (number > 1)
+ assert_style_value_equals(result, new CSSUnitValue(100, 'number'));
+ else
+ assert_style_value_equals(result, new CSSUnitValue(number, 'number'));
+}
+
+runPropertyTests('stroke-opacity', [
+ {
+ syntax: '<number>',
+ computed: assert_is_equal_with_clamping_number
+ },
+ { syntax: '<percentage>',
+ computed: assert_is_equal_with_clamping_percentage
+ }
+]);
+
+</script>
diff --git a/testing/web-platform/tests/css/css-typed-om/the-stylepropertymap/properties/stroke-width.html b/testing/web-platform/tests/css/css-typed-om/the-stylepropertymap/properties/stroke-width.html
new file mode 100644
index 0000000000..abe7098a44
--- /dev/null
+++ b/testing/web-platform/tests/css/css-typed-om/the-stylepropertymap/properties/stroke-width.html
@@ -0,0 +1,39 @@
+<!doctype html>
+<meta charset="utf-8">
+<title>'stroke-width' property</title>
+<link rel="help" href="https://drafts.css-houdini.org/css-typed-om-1/#dom-stylepropertymap-get">
+<link rel="help" href="https://drafts.css-houdini.org/css-typed-om-1/#dom-stylepropertymap-set">
+<link rel="help" href="https://drafts.css-houdini.org/css-typed-om-1/#property-stle-value-normalization">
+<script src="/resources/testharness.js"></script>
+<script src="/resources/testharnessreport.js"></script>
+<script src="../../resources/testhelper.js"></script>
+<script src="resources/testsuite.js"></script>
+<body>
+<div id="log"></div>
+<script>
+'use strict';
+
+runListValuedPropertyTests('stroke-width', [
+ {
+ syntax: '<length>',
+ specified: assert_is_equal_with_range_handling
+ },
+ {
+ syntax: '<percentage>',
+ specified: assert_is_equal_with_range_handling,
+ computed: (input, result) => {
+ const percent = input.to('percent').value;
+ if (percent < 0)
+ assert_style_value_equals(result, new CSSUnitValue(0, 'percent'));
+ else
+ assert_style_value_equals(result, new CSSUnitValue(percent, 'percent'));
+ }
+ },
+ {
+ syntax: '<number>',
+ specified: assert_is_equal_with_range_handling,
+ computed: (_, result) => assert_is_unit('px', result)
+ },
+]);
+
+</script>
diff --git a/testing/web-platform/tests/css/css-typed-om/the-stylepropertymap/properties/stroke.html b/testing/web-platform/tests/css/css-typed-om/the-stylepropertymap/properties/stroke.html
new file mode 100644
index 0000000000..ff81024a94
--- /dev/null
+++ b/testing/web-platform/tests/css/css-typed-om/the-stylepropertymap/properties/stroke.html
@@ -0,0 +1,21 @@
+<!doctype html>
+<meta charset="utf-8">
+<title>'stroke' property</title>
+<link rel="help" href="https://drafts.css-houdini.org/css-typed-om-1/#dom-stylepropertymap-get">
+<link rel="help" href="https://drafts.css-houdini.org/css-typed-om-1/#dom-stylepropertymap-set">
+<link rel="help" href="https://drafts.css-houdini.org/css-typed-om-1/#property-stle-value-normalization">
+<script src="/resources/testharness.js"></script>
+<script src="/resources/testharnessreport.js"></script>
+<script src="../../resources/testhelper.js"></script>
+<script src="resources/testsuite.js"></script>
+<body>
+<div id="log"></div>
+<script>
+'use strict';
+
+runUnsupportedPropertyTests('stroke', [
+ 'black',
+ 'red gray',
+]);
+
+</script>
diff --git a/testing/web-platform/tests/css/css-typed-om/the-stylepropertymap/properties/tab-size.html b/testing/web-platform/tests/css/css-typed-om/the-stylepropertymap/properties/tab-size.html
new file mode 100644
index 0000000000..099349e08e
--- /dev/null
+++ b/testing/web-platform/tests/css/css-typed-om/the-stylepropertymap/properties/tab-size.html
@@ -0,0 +1,42 @@
+<!doctype html>
+<meta charset="utf-8">
+<title>'tab-size' property</title>
+<link rel="help" href="https://drafts.css-houdini.org/css-typed-om-1/#dom-stylepropertymap-get">
+<link rel="help" href="https://drafts.css-houdini.org/css-typed-om-1/#dom-stylepropertymap-set">
+<link rel="help" href="https://drafts.css-houdini.org/css-typed-om-1/#property-stle-value-normalization">
+<script src="/resources/testharness.js"></script>
+<script src="/resources/testharnessreport.js"></script>
+<script src="../../resources/testhelper.js"></script>
+<script src="resources/testsuite.js"></script>
+<body>
+<div id="log"></div>
+<script>
+'use strict';
+
+runPropertyTests('tab-size', [
+ {
+ // tab-size can be a non-negative number
+ syntax: '<number>',
+ specified: (input, result) => {
+ if (input instanceof CSSUnitValue && (!Number.isInteger(input.value) || input.value < 0))
+ assert_style_value_equals(result, new CSSMathSum(input));
+ else
+ assert_style_value_equals(result, input);
+ },
+ computed: (input, result) => {
+ const number = input.to('number');
+ if (number < 0)
+ assert_style_value_equals(result, new CSSUnitValue(0, 'number'));
+ else if (!Number.isInteger(number.value))
+ assert_style_value_equals(result, new CSSUnitValue(number.value, 'number'));
+ else
+ assert_style_value_equals(result, number);
+ }
+ },
+ {
+ syntax: '<length>',
+ specified: assert_is_equal_with_range_handling
+ },
+]);
+
+</script>
diff --git a/testing/web-platform/tests/css/css-typed-om/the-stylepropertymap/properties/table-layout.html b/testing/web-platform/tests/css/css-typed-om/the-stylepropertymap/properties/table-layout.html
new file mode 100644
index 0000000000..e58d019958
--- /dev/null
+++ b/testing/web-platform/tests/css/css-typed-om/the-stylepropertymap/properties/table-layout.html
@@ -0,0 +1,21 @@
+<!doctype html>
+<meta charset="utf-8">
+<title>'table-layout' property</title>
+<link rel="help" href="https://drafts.css-houdini.org/css-typed-om-1/#dom-stylepropertymap-get">
+<link rel="help" href="https://drafts.css-houdini.org/css-typed-om-1/#dom-stylepropertymap-set">
+<link rel="help" href="https://drafts.css-houdini.org/css-typed-om-1/#property-stle-value-normalization">
+<script src="/resources/testharness.js"></script>
+<script src="/resources/testharnessreport.js"></script>
+<script src="../../resources/testhelper.js"></script>
+<script src="resources/testsuite.js"></script>
+<body>
+<div id="log"></div>
+<script>
+'use strict';
+
+runPropertyTests('table-layout', [
+ { syntax: 'auto' },
+ { syntax: 'fixed' },
+]);
+
+</script>
diff --git a/testing/web-platform/tests/css/css-typed-om/the-stylepropertymap/properties/text-align-last.html b/testing/web-platform/tests/css/css-typed-om/the-stylepropertymap/properties/text-align-last.html
new file mode 100644
index 0000000000..242906fecb
--- /dev/null
+++ b/testing/web-platform/tests/css/css-typed-om/the-stylepropertymap/properties/text-align-last.html
@@ -0,0 +1,26 @@
+<!doctype html>
+<meta charset="utf-8">
+<title>'text-align-last' property</title>
+<link rel="help" href="https://drafts.css-houdini.org/css-typed-om-1/#dom-stylepropertymap-get">
+<link rel="help" href="https://drafts.css-houdini.org/css-typed-om-1/#dom-stylepropertymap-set">
+<link rel="help" href="https://drafts.css-houdini.org/css-typed-om-1/#property-stle-value-normalization">
+<script src="/resources/testharness.js"></script>
+<script src="/resources/testharnessreport.js"></script>
+<script src="../../resources/testhelper.js"></script>
+<script src="resources/testsuite.js"></script>
+<body>
+<div id="log"></div>
+<script>
+'use strict';
+
+runPropertyTests('text-align-last', [
+ { syntax: 'auto' },
+ { syntax: 'start' },
+ { syntax: 'end' },
+ { syntax: 'left' },
+ { syntax: 'right' },
+ { syntax: 'center' },
+ { syntax: 'justify' },
+]);
+
+</script>
diff --git a/testing/web-platform/tests/css/css-typed-om/the-stylepropertymap/properties/text-align.html b/testing/web-platform/tests/css/css-typed-om/the-stylepropertymap/properties/text-align.html
new file mode 100644
index 0000000000..c3d7f2e8e5
--- /dev/null
+++ b/testing/web-platform/tests/css/css-typed-om/the-stylepropertymap/properties/text-align.html
@@ -0,0 +1,22 @@
+<!doctype html>
+<meta charset="utf-8">
+<title>'text-align' property</title>
+<link rel="help" href="https://drafts.css-houdini.org/css-typed-om-1/#dom-stylepropertymap-get">
+<link rel="help" href="https://drafts.css-houdini.org/css-typed-om-1/#dom-stylepropertymap-set">
+<link rel="help" href="https://drafts.css-houdini.org/css-typed-om-1/#property-stle-value-normalization">
+<script src="/resources/testharness.js"></script>
+<script src="/resources/testharnessreport.js"></script>
+<script src="../../resources/testhelper.js"></script>
+<script src="resources/testsuite.js"></script>
+<body>
+<div id="log"></div>
+<script>
+'use strict';
+
+runPropertyTests('text-align', [
+ { syntax: 'center' },
+ { syntax: 'justify' },
+ // and other keywords
+]);
+
+</script>
diff --git a/testing/web-platform/tests/css/css-typed-om/the-stylepropertymap/properties/text-anchor.html b/testing/web-platform/tests/css/css-typed-om/the-stylepropertymap/properties/text-anchor.html
new file mode 100644
index 0000000000..00b04aaed6
--- /dev/null
+++ b/testing/web-platform/tests/css/css-typed-om/the-stylepropertymap/properties/text-anchor.html
@@ -0,0 +1,22 @@
+<!doctype html>
+<meta charset="utf-8">
+<title>'text-anchor' property</title>
+<link rel="help" href="https://drafts.css-houdini.org/css-typed-om-1/#dom-stylepropertymap-get">
+<link rel="help" href="https://drafts.css-houdini.org/css-typed-om-1/#dom-stylepropertymap-set">
+<link rel="help" href="https://drafts.css-houdini.org/css-typed-om-1/#property-stle-value-normalization">
+<script src="/resources/testharness.js"></script>
+<script src="/resources/testharnessreport.js"></script>
+<script src="../../resources/testhelper.js"></script>
+<script src="resources/testsuite.js"></script>
+<body>
+<div id="log"></div>
+<script>
+'use strict';
+
+runPropertyTests('text-anchor', [
+ { syntax: 'start' },
+ { syntax: 'middle' },
+ { syntax: 'end' },
+]);
+
+</script>
diff --git a/testing/web-platform/tests/css/css-typed-om/the-stylepropertymap/properties/text-combine-upright.html b/testing/web-platform/tests/css/css-typed-om/the-stylepropertymap/properties/text-combine-upright.html
new file mode 100644
index 0000000000..c0a7f56643
--- /dev/null
+++ b/testing/web-platform/tests/css/css-typed-om/the-stylepropertymap/properties/text-combine-upright.html
@@ -0,0 +1,25 @@
+<!doctype html>
+<meta charset="utf-8">
+<title>'text-combine-upright' property</title>
+<link rel="help" href="https://drafts.css-houdini.org/css-typed-om-1/#dom-stylepropertymap-get">
+<link rel="help" href="https://drafts.css-houdini.org/css-typed-om-1/#dom-stylepropertymap-set">
+<link rel="help" href="https://drafts.css-houdini.org/css-typed-om-1/#property-stle-value-normalization">
+<script src="/resources/testharness.js"></script>
+<script src="/resources/testharnessreport.js"></script>
+<script src="../../resources/testhelper.js"></script>
+<script src="resources/testsuite.js"></script>
+<body>
+<div id="log"></div>
+<script>
+'use strict';
+
+runPropertyTests('text-combine-upright', [
+ { syntax: 'none' },
+ { syntax: 'all' },
+]);
+
+runUnsupportedPropertyTests('text-combine-upright', [
+ 'digits 3'
+]);
+
+</script>
diff --git a/testing/web-platform/tests/css/css-typed-om/the-stylepropertymap/properties/text-decoration-color.html b/testing/web-platform/tests/css/css-typed-om/the-stylepropertymap/properties/text-decoration-color.html
new file mode 100644
index 0000000000..b76f82c3ea
--- /dev/null
+++ b/testing/web-platform/tests/css/css-typed-om/the-stylepropertymap/properties/text-decoration-color.html
@@ -0,0 +1,30 @@
+<!doctype html>
+<meta charset="utf-8">
+<title>'text-decoration-color' property</title>
+<link rel="help" href="https://drafts.css-houdini.org/css-typed-om-1/#dom-stylepropertymap-get">
+<link rel="help" href="https://drafts.css-houdini.org/css-typed-om-1/#dom-stylepropertymap-set">
+<link rel="help" href="https://drafts.css-houdini.org/css-typed-om-1/#property-stle-value-normalization">
+<script src="/resources/testharness.js"></script>
+<script src="/resources/testharnessreport.js"></script>
+<script src="../../resources/testhelper.js"></script>
+<script src="resources/testsuite.js"></script>
+<body>
+<div id="log"></div>
+<script>
+'use strict';
+
+runPropertyTests('text-decoration-color', [
+ {
+ syntax: 'currentcolor',
+ // computes to a <color>, which is not supported in level 1
+ computed: (_, result) => assert_class_string(result, 'CSSStyleValue')
+ }
+]);
+
+// <color>s are not supported in level 1
+runUnsupportedPropertyTests('text-decoration-color', [
+ 'red', '#bbff00', 'rgb(255, 255, 128)', 'hsl(50, 33%, 25%)',
+ 'transparent'
+]);
+
+</script>
diff --git a/testing/web-platform/tests/css/css-typed-om/the-stylepropertymap/properties/text-decoration-line.html b/testing/web-platform/tests/css/css-typed-om/the-stylepropertymap/properties/text-decoration-line.html
new file mode 100644
index 0000000000..dba12630a4
--- /dev/null
+++ b/testing/web-platform/tests/css/css-typed-om/the-stylepropertymap/properties/text-decoration-line.html
@@ -0,0 +1,26 @@
+<!doctype html>
+<meta charset="utf-8">
+<title>'text-decoration-line' property</title>
+<link rel="help" href="https://drafts.css-houdini.org/css-typed-om-1/#dom-stylepropertymap-get">
+<link rel="help" href="https://drafts.css-houdini.org/css-typed-om-1/#dom-stylepropertymap-set">
+<link rel="help" href="https://drafts.css-houdini.org/css-typed-om-1/#property-stle-value-normalization">
+<script src="/resources/testharness.js"></script>
+<script src="/resources/testharnessreport.js"></script>
+<script src="../../resources/testhelper.js"></script>
+<script src="resources/testsuite.js"></script>
+<body>
+<div id="log"></div>
+<script>
+'use strict';
+
+runPropertyTests('text-decoration-line', [
+ { syntax: 'none' },
+ { syntax: 'underline' },
+ { syntax: 'overline' },
+ { syntax: 'line-through' },
+ { syntax: 'blink' },
+ { syntax: 'spelling-error' },
+ { syntax: 'grammar-error' },
+]);
+
+</script>
diff --git a/testing/web-platform/tests/css/css-typed-om/the-stylepropertymap/properties/text-decoration-skip-ink.html b/testing/web-platform/tests/css/css-typed-om/the-stylepropertymap/properties/text-decoration-skip-ink.html
new file mode 100644
index 0000000000..57d445d7cd
--- /dev/null
+++ b/testing/web-platform/tests/css/css-typed-om/the-stylepropertymap/properties/text-decoration-skip-ink.html
@@ -0,0 +1,21 @@
+<!doctype html>
+<meta charset="utf-8">
+<title>'text-decoration-skip-ink' property</title>
+<link rel="help" href="https://drafts.css-houdini.org/css-typed-om-1/#dom-stylepropertymap-get">
+<link rel="help" href="https://drafts.css-houdini.org/css-typed-om-1/#dom-stylepropertymap-set">
+<link rel="help" href="https://drafts.css-houdini.org/css-typed-om-1/#property-stle-value-normalization">
+<script src="/resources/testharness.js"></script>
+<script src="/resources/testharnessreport.js"></script>
+<script src="../../resources/testhelper.js"></script>
+<script src="resources/testsuite.js"></script>
+<body>
+<div id="log"></div>
+<script>
+'use strict';
+
+runPropertyTests('text-decoration-skip-ink', [
+ { syntax: 'auto' },
+ { syntax: 'none' },
+]);
+
+</script>
diff --git a/testing/web-platform/tests/css/css-typed-om/the-stylepropertymap/properties/text-decoration-skip.html b/testing/web-platform/tests/css/css-typed-om/the-stylepropertymap/properties/text-decoration-skip.html
new file mode 100644
index 0000000000..796b87790d
--- /dev/null
+++ b/testing/web-platform/tests/css/css-typed-om/the-stylepropertymap/properties/text-decoration-skip.html
@@ -0,0 +1,29 @@
+<!doctype html>
+<meta charset="utf-8">
+<title>'text-decoration-skip' property</title>
+<link rel="help" href="https://drafts.css-houdini.org/css-typed-om-1/#dom-stylepropertymap-get">
+<link rel="help" href="https://drafts.css-houdini.org/css-typed-om-1/#dom-stylepropertymap-set">
+<link rel="help" href="https://drafts.css-houdini.org/css-typed-om-1/#property-stle-value-normalization">
+<script src="/resources/testharness.js"></script>
+<script src="/resources/testharnessreport.js"></script>
+<script src="../../resources/testhelper.js"></script>
+<script src="resources/testsuite.js"></script>
+<body>
+<div id="log"></div>
+<script>
+'use strict';
+
+runPropertyTests('text-decoration-skip', [
+ { syntax: 'none' },
+ { syntax: 'objects' },
+ { syntax: 'edges' },
+ { syntax: 'box-decoration' },
+ { syntax: 'spaces' },
+]);
+
+runUnsupportedPropertyTests('text-decoration-skip', [
+ 'objects spaces', 'leading-spaces trailing-spaces',
+ 'objects edges box-decoration'
+]);
+
+</script>
diff --git a/testing/web-platform/tests/css/css-typed-om/the-stylepropertymap/properties/text-decoration-style.html b/testing/web-platform/tests/css/css-typed-om/the-stylepropertymap/properties/text-decoration-style.html
new file mode 100644
index 0000000000..956c6e578b
--- /dev/null
+++ b/testing/web-platform/tests/css/css-typed-om/the-stylepropertymap/properties/text-decoration-style.html
@@ -0,0 +1,24 @@
+<!doctype html>
+<meta charset="utf-8">
+<title>'text-decoration-style' property</title>
+<link rel="help" href="https://drafts.css-houdini.org/css-typed-om-1/#dom-stylepropertymap-get">
+<link rel="help" href="https://drafts.css-houdini.org/css-typed-om-1/#dom-stylepropertymap-set">
+<link rel="help" href="https://drafts.css-houdini.org/css-typed-om-1/#property-stle-value-normalization">
+<script src="/resources/testharness.js"></script>
+<script src="/resources/testharnessreport.js"></script>
+<script src="../../resources/testhelper.js"></script>
+<script src="resources/testsuite.js"></script>
+<body>
+<div id="log"></div>
+<script>
+'use strict';
+
+runPropertyTests('text-decoration-style', [
+ { syntax: 'solid' },
+ { syntax: 'double' },
+ { syntax: 'dotted' },
+ { syntax: 'dashed' },
+ { syntax: 'wavy' },
+]);
+
+</script>
diff --git a/testing/web-platform/tests/css/css-typed-om/the-stylepropertymap/properties/text-decoration-thickness.html b/testing/web-platform/tests/css/css-typed-om/the-stylepropertymap/properties/text-decoration-thickness.html
new file mode 100644
index 0000000000..dfd923ae7b
--- /dev/null
+++ b/testing/web-platform/tests/css/css-typed-om/the-stylepropertymap/properties/text-decoration-thickness.html
@@ -0,0 +1,26 @@
+<!doctype html>
+<meta charset="utf-8">
+<title>'text-decoration-thickness' property</title>
+<link rel="help" href="https://drafts.css-houdini.org/css-typed-om-1/#dom-stylepropertymap-get">
+<link rel="help" href="https://drafts.css-houdini.org/css-typed-om-1/#dom-stylepropertymap-set">
+<link rel="help" href="https://drafts.css-houdini.org/css-typed-om-1/#property-stle-value-normalization">
+<script src="/resources/testharness.js"></script>
+<script src="/resources/testharnessreport.js"></script>
+<script src="../../resources/testhelper.js"></script>
+<script src="resources/testsuite.js"></script>
+<body>
+<div id="log"></div>
+<script>
+'use strict';
+
+runPropertyTests('text-decoration-thickness', [
+ { syntax: 'auto' },
+ {
+ syntax: '<length>',
+ },
+ {
+ syntax: '<percentage>',
+ },
+]);
+
+</script>
diff --git a/testing/web-platform/tests/css/css-typed-om/the-stylepropertymap/properties/text-decoration.html b/testing/web-platform/tests/css/css-typed-om/the-stylepropertymap/properties/text-decoration.html
new file mode 100644
index 0000000000..e9a9827c13
--- /dev/null
+++ b/testing/web-platform/tests/css/css-typed-om/the-stylepropertymap/properties/text-decoration.html
@@ -0,0 +1,20 @@
+<!doctype html>
+<meta charset="utf-8">
+<title>'text-decoration' property</title>
+<link rel="help" href="https://drafts.css-houdini.org/css-typed-om-1/#dom-stylepropertymap-get">
+<link rel="help" href="https://drafts.css-houdini.org/css-typed-om-1/#dom-stylepropertymap-set">
+<link rel="help" href="https://drafts.css-houdini.org/css-typed-om-1/#property-stle-value-normalization">
+<script src="/resources/testharness.js"></script>
+<script src="/resources/testharnessreport.js"></script>
+<script src="../../resources/testhelper.js"></script>
+<script src="resources/testsuite.js"></script>
+<body>
+<div id="log"></div>
+<script>
+'use strict';
+
+runUnsupportedPropertyTests('text-decoration', [
+ 'underline', 'underline dotted #ff3028', 'green wavy underline'
+]);
+
+</script>
diff --git a/testing/web-platform/tests/css/css-typed-om/the-stylepropertymap/properties/text-emphasis-color.html b/testing/web-platform/tests/css/css-typed-om/the-stylepropertymap/properties/text-emphasis-color.html
new file mode 100644
index 0000000000..8623d3dfb9
--- /dev/null
+++ b/testing/web-platform/tests/css/css-typed-om/the-stylepropertymap/properties/text-emphasis-color.html
@@ -0,0 +1,30 @@
+<!doctype html>
+<meta charset="utf-8">
+<title>'text-emphasis-color' property</title>
+<link rel="help" href="https://drafts.css-houdini.org/css-typed-om-1/#dom-stylepropertymap-get">
+<link rel="help" href="https://drafts.css-houdini.org/css-typed-om-1/#dom-stylepropertymap-set">
+<link rel="help" href="https://drafts.css-houdini.org/css-typed-om-1/#property-stle-value-normalization">
+<script src="/resources/testharness.js"></script>
+<script src="/resources/testharnessreport.js"></script>
+<script src="../../resources/testhelper.js"></script>
+<script src="resources/testsuite.js"></script>
+<body>
+<div id="log"></div>
+<script>
+'use strict';
+
+runPropertyTests('text-emphasis-color', [
+ {
+ syntax: 'currentcolor',
+ // computes to a <color>, which is not supported in level 1
+ computed: (_, result) => assert_class_string(result, 'CSSStyleValue')
+ }
+]);
+
+// <color>s are not supported in level 1
+runUnsupportedPropertyTests('text-emphasis-color', [
+ 'red', '#bbff00', 'rgb(255, 255, 128)', 'hsl(50, 33%, 25%)',
+ 'transparent'
+]);
+
+</script>
diff --git a/testing/web-platform/tests/css/css-typed-om/the-stylepropertymap/properties/text-indent.html b/testing/web-platform/tests/css/css-typed-om/the-stylepropertymap/properties/text-indent.html
new file mode 100644
index 0000000000..e7f1b8c7df
--- /dev/null
+++ b/testing/web-platform/tests/css/css-typed-om/the-stylepropertymap/properties/text-indent.html
@@ -0,0 +1,25 @@
+<!doctype html>
+<meta charset="utf-8">
+<title>'text-indent' property</title>
+<link rel="help" href="https://drafts.css-houdini.org/css-typed-om-1/#dom-stylepropertymap-get">
+<link rel="help" href="https://drafts.css-houdini.org/css-typed-om-1/#dom-stylepropertymap-set">
+<link rel="help" href="https://drafts.css-houdini.org/css-typed-om-1/#property-stle-value-normalization">
+<script src="/resources/testharness.js"></script>
+<script src="/resources/testharnessreport.js"></script>
+<script src="../../resources/testhelper.js"></script>
+<script src="resources/testsuite.js"></script>
+<body>
+<div id="log"></div>
+<script>
+'use strict';
+
+runPropertyTests('text-indent', [
+ { syntax: '<length>' },
+ { syntax: '<percentage>' },
+]);
+
+runUnsupportedPropertyTests('text-indent', [
+ '5em each-line', '5em hanging', '5em hanging each-line'
+]);
+
+</script>
diff --git a/testing/web-platform/tests/css/css-typed-om/the-stylepropertymap/properties/text-justify.html b/testing/web-platform/tests/css/css-typed-om/the-stylepropertymap/properties/text-justify.html
new file mode 100644
index 0000000000..29f7e60084
--- /dev/null
+++ b/testing/web-platform/tests/css/css-typed-om/the-stylepropertymap/properties/text-justify.html
@@ -0,0 +1,23 @@
+<!doctype html>
+<meta charset="utf-8">
+<title>'text-justify' property</title>
+<link rel="help" href="https://drafts.css-houdini.org/css-typed-om-1/#dom-stylepropertymap-get">
+<link rel="help" href="https://drafts.css-houdini.org/css-typed-om-1/#dom-stylepropertymap-set">
+<link rel="help" href="https://drafts.css-houdini.org/css-typed-om-1/#property-stle-value-normalization">
+<script src="/resources/testharness.js"></script>
+<script src="/resources/testharnessreport.js"></script>
+<script src="../../resources/testhelper.js"></script>
+<script src="resources/testsuite.js"></script>
+<body>
+<div id="log"></div>
+<script>
+'use strict';
+
+runPropertyTests('text-justify', [
+ { syntax: 'auto' },
+ { syntax: 'none' },
+ { syntax: 'inter-word' },
+ { syntax: 'inter-character' },
+]);
+
+</script>
diff --git a/testing/web-platform/tests/css/css-typed-om/the-stylepropertymap/properties/text-orientation.html b/testing/web-platform/tests/css/css-typed-om/the-stylepropertymap/properties/text-orientation.html
new file mode 100644
index 0000000000..8bc74b7b3c
--- /dev/null
+++ b/testing/web-platform/tests/css/css-typed-om/the-stylepropertymap/properties/text-orientation.html
@@ -0,0 +1,22 @@
+<!doctype html>
+<meta charset="utf-8">
+<title>'text-orientation' property</title>
+<link rel="help" href="https://drafts.css-houdini.org/css-typed-om-1/#dom-stylepropertymap-get">
+<link rel="help" href="https://drafts.css-houdini.org/css-typed-om-1/#dom-stylepropertymap-set">
+<link rel="help" href="https://drafts.css-houdini.org/css-typed-om-1/#property-stle-value-normalization">
+<script src="/resources/testharness.js"></script>
+<script src="/resources/testharnessreport.js"></script>
+<script src="../../resources/testhelper.js"></script>
+<script src="resources/testsuite.js"></script>
+<body>
+<div id="log"></div>
+<script>
+'use strict';
+
+runPropertyTests('text-orientation', [
+ { syntax: 'mixed' },
+ { syntax: 'upright' },
+ { syntax: 'sideways' },
+]);
+
+</script>
diff --git a/testing/web-platform/tests/css/css-typed-om/the-stylepropertymap/properties/text-overflow.html b/testing/web-platform/tests/css/css-typed-om/the-stylepropertymap/properties/text-overflow.html
new file mode 100644
index 0000000000..9d4a915985
--- /dev/null
+++ b/testing/web-platform/tests/css/css-typed-om/the-stylepropertymap/properties/text-overflow.html
@@ -0,0 +1,26 @@
+<!doctype html>
+<meta charset="utf-8">
+<title>'text-overflow' property</title>
+<link rel="help" href="https://drafts.css-houdini.org/css-typed-om-1/#dom-stylepropertymap-get">
+<link rel="help" href="https://drafts.css-houdini.org/css-typed-om-1/#dom-stylepropertymap-set">
+<link rel="help" href="https://drafts.css-houdini.org/css-typed-om-1/#property-stle-value-normalization">
+<script src="/resources/testharness.js"></script>
+<script src="/resources/testharnessreport.js"></script>
+<script src="../../resources/testhelper.js"></script>
+<script src="resources/testsuite.js"></script>
+<body>
+<div id="log"></div>
+<script>
+'use strict';
+
+runPropertyTests('text-overflow', [
+ { syntax: 'clip' },
+ { syntax: 'ellipsis' },
+ { syntax: 'fade' },
+]);
+
+runUnsupportedPropertyTests('text-overflow', [
+ 'clip ellipsis', '"..."', 'fade(1px, 50%)'
+]);
+
+</script>
diff --git a/testing/web-platform/tests/css/css-typed-om/the-stylepropertymap/properties/text-rendering.html b/testing/web-platform/tests/css/css-typed-om/the-stylepropertymap/properties/text-rendering.html
new file mode 100644
index 0000000000..88ef17da0e
--- /dev/null
+++ b/testing/web-platform/tests/css/css-typed-om/the-stylepropertymap/properties/text-rendering.html
@@ -0,0 +1,23 @@
+<!doctype html>
+<meta charset="utf-8">
+<title>'text-rendering' property</title>
+<link rel="help" href="https://drafts.css-houdini.org/css-typed-om-1/#dom-stylepropertymap-get">
+<link rel="help" href="https://drafts.css-houdini.org/css-typed-om-1/#dom-stylepropertymap-set">
+<link rel="help" href="https://drafts.css-houdini.org/css-typed-om-1/#property-stle-value-normalization">
+<script src="/resources/testharness.js"></script>
+<script src="/resources/testharnessreport.js"></script>
+<script src="../../resources/testhelper.js"></script>
+<script src="resources/testsuite.js"></script>
+<body>
+<div id="log"></div>
+<script>
+'use strict';
+
+runPropertyTests('text-rendering', [
+ { syntax: 'auto' },
+ { syntax: 'optimizespeed' },
+ { syntax: 'optimizelegibility' },
+ { syntax: 'geometricprecision' },
+]);
+
+</script>
diff --git a/testing/web-platform/tests/css/css-typed-om/the-stylepropertymap/properties/text-shadow.html b/testing/web-platform/tests/css/css-typed-om/the-stylepropertymap/properties/text-shadow.html
new file mode 100644
index 0000000000..930da94dc9
--- /dev/null
+++ b/testing/web-platform/tests/css/css-typed-om/the-stylepropertymap/properties/text-shadow.html
@@ -0,0 +1,24 @@
+<!doctype html>
+<meta charset="utf-8">
+<title>'text-shadow' property</title>
+<link rel="help" href="https://drafts.css-houdini.org/css-typed-om-1/#dom-stylepropertymap-get">
+<link rel="help" href="https://drafts.css-houdini.org/css-typed-om-1/#dom-stylepropertymap-set">
+<link rel="help" href="https://drafts.css-houdini.org/css-typed-om-1/#property-stle-value-normalization">
+<script src="/resources/testharness.js"></script>
+<script src="/resources/testharnessreport.js"></script>
+<script src="../../resources/testhelper.js"></script>
+<script src="resources/testsuite.js"></script>
+<body>
+<div id="log"></div>
+<script>
+'use strict';
+
+runPropertyTests('text-shadow', [
+ { syntax: 'none' },
+]);
+
+runUnsupportedPropertyTests('text-shadow', [
+ '1px 1px 2px pink', '1px 1px 2px red, 0 0 1em blue, 0 0 0.2em blue'
+]);
+
+</script>
diff --git a/testing/web-platform/tests/css/css-typed-om/the-stylepropertymap/properties/text-size-adjust.html b/testing/web-platform/tests/css/css-typed-om/the-stylepropertymap/properties/text-size-adjust.html
new file mode 100644
index 0000000000..29a60cbb30
--- /dev/null
+++ b/testing/web-platform/tests/css/css-typed-om/the-stylepropertymap/properties/text-size-adjust.html
@@ -0,0 +1,22 @@
+<!doctype html>
+<meta charset="utf-8">
+<title>'text-size-adjust' property</title>
+<link rel="help" href="https://drafts.css-houdini.org/css-typed-om-1/#dom-stylepropertymap-get">
+<link rel="help" href="https://drafts.css-houdini.org/css-typed-om-1/#dom-stylepropertymap-set">
+<link rel="help" href="https://drafts.css-houdini.org/css-typed-om-1/#property-stle-value-normalization">
+<script src="/resources/testharness.js"></script>
+<script src="/resources/testharnessreport.js"></script>
+<script src="../../resources/testhelper.js"></script>
+<script src="resources/testsuite.js"></script>
+<body>
+<div id="log"></div>
+<script>
+'use strict';
+
+runPropertyTests('text-size-adjust', [
+ { syntax: 'none' },
+ { syntax: 'auto' },
+ { syntax: '<percentage>' },
+]);
+
+</script>
diff --git a/testing/web-platform/tests/css/css-typed-om/the-stylepropertymap/properties/text-transform.html b/testing/web-platform/tests/css/css-typed-om/the-stylepropertymap/properties/text-transform.html
new file mode 100644
index 0000000000..8f636fad14
--- /dev/null
+++ b/testing/web-platform/tests/css/css-typed-om/the-stylepropertymap/properties/text-transform.html
@@ -0,0 +1,24 @@
+<!doctype html>
+<meta charset="utf-8">
+<title>'text-transform' property</title>
+<link rel="help" href="https://drafts.css-houdini.org/css-typed-om-1/#dom-stylepropertymap-get">
+<link rel="help" href="https://drafts.css-houdini.org/css-typed-om-1/#dom-stylepropertymap-set">
+<link rel="help" href="https://drafts.css-houdini.org/css-typed-om-1/#property-stle-value-normalization">
+<script src="/resources/testharness.js"></script>
+<script src="/resources/testharnessreport.js"></script>
+<script src="../../resources/testhelper.js"></script>
+<script src="resources/testsuite.js"></script>
+<body>
+<div id="log"></div>
+<script>
+'use strict';
+
+runPropertyTests('text-transform', [
+ { syntax: 'none' },
+ { syntax: 'capitalize' },
+ { syntax: 'uppercase' },
+ { syntax: 'lowercase' },
+ { syntax: 'full-width' },
+]);
+
+</script>
diff --git a/testing/web-platform/tests/css/css-typed-om/the-stylepropertymap/properties/text-underline-offset.html b/testing/web-platform/tests/css/css-typed-om/the-stylepropertymap/properties/text-underline-offset.html
new file mode 100644
index 0000000000..0e54ea8f5a
--- /dev/null
+++ b/testing/web-platform/tests/css/css-typed-om/the-stylepropertymap/properties/text-underline-offset.html
@@ -0,0 +1,22 @@
+<!doctype html>
+<meta charset="utf-8">
+<title>'text-underline-offset' property</title>
+<link rel="help" href="https://drafts.css-houdini.org/css-typed-om-1/#dom-stylepropertymap-get">
+<link rel="help" href="https://drafts.css-houdini.org/css-typed-om-1/#dom-stylepropertymap-set">
+<link rel="help" href="https://drafts.css-houdini.org/css-typed-om-1/#property-stle-value-normalization">
+<script src="/resources/testharness.js"></script>
+<script src="/resources/testharnessreport.js"></script>
+<script src="../../resources/testhelper.js"></script>
+<script src="resources/testsuite.js"></script>
+<body>
+<div id="log"></div>
+<script>
+'use strict';
+
+runPropertyTests('text-underline-offset', [
+ { syntax: 'auto' },
+ { syntax: '<length>' },
+ { syntax: '<percentage>' },
+]);
+
+</script>
diff --git a/testing/web-platform/tests/css/css-typed-om/the-stylepropertymap/properties/text-underline-position.html b/testing/web-platform/tests/css/css-typed-om/the-stylepropertymap/properties/text-underline-position.html
new file mode 100644
index 0000000000..f648171395
--- /dev/null
+++ b/testing/web-platform/tests/css/css-typed-om/the-stylepropertymap/properties/text-underline-position.html
@@ -0,0 +1,27 @@
+<!doctype html>
+<meta charset="utf-8">
+<title>'text-underline-position' property</title>
+<link rel="help" href="https://drafts.css-houdini.org/css-typed-om-1/#dom-stylepropertymap-get">
+<link rel="help" href="https://drafts.css-houdini.org/css-typed-om-1/#dom-stylepropertymap-set">
+<link rel="help" href="https://drafts.css-houdini.org/css-typed-om-1/#property-stle-value-normalization">
+<script src="/resources/testharness.js"></script>
+<script src="/resources/testharnessreport.js"></script>
+<script src="../../resources/testhelper.js"></script>
+<script src="resources/testsuite.js"></script>
+<body>
+<div id="log"></div>
+<script>
+'use strict';
+
+runPropertyTests('text-underline-position', [
+ { syntax: 'auto' },
+ { syntax: 'under' },
+ { syntax: 'left' },
+ { syntax: 'right' },
+]);
+
+runUnsupportedPropertyTests('text-underline-position', [
+ 'under left', 'right under'
+]);
+
+</script>
diff --git a/testing/web-platform/tests/css/css-typed-om/the-stylepropertymap/properties/top.html b/testing/web-platform/tests/css/css-typed-om/the-stylepropertymap/properties/top.html
new file mode 100644
index 0000000000..f12a76b286
--- /dev/null
+++ b/testing/web-platform/tests/css/css-typed-om/the-stylepropertymap/properties/top.html
@@ -0,0 +1,22 @@
+<!doctype html>
+<meta charset="utf-8">
+<title>'top' property</title>
+<link rel="help" href="https://drafts.css-houdini.org/css-typed-om-1/#dom-stylepropertymap-get">
+<link rel="help" href="https://drafts.css-houdini.org/css-typed-om-1/#dom-stylepropertymap-set">
+<link rel="help" href="https://drafts.css-houdini.org/css-typed-om-1/#property-stle-value-normalization">
+<script src="/resources/testharness.js"></script>
+<script src="/resources/testharnessreport.js"></script>
+<script src="../../resources/testhelper.js"></script>
+<script src="resources/testsuite.js"></script>
+<body>
+<div id="log"></div>
+<script>
+'use strict';
+
+runPropertyTests('top', [
+ { syntax: 'auto' },
+ { syntax: '<percentage>' },
+ { syntax: '<length>' },
+]);
+
+</script>
diff --git a/testing/web-platform/tests/css/css-typed-om/the-stylepropertymap/properties/touch-action.html b/testing/web-platform/tests/css/css-typed-om/the-stylepropertymap/properties/touch-action.html
new file mode 100644
index 0000000000..2435e347c3
--- /dev/null
+++ b/testing/web-platform/tests/css/css-typed-om/the-stylepropertymap/properties/touch-action.html
@@ -0,0 +1,33 @@
+<!doctype html>
+<meta charset="utf-8">
+<title>'touch-action' property</title>
+<link rel="help" href="https://drafts.css-houdini.org/css-typed-om-1/#dom-stylepropertymap-get">
+<link rel="help" href="https://drafts.css-houdini.org/css-typed-om-1/#dom-stylepropertymap-set">
+<link rel="help" href="https://drafts.css-houdini.org/css-typed-om-1/#property-stle-value-normalization">
+<script src="/resources/testharness.js"></script>
+<script src="/resources/testharnessreport.js"></script>
+<script src="../../resources/testhelper.js"></script>
+<script src="resources/testsuite.js"></script>
+<body>
+<div id="log"></div>
+<script>
+'use strict';
+
+runPropertyTests('touch-action', [
+ { syntax: 'auto' },
+ { syntax: 'none' },
+ { syntax: 'pan-x' },
+ { syntax: 'pan-left' },
+ { syntax: 'pan-right' },
+ { syntax: 'pan-y' },
+ { syntax: 'pan-up' },
+ { syntax: 'pan-down' },
+ { syntax: 'pinch-zoom' },
+ { syntax: 'manipulation' },
+]);
+
+runUnsupportedPropertyTests('touch-action', [
+ 'pan-x pan-down', 'pan-down pinch-zoom pan-right'
+]);
+
+</script>
diff --git a/testing/web-platform/tests/css/css-typed-om/the-stylepropertymap/properties/transform-box.html b/testing/web-platform/tests/css/css-typed-om/the-stylepropertymap/properties/transform-box.html
new file mode 100644
index 0000000000..a5556b1079
--- /dev/null
+++ b/testing/web-platform/tests/css/css-typed-om/the-stylepropertymap/properties/transform-box.html
@@ -0,0 +1,22 @@
+<!doctype html>
+<meta charset="utf-8">
+<title>'transform-box' property</title>
+<link rel="help" href="https://drafts.css-houdini.org/css-typed-om-1/#dom-stylepropertymap-get">
+<link rel="help" href="https://drafts.css-houdini.org/css-typed-om-1/#dom-stylepropertymap-set">
+<link rel="help" href="https://drafts.css-houdini.org/css-typed-om-1/#property-stle-value-normalization">
+<script src="/resources/testharness.js"></script>
+<script src="/resources/testharnessreport.js"></script>
+<script src="../../resources/testhelper.js"></script>
+<script src="resources/testsuite.js"></script>
+<body>
+<div id="log"></div>
+<script>
+'use strict';
+
+runPropertyTests('transform-box', [
+ { syntax: 'border-box' },
+ { syntax: 'fill-box' },
+ { syntax: 'view-box' },
+]);
+
+</script>
diff --git a/testing/web-platform/tests/css/css-typed-om/the-stylepropertymap/properties/transform-interpolated.html b/testing/web-platform/tests/css/css-typed-om/the-stylepropertymap/properties/transform-interpolated.html
new file mode 100644
index 0000000000..526717d99d
--- /dev/null
+++ b/testing/web-platform/tests/css/css-typed-om/the-stylepropertymap/properties/transform-interpolated.html
@@ -0,0 +1,31 @@
+<!doctype html>
+<meta charset="utf-8">
+<title>'transform' property with an interpolated value</title>
+<link rel="help" href="https://drafts.css-houdini.org/css-typed-om-1/#dom-stylepropertymap-get">
+<link rel="help" href="https://drafts.css-houdini.org/css-typed-om-1/#dom-stylepropertymap-set">
+<link rel="help" href="https://drafts.css-houdini.org/css-typed-om-1/#property-stle-value-normalization">
+<script src="/resources/testharness.js"></script>
+<script src="/resources/testharnessreport.js"></script>
+<script src="../../resources/testhelper.js"></script>
+<body>
+<div id="log"></div>
+<script>
+'use strict';
+
+// TODO: Try to support this sort of test with testsuite.js
+test(t => {
+ let elem = createDivWithStyle(t);
+ elem.animate({
+ transform: ['translate(1px, 1%)', 'rotate(45deg)']
+ }, {
+ fill: 'forwards',
+ iterationStart: 0.5,
+ });
+
+ // TODO: The computed value in this case is not fully spec'd
+ // See https://github.com/w3c/css-houdini-drafts/issues/425
+ const result = elem.computedStyleMap().get('transform');
+ assert_not_equals(result, null);
+}, 'Computed value for interpolated transforms is not null');
+
+</script>
diff --git a/testing/web-platform/tests/css/css-typed-om/the-stylepropertymap/properties/transform-style.html b/testing/web-platform/tests/css/css-typed-om/the-stylepropertymap/properties/transform-style.html
new file mode 100644
index 0000000000..2746db578e
--- /dev/null
+++ b/testing/web-platform/tests/css/css-typed-om/the-stylepropertymap/properties/transform-style.html
@@ -0,0 +1,22 @@
+<!doctype html>
+<meta charset="utf-8">
+<title>'transform-style' property</title>
+<link rel="help" href="https://drafts.css-houdini.org/css-typed-om-1/#dom-stylepropertymap-get">
+<link rel="help" href="https://drafts.css-houdini.org/css-typed-om-1/#dom-stylepropertymap-set">
+<link rel="help" href="https://drafts.css-houdini.org/css-typed-om-1/#property-stle-value-normalization">
+<script src="/resources/testharness.js"></script>
+<script src="/resources/testharnessreport.js"></script>
+<script src="../../resources/testhelper.js"></script>
+<script src="resources/testsuite.js"></script>
+<body>
+<div id="log"></div>
+<script>
+'use strict';
+
+runPropertyTests('transform-style', [
+ { syntax: 'auto' },
+ { syntax: 'flat' },
+ { syntax: 'preserve-3d' },
+]);
+
+</script>
diff --git a/testing/web-platform/tests/css/css-typed-om/the-stylepropertymap/properties/transform.html b/testing/web-platform/tests/css/css-typed-om/the-stylepropertymap/properties/transform.html
new file mode 100644
index 0000000000..7a852545a7
--- /dev/null
+++ b/testing/web-platform/tests/css/css-typed-om/the-stylepropertymap/properties/transform.html
@@ -0,0 +1,21 @@
+<!doctype html>
+<meta charset="utf-8">
+<title>'transform' property</title>
+<link rel="help" href="https://drafts.css-houdini.org/css-typed-om-1/#dom-stylepropertymap-get">
+<link rel="help" href="https://drafts.css-houdini.org/css-typed-om-1/#dom-stylepropertymap-set">
+<link rel="help" href="https://drafts.css-houdini.org/css-typed-om-1/#property-stle-value-normalization">
+<script src="/resources/testharness.js"></script>
+<script src="/resources/testharnessreport.js"></script>
+<script src="../../resources/testhelper.js"></script>
+<script src="resources/testsuite.js"></script>
+<body>
+<div id="log"></div>
+<script>
+'use strict';
+
+runPropertyTests('transform', [
+ { syntax: 'none' },
+ { syntax: '<transform>' },
+]);
+
+</script>
diff --git a/testing/web-platform/tests/css/css-typed-om/the-stylepropertymap/properties/transition-delay.html b/testing/web-platform/tests/css/css-typed-om/the-stylepropertymap/properties/transition-delay.html
new file mode 100644
index 0000000000..1ee47f4738
--- /dev/null
+++ b/testing/web-platform/tests/css/css-typed-om/the-stylepropertymap/properties/transition-delay.html
@@ -0,0 +1,20 @@
+<!doctype html>
+<meta charset="utf-8">
+<title>'transition-delay' property</title>
+<link rel="help" href="https://drafts.css-houdini.org/css-typed-om-1/#dom-stylepropertymap-get">
+<link rel="help" href="https://drafts.css-houdini.org/css-typed-om-1/#dom-stylepropertymap-set">
+<link rel="help" href="https://drafts.css-houdini.org/css-typed-om-1/#property-stle-value-normalization">
+<script src="/resources/testharness.js"></script>
+<script src="/resources/testharnessreport.js"></script>
+<script src="../../resources/testhelper.js"></script>
+<script src="resources/testsuite.js"></script>
+<body>
+<div id="log"></div>
+<script>
+'use strict';
+
+runListValuedPropertyTests('transition-delay', [
+ { syntax: '<time>' }
+]);
+
+</script>
diff --git a/testing/web-platform/tests/css/css-typed-om/the-stylepropertymap/properties/transition-duration.html b/testing/web-platform/tests/css/css-typed-om/the-stylepropertymap/properties/transition-duration.html
new file mode 100644
index 0000000000..c0eb09daa7
--- /dev/null
+++ b/testing/web-platform/tests/css/css-typed-om/the-stylepropertymap/properties/transition-duration.html
@@ -0,0 +1,19 @@
+<meta charset="utf-8">
+<title>'transition-duration' property</title>
+<link rel="help" href="https://drafts.css-houdini.org/css-typed-om-1/#dom-stylepropertymap-get">
+<link rel="help" href="https://drafts.css-houdini.org/css-typed-om-1/#dom-stylepropertymap-set">
+<link rel="help" href="https://drafts.css-houdini.org/css-typed-om-1/#property-stle-value-normalization">
+<script src="/resources/testharness.js"></script>
+<script src="/resources/testharnessreport.js"></script>
+<script src="../../resources/testhelper.js"></script>
+<script src="resources/testsuite.js"></script>
+<body>
+<div id="log"></div>
+<script>
+'use strict';
+
+runListValuedPropertyTests('transition-duration', [
+ { syntax: '<time>' },
+]);
+
+</script>
diff --git a/testing/web-platform/tests/css/css-typed-om/the-stylepropertymap/properties/transition-property.html b/testing/web-platform/tests/css/css-typed-om/the-stylepropertymap/properties/transition-property.html
new file mode 100644
index 0000000000..7f0c48a725
--- /dev/null
+++ b/testing/web-platform/tests/css/css-typed-om/the-stylepropertymap/properties/transition-property.html
@@ -0,0 +1,24 @@
+<!doctype html>
+<meta charset="utf-8">
+<title>'transition-property' property</title>
+<link rel="help" href="https://drafts.css-houdini.org/css-typed-om-1/#dom-stylepropertymap-get">
+<link rel="help" href="https://drafts.css-houdini.org/css-typed-om-1/#dom-stylepropertymap-set">
+<link rel="help" href="https://drafts.css-houdini.org/css-typed-om-1/#property-stle-value-normalization">
+<script src="/resources/testharness.js"></script>
+<script src="/resources/testharnessreport.js"></script>
+<script src="../../resources/testhelper.js"></script>
+<script src="resources/testsuite.js"></script>
+<body>
+<div id="log"></div>
+<script>
+'use strict';
+
+runPropertyTests('transition-property', [
+ { syntax: 'none' },
+]);
+
+runUnsupportedPropertyTests('transition-property', [
+ 'width', 'width, height', 'all'
+]);
+
+</script>
diff --git a/testing/web-platform/tests/css/css-typed-om/the-stylepropertymap/properties/transition-timing-function.html b/testing/web-platform/tests/css/css-typed-om/the-stylepropertymap/properties/transition-timing-function.html
new file mode 100644
index 0000000000..a4dbfc1933
--- /dev/null
+++ b/testing/web-platform/tests/css/css-typed-om/the-stylepropertymap/properties/transition-timing-function.html
@@ -0,0 +1,40 @@
+<!doctype html>
+<meta charset="utf-8">
+<title>'transition-timing-function' property</title>
+<link rel="help" href="https://drafts.css-houdini.org/css-typed-om-1/#dom-stylepropertymap-get">
+<link rel="help" href="https://drafts.css-houdini.org/css-typed-om-1/#dom-stylepropertymap-set">
+<link rel="help" href="https://drafts.css-houdini.org/css-typed-om-1/#property-stle-value-normalization">
+<script src="/resources/testharness.js"></script>
+<script src="/resources/testharnessreport.js"></script>
+<script src="../../resources/testhelper.js"></script>
+<script src="resources/testsuite.js"></script>
+<body>
+<div id="log"></div>
+<script>
+'use strict';
+
+runListValuedPropertyTests('transition-timing-function', [
+ { syntax: 'linear' },
+ { syntax: 'ease' },
+ { syntax: 'ease-in' },
+ { syntax: 'ease-out' },
+ { syntax: 'ease-in-out' },
+ {
+ syntax: 'step-start',
+ computed: (_, result) => {
+ assert_equals(result.toString(), 'steps(1, start)');
+ }
+ },
+ {
+ syntax: 'step-end',
+ computed: (_, result) => {
+ assert_equals(result.toString(), 'steps(1)');
+ }
+ },
+]);
+
+runUnsupportedPropertyTests('transition-timing-function', [
+ 'cubic-bezier(0.1, 0.7, 1.0, 0.1)', 'steps(4, end)'
+]);
+
+</script>
diff --git a/testing/web-platform/tests/css/css-typed-om/the-stylepropertymap/properties/transition.html b/testing/web-platform/tests/css/css-typed-om/the-stylepropertymap/properties/transition.html
new file mode 100644
index 0000000000..1264550bc9
--- /dev/null
+++ b/testing/web-platform/tests/css/css-typed-om/the-stylepropertymap/properties/transition.html
@@ -0,0 +1,20 @@
+<!doctype html>
+<meta charset="utf-8">
+<title>'transition' property</title>
+<link rel="help" href="https://drafts.css-houdini.org/css-typed-om-1/#dom-stylepropertymap-get">
+<link rel="help" href="https://drafts.css-houdini.org/css-typed-om-1/#dom-stylepropertymap-set">
+<link rel="help" href="https://drafts.css-houdini.org/css-typed-om-1/#property-stle-value-normalization">
+<script src="/resources/testharness.js"></script>
+<script src="/resources/testharnessreport.js"></script>
+<script src="../../resources/testhelper.js"></script>
+<script src="resources/testsuite.js"></script>
+<body>
+<div id="log"></div>
+<script>
+'use strict';
+
+runUnsupportedPropertyTests('transition', [
+ 'none', 'none, none', 'margin-right 4s', 'all 0.5s ease-out, color 1s'
+]);
+
+</script>
diff --git a/testing/web-platform/tests/css/css-typed-om/the-stylepropertymap/properties/unicode-bidi.html b/testing/web-platform/tests/css/css-typed-om/the-stylepropertymap/properties/unicode-bidi.html
new file mode 100644
index 0000000000..5ac27c433d
--- /dev/null
+++ b/testing/web-platform/tests/css/css-typed-om/the-stylepropertymap/properties/unicode-bidi.html
@@ -0,0 +1,25 @@
+<!doctype html>
+<meta charset="utf-8">
+<title>'unicode-bidi' property</title>
+<link rel="help" href="https://drafts.css-houdini.org/css-typed-om-1/#dom-stylepropertymap-get">
+<link rel="help" href="https://drafts.css-houdini.org/css-typed-om-1/#dom-stylepropertymap-set">
+<link rel="help" href="https://drafts.css-houdini.org/css-typed-om-1/#property-stle-value-normalization">
+<script src="/resources/testharness.js"></script>
+<script src="/resources/testharnessreport.js"></script>
+<script src="../../resources/testhelper.js"></script>
+<script src="resources/testsuite.js"></script>
+<body>
+<div id="log"></div>
+<script>
+'use strict';
+
+runPropertyTests('unicode-bidi', [
+ { syntax: 'normal' },
+ { syntax: 'embed' },
+ { syntax: 'isolate' },
+ { syntax: 'bidi-override' },
+ { syntax: 'isolate-override' },
+ { syntax: 'plaintext' },
+]);
+
+</script>
diff --git a/testing/web-platform/tests/css/css-typed-om/the-stylepropertymap/properties/user-select.html b/testing/web-platform/tests/css/css-typed-om/the-stylepropertymap/properties/user-select.html
new file mode 100644
index 0000000000..47ea14de67
--- /dev/null
+++ b/testing/web-platform/tests/css/css-typed-om/the-stylepropertymap/properties/user-select.html
@@ -0,0 +1,24 @@
+<!doctype html>
+<meta charset="utf-8">
+<title>'user-select' property</title>
+<link rel="help" href="https://drafts.css-houdini.org/css-typed-om-1/#dom-stylepropertymap-get">
+<link rel="help" href="https://drafts.css-houdini.org/css-typed-om-1/#dom-stylepropertymap-set">
+<link rel="help" href="https://drafts.css-houdini.org/css-typed-om-1/#property-stle-value-normalization">
+<script src="/resources/testharness.js"></script>
+<script src="/resources/testharnessreport.js"></script>
+<script src="../../resources/testhelper.js"></script>
+<script src="resources/testsuite.js"></script>
+<body>
+<div id="log"></div>
+<script>
+'use strict';
+
+runPropertyTests('user-select', [
+ { syntax: 'auto' },
+ { syntax: 'text' },
+ { syntax: 'none' },
+ { syntax: 'contain' },
+ { syntax: 'all' },
+]);
+
+</script>
diff --git a/testing/web-platform/tests/css/css-typed-om/the-stylepropertymap/properties/vector-effect.html b/testing/web-platform/tests/css/css-typed-om/the-stylepropertymap/properties/vector-effect.html
new file mode 100644
index 0000000000..692709529f
--- /dev/null
+++ b/testing/web-platform/tests/css/css-typed-om/the-stylepropertymap/properties/vector-effect.html
@@ -0,0 +1,21 @@
+<!doctype html>
+<meta charset="utf-8">
+<title>'vector-effect' property</title>
+<link rel="help" href="https://drafts.css-houdini.org/css-typed-om-1/#dom-stylepropertymap-get">
+<link rel="help" href="https://drafts.css-houdini.org/css-typed-om-1/#dom-stylepropertymap-set">
+<link rel="help" href="https://drafts.css-houdini.org/css-typed-om-1/#property-stle-value-normalization">
+<script src="/resources/testharness.js"></script>
+<script src="/resources/testharnessreport.js"></script>
+<script src="../../resources/testhelper.js"></script>
+<script src="resources/testsuite.js"></script>
+<body>
+<div id="log"></div>
+<script>
+'use strict';
+
+runPropertyTests('vector-effect', [
+ { syntax: 'non-scaling-stroke' },
+ { syntax: 'none' },
+]);
+
+</script>
diff --git a/testing/web-platform/tests/css/css-typed-om/the-stylepropertymap/properties/vertical-align.html b/testing/web-platform/tests/css/css-typed-om/the-stylepropertymap/properties/vertical-align.html
new file mode 100644
index 0000000000..af022fdae5
--- /dev/null
+++ b/testing/web-platform/tests/css/css-typed-om/the-stylepropertymap/properties/vertical-align.html
@@ -0,0 +1,23 @@
+<!doctype html>
+<meta charset="utf-8">
+<title>'vertical-align' property</title>
+<link rel="help" href="https://drafts.css-houdini.org/css-typed-om-1/#dom-stylepropertymap-get">
+<link rel="help" href="https://drafts.css-houdini.org/css-typed-om-1/#dom-stylepropertymap-set">
+<link rel="help" href="https://drafts.css-houdini.org/css-typed-om-1/#property-stle-value-normalization">
+<script src="/resources/testharness.js"></script>
+<script src="/resources/testharnessreport.js"></script>
+<script src="../../resources/testhelper.js"></script>
+<script src="resources/testsuite.js"></script>
+<body>
+<div id="log"></div>
+<script>
+'use strict';
+
+runPropertyTests('vertical-align', [
+ { syntax: 'baseline'},
+ // and other keywords
+ { syntax: '<length>' },
+ { syntax: '<percentage>' }
+]);
+
+</script>
diff --git a/testing/web-platform/tests/css/css-typed-om/the-stylepropertymap/properties/visibility.html b/testing/web-platform/tests/css/css-typed-om/the-stylepropertymap/properties/visibility.html
new file mode 100644
index 0000000000..42a020d313
--- /dev/null
+++ b/testing/web-platform/tests/css/css-typed-om/the-stylepropertymap/properties/visibility.html
@@ -0,0 +1,22 @@
+<!doctype html>
+<meta charset="utf-8">
+<title>'visibility' property</title>
+<link rel="help" href="https://drafts.css-houdini.org/css-typed-om-1/#dom-stylepropertymap-get">
+<link rel="help" href="https://drafts.css-houdini.org/css-typed-om-1/#dom-stylepropertymap-set">
+<link rel="help" href="https://drafts.css-houdini.org/css-typed-om-1/#property-stle-value-normalization">
+<script src="/resources/testharness.js"></script>
+<script src="/resources/testharnessreport.js"></script>
+<script src="../../resources/testhelper.js"></script>
+<script src="resources/testsuite.js"></script>
+<body>
+<div id="log"></div>
+<script>
+'use strict';
+
+runPropertyTests('visibility', [
+ { syntax: 'visible'},
+ { syntax: 'hidden' },
+ { syntax: 'collapse' },
+]);
+
+</script>
diff --git a/testing/web-platform/tests/css/css-typed-om/the-stylepropertymap/properties/white-space.html b/testing/web-platform/tests/css/css-typed-om/the-stylepropertymap/properties/white-space.html
new file mode 100644
index 0000000000..87fb9efa10
--- /dev/null
+++ b/testing/web-platform/tests/css/css-typed-om/the-stylepropertymap/properties/white-space.html
@@ -0,0 +1,51 @@
+<!doctype html>
+<meta charset="utf-8">
+<title>'white-space' property</title>
+<link rel="help" href="https://drafts.css-houdini.org/css-typed-om-1/#dom-stylepropertymap-get">
+<link rel="help" href="https://drafts.css-houdini.org/css-typed-om-1/#dom-stylepropertymap-set">
+<link rel="help" href="https://drafts.css-houdini.org/css-typed-om-1/#property-stle-value-normalization">
+<script src="/resources/testharness.js"></script>
+<script src="/resources/testharnessreport.js"></script>
+<script src="../../resources/testhelper.js"></script>
+<script src="resources/testsuite.js"></script>
+<body>
+<div id="log"></div>
+<script>
+'use strict';
+
+runPropertyTests('white-space-collapse', [
+ { syntax: 'collapse'},
+ { syntax: 'discard' },
+ { syntax: 'preserve' },
+ { syntax: 'preserve-breaks' },
+ { syntax: 'preserve-spaces' },
+ { syntax: 'break-spaces' },
+]);
+
+runPropertyTests('text-wrap-mode', [
+ { syntax: 'wrap'},
+ { syntax: 'nowrap' },
+]);
+
+runPropertyTests('text-wrap-style', [
+ { syntax: 'auto' },
+ { syntax: 'balance' },
+ { syntax: 'stable' },
+ { syntax: 'pretty' },
+]);
+
+runPropertyTests('white-space-trim', [
+ { syntax: 'none'},
+ { syntax: 'discard-before' },
+ { syntax: 'discard-after' },
+ { syntax: 'discard-inner' },
+]);
+
+runUnsupportedPropertyTests('white-space-trim', [
+ 'discard-before discard-after',
+ 'discard-before discard-inner',
+ 'discard-after discard-inner',
+ 'discard-before discard-after discard-inner'
+]);
+
+</script>
diff --git a/testing/web-platform/tests/css/css-typed-om/the-stylepropertymap/properties/widows.html b/testing/web-platform/tests/css/css-typed-om/the-stylepropertymap/properties/widows.html
new file mode 100644
index 0000000000..7503bffd8c
--- /dev/null
+++ b/testing/web-platform/tests/css/css-typed-om/the-stylepropertymap/properties/widows.html
@@ -0,0 +1,37 @@
+<meta charset="utf-8">
+<title>'widows' property</title>
+<link rel="help" href="https://drafts.css-houdini.org/css-typed-om-1/#dom-stylepropertymap-get">
+<link rel="help" href="https://drafts.css-houdini.org/css-typed-om-1/#dom-stylepropertymap-set">
+<link rel="help" href="https://drafts.css-houdini.org/css-typed-om-1/#property-stle-value-normalization">
+<script src="/resources/testharness.js"></script>
+<script src="/resources/testharnessreport.js"></script>
+<script src="../../resources/testhelper.js"></script>
+<script src="resources/testsuite.js"></script>
+<body>
+<div id="log"></div>
+<script>
+'use strict';
+
+runPropertyTests('widows', [
+ {
+ syntax: '<number>',
+ // widows needs to be a positive integer
+ specified: (input, result) => {
+ if (input instanceof CSSUnitValue && (!Number.isInteger(input.value) || input.value < 1))
+ assert_style_value_equals(result, new CSSMathSum(input));
+ else
+ assert_style_value_equals(result, input);
+ },
+ computed: (input, result) => {
+ const number = input.to('number');
+ if (number < 1)
+ assert_style_value_equals(result, new CSSUnitValue(1, 'number'));
+ else if (!Number.isInteger(number.value))
+ assert_style_value_equals(result, new CSSUnitValue(Math.round(number.value), 'number'));
+ else
+ assert_style_value_equals(result, number);
+ }
+ },
+]);
+
+</script>
diff --git a/testing/web-platform/tests/css/css-typed-om/the-stylepropertymap/properties/width.html b/testing/web-platform/tests/css/css-typed-om/the-stylepropertymap/properties/width.html
new file mode 100644
index 0000000000..9f15043733
--- /dev/null
+++ b/testing/web-platform/tests/css/css-typed-om/the-stylepropertymap/properties/width.html
@@ -0,0 +1,63 @@
+<!doctype html>
+<meta charset="utf-8">
+<title>'width' property</title>
+<link rel="help" href="https://drafts.css-houdini.org/css-typed-om-1/#dom-stylepropertymap-get">
+<link rel="help" href="https://drafts.css-houdini.org/css-typed-om-1/#dom-stylepropertymap-set">
+<link rel="help" href="https://drafts.css-houdini.org/css-typed-om-1/#property-stle-value-normalization">
+<script src="/resources/testharness.js"></script>
+<script src="/resources/testharnessreport.js"></script>
+<script src="../../resources/testhelper.js"></script>
+<script src="resources/testsuite.js"></script>
+<body>
+<div id="log"></div>
+<script>
+'use strict';
+
+function assert_is_equal_with_clamping_percentage(input, result) {
+ const percent = input.to('percent').value;
+
+ if (percent < 0)
+ assert_style_value_equals(result, new CSSUnitValue(0, 'percent'));
+ else
+ assert_style_value_equals(result, new CSSUnitValue(percent, 'percent'));
+}
+
+runPropertyTests('width', [
+ { syntax: 'auto' },
+ {
+ syntax: '<percentage>',
+ specified: assert_is_equal_with_range_handling,
+ computed: assert_is_equal_with_clamping_percentage
+ },
+ {
+ syntax: '<length>',
+ specified: assert_is_equal_with_range_handling
+ },
+]);
+
+runPropertyTests('min-width', [
+ {
+ syntax: '<percentage>',
+ specified: assert_is_equal_with_range_handling,
+ computed: assert_is_equal_with_clamping_percentage
+ },
+ {
+ syntax: '<length>',
+ specified: assert_is_equal_with_range_handling
+ },
+]);
+
+runPropertyTests('max-width', [
+ { syntax: 'none' },
+ {
+ syntax: '<percentage>',
+ specified: assert_is_equal_with_range_handling,
+ computed: assert_is_equal_with_clamping_percentage
+ },
+ {
+ syntax: '<length>',
+ specified: assert_is_equal_with_range_handling
+ },
+]);
+
+</script>
diff --git a/testing/web-platform/tests/css/css-typed-om/the-stylepropertymap/properties/will-change.html b/testing/web-platform/tests/css/css-typed-om/the-stylepropertymap/properties/will-change.html
new file mode 100644
index 0000000000..2add50c0df
--- /dev/null
+++ b/testing/web-platform/tests/css/css-typed-om/the-stylepropertymap/properties/will-change.html
@@ -0,0 +1,24 @@
+<!doctype html>
+<meta charset="utf-8">
+<title>'will-change' property</title>
+<link rel="help" href="https://drafts.css-houdini.org/css-typed-om-1/#dom-stylepropertymap-get">
+<link rel="help" href="https://drafts.css-houdini.org/css-typed-om-1/#dom-stylepropertymap-set">
+<link rel="help" href="https://drafts.css-houdini.org/css-typed-om-1/#property-stle-value-normalization">
+<script src="/resources/testharness.js"></script>
+<script src="/resources/testharnessreport.js"></script>
+<script src="../../resources/testhelper.js"></script>
+<script src="resources/testsuite.js"></script>
+<body>
+<div id="log"></div>
+<script>
+'use strict';
+
+runPropertyTests('will-change', [
+ { syntax: 'auto' },
+]);
+
+runUnsupportedPropertyTests('will-change', [
+ 'scroll-position', 'contents, foo, scroll-position'
+]);
+
+</script>
diff --git a/testing/web-platform/tests/css/css-typed-om/the-stylepropertymap/properties/word-break.html b/testing/web-platform/tests/css/css-typed-om/the-stylepropertymap/properties/word-break.html
new file mode 100644
index 0000000000..12370df886
--- /dev/null
+++ b/testing/web-platform/tests/css/css-typed-om/the-stylepropertymap/properties/word-break.html
@@ -0,0 +1,22 @@
+<!doctype html>
+<meta charset="utf-8">
+<title>'word-break' property</title>
+<link rel="help" href="https://drafts.css-houdini.org/css-typed-om-1/#dom-stylepropertymap-get">
+<link rel="help" href="https://drafts.css-houdini.org/css-typed-om-1/#dom-stylepropertymap-set">
+<link rel="help" href="https://drafts.css-houdini.org/css-typed-om-1/#property-stle-value-normalization">
+<script src="/resources/testharness.js"></script>
+<script src="/resources/testharnessreport.js"></script>
+<script src="../../resources/testhelper.js"></script>
+<script src="resources/testsuite.js"></script>
+<body>
+<div id="log"></div>
+<script>
+'use strict';
+
+runPropertyTests('word-break', [
+ { syntax: 'normal' },
+ { syntax: 'keep-all' },
+ { syntax: 'break-all' },
+]);
+
+</script>
diff --git a/testing/web-platform/tests/css/css-typed-om/the-stylepropertymap/properties/word-spacing.html b/testing/web-platform/tests/css/css-typed-om/the-stylepropertymap/properties/word-spacing.html
new file mode 100644
index 0000000000..9a44c96aad
--- /dev/null
+++ b/testing/web-platform/tests/css/css-typed-om/the-stylepropertymap/properties/word-spacing.html
@@ -0,0 +1,22 @@
+<!doctype html>
+<meta charset="utf-8">
+<title>'word-spacing' property</title>
+<link rel="help" href="https://drafts.css-houdini.org/css-typed-om-1/#dom-stylepropertymap-get">
+<link rel="help" href="https://drafts.css-houdini.org/css-typed-om-1/#dom-stylepropertymap-set">
+<link rel="help" href="https://drafts.css-houdini.org/css-typed-om-1/#property-stle-value-normalization">
+<script src="/resources/testharness.js"></script>
+<script src="/resources/testharnessreport.js"></script>
+<script src="../../resources/testhelper.js"></script>
+<script src="resources/testsuite.js"></script>
+<body>
+<div id="log"></div>
+<script>
+'use strict';
+
+runPropertyTests('word-spacing', [
+ { syntax: 'normal' },
+ { syntax: '<length>' },
+ { syntax: '<percentage>' },
+]);
+
+</script>
diff --git a/testing/web-platform/tests/css/css-typed-om/the-stylepropertymap/properties/word-wrap.html b/testing/web-platform/tests/css/css-typed-om/the-stylepropertymap/properties/word-wrap.html
new file mode 100644
index 0000000000..b8ec4fc525
--- /dev/null
+++ b/testing/web-platform/tests/css/css-typed-om/the-stylepropertymap/properties/word-wrap.html
@@ -0,0 +1,26 @@
+<!doctype html>
+<meta charset="utf-8">
+<title>'word-wrap' property</title>
+<link rel="help" href="https://drafts.css-houdini.org/css-typed-om-1/#dom-stylepropertymap-get">
+<link rel="help" href="https://drafts.css-houdini.org/css-typed-om-1/#dom-stylepropertymap-set">
+<link rel="help" href="https://drafts.css-houdini.org/css-typed-om-1/#property-stle-value-normalization">
+<script src="/resources/testharness.js"></script>
+<script src="/resources/testharnessreport.js"></script>
+<script src="../../resources/testhelper.js"></script>
+<script src="resources/testsuite.js"></script>
+<body>
+<div id="log"></div>
+<script>
+'use strict';
+
+runPropertyTests('word-wrap', [
+ { syntax: 'normal' },
+ { syntax: 'break-word' },
+ { syntax: 'break-spaces' },
+]);
+
+runUnsupportedPropertyTests('word-wrap', [
+ 'break-word break-spaces'
+]);
+
+</script>
diff --git a/testing/web-platform/tests/css/css-typed-om/the-stylepropertymap/properties/writing-mode.html b/testing/web-platform/tests/css/css-typed-om/the-stylepropertymap/properties/writing-mode.html
new file mode 100644
index 0000000000..976a0ea22d
--- /dev/null
+++ b/testing/web-platform/tests/css/css-typed-om/the-stylepropertymap/properties/writing-mode.html
@@ -0,0 +1,24 @@
+<!doctype html>
+<meta charset="utf-8">
+<title>'writing-mode' property</title>
+<link rel="help" href="https://drafts.css-houdini.org/css-typed-om-1/#dom-stylepropertymap-get">
+<link rel="help" href="https://drafts.css-houdini.org/css-typed-om-1/#dom-stylepropertymap-set">
+<link rel="help" href="https://drafts.css-houdini.org/css-typed-om-1/#property-stle-value-normalization">
+<script src="/resources/testharness.js"></script>
+<script src="/resources/testharnessreport.js"></script>
+<script src="../../resources/testhelper.js"></script>
+<script src="resources/testsuite.js"></script>
+<body>
+<div id="log"></div>
+<script>
+'use strict';
+
+runPropertyTests('writing-mode', [
+ { syntax: 'horizontal-tb' },
+ { syntax: 'vertical-rl' },
+ { syntax: 'vertical-lr' },
+ { syntax: 'sideways-rl' },
+ { syntax: 'sideways-lr' },
+]);
+
+</script>
diff --git a/testing/web-platform/tests/css/css-typed-om/the-stylepropertymap/properties/z-index.html b/testing/web-platform/tests/css/css-typed-om/the-stylepropertymap/properties/z-index.html
new file mode 100644
index 0000000000..53773fb96f
--- /dev/null
+++ b/testing/web-platform/tests/css/css-typed-om/the-stylepropertymap/properties/z-index.html
@@ -0,0 +1,37 @@
+<!doctype html>
+<meta charset="utf-8">
+<title>'z-index' property</title>
+<link rel="help" href="https://drafts.css-houdini.org/css-typed-om-1/#dom-stylepropertymap-get">
+<link rel="help" href="https://drafts.css-houdini.org/css-typed-om-1/#dom-stylepropertymap-set">
+<link rel="help" href="https://drafts.css-houdini.org/css-typed-om-1/#property-stle-value-normalization">
+<script src="/resources/testharness.js"></script>
+<script src="/resources/testharnessreport.js"></script>
+<script src="../../resources/testhelper.js"></script>
+<script src="resources/testsuite.js"></script>
+<body>
+<div id="log"></div>
+<script>
+'use strict';
+
+runPropertyTests('z-index', [
+ { syntax: 'auto' },
+ {
+ syntax: '<number>',
+ // z-index needs to be an integer
+ specified: (input, result) => {
+ if (input instanceof CSSUnitValue && !Number.isInteger(input.value))
+ assert_style_value_equals(result, new CSSMathSum(input));
+ else
+ assert_style_value_equals(result, input);
+ },
+ computed: (input, result) => {
+ const number = input.to('number');
+ if (!Number.isInteger(number.value))
+ assert_style_value_equals(result, new CSSUnitValue(Math.round(number.value), 'number'));
+ else
+ assert_style_value_equals(result, number);
+ }
+ }
+]);
+
+</script>