LibWeb: Parse the border-image-repeat property

Author: https://github.com/tcl3
Commit: c0390f759c
Pull-request: https://github.com/LadybirdBrowser/ladybird/pull/5253
Reviewed-by: https://github.com/AtkinsSJ ✅

Libraries/LibWeb/CSS/Enums.json

@@ -89,6 +89,12 @@
     "separate",
     "collapse"
   ],
+  "border-image-repeat": [
+    "stretch",
+    "repeat",
+    "round",
+    "space"
+  ],
   "box-sizing": [
     "border-box",
     "content-box"

Libraries/LibWeb/CSS/Properties.json

@@ -716,6 +716,16 @@
       "number [0,∞]"
     ]
   },
+  "border-image-repeat": {
+    "affects-layout": false,
+    "animation-type": "discrete",
+    "inherited": false,
+    "initial": "stretch",
+    "max-values": 2,
+    "valid-types": [
+      "border-image-repeat"
+    ]
+  },
   "border-image-slice": {
     "affects-layout": false,
     "animation-type": "by-computed-value",

Meta/Lagom/Tools/CodeGenerators/LibWeb/GenerateCSSPseudoElement.cpp

@@ -317,6 +317,7 @@ bool pseudo_element_supports_property(PseudoElement pseudo_element, PropertyID p
                 append_property("border-bottom-width"sv);
                 append_property("border-color"sv);
                 append_property("border-image-outset"sv);
+                append_property("border-image-repeat"sv);
                 append_property("border-image-slice"sv);
                 append_property("border-image-source"sv);
                 append_property("border-image-width"sv);

Tests/LibWeb/Text/expected/css/CSSStyleDeclaration-has-indexed-property-getter.txt

@@ -106,6 +106,7 @@ All properties associated with getComputedStyle(document.body):
     "border-end-end-radius",
     "border-end-start-radius",
     "border-image-outset",
+    "border-image-repeat",
     "border-image-slice",
     "border-image-source",
     "border-image-width",

Tests/LibWeb/Text/expected/css/CSSStyleProperties-all-supported-properties-and-default-values.txt

@@ -245,6 +245,8 @@ All supported properties and their default values exposed from CSSStylePropertie
 'border-end-start-radius': '0px'
 'borderImageOutset': '0'
 'border-image-outset': '0'
+'borderImageRepeat': 'stretch'
+'border-image-repeat': 'stretch'
 'borderImageSlice': '100%'
 'border-image-slice': '100%'
 'borderImageSource': 'none'

Tests/LibWeb/Text/expected/css/getComputedStyle-print-all.txt

@@ -104,6 +104,7 @@ border-bottom-width: 0px
 border-end-end-radius: 0px
 border-end-start-radius: 0px
 border-image-outset: 0
+border-image-repeat: stretch
 border-image-slice: 100%
 border-image-source: none
 border-image-width: 1
@@ -162,7 +163,7 @@ grid-row-start: auto
 grid-template-areas: none
 grid-template-columns: none
 grid-template-rows: none
-height: 2460px
+height: 2475px
 inline-size: 784px
 inset-block-end: auto
 inset-block-start: auto

Tests/LibWeb/Text/expected/wpt-import/css/css-backgrounds/animations/discrete-no-interpolation.txt

@@ -2,8 +2,8 @@ Harness status: OK
 
 Found 252 tests
 
-197 Pass
+239 Pass
-55 Fail
+13 Fail
 Pass	CSS Transitions with transition-behavior:allow-discrete: property <background-attachment> from [initial] to [fixed] at (-0.3) should be [initial]
 Pass	CSS Transitions with transition-behavior:allow-discrete: property <background-attachment> from [initial] to [fixed] at (0) should be [initial]
 Pass	CSS Transitions with transition-behavior:allow-discrete: property <background-attachment> from [initial] to [fixed] at (0.3) should be [initial]
@@ -214,45 +214,45 @@ Pass	Web Animations: property <background-repeat> from [initial] to [round] at (
 Pass	Web Animations: property <background-repeat> from [initial] to [round] at (0.6) should be [round]
 Pass	Web Animations: property <background-repeat> from [initial] to [round] at (1) should be [round]
 Pass	Web Animations: property <background-repeat> from [initial] to [round] at (1.5) should be [round]
-Fail	CSS Transitions with transition-behavior:allow-discrete: property <border-image-repeat> from [initial] to [round] at (-0.3) should be [initial]
+Pass	CSS Transitions with transition-behavior:allow-discrete: property <border-image-repeat> from [initial] to [round] at (-0.3) should be [initial]
-Fail	CSS Transitions with transition-behavior:allow-discrete: property <border-image-repeat> from [initial] to [round] at (0) should be [initial]
+Pass	CSS Transitions with transition-behavior:allow-discrete: property <border-image-repeat> from [initial] to [round] at (0) should be [initial]
-Fail	CSS Transitions with transition-behavior:allow-discrete: property <border-image-repeat> from [initial] to [round] at (0.3) should be [initial]
+Pass	CSS Transitions with transition-behavior:allow-discrete: property <border-image-repeat> from [initial] to [round] at (0.3) should be [initial]
-Fail	CSS Transitions with transition-behavior:allow-discrete: property <border-image-repeat> from [initial] to [round] at (0.5) should be [round]
+Pass	CSS Transitions with transition-behavior:allow-discrete: property <border-image-repeat> from [initial] to [round] at (0.5) should be [round]
-Fail	CSS Transitions with transition-behavior:allow-discrete: property <border-image-repeat> from [initial] to [round] at (0.6) should be [round]
+Pass	CSS Transitions with transition-behavior:allow-discrete: property <border-image-repeat> from [initial] to [round] at (0.6) should be [round]
-Fail	CSS Transitions with transition-behavior:allow-discrete: property <border-image-repeat> from [initial] to [round] at (1) should be [round]
+Pass	CSS Transitions with transition-behavior:allow-discrete: property <border-image-repeat> from [initial] to [round] at (1) should be [round]
-Fail	CSS Transitions with transition-behavior:allow-discrete: property <border-image-repeat> from [initial] to [round] at (1.5) should be [round]
+Pass	CSS Transitions with transition-behavior:allow-discrete: property <border-image-repeat> from [initial] to [round] at (1.5) should be [round]
-Fail	CSS Transitions with transition-property:all and transition-behavor:allow-discrete: property <border-image-repeat> from [initial] to [round] at (-0.3) should be [initial]
+Pass	CSS Transitions with transition-property:all and transition-behavor:allow-discrete: property <border-image-repeat> from [initial] to [round] at (-0.3) should be [initial]
-Fail	CSS Transitions with transition-property:all and transition-behavor:allow-discrete: property <border-image-repeat> from [initial] to [round] at (0) should be [initial]
+Pass	CSS Transitions with transition-property:all and transition-behavor:allow-discrete: property <border-image-repeat> from [initial] to [round] at (0) should be [initial]
-Fail	CSS Transitions with transition-property:all and transition-behavor:allow-discrete: property <border-image-repeat> from [initial] to [round] at (0.3) should be [initial]
+Pass	CSS Transitions with transition-property:all and transition-behavor:allow-discrete: property <border-image-repeat> from [initial] to [round] at (0.3) should be [initial]
-Fail	CSS Transitions with transition-property:all and transition-behavor:allow-discrete: property <border-image-repeat> from [initial] to [round] at (0.5) should be [round]
+Pass	CSS Transitions with transition-property:all and transition-behavor:allow-discrete: property <border-image-repeat> from [initial] to [round] at (0.5) should be [round]
-Fail	CSS Transitions with transition-property:all and transition-behavor:allow-discrete: property <border-image-repeat> from [initial] to [round] at (0.6) should be [round]
+Pass	CSS Transitions with transition-property:all and transition-behavor:allow-discrete: property <border-image-repeat> from [initial] to [round] at (0.6) should be [round]
-Fail	CSS Transitions with transition-property:all and transition-behavor:allow-discrete: property <border-image-repeat> from [initial] to [round] at (1) should be [round]
+Pass	CSS Transitions with transition-property:all and transition-behavor:allow-discrete: property <border-image-repeat> from [initial] to [round] at (1) should be [round]
-Fail	CSS Transitions with transition-property:all and transition-behavor:allow-discrete: property <border-image-repeat> from [initial] to [round] at (1.5) should be [round]
+Pass	CSS Transitions with transition-property:all and transition-behavor:allow-discrete: property <border-image-repeat> from [initial] to [round] at (1.5) should be [round]
-Fail	CSS Transitions: property <border-image-repeat> from [initial] to [round] at (-0.3) should be [round]
+Pass	CSS Transitions: property <border-image-repeat> from [initial] to [round] at (-0.3) should be [round]
-Fail	CSS Transitions: property <border-image-repeat> from [initial] to [round] at (0) should be [round]
+Pass	CSS Transitions: property <border-image-repeat> from [initial] to [round] at (0) should be [round]
-Fail	CSS Transitions: property <border-image-repeat> from [initial] to [round] at (0.3) should be [round]
+Pass	CSS Transitions: property <border-image-repeat> from [initial] to [round] at (0.3) should be [round]
-Fail	CSS Transitions: property <border-image-repeat> from [initial] to [round] at (0.5) should be [round]
+Pass	CSS Transitions: property <border-image-repeat> from [initial] to [round] at (0.5) should be [round]
-Fail	CSS Transitions: property <border-image-repeat> from [initial] to [round] at (0.6) should be [round]
+Pass	CSS Transitions: property <border-image-repeat> from [initial] to [round] at (0.6) should be [round]
-Fail	CSS Transitions: property <border-image-repeat> from [initial] to [round] at (1) should be [round]
+Pass	CSS Transitions: property <border-image-repeat> from [initial] to [round] at (1) should be [round]
-Fail	CSS Transitions: property <border-image-repeat> from [initial] to [round] at (1.5) should be [round]
+Pass	CSS Transitions: property <border-image-repeat> from [initial] to [round] at (1.5) should be [round]
-Fail	CSS Transitions with transition: all: property <border-image-repeat> from [initial] to [round] at (-0.3) should be [round]
+Pass	CSS Transitions with transition: all: property <border-image-repeat> from [initial] to [round] at (-0.3) should be [round]
-Fail	CSS Transitions with transition: all: property <border-image-repeat> from [initial] to [round] at (0) should be [round]
+Pass	CSS Transitions with transition: all: property <border-image-repeat> from [initial] to [round] at (0) should be [round]
-Fail	CSS Transitions with transition: all: property <border-image-repeat> from [initial] to [round] at (0.3) should be [round]
+Pass	CSS Transitions with transition: all: property <border-image-repeat> from [initial] to [round] at (0.3) should be [round]
-Fail	CSS Transitions with transition: all: property <border-image-repeat> from [initial] to [round] at (0.5) should be [round]
+Pass	CSS Transitions with transition: all: property <border-image-repeat> from [initial] to [round] at (0.5) should be [round]
-Fail	CSS Transitions with transition: all: property <border-image-repeat> from [initial] to [round] at (0.6) should be [round]
+Pass	CSS Transitions with transition: all: property <border-image-repeat> from [initial] to [round] at (0.6) should be [round]
-Fail	CSS Transitions with transition: all: property <border-image-repeat> from [initial] to [round] at (1) should be [round]
+Pass	CSS Transitions with transition: all: property <border-image-repeat> from [initial] to [round] at (1) should be [round]
-Fail	CSS Transitions with transition: all: property <border-image-repeat> from [initial] to [round] at (1.5) should be [round]
+Pass	CSS Transitions with transition: all: property <border-image-repeat> from [initial] to [round] at (1.5) should be [round]
-Fail	CSS Animations: property <border-image-repeat> from [initial] to [round] at (-0.3) should be [initial]
+Pass	CSS Animations: property <border-image-repeat> from [initial] to [round] at (-0.3) should be [initial]
-Fail	CSS Animations: property <border-image-repeat> from [initial] to [round] at (0) should be [initial]
+Pass	CSS Animations: property <border-image-repeat> from [initial] to [round] at (0) should be [initial]
-Fail	CSS Animations: property <border-image-repeat> from [initial] to [round] at (0.3) should be [initial]
+Pass	CSS Animations: property <border-image-repeat> from [initial] to [round] at (0.3) should be [initial]
-Fail	CSS Animations: property <border-image-repeat> from [initial] to [round] at (0.5) should be [round]
+Pass	CSS Animations: property <border-image-repeat> from [initial] to [round] at (0.5) should be [round]
-Fail	CSS Animations: property <border-image-repeat> from [initial] to [round] at (0.6) should be [round]
+Pass	CSS Animations: property <border-image-repeat> from [initial] to [round] at (0.6) should be [round]
-Fail	CSS Animations: property <border-image-repeat> from [initial] to [round] at (1) should be [round]
+Pass	CSS Animations: property <border-image-repeat> from [initial] to [round] at (1) should be [round]
-Fail	CSS Animations: property <border-image-repeat> from [initial] to [round] at (1.5) should be [round]
+Pass	CSS Animations: property <border-image-repeat> from [initial] to [round] at (1.5) should be [round]
-Fail	Web Animations: property <border-image-repeat> from [initial] to [round] at (-0.3) should be [initial]
+Pass	Web Animations: property <border-image-repeat> from [initial] to [round] at (-0.3) should be [initial]
-Fail	Web Animations: property <border-image-repeat> from [initial] to [round] at (0) should be [initial]
+Pass	Web Animations: property <border-image-repeat> from [initial] to [round] at (0) should be [initial]
-Fail	Web Animations: property <border-image-repeat> from [initial] to [round] at (0.3) should be [initial]
+Pass	Web Animations: property <border-image-repeat> from [initial] to [round] at (0.3) should be [initial]
-Fail	Web Animations: property <border-image-repeat> from [initial] to [round] at (0.5) should be [round]
+Pass	Web Animations: property <border-image-repeat> from [initial] to [round] at (0.5) should be [round]
-Fail	Web Animations: property <border-image-repeat> from [initial] to [round] at (0.6) should be [round]
+Pass	Web Animations: property <border-image-repeat> from [initial] to [round] at (0.6) should be [round]
-Fail	Web Animations: property <border-image-repeat> from [initial] to [round] at (1) should be [round]
+Pass	Web Animations: property <border-image-repeat> from [initial] to [round] at (1) should be [round]
-Fail	Web Animations: property <border-image-repeat> from [initial] to [round] at (1.5) should be [round]
+Pass	Web Animations: property <border-image-repeat> from [initial] to [round] at (1.5) should be [round]

Tests/LibWeb/Text/expected/wpt-import/css/css-cascade/all-prop-revert-layer.txt

@@ -1,8 +1,8 @@
 Harness status: OK
 
-Found 244 tests
+Found 245 tests
 
-238 Pass
+239 Pass
 6 Fail
 Pass	accent-color
 Pass	border-collapse
@@ -106,6 +106,7 @@ Pass	border-bottom-width
 Pass	border-end-end-radius
 Pass	border-end-start-radius
 Pass	border-image-outset
+Pass	border-image-repeat
 Pass	border-image-slice
 Pass	border-image-width
 Pass	border-inline-end-color