test - add more color helper for tests

Author: cderv

tests/integration/playwright/src/utils.ts

@@ -128,10 +128,37 @@ export type RGBColor = {
   alpha?: number;
 };
 
-export async function checkColor(element, cssProperty, rgbColors: RGBColor) {
-  const colorString = rgbColors.alpha !== undefined 
-    ? `rgba(${rgbColors.red}, ${rgbColors.green}, ${rgbColors.blue}, ${rgbColors.alpha})`
-    : `rgb(${rgbColors.red}, ${rgbColors.green}, ${rgbColors.blue})`;
+export type HexColor = string;
+
+export function isRGBColor(color: any): color is RGBColor {
+  return (
+    typeof color === 'object' && 
+    'red' in color && 
+    'green' in color && 
+    'blue' in color
+  );
+}
+
+export function isHexColor(color: any): color is HexColor {
+  return (
+    typeof color === 'string' &&
+    /^#([0-9a-fA-F]{3}|[0-9a-fA-F]{6}|[0-9a-fA-F]{8})$/.test(color)
+  );
+}
+
+export async function checkColor(element, cssProperty, color: RGBColor | HexColor) {
+  let colorString: string;
+  // Check if the color is an RGBColor object or a string
+  if (isRGBColor(color)) {
+    colorString = color.alpha !== undefined
+      ? `rgba(${color.red}, ${color.green}, ${color.blue}, ${color.alpha})`
+      : `rgb(${color.red}, ${color.green}, ${color.blue})`;
+  } else if (isHexColor(color)) {
+    colorString = color as string;
+  } else {
+    throw new Error('Invalid color format. Use either RGBColor or HexColor.');
+  }
+  // Check the CSS property
   await expect(element).toHaveCSS(cssProperty, colorString);
 }