fix(snapshot): properly save textarea content (#3835)

microsoft · Sep 10, 2020 · bf9c4a3 · bf9c4a3
1 parent 45542a5
commit bf9c4a3
Show file tree

Hide file tree

Showing 2 changed files with 11 additions and 4 deletions.
diff --git a/src/trace/snapshotterInjected.ts b/src/trace/snapshotterInjected.ts
@@ -194,9 +194,9 @@ export function takeSnapshotInFrame(guid: string, removeNoScript: boolean): Snap
         builder.push(escapeAttribute(value));
         builder.push('"');
       }
-      if (nodeName === 'INPUT' || nodeName === 'TEXTAREA') {
+      if (nodeName === 'INPUT') {
         builder.push(' value="');
-        builder.push(escapeAttribute((element as HTMLInputElement | HTMLTextAreaElement).value));
+        builder.push(escapeAttribute((element as HTMLInputElement).value));
         builder.push('"');
       }
       if ((element as any).checked)
@@ -237,8 +237,12 @@ export function takeSnapshotInFrame(guid: string, removeNoScript: boolean): Snap
       }
       builder.push('>');
     }
-    for (let child = node.firstChild; child; child = child.nextSibling)
-      visit(child, builder);
+    if (nodeName === 'TEXTAREA') {
+      builder.push(escapeText((node as HTMLTextAreaElement).value));
+    } else {
+      for (let child = node.firstChild; child; child = child.nextSibling)
+        visit(child, builder);
+    }
     if (node.nodeName === 'BODY' && chunks.size) {
       builder.push('<script>');
       const shadowChunks = Array.from(chunks).map(([chunkId, html]) => {

diff --git a/test/assets/snapshot/snapshot-with-css.html b/test/assets/snapshot/snapshot-with-css.html
@@ -7,11 +7,14 @@
   }
 </style>
 <div>hello, world!</div>
+<textarea>Before edit</textarea>
 <div class=root></div>
 <script>
   let shadow;
 
   window.addEventListener('DOMContentLoaded', () => {
+    document.querySelector('textarea').value = 'After edit';
+
     const root = document.querySelector('.root');
     shadow = root.attachShadow({ mode: 'open' });