LibWeb: Alphabetize property names in Properties.json

And add a check to make sure it stays that way!

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

@@ -42,6 +42,16 @@ ErrorOr<int> serenity_main(Main::Arguments arguments)
     VERIFY(json.is_object());
     auto properties = json.as_object();
 
+    // Check we're in alphabetical order
+    DeprecatedString most_recent_name = "";
+    properties.for_each_member([&](auto& name, auto&) {
+        if (name < most_recent_name) {
+            warnln("`{}` is in the wrong position in `{}`. Please keep this list alphabetical!", name, properties_json_path);
+            VERIFY_NOT_REACHED();
+        }
+        most_recent_name = name;
+    });
+
     replace_logical_aliases(properties);
 
     auto generated_header_file = TRY(Core::File::open(generated_header_path, Core::File::OpenMode::Write));

Userland/Libraries/LibWeb/CSS/Properties.json

@@ -308,24 +308,6 @@
       "border-color"
     ]
   },
-  "border-top": {
-    "inherited": false,
-    "initial": "medium currentcolor none",
-    "longhands": [
-      "border-top-width",
-      "border-top-style",
-      "border-top-color"
-    ]
-  },
-  "border-right": {
-    "inherited": false,
-    "initial": "medium currentcolor none",
-    "longhands": [
-      "border-right-width",
-      "border-right-style",
-      "border-right-color"
-    ]
-  },
   "border-bottom": {
     "inherited": false,
     "initial": "medium currentcolor none",
@@ -335,15 +317,6 @@
       "border-bottom-color"
     ]
   },
-  "border-left": {
-    "inherited": false,
-    "initial": "medium currentcolor none",
-    "longhands": [
-      "border-left-width",
-      "border-left-style",
-      "border-left-color"
-    ]
-  },
   "border-bottom-color": {
     "affects-layout": false,
     "initial": "currentcolor",
@@ -399,6 +372,13 @@
       "unitless-length"
     ]
   },
+  "border-collapse": {
+    "inherited": true,
+    "initial": "separate",
+    "valid-types": [
+      "border-collapse"
+    ]
+  },
   "border-color": {
     "affects-layout": false,
     "initial": "currentcolor",
@@ -416,11 +396,13 @@
       "hashless-hex-color"
     ]
   },
-  "border-collapse": {
-    "inherited": true,
-    "initial": "separate",
-    "valid-types": [
-      "border-collapse"
+  "border-left": {
+    "inherited": false,
+    "initial": "medium currentcolor none",
+    "longhands": [
+      "border-left-width",
+      "border-left-style",
+      "border-left-color"
     ]
   },
   "border-left-color": {
@@ -467,6 +449,15 @@
       "border-bottom-right-radius"
     ]
   },
+  "border-right": {
+    "inherited": false,
+    "initial": "medium currentcolor none",
+    "longhands": [
+      "border-right-width",
+      "border-right-style",
+      "border-right-color"
+    ]
+  },
   "border-right-color": {
     "affects-layout": false,
     "initial": "currentcolor",
@@ -524,6 +515,15 @@
       "line-style"
     ]
   },
+  "border-top": {
+    "inherited": false,
+    "initial": "medium currentcolor none",
+    "longhands": [
+      "border-top-width",
+      "border-top-style",
+      "border-top-color"
+    ]
+  },
   "border-top-color": {
     "affects-layout": false,
     "initial": "currentcolor",
@@ -637,13 +637,6 @@
       "caption-side"
     ]
   },
-  "table-layout": {
-    "inherited": false,
-    "initial": "auto",
-    "valid-types": [
-      "table-layout"
-    ]
-  },
   "clear": {
     "inherited": false,
     "initial": "none",
@@ -675,27 +668,27 @@
       "hashless-hex-color"
     ]
   },
-  "column-gap": {
+  "column-count": {
     "inherited": false,
     "initial": "auto",
     "valid-types": [
-      "length [0,∞]",
-      "percentage [0,∞]"
+      "integer [1,∞]"
     ],
     "valid-identifiers": [
       "auto"
-    ],
-    "percentages-resolve-to": "length"
+    ]
   },
-  "column-count": {
+  "column-gap": {
     "inherited": false,
     "initial": "auto",
     "valid-types": [
-      "integer [1,∞]"
+      "length [0,∞]",
+      "percentage [0,∞]"
     ],
     "valid-identifiers": [
       "auto"
-    ]
+    ],
+    "percentages-resolve-to": "length"
   },
   "content": {
     "inherited": false,
@@ -957,6 +950,22 @@
       "column-gap"
     ]
   },
+  "grid": {
+    "inherited": false,
+    "initial": "auto",
+    "valid-identifiers": [
+      "auto"
+    ],
+    "valid-types": [
+      "length",
+      "percentage",
+      "string"
+    ],
+    "percentages-resolve-to": "length",
+    "longhands": [
+      "grid-template"
+    ]
+  },
   "grid-area": {
     "inherited": false,
     "initial": "auto",
@@ -973,6 +982,36 @@
       "grid-row-start"
     ]
   },
+  "grid-auto-columns": {
+    "inherited": false,
+    "initial": "auto",
+    "valid-identifiers": [
+      "auto"
+    ],
+    "valid-types": [
+      "length",
+      "percentage",
+      "string"
+    ],
+    "percentages-resolve-to": "length"
+  },
+  "grid-auto-flow": {
+    "inherited": false,
+    "initial": "row"
+  },
+  "grid-auto-rows": {
+    "inherited": false,
+    "initial": "auto",
+    "valid-identifiers": [
+      "auto"
+    ],
+    "valid-types": [
+      "length",
+      "percentage",
+      "string"
+    ],
+    "percentages-resolve-to": "length"
+  },
   "grid-column": {
     "inherited": false,
     "initial": "auto",
@@ -1082,22 +1121,6 @@
       "string"
     ]
   },
