fix: re-work output dom to remove whitespace when copying (#524)

Co-authored-by: Issac Gerges <gergesim@gmail.com>
electron · Nov 11, 2020 · fc25926 · fc25926
1 parent 00808c4
commit fc25926
Show file tree

Hide file tree

Showing 3 changed files with 32 additions and 25 deletions.
diff --git a/src/less/components/output.less b/src/less/components/output.less
@@ -1,4 +1,4 @@
-@import "../variables.less";
+@import '../variables.less';
 
 .output {
   font-size: 12px;
@@ -16,10 +16,7 @@
   overflow-y: scroll;
   -webkit-app-region: no-drag;
 
-  p {
-    margin-bottom: 0;
+  .output-message {
     white-space: pre;
-    padding-left: 5.6em;
-    text-indent: -5.6em;
   }
 }
diff --git a/src/renderer/components/output.tsx b/src/renderer/components/output.tsx
@@ -88,10 +88,12 @@ export class Output extends React.Component<CommandsProps> {
       : {};
 
     return lines.map((text, lineIndex) => (
-      <p style={style} key={`${entry.timestamp}--${index}--${lineIndex}`}>
-        {timestamp}
-        {text}
-      </p>
+      <div key={`${entry.timestamp}--${index}--${lineIndex}`}>
+        <span style={style} className="output-message">
+          {timestamp}
+          {text}
+        </span>
+      </div>
     ));
   }
 

diff --git a/tests/renderer/components/__snapshots__/output-spec.tsx.snap b/tests/renderer/components/__snapshots__/output-spec.tsx.snap
@@ -4,31 +4,39 @@ exports[`Output component renders with output 1`] = `
 <div
   className="output"
 >
-  <p
+  <div
     key="1532704073130--0--0"
-    style={Object {}}
   >
     <span
-      className="timestamp"
+      className="output-message"
+      style={Object {}}
     >
-      1532704073130
+      <span
+        className="timestamp"
+      >
+        1532704073130
+      </span>
+      Hi!
     </span>
-    Hi!
-  </p>
-  <p
+  </div>
+  <div
     key="1532704073130--1--0"
-    style={
-      Object {
-        "whiteSpace": "initial",
-      }
-    }
   >
     <span
-      className="timestamp"
+      className="output-message"
+      style={
+        Object {
+          "whiteSpace": "initial",
+        }
+      }
     >
-      1532704073130
+      <span
+        className="timestamp"
+      >
+        1532704073130
+      </span>
+      Hi!
     </span>
-    Hi!
-  </p>
+  </div>
 </div>
 `;