WebKit export: [rhythmic-sizing] Add block-step-round to CSS parser (#49490)

nt1m · web-flow · commit 319c66078f0a · 2024-12-03T10:53:32.000-08:00
https://bugs.webkit.org/show_bug.cgi?id=252208
diff --git a/css/css-rhythm/parsing/block-step-round-computed.html b/css/css-rhythm/parsing/block-step-round-computed.html
@@ -0,0 +1,20 @@
+<!DOCTYPE html>
+<html>
+<head>
+<title>CSS Rhythm: block-step-round computed values</title>
+<link rel="author" title="Tim Nguyen" href="https://github.com/nt1m">
+<link rel="help" href="https://drafts.csswg.org/css-rhythm/#block-step-round">
+<meta name="assert" content="Checking computed values for block-step-round">
+<script src="/resources/testharness.js"></script>
+<script src="/resources/testharnessreport.js"></script>
+<script src="/css/support/computed-testcommon.js"></script>
+</head>
+<body>
+<div id="target"></div>
+<script>
+    test_computed_value("block-step-round", "up");
+    test_computed_value("block-step-round", "down");
+    test_computed_value("block-step-round", "nearest");
+</script>
+</body>
+</html>
diff --git a/css/css-rhythm/parsing/block-step-round-invalid.html b/css/css-rhythm/parsing/block-step-round-invalid.html
@@ -0,0 +1,34 @@
+<!DOCTYPE html>
+<html>
+<head>
+<title>CSS Rhythm: block-step-round invalid values</title>
+<link rel="author" title="Tim Nguyen" href="https://github.com/nt1m">
+<link rel="help" href="https://drafts.csswg.org/css-rhythm/#block-step-round">
+<meta name="assert" content="Invalid values for block-step-round should not be parsed">
+<script src="/resources/testharness.js"></script>
+<script src="/resources/testharnessreport.js"></script>
+<script src="/css/support/parsing-testcommon.js"></script>
+</head>
+<body>
+<script>
+    test_invalid_value("block-step-align", "up up");
+    test_invalid_value("block-step-align", "up down");
+    test_invalid_value("block-step-align", "up nearest");
+    test_invalid_value("block-step-align", "down down");
+    test_invalid_value("block-step-align", "down up");
+    test_invalid_value("block-step-align", "down nearest");
+    test_invalid_value("block-step-align", "nearest nearest");
+    test_invalid_value("block-step-align", "nearest up");
+    test_invalid_value("block-step-align", "nearest down");
+    test_invalid_value("block-step-align", "-1px");
+    test_invalid_value("block-step-align", "min-content");
+    test_invalid_value("block-step-align", "10%");
+    test_invalid_value("block-step-align", "20");
+    test_invalid_value("block-step-align", "none");
+    test_invalid_value("block-step-align", "border-box");
+    test_invalid_value('block-step-align', "margin");
+    test_invalid_value("block-step-align", "padding")
+    test_invalid_value("block-step-align", "content")
+</script>
+</body>
+</html>
diff --git a/css/css-rhythm/parsing/block-step-round-valid.html b/css/css-rhythm/parsing/block-step-round-valid.html
@@ -0,0 +1,19 @@
+<!DOCTYPE html>
+<html>
+<head>
+<title>CSS Rhythm: block-step-round valid values</title>
+<link rel="author" title="Tim Nguyen" href="https://github.com/nt1m">
+<link rel="help" href="https://drafts.csswg.org/css-rhythm/#block-step-round">
+<meta name="assert" content="Parsing valid values for block-step-round property">
+<script src="/resources/testharness.js"></script>
+<script src="/resources/testharnessreport.js"></script>
+<script src="/css/support/parsing-testcommon.js"></script>
+</head>
+<body>
+<script>
+    test_valid_value("block-step-round", "up");
+    test_valid_value("block-step-round", "down");
+    test_valid_value("block-step-round", "nearest");
+</script>
+</body>
+</html>
diff --git a/web-animations/animation-model/animation-types/property-list.js b/web-animations/animation-model/animation-types/property-list.js
@@ -116,6 +116,12 @@ const gCSSProperties1 = {
       { type: 'discrete', options: [ [ 'margin-box', 'padding-box'], ['margin-box', 'content-box'], ['padding-box', 'content-box'] ] }
     ]
   },
+  'block-step-round': {
+    // https://drafts.csswg.org/css-rhythm/#block-step-round
+    types: [
+      { type: 'discrete', options: [ [ 'up', 'down'], ['down', 'nearest'], ['nearest', 'up'] ] }
+    ]
+  },
   'block-step-size': {
     // https://drafts.csswg.org/css-rhythm/#block-step-size
     types: [ 'length' ]