-  "grid": {
-    "inherited": false,
-    "initial": "auto",
-    "valid-identifiers": [
-      "auto"
-    ],
-    "valid-types": [
-      "length",
-      "percentage",
-      "string"
-    ],
-    "percentages-resolve-to": "length",
-    "longhands": [
-      "grid-template"
-    ]
-  },
   "grid-template": {
     "inherited": false,
     "initial": "auto",
@@ -1126,36 +1149,6 @@
       "string"
     ]
   },
-  "grid-auto-columns": {
-    "inherited": false,
-    "initial": "auto",
-    "valid-identifiers": [
-      "auto"
-    ],
-    "valid-types": [
-      "length",
-      "percentage",
-      "string"
-    ],
-    "percentages-resolve-to": "length"
-  },
-  "grid-auto-flow": {
-    "inherited": false,
-    "initial": "row"
-  },
-  "grid-auto-rows": {
-    "inherited": false,
-    "initial": "auto",
-    "valid-identifiers": [
-      "auto"
-    ],
-    "valid-types": [
-      "length",
-      "percentage",
-      "string"
-    ],
-    "percentages-resolve-to": "length"
-  },
   "grid-template-columns": {
     "inherited": false,
     "initial": "none",
@@ -1403,7 +1396,7 @@
     ],
     "max-values": 2
   },
-  "margin-block-start": {
+  "margin-block-end": {
     "logical-alias-for": [
       "margin-top",
       "margin-right",
@@ -1411,7 +1404,7 @@
       "margin-left"
     ]
   },
-  "margin-block-end": {
+  "margin-block-start": {
     "logical-alias-for": [
       "margin-top",
       "margin-right",
@@ -1440,7 +1433,7 @@
     ],
     "max-values": 2
   },
-  "margin-inline-start": {
+  "margin-inline-end": {
     "logical-alias-for": [
       "margin-top",
       "margin-right",
@@ -1448,7 +1441,7 @@
       "margin-left"
     ]
   },
-  "margin-inline-end": {
+  "margin-inline-start": {
     "logical-alias-for": [
       "margin-top",
       "margin-right",
@@ -1707,7 +1700,7 @@
     ],
     "max-values": 2
   },
-  "padding-block-start": {
+  "padding-block-end": {
     "logical-alias-for": [
       "padding-top",
       "padding-right",
@@ -1715,7 +1708,7 @@
       "padding-left"
     ]
   },
-  "padding-block-end": {
+  "padding-block-start": {
     "logical-alias-for": [
       "padding-top",
       "padding-right",
@@ -1741,7 +1734,7 @@
     ],
     "max-values": 2
   },
-  "padding-inline-start": {
+  "padding-inline-end": {
     "logical-alias-for": [
       "padding-top",
       "padding-right",
@@ -1749,7 +1742,7 @@
       "padding-left"
     ]
   },
-  "padding-inline-end": {
+  "padding-inline-start": {
     "logical-alias-for": [
       "padding-top",
       "padding-right",
@@ -1859,17 +1852,17 @@
     ],
     "percentages-resolve-to": "length"
   },
-  "stroke": {
+  "stop-color": {
     "affects-layout": false,
-    "inherited": true,
-    "initial": "none",
+    "inherited": false,
+    "initial": "black",
     "valid-types": [
-      "paint"
+      "color"
     ]
   },
-  "stroke-opacity": {
+  "stop-opacity": {
     "affects-layout": false,
-    "inherited": true,
+    "inherited": false,
     "initial": "1",
     "valid-types": [
       "number [-∞,∞]",
@@ -1877,17 +1870,17 @@
     ],
     "percentages-resolve-to": "number"
   },
-  "stop-color": {
+  "stroke": {
     "affects-layout": false,
-    "inherited": false,
-    "initial": "black",
+    "inherited": true,
+    "initial": "none",
     "valid-types": [
-      "color"
+      "paint"
     ]
   },
-  "stop-opacity": {
+  "stroke-opacity": {
     "affects-layout": false,
-    "inherited": false,
+    "inherited": true,
     "initial": "1",
     "valid-types": [
       "number [-∞,∞]",
@@ -1906,11 +1899,11 @@
     ],
     "percentages-resolve-to": "length"
   },
-  "text-anchor": {
-    "inherited": true,
-    "initial": "start",
+  "table-layout": {
+    "inherited": false,
+    "initial": "auto",
     "valid-types": [
-      "text-anchor"
+      "table-layout"
     ]
   },
   "text-align": {
@@ -1920,6 +1913,13 @@
       "text-align"
     ]
   },
+  "text-anchor": {
+    "inherited": true,
+    "initial": "start",
+    "valid-types": [
+      "text-anchor"
+    ]
+  },
   "text-decoration": {
     "affects-layout": false,
     "inherited": false,
@@ -2082,6 +2082,13 @@
       "visibility"
     ]
   },
+  "white-space": {
+    "inherited": true,
+    "initial": "normal",
+    "valid-types": [
+      "white-space"
+    ]
+  },
   "width": {
     "inherited": false,
     "initial": "auto",
@@ -2100,13 +2107,6 @@
       "unitless-length"
     ]
   },
-  "white-space": {
-    "inherited": true,
-    "initial": "normal",
-    "valid-types": [
-      "white-space"
-    ]
-  },
   "word-spacing": {
     "inherited": true,
     "initial": "normal",