Merge pull request #5545 from FreeCodeCamp/new/basic-javascript-revamp

Basic Javascript Revamp

client/less/challenge.less

@@ -0,0 +1,24 @@
+.bonfire-instructions h4 {
+  margin-bottom: 0px;
+}
+
+.bonfire-instructions blockquote {
+  font-size: 90%;
+  font-family: @font-family-monospace;
+  color: @code-color;
+  background-color: @code-bg;
+  border-radius: @border-radius-base;
+  border: 1px solid @pre-border-color;
+  white-space: pre;
+  padding: 5px 10px;
+  margin-bottom: 10px;
+  margin-top: -10px;
+  overflow: auto;
+}
+
+.bonfire-instructions dfn {
+  font-family: @font-family-monospace;
+  color: @code-color;
+  background-color: @code-bg;
+  border-radius: @border-radius-base;
+}

client/less/main.less

@@ -1137,3 +1137,4 @@ code {
 
 @import "chat.less";
 @import "jobs.less";
+@import "challenge.less";

seed/test-challenges.js

@@ -51,8 +51,25 @@ function fillAssert(t) {
   return assert;
 }
 
-function createTest({ title, tests = [], solutions = [] }) {
+function createTest({
+  title,
+  tests = [],
+  solutions = [],
+  head = [],
+  tail = []
+}) {
+  solutions = solutions.filter(solution => !!solution);
+  tests = tests.filter(test => !!test);
+  head = head.join('\n');
+  tail = tail.join('\n');
   const plan = tests.length;
+  if (!plan) {
+    return Observable.just({
+      title,
+      type: 'missing'
+    });
+  }
+
   return Observable.fromCallback(tape)(title)
     .doOnNext(t => solutions.length ? t.plan(plan) : t.end())
     .flatMap(t => {
@@ -64,16 +81,25 @@ function createTest({ title, tests = [], solutions = [] }) {
         });
       }
 
+
       return Observable.just(t)
         .map(fillAssert)
         /* eslint-disable no-unused-vars */
-        // assert is used within the eval
+        // assert and code used within the eval
         .doOnNext(assert => {
-        /* eslint-enable no-unused-vars */
           solutions.forEach(solution => {
             tests.forEach(test => {
+              const code = solution;
+              const editor = { getValue() { return code; } };
+              /* eslint-enable no-unused-vars */
               try {
-                eval(solution + ';;' + test);
+                (() => {
+                  return eval(
+                    head + '\n;;' +
+                    solution + '\n;;' +
+                    tail + '\n;;' +
+                    test);
+                })();
               } catch (e) {
                 t.fail(e);
               }

server/views/coursewares/showBonfire.jade

@@ -15,7 +15,10 @@ block content
                         .col-xs-12
                             .bonfire-instructions
                                 for sentence in details
-                                    p.wrappable.negative-10!= sentence
+                                    if (/blockquote|h4|table/.test(sentence))
+                                        !=sentence
+                                    else
+                                        p.wrappable.negative-10!= sentence
                                 .negative-30-bottom
                                     #MDN-links
                                         p.negative-10 Here are some helpful links:

server/views/coursewares/showJS.jade

@@ -14,7 +14,10 @@ block content
                             .col-xs-12
                                 .bonfire-instructions
                                     for sentence in details
-                                        p.wrappable.negative-10!= sentence
+                                        if (/blockquote|h4|table/.test(sentence))
+                                            !=sentence
+                                        else
+                                            p.wrappable.negative-10!= sentence
                                     .negative-bottom-margin-30
                                         #MDN-links
                                             p.negative-10 Here are some helpful links: