Lab csp1: Change from YAML to JavaScript

Signed-off-by: David A. Wheeler <[email protected]>

Author: david-a-wheeler

docs/labs/csp1.html

@@ -7,6 +7,7 @@
 <link rel="stylesheet" href="checker.css">
 <script src="js-yaml.min.js"></script>
 <script src="checker.js"></script>
+<script src="csp1.js"></script>
 <link rel="license" href="https://creativecommons.org/licenses/by/4.0/">
 
 <!-- See create_labs.md for how to create your own lab! -->
@@ -58,88 +59,6 @@
   \} \) \) ;
 -->
 
-<script id="info" type="application/yaml">
----
-hints:
-- present: "import"
-  text: Yes, many JavaScript implementations support an import statement.
-    However, in this exercise we will use a require form. Please use that
-    instead.
-  examples:
-  - - 'import express from "express";'
-- absent: "const"
-  text: Start with const.
-- absent: 'const\s+helmet ='
-  text: Create a constant name named helmet using the form const helmet = ...
-  examples:
-  - - 'const'
-  - - 'consthelmet = '
-- present: 'require \( helmet \)'
-  text: The parameter of a requirement statement must be string.
-    Surround the term helment with double-quotes.
-  examples:
-  - - '  const helmet = require(helmet);'
-- absent: "; $"
-  text: JavaScript doesn''t require semicolon terminators, but the rest of
-    the code uses them. You should try to match a coding style when modifying
-    existing code unless there''s an important reason not to.
-    Please update the first statment.
-  examples:
-  - - '  const helmet = require("helmet")'
-- absent: '\s* app \. use \( helmet \( \{'
-  index: 1
-  text: Your code should begin with app.use(helmet({
-- absent: |
-    \s* app \. use \( helmet \( \{
-          contentSecurityPolicy: \{ \s*
-  index: 1
-  text: |
-    Your code should begin with:
-    app.use(helmet({
-      contentSecurityPolicy: {
-- absent: |
-    \s* app \. use \( helmet \( \{
-          contentSecurityPolicy: \{
-            directives: \{ \s*
-  index: 1
-  text: |
-    Your code should begin with:
-    app.use(helmet({
-      contentSecurityPolicy: {
-            directives: {
-- absent: |
-    \s* app \. use \( helmet \( \{
-          contentSecurityPolicy: \{
-            directives: \{
-                "script-src": \[ "'self'" , ["']https://example.com["'] \] , \s*
-  index: 1
-  text: |
-    Your code should continue with:
-    app.use(helmet({
-      contentSecurityPolicy: {
-            directives: {
-              "script-src": ["'self'", "https://example.com"],
-- absent: |
-    "style-src": \[ "'self'" \]
-  index: 1
-  text: |
-    Don't forget to include "style-src": ["'self'"]
-- absent: '; $'
-  index: 1
-  text: JavaScript doesn''t require semicolon terminators, but the rest of
-    the code uses them. You should try to match a coding style when modifying
-    existing code unless there''s an important reason not to.
-    Please update the second statement to use a semicolon terminator.
-- absent: |-
-    \} \} \) \) ; $
-  index: 1
-  text: The correct answer is expected to end with `} } ) ) ;` ignoring
-    whitespace. Check that you have matching parentheses and braces.
-- text: I do not have more specific hints to provide. Please ensure that
-    the parentheses, braces, and brackets pair correctly, as that is
-    often the problem.
-# debug: true
-</script>
 
 
 <!-- More examples:

docs/labs/csp1.js

@@ -0,0 +1,88 @@
+info =
+{
+  hints: [
+    {
+      present: "import",
+      text: "Yes, many JavaScript implementations support an import statement. However, in this exercise we will use a require form. Please use that instead.",
+      examples: [
+        [
+          "import express from \"express\";"
+        ]
+      ]
+    },
+    {
+      absent: "const",
+      text: "Start with const."
+    },
+    {
+      absent: String.raw`const\s+helmet =`,
+      text: "Create a constant name named helmet using the form const helmet = ...",
+      examples: [
+        [ "const" ],
+        [ "consthelmet = " ]
+      ]
+    },
+    {
+      present: String.raw`require \( helmet \)`,
+      text: "The parameter of a requirement statement must be string. Surround the term helment with double-quotes.",
+      examples: [
+        [ "  const helmet = require(helmet);" ]
+      ]
+    },
+    {
+      absent: "; $",
+      text: "JavaScript doesn''t require semicolon terminators, but the rest of the code uses them. You should try to match a coding style when modifying existing code unless there''s an important reason not to. Please update the first statment.",
+      examples: [
+        [ "  const helmet = require(\"helmet\")" ]
+      ]
+    },
+    {
+      absent: String.raw`\s* app \. use \( helmet \( \{`,
+      index: 1,
+      text: "Your code should begin with app.use(helmet({"
+    },
+    {
+      absent: String.raw`\s* app \. use \( helmet \( \{
+      contentSecurityPolicy: \{ \s*
+`,
+      index: 1,
+      text: "Your code should begin with:\napp.use(helmet({\n  contentSecurityPolicy: {\n"
+    },
+    {
+      absent: String.raw`\s* app \. use \( helmet \( \{
+      contentSecurityPolicy: \{
+        directives: \{ \s*
+`,
+      index: 1,
+      text: "Your code should begin with:\napp.use(helmet({\n  contentSecurityPolicy: {\n        directives: {\n"
+    },
+    {
+      absent: String.raw`\s* app \. use \( helmet \( \{
+      contentSecurityPolicy: \{
+        directives: \{
+            "script-src": \[ "'self'" , ["']https://example.com["'] \] , \s*
+`,
+      index: 1,
+      text: "Your code should continue with:\napp.use(helmet({\n  contentSecurityPolicy: {\n        directives: {\n          \"script-src\": [\"'self'\", \"https://example.com\"],\n"
+    },
+    {
+      absent: String.raw`"style-src": \[ "'self'" \]
+`,
+      index: 1,
+      text: "Don't forget to include \"style-src\": [\"'self'\"]\n"
+    },
+    {
+      absent: "; $",
+      index: 1,
+      text: "JavaScript doesn''t require semicolon terminators, but the rest of the code uses them. You should try to match a coding style when modifying existing code unless there''s an important reason not to. Please update the second statement to use a semicolon terminator."
+    },
+    {
+      absent: String.raw`\} \} \) \) ; $`,
+      index: 1,
+      text: "The correct answer is expected to end with `} } ) ) ;` ignoring whitespace. Check that you have matching parentheses and braces."
+    },
+    {
+      text: "I do not have more specific hints to provide. Please ensure that the parentheses, braces, and brackets pair correctly, as that is often the problem."
+    }
+  ]
+}