Bug 1560429 - Fix low-alpha hexa longAlphaHex getter. r=miker.

A test case is added to make sure this is fixed.
We also add the ability to not run a given test case in the color test.

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

--HG--
extra : moz-landing-system : lando

devtools/client/shared/test/browser_css_color.js

@@ -30,7 +30,7 @@ function createTestCanvas(doc) {
 function testColorUtils(canvas) {
   const data = getFixtureColorData();
 
-  for (const {authored, name, hex, hsl, rgb} of data) {
+  for (const {authored, name, hex, hsl, rgb, disableColorMatch = false} of data) {
     const color = new colorUtils.CssColor(authored);
 
     // Check all values.
@@ -41,7 +41,9 @@ function testColorUtils(canvas) {
     is(color.rgb, rgb, "color.rgb === rgb");
 
     testToString(color, name, hex, hsl, rgb);
-    testColorMatch(name, hex, hsl, rgb, color.rgba, canvas);
+    if (!disableColorMatch) {
+      testColorMatch(name, hex, hsl, rgb, color.rgba, canvas);
+    }
   }
 
   testSetAlpha();

devtools/client/shared/test/helper_color_data.js

@@ -159,6 +159,7 @@ function getFixtureColorData() {
     {authored: "hsla(19.304, 56%, 40%, 1)", name: "#9f522d", hex: "#9f522d", hsl: "hsl(19.5, 55.9%, 40%)", rgb: "rgb(159, 82, 45)", cycle: 3},
     {authored: "#f089", name: "#f089", hex: "#f089", hsl: "hsla(328, 100%, 50%, 0.6)", rgb: "rgba(255, 0, 136, 0.6)", cycle: 3},
     {authored: "#00ff8080", name: "#00ff8080", hex: "#00ff8080", hsl: "hsla(150.1, 100%, 50%, 0.5)", rgb: "rgba(0, 255, 128, 0.5)", cycle: 3},
+    {authored: "#aaaaaa08", name: "#aaaaaa08", hex: "#aaaaaa08", hsl: "hsla(0, 0%, 66.7%, 0)", rgb: "rgba(170, 170, 170, 0)", disableColorMatch: true},
     {authored: "currentcolor", name: "currentcolor", hex: "currentcolor", hsl: "currentcolor", rgb: "currentcolor", cycle: false},
     {authored: "inherit", name: "inherit", hex: "inherit", hsl: "inherit", rgb: "inherit", cycle: false},
     {authored: "initial", name: "initial", hex: "initial", hsl: "initial", rgb: "initial", cycle: false},

devtools/shared/css/color.js

@@ -258,7 +258,7 @@ CssColor.prototype = {
 
     return "#" + ((1 << 24) + (tuple.r << 16) + (tuple.g << 8) +
                   (tuple.b << 0)).toString(16).substr(-6) +
-                  Math.round(tuple.a).toString(16).padEnd(2, "0");
+                  Math.round(tuple.a).toString(16).padStart(2, "0");
   },
 
   get rgb() {