diff --git a/client/modules/IDE/components/Console.jsx b/client/modules/IDE/components/Console.jsx index bbcde1d3..5468a4db 100644 --- a/client/modules/IDE/components/Console.jsx +++ b/client/modules/IDE/components/Console.jsx @@ -70,13 +70,6 @@ class Console extends React.Component { } } - formatData(args) { - if (!Array.isArray(args)) { - return Array.of(args); - } - return args; - } - render() { const consoleClass = classNames({ 'preview-console': true, @@ -105,16 +98,8 @@ class Console extends React.Component {
{ this.consoleMessages = element; }} className="preview-console__messages"> {this.props.consoleEvents.map((consoleEvent) => { - const { arguments: args, method, times } = consoleEvent; + const { data: args, method, times } = consoleEvent; const { theme } = this.props; - Object.assign(consoleEvent, { data: this.formatData(args) }); - if (Object.keys(args).length === 0) { - return ( -
- undefined -
- ); - } return (
{ times > 1 && @@ -127,7 +112,7 @@ class Console extends React.Component { }
); diff --git a/client/modules/IDE/components/PreviewFrame.jsx b/client/modules/IDE/components/PreviewFrame.jsx index 0523e666..e1f8311c 100644 --- a/client/modules/IDE/components/PreviewFrame.jsx +++ b/client/modules/IDE/components/PreviewFrame.jsx @@ -8,6 +8,7 @@ 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 { @@ -80,8 +81,10 @@ class PreviewFrame extends React.Component { handleConsoleEvent(messageEvent) { if (Array.isArray(messageEvent.data)) { - messageEvent.data.every((message, index, arr) => { - const { arguments: args } = message; + let decodedMessages = messageEvent.data.map(message => Decode(message.log)); + + decodedMessages.every((message, index, arr) => { + const { data: args } = message; let hasInfiniteLoop = false; Object.keys(args).forEach((key) => { if (typeof args[key] === 'string' && args[key].includes('Exiting potential infinite loop')) { @@ -99,7 +102,7 @@ class PreviewFrame extends React.Component { } const cur = Object.assign(message, { times: 1 }); const nextIndex = index + 1; - while (isEqual(cur.arguments, arr[nextIndex].arguments) && cur.method === arr[nextIndex].method) { + while (isEqual(cur.data, arr[nextIndex].data) && cur.method === arr[nextIndex].method) { cur.times += 1; arr.splice(nextIndex, 1); if (nextIndex === arr.length) { @@ -109,7 +112,7 @@ class PreviewFrame extends React.Component { return true; }); - this.props.dispatchConsoleEvent(messageEvent.data); + this.props.dispatchConsoleEvent(decodedMessages); } } diff --git a/client/modules/IDE/reducers/console.js b/client/modules/IDE/reducers/console.js index e3a64098..145ad251 100644 --- a/client/modules/IDE/reducers/console.js +++ b/client/modules/IDE/reducers/console.js @@ -2,17 +2,12 @@ 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 e6e32809..9143dccd 100644 --- a/client/utils/previewEntry.js +++ b/client/utils/previewEntry.js @@ -6,11 +6,8 @@ window.loopProtect = loopProtect; const consoleBuffer = []; const LOGWAIT = 500; Hook(window.console, (log) => { - const { method, data: args } = log[0]; consoleBuffer.push({ - method, - arguments: args, - source: 'sketch' + log }); }); setInterval(() => {