fix: simplify logging and include console.log

This comes at the cost of creating a flash of the default message when
the preview updates, but significantly simplifies the code.

client/src/templates/Challenges/redux/execute-challenge-saga.js

@@ -1,5 +1,4 @@
 import {
-  all,
   delay,
   put,
   select,
@@ -146,24 +145,19 @@ function* previewChallengeSaga() {
   }
 
   const logProxy = yield channel();
-  const consoleProxy = yield channel();
   const proxyLogger = args => logProxy.put(args);
-  const proxyUpdateConsole = args => consoleProxy.put(args);
 
   try {
     yield put(initLogs());
-    yield fork(takeEveryLog, logProxy);
+    yield put(initConsole(''));
-    yield fork(takeEveryConsole, consoleProxy);
+    yield fork(takeEveryConsole, logProxy);
 
     const challengeData = yield select(challengeDataSelector);
     const buildData = yield buildChallengeData(challengeData);
     // evaluate the user code in the preview frame or in the worker
     if (challengeHasPreview(challengeData)) {
       const document = yield getContext('document');
-      yield call(updatePreview, buildData, document, {
+      yield call(updatePreview, buildData, document, proxyLogger);
-        proxyLogger,
-        proxyUpdateConsole
-      });
     } else if (isJavaScriptChallenge(challengeData)) {
       const runUserCode = getTestRunner(buildData, { proxyLogger });
       // without a testString the testRunner just evaluates the user's code
@@ -171,14 +165,7 @@ function* previewChallengeSaga() {
     }
   } catch (err) {
     console.log(err);
-    yield put(updateLogs(escape(err)));
+    yield put(updateConsole(escape(err)));
-  } finally {
-    // consoleProxy is left open to record any errors triggered by user
-    // input.
-    logProxy.close();
-
-    // To avoid seeing the default console, initialise and output in one call.
-    yield all([put(initConsole('')), put(logsToConsole('// console output'))]);
   }
 }
 

client/src/templates/Challenges/utils/frame.js

@@ -101,15 +101,15 @@ const initTestFrame = frameReady => ctx => {
   return ctx;
 };
 
-const initMainFrame = (frameReady, proxyUpdateConsole) => ctx => {
+const initMainFrame = (frameReady, proxyLogger) => ctx => {
   waitForFrame(ctx).then(() => {
     // Overwriting the onerror added by createHeader to catch any errors thrown
     // after the frame is ready. It has to be overwritten, as proxyUpdateConsole
     // cannot be added as part of createHeader.
     ctx.window.onerror = function(msg) {
       console.log(msg);
-      if (proxyUpdateConsole) {
+      if (proxyLogger) {
-        proxyUpdateConsole(msg);
+        proxyLogger(msg);
       }
       return true;
     };
@@ -140,23 +140,17 @@ const writeContentToFrame = ctx => {
   return ctx;
 };
 
-export const createMainFramer = (document, frameReady, proxy) =>
+export const createMainFramer = (document, frameReady, proxyLogger) =>
-  createFramer(document, frameReady, proxy, mainId, initMainFrame);
+  createFramer(document, frameReady, proxyLogger, mainId, initMainFrame);
 
-export const createTestFramer = (document, frameReady, proxy) =>
+export const createTestFramer = (document, frameReady, proxyLogger) =>
-  createFramer(document, frameReady, proxy, testId, initTestFrame);
+  createFramer(document, frameReady, proxyLogger, testId, initTestFrame);
 
-const createFramer = (
+const createFramer = (document, frameReady, proxyLogger, id, init) =>
-  document,
-  frameReady,
-  { proxyLogger, proxyUpdateConsole },
-  id,
-  init
-) =>
   flow(
     createFrame(document, id),
     mountFrame(document),
     buildProxyConsole(proxyLogger),
     writeContentToFrame,
-    init(frameReady, proxyUpdateConsole)
+    init(frameReady, proxyLogger)
   );