diff --git a/client/modules/IDE/components/Console.js b/client/modules/IDE/components/Console.js index 390afd51..bb08e59b 100644 --- a/client/modules/IDE/components/Console.js +++ b/client/modules/IDE/components/Console.js @@ -8,7 +8,7 @@ import classNames from 'classnames'; * How many console messages to store * @type {Number} */ -const consoleMax = 100; +const consoleMax = 200; class Console extends React.Component { @@ -27,17 +27,21 @@ class Console extends React.Component { if (nextProps.isPlaying && !this.props.isPlaying) { this.children = []; } else if (nextProps.consoleEvent !== this.props.consoleEvent && this.props.isPlaying) { - const args = nextProps.consoleEvent.arguments; - Object.keys(args).forEach((key) => { - if (args[key].includes('Exiting potential infinite loop')) { - this.props.stopSketch(); - this.props.expandConsole(); - this.appendConsoleEvent(nextProps.consoleEvent); + nextProps.consoleEvent.forEach(consoleEvent => { + if (consoleEvent.source === 'sketch') { + const args = consoleEvent.arguments; + Object.keys(args).forEach((key) => { + if (args[key].includes('Exiting potential infinite loop')) { + this.props.stopSketch(); + this.props.expandConsole(); + this.appendConsoleEvent(consoleEvent); + } + }); + if (nextProps.isExpanded) { + this.appendConsoleEvent(consoleEvent); + } } }); - if (nextProps.isExpanded) { - this.appendConsoleEvent(nextProps.consoleEvent); - } } } @@ -90,7 +94,7 @@ class Console extends React.Component { } Console.propTypes = { - consoleEvent: PropTypes.object, + consoleEvent: PropTypes.array, isPlaying: PropTypes.bool.isRequired, isExpanded: PropTypes.bool.isRequired, collapseConsole: PropTypes.func.isRequired, diff --git a/client/modules/IDE/components/PreviewFrame.js b/client/modules/IDE/components/PreviewFrame.js index 2fc40003..748a6d75 100644 --- a/client/modules/IDE/components/PreviewFrame.js +++ b/client/modules/IDE/components/PreviewFrame.js @@ -42,29 +42,11 @@ function hijackConsoleLogsScript() { 'debug', 'clear', 'error', 'info', 'log', 'warn' ]; - - function throttle(fn, threshhold, scope) { - var last, deferTimer; - return function() { - var context = scope || this; - var now = +new Date, - args = arguments; - if (last && now < last + threshhold) { - // hold on to it - clearTimeout(deferTimer); - deferTimer = setTimeout(function() { - last = now; - fn.apply(context, args); - }, threshhold); - } else { - last = now; - fn.apply(context, args); - } - }; - } + var consoleBuffer = []; + var LOGWAIT = 500; methods.forEach( function(method) { - iframeWindow.console[method] = throttle(function() { + iframeWindow.console[method] = function() { originalConsole[method].apply(originalConsole, arguments); var args = Array.from(arguments); @@ -73,14 +55,20 @@ function hijackConsoleLogsScript() { return (typeof i === 'string') ? i : JSON.stringify(i); }); - // post message to parent window - window.parent.postMessage({ + consoleBuffer.push({ method: method, arguments: args, source: 'sketch' - }, '*'); - }, 100); + }); + }; }); + + setInterval(function() { + if (consoleBuffer.length > 0) { + window.parent.postMessage(consoleBuffer, '*'); + consoleBuffer.length = 0; + } + }, LOGWAIT); `; return s; } @@ -133,9 +121,7 @@ class PreviewFrame extends React.Component { if (this.props.dispatchConsoleEvent) { window.addEventListener('message', (msg) => { - if (msg.data.source === 'sketch') { - this.props.dispatchConsoleEvent(msg); - } + this.props.dispatchConsoleEvent(msg); }); } } diff --git a/client/modules/IDE/pages/IDEView.js b/client/modules/IDE/pages/IDEView.js index c69896dc..28f4f3ec 100644 --- a/client/modules/IDE/pages/IDEView.js +++ b/client/modules/IDE/pages/IDEView.js @@ -415,7 +415,7 @@ IDEView.propTypes = { ide: PropTypes.shape({ isPlaying: PropTypes.bool.isRequired, isTextOutputPlaying: PropTypes.bool.isRequired, - consoleEvent: PropTypes.object, + consoleEvent: PropTypes.array, modalIsVisible: PropTypes.bool.isRequired, sidebarIsExpanded: PropTypes.bool.isRequired, consoleIsExpanded: PropTypes.bool.isRequired, diff --git a/client/modules/IDE/reducers/ide.js b/client/modules/IDE/reducers/ide.js index 0abde94c..6c8bc891 100644 --- a/client/modules/IDE/reducers/ide.js +++ b/client/modules/IDE/reducers/ide.js @@ -3,10 +3,7 @@ import * as ActionTypes from '../../../constants'; const initialState = { isPlaying: false, isTextOutputPlaying: false, - consoleEvent: { - method: undefined, - arguments: [] - }, + consoleEvent: [], modalIsVisible: false, sidebarIsExpanded: false, consoleIsExpanded: false,