LibWeb: Handle border-{inline,block}-* properties with a single value

Gains us 14 WPT tests

Libraries/LibWeb/CSS/Properties.json

@@ -503,6 +503,10 @@
     "longhands": [
       "border-block-start-color",
       "border-block-end-color"
+    ],
+    "max-values": 2,
+    "valid-types": [
+      "color"
     ]
   },
   "border-block-end": {
@@ -571,6 +575,10 @@
     "longhands": [
       "border-block-start-style",
       "border-block-end-style"
+    ],
+    "max-values": 2,
+    "valid-types": [
+      "line-style"
     ]
   },
   "border-block-width": {
@@ -579,6 +587,15 @@
     "longhands": [
       "border-block-start-width",
       "border-block-end-width"
+    ],
+    "max-values": 2,
+    "valid-types": [
+      "length [0,∞]"
+    ],
+    "valid-identifiers": [
+      "medium",
+      "thick",
+      "thin"
     ]
   },
   "border-bottom": {
@@ -767,6 +784,10 @@
     "longhands": [
       "border-inline-start-color",
       "border-inline-end-color"
+    ],
+    "max-values": 2,
+    "valid-types": [
+      "color"
     ]
   },
   "border-inline-end": {
@@ -835,6 +856,10 @@
     "longhands": [
       "border-inline-start-style",
       "border-inline-end-style"
+    ],
+    "max-values": 2,
+    "valid-types": [
+      "line-style"
     ]
   },
   "border-inline-width": {
@@ -843,6 +868,15 @@
     "longhands": [
       "border-inline-start-width",
       "border-inline-end-width"
+    ],
+    "max-values": 2,
+    "valid-types": [
+      "length [0,∞]"
+    ],
+    "valid-identifiers": [
+      "medium",
+      "thick",
+      "thin"
     ]
   },
   "border-left": {

Libraries/LibWeb/CSS/StyleComputer.cpp

@@ -693,16 +693,46 @@ void StyleComputer::for_each_property_expanding_shorthands(PropertyID property_i
         return;
     }
 
+    if (property_id == CSS::PropertyID::BorderBlockStyle) {
+        assign_start_and_end_values(PropertyID::BorderBlockStartStyle, PropertyID::BorderBlockEndStyle, value);
+        return;
+    }
+
+    if (property_id == CSS::PropertyID::BorderInlineStyle) {
+        assign_start_and_end_values(PropertyID::BorderInlineStartStyle, PropertyID::BorderInlineEndStyle, value);
+        return;
+    }
+
     if (property_id == CSS::PropertyID::BorderWidth) {
         assign_edge_values(PropertyID::BorderTopWidth, PropertyID::BorderRightWidth, PropertyID::BorderBottomWidth, PropertyID::BorderLeftWidth, value);
         return;
     }
 
+    if (property_id == CSS::PropertyID::BorderBlockWidth) {
+        assign_start_and_end_values(PropertyID::BorderBlockStartWidth, PropertyID::BorderBlockEndWidth, value);
+        return;
+    }
+
+    if (property_id == CSS::PropertyID::BorderInlineWidth) {
+        assign_start_and_end_values(PropertyID::BorderInlineStartWidth, PropertyID::BorderInlineEndWidth, value);
+        return;
+    }
+
     if (property_id == CSS::PropertyID::BorderColor) {
         assign_edge_values(PropertyID::BorderTopColor, PropertyID::BorderRightColor, PropertyID::BorderBottomColor, PropertyID::BorderLeftColor, value);
         return;
     }
 
+    if (property_id == CSS::PropertyID::BorderBlockColor) {
+        assign_start_and_end_values(PropertyID::BorderBlockStartColor, PropertyID::BorderBlockEndColor, value);
+        return;
+    }
+
+    if (property_id == CSS::PropertyID::BorderInlineColor) {
+        assign_start_and_end_values(PropertyID::BorderInlineStartColor, PropertyID::BorderInlineEndColor, value);
+        return;
+    }
+
     if (property_id == CSS::PropertyID::BackgroundPosition) {
         if (value.is_position()) {
             auto const& position = value.as_position();

Tests/LibWeb/Text/expected/wpt-import/css/css-logical/parsing/border-block-color-computed.txt

@@ -2,13 +2,12 @@ Harness status: OK
 
 Found 8 tests
 
-6 Pass
+8 Pass
-2 Fail
 Pass	Property border-block-start-color value 'currentcolor'
 Pass	Property border-block-start-color value 'rgb(2, 3, 4)'
 Pass	Property border-block-end-color value 'rgb(34, 51, 68)'
 Pass	Property border-block-end-color value 'transparent'
-Fail	Property border-block-color value 'rgb(34, 51, 68)'
+Pass	Property border-block-color value 'rgb(34, 51, 68)'
 Pass	Property border-block-color value 'transparent rgb(2, 3, 4)'
-Fail	Property border-block-color value 'rgb(2, 3, 4) rgb(2, 3, 4)'
+Pass	Property border-block-color value 'rgb(2, 3, 4) rgb(2, 3, 4)'
 Pass	Property border-block-color value 'currentcolor lime'

Tests/LibWeb/Text/expected/wpt-import/css/css-logical/parsing/border-block-width-computed.txt

@@ -2,16 +2,15 @@ Harness status: OK
 
 Found 11 tests
 
-6 Pass
+11 Pass
-5 Fail
 Pass	Property border-block-start-width value 'calc(10px + 0.5em)'
 Pass	Property border-block-start-width value 'calc(10px - 0.5em)'
 Pass	Property border-block-start-width value 'thin'
 Pass	Property border-block-start-width value 'medium'
-Fail	Property border-block-end-width value 'calc(10px + 0.5em)'
+Pass	Property border-block-end-width value 'calc(10px + 0.5em)'
 Pass	Property border-block-end-width value 'calc(10px - 0.5em)'
-Fail	Property border-block-end-width value 'thick'
+Pass	Property border-block-end-width value 'thick'
-Fail	Property border-block-width value '10px'
+Pass	Property border-block-width value '10px'
-Fail	Property border-block-width value '10px 20px'
+Pass	Property border-block-width value '10px 20px'
-Fail	Property border-block-width value '10px 10px'
+Pass	Property border-block-width value '10px 10px'
 Pass	width is zero if the border block style is none or hidden

Tests/LibWeb/Text/expected/wpt-import/css/css-logical/parsing/border-inline-color-computed.txt

@@ -2,13 +2,12 @@ Harness status: OK
 
 Found 8 tests
 
-6 Pass
+8 Pass
-2 Fail
 Pass	Property border-inline-start-color value 'currentcolor'
 Pass	Property border-inline-start-color value 'rgb(2, 3, 4)'
 Pass	Property border-inline-end-color value 'rgb(34, 51, 68)'
 Pass	Property border-inline-end-color value 'transparent'
-Fail	Property border-inline-color value 'rgb(34, 51, 68)'
+Pass	Property border-inline-color value 'rgb(34, 51, 68)'
 Pass	Property border-inline-color value 'transparent rgb(2, 3, 4)'
-Fail	Property border-inline-color value 'rgb(2, 3, 4) rgb(2, 3, 4)'
+Pass	Property border-inline-color value 'rgb(2, 3, 4) rgb(2, 3, 4)'
 Pass	Property border-inline-color value 'currentcolor lime'

Tests/LibWeb/Text/expected/wpt-import/css/css-logical/parsing/border-inline-width-computed.txt

@@ -2,16 +2,15 @@ Harness status: OK
 
 Found 11 tests
 
-6 Pass
+11 Pass
-5 Fail
 Pass	Property border-inline-start-width value 'calc(10px + 0.5em)'
 Pass	Property border-inline-start-width value 'calc(10px - 0.5em)'
 Pass	Property border-inline-start-width value 'thin'
 Pass	Property border-inline-start-width value 'medium'
-Fail	Property border-inline-end-width value 'calc(10px + 0.5em)'
+Pass	Property border-inline-end-width value 'calc(10px + 0.5em)'
 Pass	Property border-inline-end-width value 'calc(10px - 0.5em)'
-Fail	Property border-inline-end-width value 'thick'
+Pass	Property border-inline-end-width value 'thick'
-Fail	Property border-inline-width value '10px'
+Pass	Property border-inline-width value '10px'
-Fail	Property border-inline-width value '10px 20px'
+Pass	Property border-inline-width value '10px 20px'
-Fail	Property border-inline-width value '10px 10px'
+Pass	Property border-inline-width value '10px 10px'
 Pass	width is zero if the border block style is none or hidden