Bug 1876496 - Remove prefix from custom property name passed to AnimatedPropertyID r=nchevobbe,emilio

Including the `--` prefix in custom property names caused
Servo_ComputedValues_ExtractAnimationValue to not find custom properties
that nsDOMWindowUtils::GetUnanimatedComputedStyle passed.

Differential Revision: https://phabricator.services.mozilla.com/D199714

dom/base/nsDOMWindowUtils.cpp

@@ -3185,9 +3185,11 @@ nsDOMWindowUtils::GetUnanimatedComputedStyle(Element* aElement,
       nsCSSProps::IsShorthand(propertyID)) {
     return NS_ERROR_INVALID_ARG;
   }
-  AnimatedPropertyID property = propertyID == eCSSPropertyExtra_variable
-                                    ? AnimatedPropertyID(NS_Atomize(aProperty))
-                                    : AnimatedPropertyID(propertyID);
+  AnimatedPropertyID property =
+      propertyID == eCSSPropertyExtra_variable
+          ? AnimatedPropertyID(
+                NS_Atomize(Substring(aProperty, 2, aProperty.Length() - 2)))
+          : AnimatedPropertyID(propertyID);
 
   switch (aFlushType) {
     case FLUSH_NONE:

dom/base/test/file_domwindowutils_animation.html

@@ -28,7 +28,16 @@ function deleteStyle() {
 }
 
 
+let propertyIndex = 0;
+
 function test_getUnanimatedComputedStyle() {
+  const name = `--property-${++propertyIndex}`;
+  CSS.registerProperty({
+    name,
+    syntax: "<length>",
+    initialValue: "2px",
+    inherits: false,
+  });
   [
     {
       property: "opacity",
@@ -37,6 +46,13 @@ function test_getUnanimatedComputedStyle() {
       expectedDuringTransitionStyle: "0",
       isDiscrete: false,
     },
+    {
+      property: name,
+      keyframes: ["1px", "10px"],
+      expectedInitialStyle: "2px",
+      expectedDuringTransitionStyle: "2px",
+      isDiscrete: true,
+    },
     {
       property: "clear",
       keyframes: ["left", "inline-end"],

dom/base/test/test_domwindowutils.html

@@ -83,6 +83,7 @@ function test_getUnanimatedComputedStyle() {
       set: [
         ["dom.animations-api.getAnimations.enabled", true],
         ["dom.animations-api.timelines.enabled", true],
+        ["layout.css.properties-and-values.enabled", true],
       ],
     },
     () => {