LibWeb: Treat word-wrap as an alias for overflow-wrap

2025-12-06 00:19:53 +01:00 · 2025-09-27 19:52:51 +01:00 · 2025-09-27 19:52:51 +01:00 · 3299ea97c6
commit 3299ea97c6
parent a010557205
14 changed files with 125 additions and 13 deletions
--- a/Libraries/LibWeb/CSS/Properties.json
+++ b/Libraries/LibWeb/CSS/Properties.json
@ -2805,6 +2805,16 @@
      "mapping": "inline-xy"
    }
  },
+  "overflow-wrap": {
+    "animation-type": "discrete",
+    "inherited": true,
+    "initial": "normal",
+    "valid-identifiers": [
+      "anywhere",
+      "break-word",
+      "normal"
+    ]
+  },
  "overflow-x": {
    "animation-type": "discrete",
    "inherited": false,
@ -3744,14 +3754,7 @@
    ]
  },
  "word-wrap": {
-    "animation-type": "discrete",
-    "inherited": true,
-    "initial": "normal",
-    "valid-identifiers": [
-      "anywhere",
-      "break-word",
-      "normal"
-    ]
+    "legacy-alias-for": "overflow-wrap"
  },
  "writing-mode": {
    "animation-type": "none",
--- a/Meta/Lagom/Tools/CodeGenerators/LibWeb/GenerateCSSPseudoElement.cpp
+++ b/Meta/Lagom/Tools/CodeGenerators/LibWeb/GenerateCSSPseudoElement.cpp
@ -410,7 +410,7 @@ bool pseudo_element_supports_property(PseudoElement pseudo_element, PropertyID p
                append_property("letter-spacing"sv);
                // FIXME: line-break
                // FIXME: line-padding
-                // FIXME: overflow-wrap
+                append_property("overflow-wrap"sv);
                append_property("tab-size"sv);
                append_property("text-align"sv);
                // FIXME: text-align-all
@ -431,7 +431,6 @@ bool pseudo_element_supports_property(PseudoElement pseudo_element, PropertyID p
                append_property("word-break"sv);
                // FIXME: word-space-transform
                append_property("word-spacing"sv);
-                append_property("word-wrap"sv);
                // FIXME: wrap-after
                // FIXME: wrap-before
                // FIXME: wrap-inside
--- a/Tests/LibWeb/Text/expected/css/CSSStyleDeclaration-has-indexed-property-getter.txt
+++ b/Tests/LibWeb/Text/expected/css/CSSStyleDeclaration-has-indexed-property-getter.txt
@ -42,6 +42,7 @@ All properties associated with getComputedStyle(document.body):
    "math-shift",
    "math-style",
    "orphans",
+    "overflow-wrap",
    "paint-order",
    "pointer-events",
    "quotes",
@ -72,7 +73,6 @@ All properties associated with getComputedStyle(document.body):
    "widows",
    "word-break",
    "word-spacing",
-    "word-wrap",
    "writing-mode",
    "align-content",
    "align-items",
--- a/Tests/LibWeb/Text/expected/css/CSSStyleProperties-all-supported-properties-and-default-values.txt
+++ b/Tests/LibWeb/Text/expected/css/CSSStyleProperties-all-supported-properties-and-default-values.txt
@ -594,6 +594,8 @@ All supported properties and their default values exposed from CSSStylePropertie
 'overflow-block': 'visible'
 'overflowInline': 'visible'
 'overflow-inline': 'visible'
+'overflowWrap': 'normal'
+'overflow-wrap': 'normal'
 'overflowX': 'visible'
 'overflow-x': 'visible'
 'overflowY': 'visible'
--- a/Tests/LibWeb/Text/expected/css/getComputedStyle-print-all.txt
+++ b/Tests/LibWeb/Text/expected/css/getComputedStyle-print-all.txt
@ -40,6 +40,7 @@ math-depth: 0
 math-shift: normal
 math-style: normal
 orphans: 2
+overflow-wrap: normal
 paint-order: normal
 pointer-events: auto
 quotes: auto
@ -70,7 +71,6 @@ white-space-collapse: collapse
 widows: 2
 word-break: normal
 word-spacing: 0px
-word-wrap: normal
 writing-mode: horizontal-tb
 align-content: normal
 align-items: normal
--- a/Tests/LibWeb/Text/expected/wpt-import/css/css-cascade/all-prop-revert-layer.txt
+++ b/Tests/LibWeb/Text/expected/wpt-import/css/css-cascade/all-prop-revert-layer.txt
@ -44,6 +44,7 @@ Pass	math-depth
 Pass	math-shift
 Pass	math-style
 Pass	orphans
+Pass	overflow-wrap
 Pass	paint-order
 Pass	pointer-events
 Pass	quotes
@ -74,7 +75,6 @@ Pass	white-space-collapse
 Pass	widows
 Pass	word-break
 Pass	word-spacing
-Pass	word-wrap
 Pass	writing-mode
 Pass	align-items
 Pass	align-self
--- a/Tests/LibWeb/Text/expected/wpt-import/css/css-text/overflow-wrap/word-wrap-alias.txt
+++ b/Tests/LibWeb/Text/expected/wpt-import/css/css-text/overflow-wrap/word-wrap-alias.txt
@ -0,0 +1,7 @@
+Harness status: OK
+
+Found 2 tests
+
+2 Pass
+Pass	word-wrap should be defined as an alias of overflow-wrap
+Pass	word-wrap is a legacy name alias for overflow-wrap
--- a/Tests/LibWeb/Text/expected/wpt-import/css/css-text/parsing/overflow-wrap-computed.txt
+++ b/Tests/LibWeb/Text/expected/wpt-import/css/css-text/parsing/overflow-wrap-computed.txt
@ -0,0 +1,8 @@
+Harness status: OK
+
+Found 3 tests
+
+3 Pass
+Pass	Property overflow-wrap value 'normal'
+Pass	Property overflow-wrap value 'break-word'
+Pass	Property overflow-wrap value 'anywhere'
--- a/Tests/LibWeb/Text/expected/wpt-import/css/css-text/parsing/overflow-wrap-invalid.txt
+++ b/Tests/LibWeb/Text/expected/wpt-import/css/css-text/parsing/overflow-wrap-invalid.txt
@ -0,0 +1,8 @@
+Harness status: OK
+
+Found 3 tests
+
+3 Pass
+Pass	e.style['overflow-wrap'] = "auto" should not set the property value
+Pass	e.style['overflow-wrap'] = "normal break-word" should not set the property value
+Pass	e.style['overflow-wrap'] = "anywhere anywhere" should not set the property value
--- a/Tests/LibWeb/Text/expected/wpt-import/css/css-text/parsing/overflow-wrap-valid.txt
+++ b/Tests/LibWeb/Text/expected/wpt-import/css/css-text/parsing/overflow-wrap-valid.txt
@ -0,0 +1,8 @@
+Harness status: OK
+
+Found 3 tests
+
+3 Pass
+Pass	e.style['overflow-wrap'] = "normal" should set the property value
+Pass	e.style['overflow-wrap'] = "break-word" should set the property value
+Pass	e.style['overflow-wrap'] = "anywhere" should set the property value
--- a/Tests/LibWeb/Text/input/wpt-import/css/css-text/overflow-wrap/word-wrap-alias.html
+++ b/Tests/LibWeb/Text/input/wpt-import/css/css-text/overflow-wrap/word-wrap-alias.html
@ -0,0 +1,19 @@
+<!DOCTYPE html>
+<link rel="help" href="https://drafts.csswg.org/css-text-3/#propdef-word-wrap">
+<link rel="help" href="https://github.com/w3c/csswg-drafts/issues/866">
+<script src="../../../resources/testharness.js"></script>
+<script src="../../../resources/testharnessreport.js"></script>
+<script src="../../support/shorthand-testcommon.js"></script>
+<div id="test" style="word-wrap: break-word; overflow-wrap: break-word;"></div>
+<script>
+test(function() {
+    const div = document.getElementById("test");
+    assert_equals(div.style.cssText, "overflow-wrap: break-word;", "Only overflow-wrap should appear when serializing the declaration.");
+    assert_equals(div.style.wordWrap, "break-word");
+    assert_equals(div.style.overflowWrap, "break-word");
+    assert_equals(getComputedStyle(div).wordWrap, "break-word");
+    assert_equals(getComputedStyle(div).overflowWrap, "break-word");
+}, "word-wrap should be defined as an alias of overflow-wrap");
+
+test_is_legacy_name_alias("word-wrap", "overflow-wrap");
+</script>
--- a/Tests/LibWeb/Text/input/wpt-import/css/css-text/parsing/overflow-wrap-computed.html
+++ b/Tests/LibWeb/Text/input/wpt-import/css/css-text/parsing/overflow-wrap-computed.html
@ -0,0 +1,20 @@
+<!DOCTYPE html>
+<html>
+<head>
+<meta charset="utf-8">
+<title>CSS Text: getComputedStyle().overflowWrap</title>
+<link rel="help" href="https://www.w3.org/TR/css-text-3/#propdef-overflow-wrap">
+<meta name="assert" content="overflow-wrap computed value is specified keyword.">
+<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("overflow-wrap", "normal");
+test_computed_value("overflow-wrap", "break-word");
+test_computed_value("overflow-wrap", "anywhere");
+</script>
+</body>
+</html>
--- a/Tests/LibWeb/Text/input/wpt-import/css/css-text/parsing/overflow-wrap-invalid.html
+++ b/Tests/LibWeb/Text/input/wpt-import/css/css-text/parsing/overflow-wrap-invalid.html
@ -0,0 +1,19 @@
+<!DOCTYPE html>
+<html>
+<head>
+<meta charset="utf-8">
+<title>CSS Text Module Test: parsing overflow-wrap with invalid values</title>
+<link rel="help" href="https://www.w3.org/TR/css-text-3/#propdef-overflow-wrap">
+<meta name="assert" content="overflow-wrap supports only the grammar 'normal | break-word | anywhere'.">
+<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("overflow-wrap", "auto");
+test_invalid_value("overflow-wrap", "normal break-word");
+test_invalid_value("overflow-wrap", "anywhere anywhere");
+</script>
+</body>
+</html>
--- a/Tests/LibWeb/Text/input/wpt-import/css/css-text/parsing/overflow-wrap-valid.html
+++ b/Tests/LibWeb/Text/input/wpt-import/css/css-text/parsing/overflow-wrap-valid.html
@ -0,0 +1,19 @@
+<!DOCTYPE html>
+<html>
+<head>
+<meta charset="utf-8">
+<title>CSS Text Module Test: parsing overflow-wrap with valid values</title>
+<link rel="help" href="https://www.w3.org/TR/css-text-3/#propdef-overflow-wrap">
+<meta name="assert" content="overflow-wrap supports the full grammar 'normal | break-word | anywhere'.">
+<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("overflow-wrap", "normal");
+test_valid_value("overflow-wrap", "break-word");
+test_valid_value("overflow-wrap", "anywhere");
+</script>
+</body>
+</html>