From 047f09a3167553bcff7c8ec410c00ed78f7c31f0 Mon Sep 17 00:00:00 2001
From: ahnpnl <anhpnnd@gmail.com>
Date: Sun, 21 Jul 2024 15:25:54 +0200
Subject: [PATCH] refactor(serializers): improve codes for snapshot serializer

- Extract comments into smaller functions
- Use `NewPlugin` type from `pretty-format`
---
 src/serializers/no-ng-attributes.ts | 48 +++++++++++++++++++----------
 1 file changed, 32 insertions(+), 16 deletions(-)

diff --git a/src/serializers/no-ng-attributes.ts b/src/serializers/no-ng-attributes.ts
index 2bbd16a0c3..0fdc4169a9 100644
--- a/src/serializers/no-ng-attributes.ts
+++ b/src/serializers/no-ng-attributes.ts
@@ -1,4 +1,4 @@
-import { plugins } from 'pretty-format';
+import { plugins, type NewPlugin } from 'pretty-format';
 
 const jestDOMElementSerializer = plugins.DOMElement;
 
@@ -13,24 +13,28 @@ const attributesToClean: Record<string, RegExp[]> = {
 };
 const hasAttributesToRemove = (attribute: Attr): boolean =>
     attributesToRemovePatterns.some((removePattern) => attribute.name.startsWith(removePattern));
+
 const hasAttributesToClean = (attribute: Attr): boolean =>
     Object.keys(attributesToClean).some((removePatternKey) => attribute.name === removePatternKey);
 
-// eslint-disable-next-line @typescript-eslint/no-explicit-any, @typescript-eslint/explicit-module-boundary-types
-const serialize = (node: Element, ...rest: any): string => {
+const removeAngularAttributes = (node: Element): Element => {
     const nodeCopy = node.cloneNode(true) as Element;
-    // Remove angular-specific attributes
     Object.values(nodeCopy.attributes)
         .filter(hasAttributesToRemove)
         .forEach((attribute) => nodeCopy.attributes.removeNamedItem(attribute.name));
-    // Remove angular auto-added classes
+
+    return nodeCopy;
+};
+
+const cleanAngularClasses = (node: Element): Element => {
+    const nodeCopy = node.cloneNode(true) as Element;
     Object.values(nodeCopy.attributes)
         .filter(hasAttributesToClean)
-        .forEach((attribute: Attr) => {
+        .forEach((attribute) => {
             attribute.value = attribute.value
                 .split(' ')
                 .filter(
-                    (attrValue: string) =>
+                    (attrValue) =>
                         !attributesToClean[attribute.name].some((attributeCleanRegex) =>
                             attributeCleanRegex.test(attrValue),
                         ),
@@ -43,19 +47,31 @@ const serialize = (node: Element, ...rest: any): string => {
             }
         });
 
-    // eslint-disable-next-line @typescript-eslint/ban-ts-comment
-    // @ts-expect-error
-    return jestDOMElementSerializer.serialize(nodeCopy, ...rest);
+    return nodeCopy;
 };
 
-const serializeTestFn = (val: Element): boolean =>
-    !!val.attributes &&
-    Object.values(val.attributes).some(
-        (attribute: Attr) => hasAttributesToRemove(attribute) || hasAttributesToClean(attribute),
+const shouldSerializeElement = (val: Element): boolean => {
+    return Object.values(val.attributes).some(
+        (attribute) => hasAttributesToRemove(attribute) || hasAttributesToClean(attribute),
     );
-const test = (val: unknown): boolean => !!val && jestDOMElementSerializer.test(val) && serializeTestFn(val as Element);
+};
+
+const serialize: NewPlugin['serialize'] = (node, ...rest) => {
+    let nodeCopy = removeAngularAttributes(node);
+    nodeCopy = cleanAngularClasses(nodeCopy);
+
+    return jestDOMElementSerializer.serialize(nodeCopy, ...rest);
+};
+
+const test: NewPlugin['test'] = (val) => {
+    if (!val || !(val instanceof Element)) {
+        return false;
+    }
+
+    return jestDOMElementSerializer.test(val) && shouldSerializeElement(val);
+};
 
 export = {
     serialize,
     test,
-};
+} satisfies NewPlugin;