From f1bc7293cee4bde358558ca2297dffa3f3228741 Mon Sep 17 00:00:00 2001
From: Cassie Tarakajian <ctarakajian@gmail.com>
Date: Thu, 15 Nov 2018 15:55:02 -0500
Subject: [PATCH] Revert "fixes #761, but fixes the bigger issue at hand here,
 which is that log messages were not getting deserialized properly"

This reverts commit 661a367b72848a023c7edab5f1453a11c3a88f55.
---
 client/modules/IDE/components/Console.jsx     | 19 +++++++++++++++++--
 .../modules/IDE/components/PreviewFrame.jsx   | 11 ++++-------
 client/modules/IDE/reducers/console.js        |  5 +++++
 client/utils/previewEntry.js                  |  5 ++++-
 4 files changed, 30 insertions(+), 10 deletions(-)

diff --git a/client/modules/IDE/components/Console.jsx b/client/modules/IDE/components/Console.jsx
index 5468a4db..bbcde1d3 100644
--- a/client/modules/IDE/components/Console.jsx
+++ b/client/modules/IDE/components/Console.jsx
@@ -70,6 +70,13 @@ class Console extends React.Component {
     }
   }
 
+  formatData(args) {
+    if (!Array.isArray(args)) {
+      return Array.of(args);
+    }
+    return args;
+  }
+
   render() {
     const consoleClass = classNames({
       'preview-console': true,
@@ -98,8 +105,16 @@ class Console extends React.Component {
         </div>
         <div ref={(element) => { this.consoleMessages = element; }} className="preview-console__messages">
           {this.props.consoleEvents.map((consoleEvent) => {
-            const { data: args, method, times } = consoleEvent;
+            const { arguments: args, method, times } = consoleEvent;
             const { theme } = this.props;
+            Object.assign(consoleEvent, { data: this.formatData(args) });
+            if (Object.keys(args).length === 0) {
+              return (
+                <div key={consoleEvent.id} className="preview-console__message preview-console__message--undefined">
+                  <span key={`${consoleEvent.id}-0`}>undefined</span>
+                </div>
+              );
+            }
             return (
               <div key={consoleEvent.id} className={`preview-console__message preview-console__message--${method}`}>
                 { times > 1 &&
@@ -112,7 +127,7 @@ class Console extends React.Component {
                 }
                 <ConsoleFeed
                   styles={this.getConsoleFeedStyle(theme, times)}
-                  logs={[consoleEvent]}
+                  logs={Array.of(consoleEvent)}
                 />
               </div>
             );
diff --git a/client/modules/IDE/components/PreviewFrame.jsx b/client/modules/IDE/components/PreviewFrame.jsx
index e1f8311c..0523e666 100644
--- a/client/modules/IDE/components/PreviewFrame.jsx
+++ b/client/modules/IDE/components/PreviewFrame.jsx
@@ -8,7 +8,6 @@ import loopProtect from 'loop-protect';
 import { JSHINT } from 'jshint';
 import decomment from 'decomment';
 import classNames from 'classnames';
-import { Decode } from 'console-feed';
 import { getBlobUrl } from '../actions/files';
 import { resolvePathToFile } from '../../../../server/utils/filePath';
 import {
@@ -81,10 +80,8 @@ class PreviewFrame extends React.Component {
 
   handleConsoleEvent(messageEvent) {
     if (Array.isArray(messageEvent.data)) {
-      let decodedMessages = messageEvent.data.map(message => Decode(message.log));
-
-      decodedMessages.every((message, index, arr) => {
-        const { data: args } = message;
+      messageEvent.data.every((message, index, arr) => {
+        const { arguments: args } = message;
         let hasInfiniteLoop = false;
         Object.keys(args).forEach((key) => {
           if (typeof args[key] === 'string' && args[key].includes('Exiting potential infinite loop')) {
@@ -102,7 +99,7 @@ class PreviewFrame extends React.Component {
         }
         const cur = Object.assign(message, { times: 1 });
         const nextIndex = index + 1;
-        while (isEqual(cur.data, arr[nextIndex].data) && cur.method === arr[nextIndex].method) {
+        while (isEqual(cur.arguments, arr[nextIndex].arguments) && cur.method === arr[nextIndex].method) {
           cur.times += 1;
           arr.splice(nextIndex, 1);
           if (nextIndex === arr.length) {
@@ -112,7 +109,7 @@ class PreviewFrame extends React.Component {
         return true;
       });
 
-      this.props.dispatchConsoleEvent(decodedMessages);
+      this.props.dispatchConsoleEvent(messageEvent.data);
     }
   }
 
diff --git a/client/modules/IDE/reducers/console.js b/client/modules/IDE/reducers/console.js
index 145ad251..e3a64098 100644
--- a/client/modules/IDE/reducers/console.js
+++ b/client/modules/IDE/reducers/console.js
@@ -2,12 +2,17 @@ import * as ActionTypes from '../../../constants';
 
 const consoleMax = 500;
 const initialState = [];
+let messageId = 0;
 
 const console = (state = initialState, action) => {
   let messages;
   switch (action.type) {
     case ActionTypes.CONSOLE_EVENT:
       messages = [...action.event];
+      messages.forEach((message) => {
+        message.id = messageId;
+        messageId += 1;
+      });
       return state.concat(messages).slice(-consoleMax);
     case ActionTypes.CLEAR_CONSOLE:
       return [];
diff --git a/client/utils/previewEntry.js b/client/utils/previewEntry.js
index 9143dccd..e6e32809 100644
--- a/client/utils/previewEntry.js
+++ b/client/utils/previewEntry.js
@@ -6,8 +6,11 @@ window.loopProtect = loopProtect;
 const consoleBuffer = [];
 const LOGWAIT = 500;
 Hook(window.console, (log) => {
+  const { method, data: args } = log[0];
   consoleBuffer.push({
-    log
+    method,
+    arguments: args,
+    source: 'sketch'
   });
 });
 setInterval(() => {