[IMP] test: add expect.toHaveStyle jest matcher

This commit adds a custom jest matcher `toHaveStyle` to check if a DOM
element has a specific CSS style properties applied.

Task: 5059476
Part-of: #7029
Signed-off-by: Lucas Lefèvre (lul) <lul@odoo.com>

Author: hokolomopo

tests/setup/jest_extend.ts

@@ -39,6 +39,7 @@ declare global {
       toHaveCount(count: number): R;
       toHaveClass(className: string): R;
       toHaveAttribute(attribute: string, value: string): R;
+      toHaveStyle(style: Record<string, string>): R;
     }
   }
 }
@@ -298,6 +299,29 @@ CancelledReasons: ${this.utils.printReceived(dispatchResult.reasons)}
           )}`;
     return { pass, message };
   },
+  toHaveStyle(target: DOMTarget, expectedStyle: Record<string, string>) {
+    const element = getTarget(target);
+    if (!(element instanceof HTMLElement)) {
+      const message = element ? "Target is not an HTML element" : "Target not found";
+      return { pass: false, message: () => message };
+    }
+    const receivedStyle: Record<string, string> = {};
+    for (const key of Object.keys(expectedStyle)) {
+      receivedStyle[key] = element.style.getPropertyValue(key);
+    }
+    const pass = this.equals(receivedStyle, expectedStyle, [this.utils.iterableEquality]);
+    const message = () =>
+      pass
+        ? ""
+        : `expect(target).toHaveStyle(expected);\n\n${this.utils.printDiffOrStringify(
+            expectedStyle,
+            receivedStyle,
+            "Expected style",
+            "Received style",
+            false
+          )}`;
+    return { pass, message };
+  },
 });
 
 function getTarget(target: DOMTarget): Element | Document | Window {