Do not ignore password fields, but allow them to be masked instead

guide.md

@@ -108,7 +108,7 @@ You may find some contents on the webpage which are not willing to be recorded,
 
 - An element with the class name `.rr-block` will not be recorded. Instead, it will replay as a placeholder with the same dimension.
 - An element with the class name `.rr-ignore` will not record its input events.
-- `input[type="password"]` will be ignored as default.
+- You’ll probably want to mask `input[type="password"]` by adding `maskInputOptions: {password: true}`
 
 #### Checkout
 

scripts/repl.ts

@@ -96,7 +96,8 @@ function getCode(): string {
       rrweb.record({
         emit: event => window._replLog(event),
         recordCanvas: true,
-        collectFonts: true
+        collectFonts: true,
+        maskInputOptions: { password: true }
       });
     `);
     page.on('framenavigated', async () => {
@@ -107,7 +108,8 @@ function getCode(): string {
           rrweb.record({
             emit: event => window._replLog(event),
             recordCanvas: true,
-            collectFonts: true
+            collectFonts: true,
+            maskInputOptions: { password: true }
           });
         `);
       }

src/record/index.ts

@@ -62,6 +62,7 @@ function record<T = eventWithTime>(
           email: true,
           month: true,
           number: true,
+          password: true,
           range: true,
           search: true,
           tel: true,

src/record/observer.ts

@@ -240,7 +240,6 @@ function initInputObserver(
 
     const type: string | undefined = (target as HTMLInputElement).type;
     if (
-      type === 'password' ||
       (target as HTMLElement).classList.contains(ignoreClass)
     ) {
       return;