fix: Fix input.type check (#1184)

* fix: Fix input.type check

Actually I noticed that `el.type` returns `text` when type is not explicitly set, so this is slightly incorrect.

* fix linting

* Apply formatting changes

packages/rrweb-snapshot/src/snapshot.ts

@@ -20,6 +20,7 @@ import {
   maskInputValue,
   isNativeShadowDom,
   getCssRulesString,
+  getInputType,
 } from './utils';
 
 let _id = 1;
@@ -682,11 +683,7 @@ function serializeElementNode(
       attributes.type !== 'button' &&
       value
     ) {
-      const type: string | null = n.hasAttribute('data-rr-is-password')
-        ? 'password'
-        : typeof attributes.type === 'string'
-        ? attributes.type.toLowerCase()
-        : null;
+      const type = getInputType(n);
       attributes.value = maskInputValue({
         type,
         tagName,

packages/rrweb-snapshot/src/utils.ts

@@ -248,3 +248,20 @@ export function isNodeMetaEqual(a: serializedNode, b: serializedNode): boolean {
     );
   return false;
 }
+
+/**
+ * Get the type of an input element.
+ * This takes care of the case where a password input is changed to a text input.
+ * In this case, we continue to consider this of type password, in order to avoid leaking sensitive data
+ * where passwords should be masked.
+ */
+export function getInputType(element: HTMLElement): Lowercase<string> | null {
+  const type = (element as HTMLInputElement).type;
+
+  return element.hasAttribute('data-rr-is-password')
+    ? 'password'
+    : type
+    ? // eslint-disable-next-line @typescript-eslint/no-unnecessary-type-assertion
+      (type.toLowerCase() as Lowercase<string>)
+    : null;
+}