diff --git a/components/ui/js-editor.vue b/components/ui/js-editor.vue
index f3964b553..764d56d9b 100644
--- a/components/ui/js-editor.vue
+++ b/components/ui/js-editor.vue
@@ -21,7 +21,14 @@
 <script>
 import ace from "ace-builds"
 import "ace-builds/webpack-resolver"
+import "ace-builds/src-noconflict/ext-language_tools"
+import "ace-builds/src-noconflict/mode-graphqlschema"
 import debounce from "~/helpers/utils/debounce"
+import {
+  getPreRequestScriptCompletions,
+  getTestScriptCompletions,
+  performPreRequestLinting,
+} from "~/helpers/tern"
 
 import * as esprima from "esprima"
 
@@ -44,6 +51,11 @@ export default {
       type: String,
       default: "",
     },
+    completeMode: {
+      type: String,
+      required: true,
+      default: "none",
+    },
   },
 
   data() {
@@ -65,9 +77,14 @@ export default {
     theme() {
       this.initialized = false
       this.editor.setTheme(`ace/theme/${this.defineTheme()}`, () => {
-        this.$nextTick().then(() => {
-          this.initialized = true
-        })
+        this.$nextTick()
+          .then(() => {
+            this.initialized = true
+          })
+          .catch(() => {
+            // nextTick shouldn't really ever throw but still
+            this.initialized = true
+          })
       })
     },
     options(value) {
@@ -76,18 +93,63 @@ export default {
   },
 
   mounted() {
+    const langTools = ace.require("ace/ext/language_tools")
+
     const editor = ace.edit(this.$refs.editor, {
       mode: `ace/mode/javascript`,
+      enableBasicAutocompletion: true,
+      enableLiveAutocompletion: true,
       ...this.options,
     })
 
     // Set the theme and show the editor only after it's been set to prevent FOUC.
     editor.setTheme(`ace/theme/${this.defineTheme()}`, () => {
-      this.$nextTick().then(() => {
-        this.initialized = true
-      })
+      this.$nextTick()
+        .then(() => {
+          this.initialized = true
+        })
+        .catch(() => {
+          // nextTIck shouldn't really ever throw but still
+          this.initalized = true
+        })
     })
 
+    const completer = {
+      getCompletions: (editor, _session, { row, column }, _prefix, callback) => {
+        if (this.completeMode === "pre") {
+          getPreRequestScriptCompletions(editor.getValue(), row, column)
+            .then((res) => {
+              callback(
+                null,
+                res.completions.map((r, index, arr) => ({
+                  name: r.name,
+                  value: r.name,
+                  score: (arr.length - index) / arr.length,
+                  meta: r.type,
+                }))
+              )
+            })
+            .catch(() => callback(null, []))
+        } else if (this.completeMode === "test") {
+          getTestScriptCompletions(editor.getValue(), row, column)
+            .then((res) => {
+              callback(
+                null,
+                res.completions.map((r, index, arr) => ({
+                  name: r.name,
+                  value: r.name,
+                  score: (arr.length - index) / arr.length,
+                  meta: r.type,
+                }))
+              )
+            })
+            .catch(() => callback(null, []))
+        }
+      },
+    }
+
+    editor.completers = [completer]
+
     if (this.value) editor.setValue(this.value, 1)
 
     this.editor = editor
@@ -115,33 +177,80 @@ export default {
     },
 
     provideLinting: debounce(function (code) {
-      try {
-        const res = esprima.parseScript(code, { tolerant: true })
-        if (res.errors && res.errors.length > 0) {
-          this.editor.session.setAnnotations(
-            res.errors.map((err) => {
-              const pos = this.editor.session.getDocument().indexToPosition(err.index, 0)
+      let results = []
 
-              return {
+      performPreRequestLinting(code)
+        .then((semanticLints) => {
+          results = results.concat(
+            semanticLints.map((lint) => ({
+              row: lint.from.line,
+              column: lint.from.ch,
+              text: `[semantic] ${lint.message}`,
+              type: "error",
+            }))
+          )
+
+          try {
+            const res = esprima.parseScript(code, { tolerant: true })
+            if (res.errors && res.errors.length > 0) {
+              results = results.concat(
+                res.errors.map((err) => {
+                  const pos = this.editor.session.getDocument().indexToPosition(err.index, 0)
+
+                  return {
+                    row: pos.row,
+                    column: pos.column,
+                    text: `[syntax] ${err.description}`,
+                    type: "error",
+                  }
+                })
+              )
+            }
+          } catch (e) {
+            const pos = this.editor.session.getDocument().indexToPosition(e.index, 0)
+            results = results.concat([
+              {
                 row: pos.row,
                 column: pos.column,
-                text: err.description,
+                text: `[syntax] ${e.description}`,
                 type: "error",
-              }
-            })
-          )
-        }
-      } catch (e) {
-        const pos = this.editor.session.getDocument().indexToPosition(e.index, 0)
-        this.editor.session.setAnnotations([
-          {
-            row: pos.row,
-            column: pos.column,
-            text: e.description,
-            type: "error",
-          },
-        ])
-      }
+              },
+            ])
+          }
+
+          this.editor.session.setAnnotations(results)
+        })
+        .catch(() => {
+          try {
+            const res = esprima.parseScript(code, { tolerant: true })
+            if (res.errors && res.errors.length > 0) {
+              results = results.concat(
+                res.errors.map((err) => {
+                  const pos = this.editor.session.getDocument().indexToPosition(err.index, 0)
+
+                  return {
+                    row: pos.row,
+                    column: pos.column,
+                    text: `[syntax] ${err.description}`,
+                    type: "error",
+                  }
+                })
+              )
+            }
+          } catch (e) {
+            const pos = this.editor.session.getDocument().indexToPosition(e.index, 0)
+            results = results.concat([
+              {
+                row: pos.row,
+                column: pos.column,
+                text: `[syntax] ${e.description}`,
+                type: "error",
+              },
+            ])
+          }
+
+          this.editor.session.setAnnotations(results)
+        })
     }, 2000),
   },
 
diff --git a/helpers/tern.js b/helpers/tern.js
new file mode 100644
index 000000000..e8e1a27ae
--- /dev/null
+++ b/helpers/tern.js
@@ -0,0 +1,119 @@
+import tern from "tern"
+
+import ECMA_DEF from "~/helpers/terndoc/ecma.json"
+import PW_PRE_DEF from "~/helpers/terndoc/pw-pre.json"
+import PW_TEST_DEF from "~/helpers/terndoc/pw-test.json"
+import PW_EXTRAS_DEF from "~/helpers/terndoc/pw-extras.json"
+
+import { registerTernLinter } from "./ternlint"
+
+const server = new tern.Server({
+  defs: [ECMA_DEF, PW_EXTRAS_DEF],
+  plugins: {
+    lint: {
+      rules: [],
+    },
+  },
+})
+
+registerTernLinter()
+
+function performLinting(code) {
+  return new Promise((resolve, reject) => {
+    server.request(
+      {
+        query: {
+          type: "lint",
+          file: "doc",
+          lineCharPositions: true,
+        },
+        files: [
+          {
+            type: "full",
+            name: "doc",
+            text: code,
+          },
+        ],
+      },
+      (err, res) => {
+        if (!err) resolve(res.messages)
+        else reject(err)
+      }
+    )
+  })
+}
+
+export function performPreRequestLinting(code) {
+  server.deleteDefs("pw-test")
+  server.deleteDefs("pw-pre")
+  server.addDefs(PW_PRE_DEF)
+  return performLinting(code)
+}
+
+export function performTestLinting(code) {
+  server.deleteDefs("pw-test")
+  server.deleteDefs("pw-pre")
+  server.addDefs(PW_TEST_DEF)
+  return performLinting(code)
+}
+
+function postProcessCompletionResult(res) {
+  if (res.completions) {
+    const index = res.completions.findIndex((el) => el.name === "pw")
+
+    if (index !== -1) {
+      const result = res.completions[index]
+
+      res.completions.splice(index, 1)
+      res.completions.splice(0, 0, result)
+    }
+  }
+
+  return res
+}
+
+function performCompletion(code, row, col) {
+  return new Promise((resolve, reject) => {
+    server.request(
+      {
+        query: {
+          type: "completions",
+          file: "doc",
+          end: {
+            line: row,
+            ch: col,
+          },
+          guess: false,
+          types: true,
+          includeKeywords: true,
+          inLiteral: false,
+        },
+        files: [
+          {
+            type: "full",
+            name: "doc",
+            text: code,
+          },
+        ],
+      },
+      (err, res) => {
+        if (err) reject(err)
+        else resolve(postProcessCompletionResult(res))
+      }
+    )
+  })
+}
+
+export function getPreRequestScriptCompletions(code, row, col) {
+  server.deleteDefs("pw-test")
+  server.deleteDefs("pw-pre")
+  server.addDefs(PW_PRE_DEF)
+  return performCompletion(code, row, col)
+}
+
+export function getTestScriptCompletions(code, row, col) {
+  server.deleteDefs("pw-test")
+  server.deleteDefs("pw-pre")
+  server.addDefs(PW_TEST_DEF)
+  return performCompletion(code, row, col)
+}
diff --git a/helpers/terndoc/ecma.json b/helpers/terndoc/ecma.json
new file mode 100644
index 000000000..95d9ada2b
--- /dev/null
+++ b/helpers/terndoc/ecma.json
@@ -0,0 +1,1284 @@
+{
+  "!name": "ecmascript",
+  "!define": {
+    "Error.prototype": "Error.prototype",
+    "propertyDescriptor": {
+      "enumerable": "bool",
+      "configurable": "bool",
+      "value": "?",
+      "writable": "bool",
+      "get": "fn() -> ?",
+      "set": "fn(value: ?)"
+    },
+    "Promise.prototype": {
+      "catch": {
+        "!type": "fn(onRejected: fn(reason: ?)) -> !this"
+      },
+      "then": {
+        "!type": "fn(onFulfilled: fn(value: ?), onRejected: fn(reason: ?)) -> !custom:Promise_then",
+        "!effects": ["call !0 !this.:t"]
+      },
+      "finally": {
+        "!type": "fn(onFinally: fn()) -> !custom:Promise_then"
+      }
+    },
+    "Promise_reject": {
+      "!type": "fn(reason: ?) -> !this"
+    },
+    "iter_prototype": {
+      ":Symbol.iterator": "fn() -> !this"
+    },
+    "iter": {
+      "!proto": "iter_prototype",
+      "next": {
+        "!type": "fn() -> +iter_result[value=!this.:t]"
+      }
+    },
+    "iter_result": {
+      "done": "bool",
+      "value": "?"
+    },
+    "generator_prototype": {
+      "!proto": "iter_prototype",
+      "next": "fn(value?: ?) -> iter_result",
+      "return": "fn(value?: ?) -> iter_result",
+      "throw": "fn(exception: +Error)"
+    },
+    "async_iter_prototype": {
+      ":Symbol.asyncIterator": "fn() -> !this"
+    },
+    "async_iter": {
+      "!proto": "async_iter_prototype",
+      "next": {
+        "!type": "fn() -> +Promise[:t=+iter_result[value=!this.:t]]"
+      }
+    },
+    "async_generator_prototype": {
+      "!proto": "async_iter_prototype",
+      "next": "fn(value?: ?) -> +Promise[:t=iter_result]",
+      "return": "fn(value?: ?) -> +Promise[:t=iter_result]",
+      "throw": "fn(exception: +Error)"
+    },
+    "Proxy_handler": {
+      "getPrototypeOf": "fn(target: ?)",
+      "setPrototypeOf": "fn(target: ?, prototype: ?)",
+      "isExtensible": "fn(target: ?)",
+      "preventExtensions": "fn(target: ?)",
+      "getOwnPropertyDescriptor": "fn(target: ?, property: string) -> propertyDescriptor",
+      "defineProperty": "fn(target: ?, property: string, descriptor: propertyDescriptor)",
+      "has": "fn(target: ?, property: string)",
+      "get": "fn(target: ?, property: string)",
+      "set": "fn(target: ?, property: string, value: ?)",
+      "deleteProperty": "fn(target: ?, property: string)",
+      "enumerate": "fn(target: ?)",
+      "ownKeys": "fn(target: ?)",
+      "apply": "fn(target: ?, self: ?, arguments: [?])",
+      "construct": "fn(target: ?, arguments: [?])"
+    },
+    "Proxy_revocable": {
+      "proxy": "+Proxy",
+      "revoke": "fn()"
+    },
+    "TypedArray": {
+      "!type": "fn(size: number)",
+      "from": {
+        "!type": "fn(arrayLike: ?, mapFn?: fn(elt: ?, i: number) -> number, thisArg?: ?) -> +TypedArray",
+        "!effects": ["call !1 this=!2 !0.<i> number"]
+      },
+      "of": {
+        "!type": "fn(elements: number) -> +TypedArray"
+      },
+      "BYTES_PER_ELEMENT": {
+        "!type": "number"
+      },
+      "name": {
+        "!type": "string"
+      },
+      "prototype": {
+        "<i>": "number",
+        "buffer": {
+          "!type": "+ArrayBuffer"
+        },
+        "byteLength": {
+          "!type": "number"
+        },
+        "byteOffset": {
+          "!type": "number"
+        },
+        "copyWithin": {
+          "!type": "fn(target: number, start: number, end?: number) -> ?"
+        },
+        "entries": {
+          "!type": "fn() -> +iter[:t=number]"
+        },
+        "every": {
+          "!type": "fn(callback: fn(element: number, index: number, array: TypedArray) -> bool, thisArg?: ?) -> bool",
+          "!effects": ["call !0 this=!1 number number !this"]
+        },
+        "fill": {
+          "!type": "fn(value: number, start?: number, end?: number)"
+        },
+        "filter": {
+          "!type": "fn(test: fn(element: number, i: number) -> bool, context?: ?) -> !this",
+          "!effects": ["call !0 this=!1 number number"]
+        },
+        "find": {
+          "!type": "fn(callback: fn(element: number, index: number, array: +TypedArray) -> bool, thisArg?: ?) -> number",
+          "!effects": ["call !0 this=!1 number number !this"]
+        },
+        "findIndex": {
+          "!type": "fn(callback: fn(element: number, index: number, array: +TypedArray) -> bool, thisArg?: ?) -> number",
+          "!effects": ["call !0 this=!1 number number !this"]
+        },
+        "forEach": {
+          "!type": "fn(callback: fn(value: number, key: number, array: +TypedArray), thisArg?: ?)",
+          "!effects": ["call !0 this=!1 number number !this"]
+        },
+        "indexOf": {
+          "!type": "fn(searchElement: number, fromIndex?: number) -> number"
+        },
+        "join": {
+          "!type": "fn(separator?: string) -> string"
+        },
+        "keys": {
+          "!type": "fn() -> +iter[:t=number]"
+        },
+        "lastIndexOf": {
+          "!type": "fn(searchElement: number, fromIndex?: number) -> number"
+        },
+        "length": {
+          "!type": "number"
+        },
+        "map": {
+          "!type": "fn(f: fn(element: number, i: number) -> number, context?: ?) -> +TypedArray",
+          "!effects": ["call !0 this=!1 number number"]
+        },
+        "reduce": {
+          "!type": "fn(combine: fn(sum: ?, elt: number, i: number) -> ?, init?: ?) -> !0.!ret",
+          "!effects": ["call !0 !1 number number"]
+        },
+        "reduceRight": {
+          "!type": "fn(combine: fn(sum: ?, elt: number, i: number) -> ?, init?: ?) -> !0.!ret",
+          "!effects": ["call !0 !1 number number"]
+        },
+        "reverse": {
+          "!type": "fn()"
+        },
+        "set": {
+          "!type": "fn(array: [number], offset?: number)"
+        },
+        "slice": {
+          "!type": "fn(from: number, to?: number) -> +TypedArray"
+        },
+        "some": {
+          "!type": "fn(test: fn(elt: number, i: number) -> bool, context?: ?) -> bool",
+          "!effects": ["call !0 this=!1 number number"]
+        },
+        "sort": {
+          "!type": "fn(compare?: fn(a: number, b: number) -> number)",
+          "!effects": ["call !0 number number"]
+        },
+        "subarray": {
+          "!type": "fn(begin?: number, end?: number) -> +TypedArray"
+        },
+        "values": {
+          "!type": "fn() -> +iter[:t=number]"
+        },
+        ":Symbol.iterator": {
+          "!type": "fn() -> +iter[:t=number]"
+        }
+      }
+    }
+  },
+  "Infinity": {
+    "!type": "number"
+  },
+  "undefined": {
+    "!type": "?"
+  },
+  "NaN": {
+    "!type": "number"
+  },
+  "Object": {
+    "!type": "fn()",
+    "getPrototypeOf": {
+      "!type": "fn(obj: ?) -> ?"
+    },
+    "create": {
+      "!type": "fn(proto: ?) -> !custom:Object_create"
+    },
+    "defineProperty": {
+      "!type": "fn(obj: ?, prop: string, desc: propertyDescriptor) -> !custom:Object_defineProperty"
+    },
+    "defineProperties": {
+      "!type": "fn(obj: ?, props: ?) -> !custom:Object_defineProperties"
+    },
+    "getOwnPropertyDescriptor": {
+      "!type": "fn(obj: ?, prop: string) -> propertyDescriptor"
+    },
+    "keys": {
+      "!type": "fn(obj: ?) -> [string]"
+    },
+    "getOwnPropertyNames": {
+      "!type": "fn(obj: ?) -> [string]"
+    },
+    "seal": {
+      "!type": "fn(obj: ?)"
+    },
+    "isSealed": {
+      "!type": "fn(obj: ?) -> bool"
+    },
+    "freeze": {
+      "!type": "fn(obj: ?) -> !0"
+    },
+    "isFrozen": {
+      "!type": "fn(obj: ?) -> bool"
+    },
+    "preventExtensions": {
+      "!type": "fn(obj: ?)"
+    },
+    "isExtensible": {
+      "!type": "fn(obj: ?) -> bool"
+    },
+    "assign": {
+      "!type": "fn(target: ?, source: ?, source?: ?) -> !0",
+      "!effects": ["copy !1 !0", "copy !2 !0", "copy !3 !0"]
+    },
+    "getOwnPropertySymbols": {
+      "!type": "fn(obj: ?) -> !custom:getOwnPropertySymbols"
+    },
+    "is": {
+      "!type": "fn(value1: ?, value2: ?) -> bool"
+    },
+    "setPrototypeOf": {
+      "!type": "fn(obj: ?, prototype: ?)"
+    },
+    "prototype": {
+      "!stdProto": "Object",
+      "toString": {
+        "!type": "fn() -> string"
+      },
+      "toLocaleString": {
+        "!type": "fn() -> string"
+      },
+      "valueOf": {
+        "!type": "fn() -> number"
+      },
+      "hasOwnProperty": {
+        "!type": "fn(prop: string) -> bool"
+      },
+      "propertyIsEnumerable": {
+        "!type": "fn(prop: string) -> bool"
+      },
+      "isPrototypeOf": {
+        "!type": "fn(obj: ?) -> bool"
+      }
+    }
+  },
+  "Function": {
+    "!type": "fn(body: string) -> fn()",
+    "prototype": {
+      "!stdProto": "Function",
+      "apply": {
+        "!type": "fn(this: ?, args: [?])",
+        "!effects": [
+          "call and return !this this=!0 !1.<i> !1.<i> !1.<i>"
+        ]
+      },
+      "call": {
+        "!type": "fn(this: ?, args?: ?) -> !this.!ret",
+        "!effects": [
+          "call and return !this this=!0 !1 !2 !3 !4"
+        ]
+      },
+      "bind": {
+        "!type": "fn(this: ?, args?: ?) -> !custom:Function_bind"
+      },
+      "prototype": "?"
+    }
+  },
+  "Array": {
+    "!type": "fn(size: number) -> !custom:Array_ctor",
+    "isArray": {
+      "!type": "fn(value: ?) -> bool"
+    },
+    "from": {
+      "!type": "fn(arrayLike: ?, mapFn?: fn(elt: ?, i: number) -> ?, thisArg?: ?) -> [!0.<i>]",
+      "!effects": [
+        "call !1 this=!2 !0.<i> number"
+      ]
+    },
+    "of": {
+      "!type": "fn(elementN: ?) -> [!0]"
+    },
+    "prototype": {
+      "!stdProto": "Array",
+      "length": {
+        "!type": "number"
+      },
+      "concat": {
+        "!type": "fn(other: [?]) -> !this"
+      },
+      "join": {
+        "!type": "fn(separator?: string) -> string"
+      },
+      "splice": {
+        "!type": "fn(pos: number, amount: number, newelt?: ?) -> [?]"
+      },
+      "pop": {
+        "!type": "fn() -> !this.<i>"
+      },
+      "push": {
+        "!type": "fn(newelt: ?) -> number",
+        "!effects": [
+          "propagate !0 !this.<i>"
+        ]
+      },
+      "shift": {
+        "!type": "fn() -> !this.<i>"
+      },
+      "unshift": {
+        "!type": "fn(newelt: ?) -> number",
+        "!effects": [
+          "propagate !0 !this.<i>"
+        ]
+      },
+      "slice": {
+        "!type": "fn(from?: number, to?: number) -> !this"
+      },
+      "reverse": {
+        "!type": "fn()"
+      },
+      "sort": {
+        "!type": "fn(compare?: fn(a: ?, b: ?) -> number)",
+        "!effects": [
+          "call !0 !this.<i> !this.<i>"
+        ]
+      },
+      "indexOf": {
+        "!type": "fn(elt: ?, from?: number) -> number"
+      },
+      "lastIndexOf": {
+        "!type": "fn(elt: ?, from?: number) -> number"
+      },
+      "every": {
+        "!type": "fn(test: fn(elt: ?, i: number, array: +Array) -> bool, context?: ?) -> bool",
+        "!effects": [
+          "call !0 this=!1 !this.<i> number !this"
+        ]
+      },
+      "some": {
+        "!type": "fn(test: fn(elt: ?, i: number, array: +Array) -> bool, context?: ?) -> bool",
+        "!effects": [
+          "call !0 this=!1 !this.<i> number !this"
+        ]
+      },
+      "filter": {
+        "!type": "fn(test: fn(elt: ?, i: number, array: +Array) -> bool, context?: ?) -> !this",
+        "!effects": [
+          "call !0 this=!1 !this.<i> number !this"
+        ]
+      },
+      "forEach": {
+        "!type": "fn(f: fn(elt: ?, i: number, array: +Array), context?: ?)",
+        "!effects": [
+          "call !0 this=!1 !this.<i> number !this"
+        ]
+      },
+      "map": {
+        "!type": "fn(f: fn(elt: ?, i: number, array: +Array) -> ?, context?: ?) -> [!0.!ret]",
+        "!effects": [
+          "call !0 this=!1 !this.<i> number !this"
+        ]
+      },
+      "reduce": {
+        "!type": "fn(combine: fn(sum: ?, elt: ?, i: number, array: +Array) -> ?, init?: ?) -> !0.!ret",
+        "!effects": [
+          "call !0 !1 !this.<i> number !this"
+        ]
+      },
+      "reduceRight": {
+        "!type": "fn(combine: fn(sum: ?, elt: ?, i: number, array: +Array) -> ?, init?: ?) -> !0.!ret",
+        "!effects": [
+          "call !0 !1 !this.<i> number !this"
+        ]
+      },
+      "copyWithin": {
+        "!type": "fn(target: number, start: number, end?: number) -> !this"
+      },
+      "entries": {
+        "!type": "fn() -> +iter[:t=[number, !this.<i>]]"
+      },
+      "fill": {
+        "!type": "fn(value: ?, start?: number, end?: number) -> !this"
+      },
+      "find": {
+        "!type": "fn(callback: fn(element: ?, index: number, array: [?]) -> bool, thisArg?: ?) -> !this.<i>",
+        "!effects": ["call !0 this=!2 !this.<i> number"]
+      },
+      "findIndex": {
+        "!type": "fn(callback: fn(element: ?, index: number, array: [?]), thisArg?: ?) -> number",
+        "!effects": ["call !0 this=!2 !this.<i> number"]
+      },
+      "keys": {
+        "!type": "fn() -> +iter[:t=number]"
+      },
+      "values": {
+        "!type": "fn() -> +iter[:t=!this.<i>]"
+      },
+      ":Symbol.iterator": {
+        "!type": "fn() -> +iter[:t=!this.<i>]"
+      },
+      "includes": {
+        "!type": "fn(value: ?, fromIndex?: number) -> bool"
+      }
+    }
+  },
+  "String": {
+    "!type": "fn(value: ?) -> string",
+    "fromCharCode": {
+      "!type": "fn(code: number) -> string"
+    },
+    "fromCodePoint": {
+      "!type": "fn(point: number, point?: number) -> string"
+    },
+    "raw": {
+      "!type": "fn(template: [string], substitutions: ?, templateString: ?) -> string"
+    },
+    "prototype": {
+      "!stdProto": "String",
+      "length": {
+        "!type": "number"
+      },
+      "<i>": "string",
+      "charAt": {
+        "!type": "fn(i: number) -> string"
+      },
+      "charCodeAt": {
+        "!type": "fn(i: number) -> number"
+      },
+      "indexOf": {
+        "!type": "fn(char: string, from?: number) -> number"
+      },
+      "lastIndexOf": {
+        "!type": "fn(char: string, from?: number) -> number"
+      },
+      "substring": {
+        "!type": "fn(from: number, to?: number) -> string"
+      },
+      "substr": {
+        "!type": "fn(from: number, length?: number) -> string"
+      },
+      "slice": {
+        "!type": "fn(from: number, to?: number) -> string"
+      },
+      "padStart": {
+        "!type": "fn(targetLength: number, padString?: string) -> string"
+      },
+      "padEnd": {
+        "!type": "fn(targetLength: number, padString?: string) -> string"
+      },
+      "trim": {
+        "!type": "fn() -> string"
+      },
+      "trimStart": {
+        "!type": "fn() -> string"
+      },
+      "trimLeft": "String.prototype.trimStart",
+      "trimEnd": {
+        "!type": "fn() -> string"
+      },
+      "trimRight": "String.prototype.trimEnd",
+      "toUpperCase": {
+        "!type": "fn() -> string"
+      },
+      "toLowerCase": {
+        "!type": "fn() -> string"
+      },
+      "toLocaleUpperCase": {
+        "!type": "fn() -> string"
+      },
+      "toLocaleLowerCase": {
+        "!type": "fn() -> string"
+      },
+      "split": {
+        "!type": "fn(pattern?: string|+RegExp, limit?: number) -> [string]"
+      },
+      "concat": {
+        "!type": "fn(other: string) -> string"
+      },
+      "localeCompare": {
+        "!type": "fn(other: string) -> number"
+      },
+      "match": {
+        "!type": "fn(pattern: +RegExp) -> [string]"
+      },
+      "replace": {
+        "!type": "fn(pattern: string|+RegExp, replacement: string) -> string"
+      },
+      "search": {
+        "!type": "fn(pattern: +RegExp) -> number"
+      },
+      "codePointAt": {
+        "!type": "fn(pos: number) -> number"
+      },
+      "endsWith": {
+        "!type": "fn(searchString: string, position?: number) -> bool"
+      },
+      "includes": {
+        "!type": "fn(searchString: string, position?: number) -> bool"
+      },
+      "normalize": {
+        "!type": "fn(form: string) -> string"
+      },
+      "repeat": {
+        "!type": "fn(count: number) -> string"
+      },
+      "startsWith": {
+        "!type": "fn(searchString: string, position?: number) -> bool"
+      },
+      ":Symbol.iterator": {
+        "!type": "fn() -> +iter[:t=string]"
+      }
+    }
+  },
+  "Number": {
+    "!type": "fn(value: ?) -> number",
+    "MAX_VALUE": {
+      "!type": "number"
+    },
+    "MIN_VALUE": {
+      "!type": "number"
+    },
+    "POSITIVE_INFINITY": {
+      "!type": "number"
+    },
+    "NEGATIVE_INFINITY": {
+      "!type": "number"
+    },
+    "prototype": {
+      "!stdProto": "Number",
+      "toString": {
+        "!type": "fn(radix?: number) -> string"
+      },
+      "toFixed": {
+        "!type": "fn(digits: number) -> string"
+      },
+      "toExponential": {
+        "!type": "fn(digits: number) -> string"
+      },
+      "toPrecision": {
+        "!type": "fn(digits: number) -> string"
+      }
+    },
+    "EPSILON": {
+      "!type": "number"
+    },
+    "MAX_SAFE_INTEGER": {
+      "!type": "number"
+    },
+    "MIN_SAFE_INTEGER": {
+      "!type": "number"
+    },
+    "isFinite": {
+      "!type": "fn(testValue: ?) -> bool"
+    },
+    "isInteger": {
+      "!type": "fn(testValue: ?) -> bool"
+    },
+    "isNaN": {
+      "!type": "fn(testValue: ?) -> bool"
+    },
+    "isSafeInteger": {
+      "!type": "fn(testValue: ?) -> bool"
+    },
+    "parseFloat": {
+      "!type": "fn(string: string) -> number"
+    },
+    "parseInt": {
+      "!type": "fn(string: string, radix?: number) -> number"
+    }
+  },
+  "Boolean": {
+    "!type": "fn(value: ?) -> bool",
+    "prototype": {
+      "!stdProto": "Boolean"
+    }
+  },
+  "RegExp": {
+    "!type": "fn(source: string, flags?: string)",
+    "prototype": {
+      "!stdProto": "RegExp",
+      "exec": {
+        "!type": "fn(input: string) -> [string]"
+      },
+      "test": {
+        "!type": "fn(input: string) -> bool"
+      },
+      "global": {
+        "!type": "bool"
+      },
+      "ignoreCase": {
+        "!type": "bool"
+      },
+      "multiline": {
+        "!type": "bool"
+      },
+      "source": {
+        "!type": "string"
+      },
+      "lastIndex": {
+        "!type": "number"
+      },
+      "flags": {
+        "!type": "string"
+      },
+      "sticky": {
+        "!type": "bool"
+      },
+      "unicode": {
+        "!type": "bool"
+      }
+    }
+  },
+  "Date": {
+    "!type": "fn(ms: number)",
+    "parse": {
+      "!type": "fn(source: string) -> +Date"
+    },
+    "UTC": {
+      "!type": "fn(year: number, month: number, date: number, hour?: number, min?: number, sec?: number, ms?: number) -> number"
+    },
+    "now": {
+      "!type": "fn() -> number"
+    },
+    "prototype": {
+      "toUTCString": {
+        "!type": "fn() -> string"
+      },
+      "toISOString": {
+        "!type": "fn() -> string"
+      },
+      "toDateString": {
+        "!type": "fn() -> string"
+      },
+      "toGMTString": {
+        "!type": "fn() -> string"
+      },
+      "toTimeString": {
+        "!type": "fn() -> string"
+      },
+      "toLocaleDateString": {
+        "!type": "fn() -> string"
+      },
+      "toLocaleFormat": {
+        "!type": "fn(formatString: string) -> string"
+      },
+      "toLocaleString": {
+        "!type": "fn(locales?: string, options?: ?) -> string"
+      },
+      "toLocaleTimeString": {
+        "!type": "fn() -> string"
+      },
+      "toSource": {
+        "!type": "fn() -> string"
+      },
+      "toString": {
+        "!type": "fn() -> string"
+      },
+      "valueOf": {
+        "!type": "fn() -> number"
+      },
+      "getTime": {
+        "!type": "fn() -> number"
+      },
+      "getFullYear": {
+        "!type": "fn() -> number"
+      },
+      "getYear": {
+        "!type": "fn() -> number"
+      },
+      "getMonth": {
+        "!type": "fn() -> number"
+      },
+      "getUTCMonth": {
+        "!type": "fn() -> number"
+      },
+      "getDate": {
+        "!type": "fn() -> number"
+      },
+      "getUTCDate": {
+        "!type": "fn() -> number"
+      },
+      "getDay": {
+        "!type": "fn() -> number"
+      },
+      "getUTCDay": {
+        "!type": "fn() -> number"
+      },
+      "getUTCFullYear": {
+        "!type": "fn() -> number"
+      },
+      "getHours": {
+        "!type": "fn() -> number"
+      },
+      "getUTCHours": {
+        "!type": "fn() -> number"
+      },
+      "getMinutes": {
+        "!type": "fn() -> number"
+      },
+      "getUTCMinutes": {
+        "!type": "fn() -> number"
+      },
+      "getSeconds": {
+        "!type": "fn() -> number"
+      },
+      "getUTCSeconds": {
+        "!type": "fn() -> number"
+      },
+      "getMilliseconds": {
+        "!type": "fn() -> number"
+      },
+      "getUTCMilliseconds": {
+        "!type": "fn() -> number"
+      },
+      "getTimezoneOffset": {
+        "!type": "fn() -> number"
+      },
+      "setTime": {
+        "!type": "fn(date: +Date) -> number"
+      },
+      "setFullYear": {
+        "!type": "fn(year: number) -> number"
+      },
+      "setUTCFullYear": {
+        "!type": "fn(year: number) -> number"
+      },
+      "setYear": {
+        "!type": "fn(yearValue: number) -> number"
+      },
+      "setMonth": {
+        "!type": "fn(month: number) -> number"
+      },
+      "setUTCMonth": {
+        "!type": "fn(month: number) -> number"
+      },
+      "setDate": {
+        "!type": "fn(day: number) -> number"
+      },
+      "setUTCDate": {
+        "!type": "fn(day: number) -> number"
+      },
+      "setHours": {
+        "!type": "fn(hour: number) -> number"
+      },
+      "setUTCHours": {
+        "!type": "fn(hour: number) -> number"
+      },
+      "setMinutes": {
+        "!type": "fn(min: number) -> number"
+      },
+      "setUTCMinutes": {
+        "!type": "fn(min: number) -> number"
+      },
+      "setSeconds": {
+        "!type": "fn(sec: number) -> number"
+      },
+      "setUTCSeconds": {
+        "!type": "fn(sec: number) -> number"
+      },
+      "setMilliseconds": {
+        "!type": "fn(ms: number) -> number"
+      },
+      "setUTCMilliseconds": {
+        "!type": "fn(ms: number) -> number"
+      },
+      "toJSON": {
+        "!type": "fn() -> string"
+      }
+    }
+  },
+  "Error": {
+    "!type": "fn(message: string)",
+    "prototype": {
+      "name": {
+        "!type": "string"
+      },
+      "message": {
+        "!type": "string"
+      }
+    }
+  },
+  "SyntaxError": {
+    "!type": "fn(message: string)",
+    "prototype": "Error.prototype"
+  },
+  "ReferenceError": {
+    "!type": "fn(message: string)",
+    "prototype": "Error.prototype"
+  },
+  "URIError": {
+    "!type": "fn(message: string)",
+    "prototype": "Error.prototype"
+  },
+  "EvalError": {
+    "!type": "fn(message: string)",
+    "prototype": "Error.prototype"
+  },
+  "RangeError": {
+    "!type": "fn(message: string)",
+    "prototype": "Error.prototype"
+  },
+  "TypeError": {
+    "!type": "fn(message: string)",
+    "prototype": "Error.prototype"
+  },
+  "parseInt": {
+    "!type": "fn(string: string, radix?: number) -> number"
+  },
+  "parseFloat": {
+    "!type": "fn(string: string) -> number"
+  },
+  "isNaN": {
+    "!type": "fn(value: number) -> bool"
+  },
+  "isFinite": {
+    "!type": "fn(value: number) -> bool"
+  },
+  "eval": {
+    "!type": "fn(code: string) -> ?"
+  },
+  "encodeURI": {
+    "!type": "fn(uri: string) -> string"
+  },
+  "encodeURIComponent": {
+    "!type": "fn(uri: string) -> string"
+  },
+  "decodeURI": {
+    "!type": "fn(uri: string) -> string"
+  },
+  "decodeURIComponent": {
+    "!type": "fn(uri: string) -> string"
+  },
+  "Math": {
+    "E": {
+      "!type": "number"
+    },
+    "LN2": {
+      "!type": "number"
+    },
+    "LN10": {
+      "!type": "number"
+    },
+    "LOG2E": {
+      "!type": "number"
+    },
+    "LOG10E": {
+      "!type": "number"
+    },
+    "SQRT1_2": {
+      "!type": "number"
+    },
+    "SQRT2": {
+      "!type": "number"
+    },
+    "PI": {
+      "!type": "number"
+    },
+    "abs": {
+      "!type": "fn(number) -> number"
+    },
+    "cos": {
+      "!type": "fn(number) -> number"
+    },
+    "sin": {
+      "!type": "fn(number) -> number"
+    },
+    "tan": {
+      "!type": "fn(number) -> number"
+    },
+    "acos": {
+      "!type": "fn(number) -> number"
+    },
+    "asin": {
+      "!type": "fn(number) -> number"
+    },
+    "atan": {
+      "!type": "fn(number) -> number"
+    },
+    "atan2": {
+      "!type": "fn(y: number, x: number) -> number"
+    },
+    "ceil": {
+      "!type": "fn(number) -> number"
+    },
+    "floor": {
+      "!type": "fn(number) -> number"
+    },
+    "round": {
+      "!type": "fn(number) -> number"
+    },
+    "exp": {
+      "!type": "fn(number) -> number"
+    },
+    "log": {
+      "!type": "fn(number) -> number"
+    },
+    "sqrt": {
+      "!type": "fn(number) -> number"
+    },
+    "pow": {
+      "!type": "fn(number, number) -> number"
+    },
+    "max": {
+      "!type": "fn(number, number) -> number"
+    },
+    "min": {
+      "!type": "fn(number, number) -> number"
+    },
+    "random": {
+      "!type": "fn() -> number"
+    },
+    "acosh": {
+      "!type": "fn(x: number) -> number"
+    },
+    "asinh": {
+      "!type": "fn(x: number) -> number"
+    },
+    "atanh": {
+      "!type": "fn(x: number) -> number"
+    },
+    "cbrt": {
+      "!type": "fn(x: number) -> number"
+    },
+    "clz32": {
+      "!type": "fn(x: number) -> number"
+    },
+    "cosh": {
+      "!type": "fn(x: number) -> number"
+    },
+    "expm1": {
+      "!type": "fn(x: number) -> number"
+    },
+    "fround": {
+      "!type": "fn(x: number) -> number"
+    },
+    "hypot": {
+      "!type": "fn(value: number) -> number"
+    },
+    "imul": {
+      "!type": "fn(a: number, b: number) -> number"
+    },
+    "log10": {
+      "!type": "fn(x: number) -> number"
+    },
+    "log1p": {
+      "!type": "fn(x: number) -> number"
+    },
+    "log2": {
+      "!type": "fn(x: number) -> number"
+    },
+    "sign": {
+      "!type": "fn(x: number) -> number"
+    },
+    "sinh": {
+      "!type": "fn(x: number) -> number"
+    },
+    "tanh": {
+      "!type": "fn(x: number) -> number"
+    },
+    "trunc": {
+      "!type": "fn(x: number) -> number"
+    }
+  },
+  "JSON": {
+    "parse": {
+      "!type": "fn(json: string, reviver?: fn(key: string, value: ?) -> ?) -> ?"
+    },
+    "stringify": {
+      "!type": "fn(value: ?, replacer?: fn(key: string, value: ?) -> ?, space?: string|number) -> string"
+    }
+  },
+  "ArrayBuffer": {
+    "!type": "fn(length: number)",
+    "isView": {
+      "!type": "fn(arg: +ArrayBuffer) -> bool"
+    },
+    "prototype": {
+      "byteLength": {
+        "!type": "number"
+      },
+      "slice": {
+        "!type": "fn(begin: number, end?: number) -> +ArrayBuffer"
+      }
+    }
+  },
+  "DataView": {
+    "!type": "fn(buffer: +ArrayBuffer, byteOffset?: number, byteLength?: number)",
+    "prototype": {
+      "buffer": {
+        "!type": "+ArrayBuffer"
+      },
+      "byteLength": {
+        "!type": "number"
+      },
+      "byteOffset": {
+        "!type": "number"
+      },
+      "getFloat32": {
+        "!type": "fn(byteOffset: number, littleEndian?: bool) -> number"
+      },
+      "getFloat64": {
+        "!type": "fn(byteOffset: number, littleEndian?: bool) -> number"
+      },
+      "getInt16": {
+        "!type": "fn(byteOffset: number, littleEndian?: bool) -> number"
+      },
+      "getInt32": {
+        "!type": "fn(byteOffset: number, littleEndian?: bool) -> number"
+      },
+      "getInt8": {
+        "!type": "fn(byteOffset: number, littleEndian?: bool) -> number"
+      },
+      "getUint16": {
+        "!type": "fn(byteOffset: number, littleEndian?: bool) -> number"
+      },
+      "getUint32": {
+        "!type": "fn(byteOffset: number, littleEndian?: bool) -> number"
+      },
+      "getUint8": {
+        "!type": "fn(byteOffset: number) -> number"
+      },
+      "setFloat32": {
+        "!type": "fn(byteOffset: number, value: number, littleEndian?: bool)"
+      },
+      "setFloat64": {
+        "!type": "fn(byteOffset: number, value: number, littleEndian?: bool)"
+      },
+      "setInt16": {
+        "!type": "fn(byteOffset: number, value: number, littleEndian?: bool)"
+      },
+      "setInt32": {
+        "!type": "fn(byteOffset: number, value: number, littleEndian?: bool)"
+      },
+      "setInt8": {
+        "!type": "fn(byteOffset: number, value: number)"
+      },
+      "setUint16": {
+        "!type": "fn(byteOffset: number, value: number, littleEndian?: bool)"
+      },
+      "setUint32": {
+        "!type": "fn(byteOffset: number, value: number, littleEndian?: bool)"
+      },
+      "setUint8": {
+        "!type": "fn(byteOffset: number, value: number)"
+      }
+    }
+  },
+  "Float32Array": "TypedArray",
+  "Float64Array": "TypedArray",
+  "Int16Array": "TypedArray",
+  "Int32Array": "TypedArray",
+  "Int8Array": "TypedArray",
+  "Map": {
+    "!type": "fn(iterable?: [?])",
+    "prototype": {
+      "clear": {
+        "!type": "fn()"
+      },
+      "delete": {
+        "!type": "fn(key: ?)"
+      },
+      "entries": {
+        "!type": "fn() -> +iter[:t=[!this.:key, !this.:value]]"
+      },
+      "forEach": {
+        "!type": "fn(callback: fn(value: ?, key: ?, map: +Map), thisArg?: ?)",
+        "!effects": ["call !0 this=!1 !this.:value !this.:key !this"]
+      },
+      "get": {
+        "!type": "fn(key: ?) -> !this.:value"
+      },
+      "has": {
+        "!type": "fn(key: ?) -> bool"
+      },
+      "keys": {
+        "!type": "fn() -> +iter[:t=!this.:key]"
+      },
+      "set": {
+        "!type": "fn(key: ?, value: ?) -> !this",
+        "!effects": ["propagate !0 !this.:key", "propagate !1 !this.:value"]
+      },
+      "size": {
+        "!type": "number"
+      },
+      "values": {
+        "!type": "fn() -> +iter[:t=!this.:value]"
+      },
+      ":Symbol.iterator": {
+        "!type": "fn() -> +iter[:t=[!this.:key, !this.:value]]"
+      }
+    }
+  },
+  "Promise": {
+    "!type": "fn(executor: fn(resolve: fn(value: ?), reject: fn(reason: ?))) -> !custom:Promise_ctor",
+    "all": {
+      "!type": "fn(iterable: [+Promise]) -> +Promise[:t=[!0.<i>.:t]]"
+    },
+    "race": {
+      "!type": "fn(iterable: [+Promise]) -> !0.<i>"
+    },
+    "reject": "Promise_reject",
+    "resolve": {
+      "!type": "fn(value: ?) -> !custom:Promise_resolve"
+    },
+    "prototype": "Promise.prototype"
+  },
+  "Proxy": {
+    "!type": "fn(target: ?, handler: Proxy_handler)",
+    "revocable": {
+      "!type": "fn(target: ?, handler: Proxy_handler) -> Proxy_revocable"
+    }
+  },
+  "Reflect": {
+    "apply": {
+      "!type": "fn(target: fn(), thisArg?: ?, argumentList?: [?]) -> !0.!ret"
+    },
+    "construct": {
+      "!type": "fn(target: fn(), argumentList?: [?]) -> ?"
+    },
+    "defineProperty": {
+      "!type": "fn(target: ?, property: string, descriptor: propertyDescriptor) -> bool"
+    },
+    "deleteProperty": {
+      "!type": "fn(target: ?, property: string) -> bool"
+    },
+    "enumerate": {
+      "!type": "fn(target: ?) -> +iter[:t=string]"
+    },
+    "get": {
+      "!type": "fn(target: ?, property: string) -> ?"
+    },
+    "getOwnPropertyDescriptor": {
+      "!type": "fn(target: ?, property: string) -> ?"
+    },
+    "getPrototypeOf": {
+      "!type": "fn(target: ?) -> ?"
+    },
+    "has": {
+      "!type": "fn(target: ?, property: string) -> bool"
+    },
+    "isExtensible": {
+      "!type": "fn(target: ?) -> bool"
+    },
+    "ownKeys": {
+      "!type": "fn(target: ?) -> [string]"
+    },
+    "preventExtensions": {
+      "!type": "fn(target: ?) -> bool"
+    },
+    "set": {
+      "!type": "fn(target: ?, property: string, value: ?) -> bool"
+    },
+    "setPrototypeOf": {
+      "!type": "fn(target: ?, prototype: ?) -> bool"
+    }
+  },
+  "Set": {
+    "!type": "fn(iterable?: [?])",
+    "prototype": {
+      "add": {
+        "!type": "fn(value: ?) -> !this",
+        "!effects": ["propagate !0 !this.:t"]
+      },
+      "clear": {
+        "!type": "fn()"
+      },
+      "delete": {
+        "!type": "fn(value: ?) -> bool"
+      },
+      "entries": {
+        "!type": "fn() -> +iter[:t=[!this.:t]]"
+      },
+      "forEach": {
+        "!type": "fn(callback: fn(value: ?, value2: ?, set: +Set), thisArg?: ?)",
+        "!effects": ["call !0 this=!1 !this.:t number !this"]
+      },
+      "has": {
+        "!type": "fn(value: ?) -> bool"
+      },
+      "keys": {
+        "!type": "fn() -> +iter[:t=!this.:t]"
+      },
+      "size": {
+        "!type": "number"
+      },
+      "values": {
+        "!type": "fn() -> +iter[:t=!this.:t]"
+      },
+      ":Symbol.iterator": {
+        "!type": "fn() -> +iter[:t=!this.:t]"
+      }
+    }
+  },
+  "Symbol": {
+    "!type": "fn(description?: string) -> !custom:getSymbol",
+    "for": {
+      "!type": "fn(key: string) -> !custom:getSymbol"
+    },
+    "keyFor": {
+      "!type": "fn(sym: +Symbol) -> string"
+    },
+    "hasInstance": ":Symbol.hasInstance",
+    "isConcatSpreadable": ":Symbol.isConcatSpreadable",
+    "iterator": ":Symbol.iterator",
+    "asyncIterator": ":Symbol.asyncIterator",
+    "match": ":Symbol.match",
+    "replace": ":Symbol.replace",
+    "search": ":Symbol.search",
+    "species": ":Symbol.species",
+    "split": ":Symbol.split",
+    "toStringTag": ":Symbol.toStringTag",
+    "unscopables": ":Symbol.unscopables",
+    "prototype": {
+      "!stdProto": "Symbol"
+    }
+  },
+  "Uint16Array": "TypedArray",
+  "Uint32Array": "TypedArray",
+  "Uint8Array": "TypedArray",
+  "Uint8ClampedArray": "TypedArray",
+  "WeakMap": {
+    "!type": "fn(iterable?: [?])",
+    "prototype": {
+      "delete": {
+        "!type": "fn(key: ?) -> bool"
+      },
+      "get": {
+        "!type": "fn(key: ?) -> !this.:value"
+      },
+      "has": {
+        "!type": "fn(key: ?) -> bool"
+      },
+      "set": {
+        "!type": "fn(key: ?, value: ?)",
+        "!effects": ["propagate !0 !this.:key", "propagate !1 !this.:value"]
+      }
+    }
+  },
+  "WeakSet": {
+    "!type": "fn(iterable?: [?])",
+    "prototype": {
+      "add": {
+        "!type": "fn(value: ?)"
+      },
+      "delete": {
+        "!type": "fn(value: ?) -> bool"
+      },
+      "has": {
+        "!type": "fn(value: ?) -> bool"
+      }
+    }
+  }
+}
diff --git a/helpers/terndoc/pw-extras.json b/helpers/terndoc/pw-extras.json
new file mode 100644
index 000000000..c7ea6cc27
--- /dev/null
+++ b/helpers/terndoc/pw-extras.json
@@ -0,0 +1,51 @@
+{
+  "!name": "pw-extra",
+  "console": {
+    "assert": {
+      "!type": "fn(assertion: bool, text: string)"
+    },
+    "clear": {
+      "!type": "fn()"
+    },
+    "count": {
+      "!type": "fn(label?: string)"
+    },
+    "debug": "console.log",
+    "dir": {
+      "!type": "fn(object: ?)"
+    },
+    "error": {
+      "!type": "fn(...msg: ?)"
+    },
+    "group": {
+      "!type": "fn(label?: string)"
+    },
+    "groupCollapsed": {
+      "!type": "fn(label?: string)"
+    },
+    "groupEnd": {
+      "!type": "fn()"
+    },
+    "info": {
+      "!type": "fn(...msg: ?)"
+    },
+    "log": {
+      "!type": "fn(...msg: ?)"
+    },
+    "table": {
+      "!type": "fn(data: []|?, columns?: [])"
+    },
+    "time": {
+      "!type": "fn(label: string)"
+    },
+    "timeEnd": {
+      "!type": "fn(label: string)"
+    },
+    "trace": {
+      "!type": "fn()"
+    },
+    "warn": {
+      "!type": "fn(...msg: ?)"
+    }
+  }
+}
diff --git a/helpers/terndoc/pw-pre.json b/helpers/terndoc/pw-pre.json
new file mode 100644
index 000000000..a489a30c7
--- /dev/null
+++ b/helpers/terndoc/pw-pre.json
@@ -0,0 +1,8 @@
+{
+  "!name": "pw-pre",
+  "pw": {
+    "env": {
+      "set": "fn(key: string, value: string)"
+    }
+  }
+}
diff --git a/helpers/terndoc/pw-test.json b/helpers/terndoc/pw-test.json
new file mode 100644
index 000000000..8bec91ba9
--- /dev/null
+++ b/helpers/terndoc/pw-test.json
@@ -0,0 +1,24 @@
+{
+  "!name": "pw-test",
+  "!define": {
+    "Expectation": {
+      "not": "Expectation",
+      "toBe": "fn(value: ?)",
+      "toBeLevel2xx": "fn()",
+      "toBeLevel3xx": "fn()",
+      "toBeLevel4xx": "fn()",
+      "toBeLevel5xx": "fn()",
+      "toBeType": "fn(type: string)",
+      "toHaveLength": "fn(length: number)"
+    }
+  },
+  "pw": {
+    "expect": "fn(value: ?) -> Expectation",
+    "response": {
+      "status": "number",
+      "headers": "?",
+      "body": "?"
+    },
+    "test": "fn(name: string, func: fn())"
+  }
+}
diff --git a/helpers/ternlint.js b/helpers/ternlint.js
new file mode 100644
index 000000000..c06367c12
--- /dev/null
+++ b/helpers/ternlint.js
@@ -0,0 +1,672 @@
+import infer from "tern/lib/infer"
+import tern from "tern/lib/tern"
+
+const walk = require("acorn-walk")
+
+var defaultRules = {
+  UnknownProperty: { severity: "warning" },
+  UnknownIdentifier: { severity: "warning" },
+  NotAFunction: { severity: "error" },
+  InvalidArgument: { severity: "error" },
+  UnusedVariable: { severity: "warning" },
+  UnknownModule: { severity: "error" },
+  MixedReturnTypes: { severity: "warning" },
+  ObjectLiteral: { severity: "error" },
+  TypeMismatch: { severity: "warning" },
+  Array: { severity: "error" },
+  ES6Modules: { severity: "error" },
+}
+
+function makeVisitors(server, query, file, messages) {
+  function addMessage(node, msg, severity) {
+    var error = makeError(node, msg, severity)
+    messages.push(error)
+  }
+
+  function makeError(node, msg, severity) {
+    var pos = getPosition(node)
+    var error = {
+      message: msg,
+      from: tern.outputPos(query, file, pos.start),
+      to: tern.outputPos(query, file, pos.end),
+      severity: severity,
+    }
+    if (query.lineNumber) {
+      error.lineNumber = query.lineCharPositions
+        ? error.from.line
+        : tern.outputPos({ lineCharPositions: true }, file, pos.start).line
+    }
+    if (!query.groupByFiles) error.file = file.name
+    return error
+  }
+
+  function getNodeName(node) {
+    if (node.callee) {
+      // This is a CallExpression node.
+      // We get the position of the function name.
+      return getNodeName(node.callee)
+    } else if (node.property) {
+      // This is a MemberExpression node.
+      // We get the name of the property.
+      return node.property.name
+    } else {
+      return node.name
+    }
+  }
+
+  function getNodeValue(node) {
+    if (node.callee) {
+      // This is a CallExpression node.
+      // We get the position of the function name.
+      return getNodeValue(node.callee)
+    } else if (node.property) {
+      // This is a MemberExpression node.
+      // We get the value of the property.
+      return node.property.value
+    } else {
+      if (node.type === "Identifier") {
+        var query = { type: "definition", start: node.start, end: node.end }
+        var expr = tern.findQueryExpr(file, query)
+        var type = infer.expressionType(expr)
+        var objExpr = type.getType()
+        if (objExpr && objExpr.originNode) return getNodeValue(objExpr.originNode)
+        return null
+      }
+      return node.value
+    }
+  }
+
+  function getPosition(node) {
+    if (node.callee) {
+      // This is a CallExpression node.
+      // We get the position of the function name.
+      return getPosition(node.callee)
+    }
+    if (node.property) {
+      // This is a MemberExpression node.
+      // We get the position of the property.
+      return node.property
+    }
+    return node
+  }
+
+  function getTypeName(type) {
+    if (!type) return "Unknown type"
+    if (type.types) {
+      // multiple types
+      var types = type.types,
+        s = ""
+      for (var i = 0; i < types.length; i++) {
+        if (i > 0) s += "|"
+        var t = getTypeName(types[i])
+        if (t != "Unknown type") s += t
+      }
+      return s == "" ? "Unknown type" : s
+    }
+    if (type.name) {
+      return type.name
+    }
+    return type.proto ? type.proto.name : "Unknown type"
+  }
+
+  function hasProto(expectedType, name) {
+    if (!expectedType) return false
+    if (!expectedType.proto) return false
+    return expectedType.proto.name === name
+  }
+
+  function isRegexExpected(expectedType) {
+    return hasProto(expectedType, "RegExp.prototype")
+  }
+
+  function isEmptyType(val) {
+    return !val || (val.types && val.types.length == 0)
+  }
+
+  function compareType(expected, actual) {
+    if (isEmptyType(expected) || isEmptyType(actual)) return true
+    if (expected.types) {
+      for (var i = 0; i < expected.types.length; i++) {
+        if (actual.types) {
+          for (var j = 0; j < actual.types.length; j++) {
+            if (compareType(expected.types[i], actual.types[j])) return true
+          }
+        } else {
+          if (compareType(expected.types[i], actual.getType())) return true
+        }
+      }
+      return false
+    } else if (actual.types) {
+      for (var i = 0; i < actual.types.length; i++) {
+        if (compareType(expected.getType(), actual.types[i])) return true
+      }
+    }
+    var expectedType = expected.getType(),
+      actualType = actual.getType()
+    if (!expectedType || !actualType) return true
+    var currentProto = actualType.proto
+    while (currentProto) {
+      if (expectedType.proto && expectedType.proto.name === currentProto.name) return true
+      currentProto = currentProto.proto
+    }
+    return false
+  }
+
+  function checkPropsInObject(node, expectedArg, actualObj, invalidArgument) {
+    var properties = node.properties,
+      expectedObj = expectedArg.getType()
+    for (var i = 0; i < properties.length; i++) {
+      var property = properties[i],
+        key = property.key,
+        prop = key && key.name,
+        value = property.value
+      if (prop) {
+        var expectedType = expectedObj.hasProp(prop)
+        if (!expectedType) {
+          // key doesn't exists
+          addMessage(
+            key,
+            "Invalid property at " +
+              (i + 1) +
+              ": " +
+              prop +
+              " is not a property in " +
+              getTypeName(expectedArg),
+            invalidArgument.severity
+          )
+        } else {
+          // test that each object literal prop is the correct type
+          var actualType = actualObj.props[prop]
+          if (!compareType(expectedType, actualType)) {
+            addMessage(
+              value,
+              "Invalid property at " +
+                (i + 1) +
+                ": cannot convert from " +
+                getTypeName(actualType) +
+                " to " +
+                getTypeName(expectedType),
+              invalidArgument.severity
+            )
+          }
+        }
+      }
+    }
+  }
+
+  function checkItemInArray(node, expectedArg, state, invalidArgument) {
+    var elements = node.elements,
+      expectedType = expectedArg.hasProp("<i>")
+    for (var i = 0; i < elements.length; i++) {
+      var elt = elements[i],
+        actualType = infer.expressionType({ node: elt, state: state })
+      if (!compareType(expectedType, actualType)) {
+        addMessage(
+          elt,
+          "Invalid item at " +
+            (i + 1) +
+            ": cannot convert from " +
+            getTypeName(actualType) +
+            " to " +
+            getTypeName(expectedType),
+          invalidArgument.severity
+        )
+      }
+    }
+  }
+
+  function isObjectLiteral(type) {
+    var objType = type.getObjType()
+    return objType && objType.proto && objType.proto.name == "Object.prototype"
+  }
+
+  function getFunctionLint(fnType) {
+    if (fnType.lint) return fnType.lint
+    if (fnType.metaData) {
+      fnType.lint = getLint(fnType.metaData["!lint"])
+      return fnType.lint
+    }
+  }
+
+  function isFunctionType(type) {
+    if (type.types) {
+      for (var i = 0; i < type.types.length; i++) {
+        if (isFunctionType(type.types[i])) return true
+      }
+    }
+    return type.proto && type.proto.name == "Function.prototype"
+  }
+
+  function validateCallExpression(node, state, c) {
+    var notAFunctionRule = getRule("NotAFunction"),
+      invalidArgument = getRule("InvalidArgument")
+    if (!notAFunctionRule && !invalidArgument) return
+    var type = infer.expressionType({ node: node.callee, state: state })
+    if (!type.isEmpty()) {
+      // If type.isEmpty(), it is handled by MemberExpression/Identifier already.
+
+      // An expression can have multiple possible (guessed) types.
+      // If one of them is a function, type.getFunctionType() will return it.
+      var fnType = type.getFunctionType()
+      if (fnType == null) {
+        if (notAFunctionRule && !isFunctionType(type))
+          addMessage(
+            node,
+            "'" + getNodeName(node) + "' is not a function",
+            notAFunctionRule.severity
+          )
+        return
+      }
+      var fnLint = getFunctionLint(fnType)
+      var continueLint = fnLint ? fnLint(node, addMessage, getRule) : true
+      if (continueLint && fnType.args) {
+        // validate parameters of the function
+        if (!invalidArgument) return
+        var actualArgs = node.arguments
+        if (!actualArgs) return
+        var expectedArgs = fnType.args
+        for (var i = 0; i < expectedArgs.length; i++) {
+          var expectedArg = expectedArgs[i]
+          if (actualArgs.length > i) {
+            var actualNode = actualArgs[i]
+            if (isRegexExpected(expectedArg.getType())) {
+              var value = getNodeValue(actualNode)
+              if (value) {
+                try {
+                  var regex = new RegExp(value)
+                } catch (e) {
+                  addMessage(
+                    actualNode,
+                    "Invalid argument at " + (i + 1) + ": " + e,
+                    invalidArgument.severity
+                  )
+                }
+              }
+            } else {
+              var actualArg = infer.expressionType({ node: actualNode, state: state })
+              // if actual type is an Object literal and expected type is an object, we ignore
+              // the comparison type since object literal properties validation is done inside "ObjectExpression".
+              if (!(expectedArg.getObjType() && isObjectLiteral(actualArg))) {
+                if (!compareType(expectedArg, actualArg)) {
+                  addMessage(
+                    actualNode,
+                    "Invalid argument at " +
+                      (i + 1) +
+                      ": cannot convert from " +
+                      getTypeName(actualArg) +
+                      " to " +
+                      getTypeName(expectedArg),
+                    invalidArgument.severity
+                  )
+                }
+              }
+            }
+          }
+        }
+      }
+    }
+  }
+
+  function validateAssignement(nodeLeft, nodeRight, rule, state) {
+    if (!nodeLeft || !nodeRight) return
+    if (!rule) return
+    var leftType = infer.expressionType({ node: nodeLeft, state: state }),
+      rightType = infer.expressionType({ node: nodeRight, state: state })
+    if (!compareType(leftType, rightType)) {
+      addMessage(
+        nodeRight,
+        "Type mismatch: cannot convert from " +
+          getTypeName(leftType) +
+          " to " +
+          getTypeName(rightType),
+        rule.severity
+      )
+    }
+  }
+
+  function validateDeclaration(node, state, c) {
+    function isUsedVariable(varNode, varState, file, srv) {
+      var name = varNode.name
+
+      for (var scope = varState; scope && !(name in scope.props); scope = scope.prev) {}
+      if (!scope) return false
+
+      var hasRef = false
+      function searchRef(file) {
+        return function (node, scopeHere) {
+          if (node != varNode) {
+            hasRef = true
+            throw new Error() // throw an error to stop the search.
+          }
+        }
+      }
+
+      try {
+        if (scope.node) {
+          // local scope
+          infer.findRefs(scope.node, scope, name, scope, searchRef(file))
+        } else {
+          // global scope
+          infer.findRefs(file.ast, file.scope, name, scope, searchRef(file))
+          for (var i = 0; i < srv.files.length && !hasRef; ++i) {
+            var cur = srv.files[i]
+            if (cur != file) infer.findRefs(cur.ast, cur.scope, name, scope, searchRef(cur))
+          }
+        }
+      } catch (e) {}
+      return hasRef
+    }
+
+    var unusedRule = getRule("UnusedVariable"),
+      mismatchRule = getRule("TypeMismatch")
+    if (!unusedRule && !mismatchRule) return
+    switch (node.type) {
+      case "VariableDeclaration":
+        for (var i = 0; i < node.declarations.length; ++i) {
+          var decl = node.declarations[i],
+            varNode = decl.id
+          if (varNode.name != "✖") {
+            // unused variable
+            if (unusedRule && !isUsedVariable(varNode, state, file, server))
+              addMessage(
+                varNode,
+                "Unused variable '" + getNodeName(varNode) + "'",
+                unusedRule.severity
+              )
+            // type mismatch?
+            if (mismatchRule) validateAssignement(varNode, decl.init, mismatchRule, state)
+          }
+        }
+        break
+      case "FunctionDeclaration":
+        if (unusedRule) {
+          var varNode = node.id
+          if (varNode.name != "✖" && !isUsedVariable(varNode, state, file, server))
+            addMessage(
+              varNode,
+              "Unused function '" + getNodeName(varNode) + "'",
+              unusedRule.severity
+            )
+        }
+        break
+    }
+  }
+
+  function getArrType(type) {
+    if (type instanceof infer.Arr) {
+      return type.getObjType()
+    } else if (type.types) {
+      for (var i = 0; i < type.types.length; i++) {
+        if (getArrType(type.types[i])) return type.types[i]
+      }
+    }
+  }
+
+  var visitors = {
+    VariableDeclaration: validateDeclaration,
+    FunctionDeclaration: validateDeclaration,
+    ReturnStatement: function (node, state, c) {
+      if (!node.argument) return
+      var rule = getRule("MixedReturnTypes")
+      if (!rule) return
+      if (state.fnType && state.fnType.retval) {
+        var actualType = infer.expressionType({ node: node.argument, state: state }),
+          expectedType = state.fnType.retval
+        if (!compareType(expectedType, actualType)) {
+          addMessage(
+            node,
+            "Invalid return type : cannot convert from " +
+              getTypeName(actualType) +
+              " to " +
+              getTypeName(expectedType),
+            rule.severity
+          )
+        }
+      }
+    },
+    // Detects expressions of the form `object.property`
+    MemberExpression: function (node, state, c) {
+      var rule = getRule("UnknownProperty")
+      if (!rule) return
+      var prop = node.property && node.property.name
+      if (!prop || prop == "✖") return
+      var type = infer.expressionType({ node: node, state: state })
+      var parentType = infer.expressionType({ node: node.object, state: state })
+
+      if (node.computed) {
+        // Bracket notation.
+        // Until we figure out how to handle these properly, we ignore these nodes.
+        return
+      }
+
+      if (!parentType.isEmpty() && type.isEmpty()) {
+        // The type of the property cannot be determined, which means
+        // that the property probably doesn't exist.
+
+        // We only do this check if the parent type is known,
+        // otherwise we will generate errors for an entire chain of unknown
+        // properties.
+
+        // Also, the expression may be valid even if the parent type is unknown,
+        // since the inference engine cannot detect the type in all cases.
+
+        var propertyDefined = false
+
+        // In some cases the type is unknown, even if the property is defined
+        if (parentType.types) {
+          // We cannot use parentType.hasProp or parentType.props - in the case of an AVal,
+          // this may contain properties that are not really defined.
+          parentType.types.forEach(function (potentialType) {
+            // Obj#hasProp checks the prototype as well
+            if (typeof potentialType.hasProp == "function" && potentialType.hasProp(prop, true)) {
+              propertyDefined = true
+            }
+          })
+        }
+
+        if (!propertyDefined) {
+          addMessage(node, "Unknown property '" + getNodeName(node) + "'", rule.severity)
+        }
+      }
+    },
+    // Detects top-level identifiers, e.g. the object in
+    // `object.property` or just `object`.
+    Identifier: function (node, state, c) {
+      var rule = getRule("UnknownIdentifier")
+      if (!rule) return
+      var type = infer.expressionType({ node: node, state: state })
+
+      if (type.originNode != null || type.origin != null) {
+        // The node is defined somewhere (could be this node),
+        // regardless of whether or not the type is known.
+      } else if (type.isEmpty()) {
+        // The type of the identifier cannot be determined,
+        // and the origin is unknown.
+        addMessage(node, "Unknown identifier '" + getNodeName(node) + "'", rule.severity)
+      } else {
+        // Even though the origin node is unknown, the type is known.
+        // This is typically the case for built-in identifiers (e.g. window or document).
+      }
+    },
+    // Detects function calls.
+    // `node.callee` is the expression (Identifier or MemberExpression)
+    // the is called as a function.
+    NewExpression: validateCallExpression,
+    CallExpression: validateCallExpression,
+    AssignmentExpression: function (node, state, c) {
+      var rule = getRule("TypeMismatch")
+      validateAssignement(node.left, node.right, rule, state)
+    },
+    ObjectExpression: function (node, state, c) {
+      // validate properties of the object literal
+      var rule = getRule("ObjectLiteral")
+      if (!rule) return
+      var actualType = node.objType
+      var ctxType = infer.typeFromContext(file.ast, { node: node, state: state }),
+        expectedType = null
+      if (ctxType instanceof infer.Obj) {
+        expectedType = ctxType.getObjType()
+      } else if (ctxType && ctxType.makeupType) {
+        var objType = ctxType.makeupType()
+        if (objType && objType.getObjType()) {
+          expectedType = objType.getObjType()
+        }
+      }
+      if (expectedType && expectedType != actualType) {
+        // expected type is known. Ex: config object of RequireJS
+        checkPropsInObject(node, expectedType, actualType, rule)
+      }
+    },
+    ArrayExpression: function (node, state, c) {
+      // validate elements of the Arrray
+      var rule = getRule("Array")
+      if (!rule) return
+      //var actualType = infer.expressionType({node: node, state: state});
+      var ctxType = infer.typeFromContext(file.ast, { node: node, state: state }),
+        expectedType = getArrType(ctxType)
+      if (expectedType /*&& expectedType != actualType*/) {
+        // expected type is known. Ex: config object of RequireJS
+        checkItemInArray(node, expectedType, state, rule)
+      }
+    },
+    ImportDeclaration: function (node, state, c) {
+      // Validate ES6 modules from + specifiers
+      var rule = getRule("ES6Modules")
+      if (!rule) return
+      var me = infer.cx().parent.mod.modules
+      if (!me) return // tern plugin modules.js is not loaded
+      var source = node.source
+      if (!source) return
+      // Validate ES6 modules "from"
+      var modType = me.getModType(source)
+      if (!modType) {
+        addMessage(source, "Invalid modules from '" + source.value + "'", rule.severity)
+        return
+      }
+      // Validate ES6 modules "specifiers"
+      var specifiers = node.specifiers,
+        specifier
+      if (!specifiers) return
+      for (var i = 0; i < specifiers.length; i++) {
+        var specifier = specifiers[i],
+          imported = specifier.imported
+        if (imported) {
+          var name = imported.name
+          if (!modType.hasProp(name))
+            addMessage(
+              imported,
+              "Invalid modules specifier '" + getNodeName(imported) + "'",
+              rule.severity
+            )
+        }
+      }
+    },
+  }
+
+  return visitors
+}
+
+// Adapted from infer.searchVisitor.
+// Record the scope and pass it through in the state.
+// VariableDeclaration in infer.searchVisitor breaks things for us.
+var scopeVisitor = walk.make({
+  Function: function (node, _st, c) {
+    var scope = node.scope
+    if (node.id) c(node.id, scope)
+    for (var i = 0; i < node.params.length; ++i) c(node.params[i], scope)
+    c(node.body, scope, "ScopeBody")
+  },
+  Statement: function (node, st, c) {
+    c(node, node.scope || st)
+  },
+})
+
+// Validate one file
+
+export function validateFile(server, query, file) {
+  try {
+    var messages = [],
+      ast = file.ast,
+      state = file.scope
+    var visitors = makeVisitors(server, query, file, messages)
+    walk.simple(ast, visitors, infer.searchVisitor, state)
+    return { messages: messages }
+  } catch (err) {
+    console.error(err.stack)
+    return { messages: [] }
+  }
+}
+
+export function registerTernLinter() {
+  tern.defineQueryType("lint", {
+    takesFile: true,
+    run: function (server, query, file) {
+      return validateFile(server, query, file)
+    },
+  })
+
+  tern.defineQueryType("lint-full", {
+    run: function (server, query) {
+      return validateFiles(server, query)
+    },
+  })
+
+  tern.registerPlugin("lint", function (server, options) {
+    server._lint = {
+      rules: getRules(options),
+    }
+    return {
+      passes: {},
+      loadFirst: true,
+    }
+  })
+}
+
+// Validate the whole files of the server
+
+export function validateFiles(server, query) {
+  try {
+    var messages = [],
+      files = server.files,
+      groupByFiles = query.groupByFiles == true
+    for (var i = 0; i < files.length; ++i) {
+      var messagesFile = groupByFiles ? [] : messages,
+        file = files[i],
+        ast = file.ast,
+        state = file.scope
+      var visitors = makeVisitors(server, query, file, messagesFile)
+      walk.simple(ast, visitors, infer.searchVisitor, state)
+      if (groupByFiles) messages.push({ file: file.name, messages: messagesFile })
+    }
+    return { messages: messages }
+  } catch (err) {
+    console.error(err.stack)
+    return { messages: [] }
+  }
+}
+
+var lints = Object.create(null)
+
+var getLint = (tern.getLint = function (name) {
+  if (!name) return null
+  return lints[name]
+})
+
+function getRules(options) {
+  var rules = {}
+  for (var ruleName in defaultRules) {
+    if (options && options.rules && options.rules[ruleName] && options.rules[ruleName].severity) {
+      if (options.rules[ruleName].severity != "none") rules[ruleName] = options.rules[ruleName]
+    } else {
+      rules[ruleName] = defaultRules[ruleName]
+    }
+  }
+  return rules
+}
+
+function getRule(ruleName) {
+  const cx = infer.cx()
+  const server = cx.parent
+  const rules = server && server._lint && server._lint.rules ? server._lint.rules : defaultRules
+  return rules[ruleName]
+}
diff --git a/nuxt.config.js b/nuxt.config.js
index 1e389f6e9..49a667438 100644
--- a/nuxt.config.js
+++ b/nuxt.config.js
@@ -326,6 +326,12 @@ export default {
           use: { loader: "raw-loader" },
           exclude: /(node_modules)/,
         })
+
+        config.module.rules.push({
+          test: /\.mjs$/,
+          include: /node_modules/,
+          type: "javascript/auto"
+        })
       }
     },
     parallel: true,
diff --git a/package-lock.json b/package-lock.json
index c1bdfa9ef..16fe364a0 100644
--- a/package-lock.json
+++ b/package-lock.json
@@ -3810,9 +3810,9 @@
       "integrity": "sha512-G+chJctFPiiLGvs3+/Mly3apXTcfgE45dT5yp12BcWZ1kUs+gm0qd3/fv4gsz6fVag4mM0moHVpjHDIgph6Psg=="
     },
     "acorn": {
-      "version": "6.4.2",
-      "resolved": "https://registry.npmjs.org/acorn/-/acorn-6.4.2.tgz",
-      "integrity": "sha512-XtGIhXwF8YM8bJhGxG5kXgjkEuNGLTkoYqVE+KMR+aspr4KGYmKYg7yUe3KghyQ9yheNwLnjmzh/7+gfDBmHCQ=="
+      "version": "8.0.4",
+      "resolved": "https://registry.npmjs.org/acorn/-/acorn-8.0.4.tgz",
+      "integrity": "sha512-XNP0PqF1XD19ZlLKvB7cMmnZswW4C/03pRHgirB30uSJTaS3A3V1/P4sS3HPvFmjoriPCJQs+JDSbm4bL1TxGQ=="
     },
     "acorn-globals": {
       "version": "6.0.0",
@@ -3829,6 +3829,12 @@
           "resolved": "https://registry.npmjs.org/acorn/-/acorn-7.4.1.tgz",
           "integrity": "sha512-nQyp0o1/mNdbTO1PO6kHkwSrmgZ0MT/jCCpNiwbUjGoRN4dlBhqJtoQuCnEOKzgTVwg0ZWiCoQy6SxMebQVh8A==",
           "dev": true
+        },
+        "acorn-walk": {
+          "version": "7.2.0",
+          "resolved": "https://registry.npmjs.org/acorn-walk/-/acorn-walk-7.2.0.tgz",
+          "integrity": "sha512-OPdCF6GsMIP+Az+aWfAAOEt2/+iVDKE7oy6lJ098aoe59oAmK76qV6Gw60SbZ8jHuG2wH058GF4pLFbYamYrVA==",
+          "dev": true
         }
       }
     },
@@ -3838,6 +3844,21 @@
       "integrity": "sha512-K0Ptm/47OKfQRpNQ2J/oIN/3QYiK6FwW+eJbILhsdxh2WTLdl+30o8aGdTbm5JbffpFFAg/g+zi1E+jvJha5ng==",
       "dev": true
     },
+    "acorn-loose": {
+      "version": "6.1.0",
+      "resolved": "https://registry.npmjs.org/acorn-loose/-/acorn-loose-6.1.0.tgz",
+      "integrity": "sha512-FHhXoiF0Uch3IqsrnPpWwCtiv5PYvipTpT1k9lDMgQVVYc9iDuSl5zdJV358aI8twfHCYMFBRVYvAVki9wC/ng==",
+      "requires": {
+        "acorn": "^6.2.0"
+      },
+      "dependencies": {
+        "acorn": {
+          "version": "6.4.2",
+          "resolved": "https://registry.npmjs.org/acorn/-/acorn-6.4.2.tgz",
+          "integrity": "sha512-XtGIhXwF8YM8bJhGxG5kXgjkEuNGLTkoYqVE+KMR+aspr4KGYmKYg7yUe3KghyQ9yheNwLnjmzh/7+gfDBmHCQ=="
+        }
+      }
+    },
     "acorn-node": {
       "version": "1.8.2",
       "resolved": "https://registry.npmjs.org/acorn-node/-/acorn-node-1.8.2.tgz",
@@ -3854,13 +3875,19 @@
           "resolved": "https://registry.npmjs.org/acorn/-/acorn-7.4.1.tgz",
           "integrity": "sha512-nQyp0o1/mNdbTO1PO6kHkwSrmgZ0MT/jCCpNiwbUjGoRN4dlBhqJtoQuCnEOKzgTVwg0ZWiCoQy6SxMebQVh8A==",
           "dev": true
+        },
+        "acorn-walk": {
+          "version": "7.2.0",
+          "resolved": "https://registry.npmjs.org/acorn-walk/-/acorn-walk-7.2.0.tgz",
+          "integrity": "sha512-OPdCF6GsMIP+Az+aWfAAOEt2/+iVDKE7oy6lJ098aoe59oAmK76qV6Gw60SbZ8jHuG2wH058GF4pLFbYamYrVA==",
+          "dev": true
         }
       }
     },
     "acorn-walk": {
-      "version": "7.2.0",
-      "resolved": "https://registry.npmjs.org/acorn-walk/-/acorn-walk-7.2.0.tgz",
-      "integrity": "sha512-OPdCF6GsMIP+Az+aWfAAOEt2/+iVDKE7oy6lJ098aoe59oAmK76qV6Gw60SbZ8jHuG2wH058GF4pLFbYamYrVA=="
+      "version": "8.0.1",
+      "resolved": "https://registry.npmjs.org/acorn-walk/-/acorn-walk-8.0.1.tgz",
+      "integrity": "sha512-zn/7dYtoTVkG4EoMU55QlQU4F+m+T7Kren6Vj3C2DapWPnakG/DL9Ns5aPAPW5Ixd3uxXrV/BoMKKVFIazPcdg=="
     },
     "agent-base": {
       "version": "6.0.2",
@@ -15687,6 +15714,89 @@
         "supports-hyperlinks": "^2.0.0"
       }
     },
+    "tern": {
+      "version": "0.24.3",
+      "resolved": "https://registry.npmjs.org/tern/-/tern-0.24.3.tgz",
+      "integrity": "sha512-Z8uvtdWIlFn1GWy0HW5FhZ8VDryZwoJUdnjZU25C7/PBOltLIn1uv+WF3rVq6S1761YbsmbZYRP/l0ZJBCkvrw==",
+      "requires": {
+        "acorn": "^6.0.0",
+        "acorn-loose": "^6.0.0",
+        "acorn-walk": "^6.0.0",
+        "enhanced-resolve": "^2.2.2",
+        "glob": "^7.1.1",
+        "minimatch": "^3.0.3",
+        "resolve-from": "2.0.0"
+      },
+      "dependencies": {
+        "acorn": {
+          "version": "6.4.2",
+          "resolved": "https://registry.npmjs.org/acorn/-/acorn-6.4.2.tgz",
+          "integrity": "sha512-XtGIhXwF8YM8bJhGxG5kXgjkEuNGLTkoYqVE+KMR+aspr4KGYmKYg7yUe3KghyQ9yheNwLnjmzh/7+gfDBmHCQ=="
+        },
+        "acorn-walk": {
+          "version": "6.2.0",
+          "resolved": "https://registry.npmjs.org/acorn-walk/-/acorn-walk-6.2.0.tgz",
+          "integrity": "sha512-7evsyfH1cLOCdAzZAd43Cic04yKydNx0cF+7tiA19p1XnLLPU4dpCQOqpjqwokFe//vS0QqfqqjCS2JkiIs0cA=="
+        },
+        "enhanced-resolve": {
+          "version": "2.3.0",
+          "resolved": "https://registry.npmjs.org/enhanced-resolve/-/enhanced-resolve-2.3.0.tgz",
+          "integrity": "sha1-oRXDJQS2MC6Fp2Jp16V8zdli41k=",
+          "requires": {
+            "graceful-fs": "^4.1.2",
+            "memory-fs": "^0.3.0",
+            "object-assign": "^4.0.1",
+            "tapable": "^0.2.3"
+          }
+        },
+        "memory-fs": {
+          "version": "0.3.0",
+          "resolved": "https://registry.npmjs.org/memory-fs/-/memory-fs-0.3.0.tgz",
+          "integrity": "sha1-e8xrYp46Q+hx1+Kaymrop/FcuyA=",
+          "requires": {
+            "errno": "^0.1.3",
+            "readable-stream": "^2.0.1"
+          }
+        },
+        "readable-stream": {
+          "version": "2.3.7",
+          "resolved": "https://registry.npmjs.org/readable-stream/-/readable-stream-2.3.7.tgz",
+          "integrity": "sha512-Ebho8K4jIbHAxnuxi7o42OrZgF/ZTNcsZj6nRKyUmkhLFq8CHItp/fy6hQZuZmP/n3yZ9VBUbp4zz/mX8hmYPw==",
+          "requires": {
+            "core-util-is": "~1.0.0",
+            "inherits": "~2.0.3",
+            "isarray": "~1.0.0",
+            "process-nextick-args": "~2.0.0",
+            "safe-buffer": "~5.1.1",
+            "string_decoder": "~1.1.1",
+            "util-deprecate": "~1.0.1"
+          }
+        },
+        "resolve-from": {
+          "version": "2.0.0",
+          "resolved": "https://registry.npmjs.org/resolve-from/-/resolve-from-2.0.0.tgz",
+          "integrity": "sha1-lICrIOlP+h2egKgEx+oUdhGWa1c="
+        },
+        "safe-buffer": {
+          "version": "5.1.2",
+          "resolved": "https://registry.npmjs.org/safe-buffer/-/safe-buffer-5.1.2.tgz",
+          "integrity": "sha512-Gd2UZBJDkXlY7GbJxfsE8/nvKkUEU1G38c1siN6QP6a9PT9MmHB8GnpscSmMJSoF8LOIrt8ud/wPtojys4G6+g=="
+        },
+        "string_decoder": {
+          "version": "1.1.1",
+          "resolved": "https://registry.npmjs.org/string_decoder/-/string_decoder-1.1.1.tgz",
+          "integrity": "sha512-n/ShnvDi6FHbbVfviro+WojiFzv+s8MPMHBczVePfUpDJLwoLT0ht1l4YwBCbi8pJAveEEdnkHyPyTP/mzRfwg==",
+          "requires": {
+            "safe-buffer": "~5.1.0"
+          }
+        },
+        "tapable": {
+          "version": "0.2.9",
+          "resolved": "https://registry.npmjs.org/tapable/-/tapable-0.2.9.tgz",
+          "integrity": "sha512-2wsvQ+4GwBvLPLWsNfLCDYGsW6xb7aeC6utq2Qh0PFwgEy7K7dsma9Jsmb2zSQj7GvYAyUGSntLtsv++GmgL1A=="
+        }
+      }
+    },
     "terser": {
       "version": "4.8.0",
       "resolved": "https://registry.npmjs.org/terser/-/terser-4.8.0.tgz",
@@ -16987,6 +17097,11 @@
         "webpack-sources": "^1.4.1"
       },
       "dependencies": {
+        "acorn": {
+          "version": "6.4.2",
+          "resolved": "https://registry.npmjs.org/acorn/-/acorn-6.4.2.tgz",
+          "integrity": "sha512-XtGIhXwF8YM8bJhGxG5kXgjkEuNGLTkoYqVE+KMR+aspr4KGYmKYg7yUe3KghyQ9yheNwLnjmzh/7+gfDBmHCQ=="
+        },
         "braces": {
           "version": "2.3.2",
           "resolved": "https://registry.npmjs.org/braces/-/braces-2.3.2.tgz",
@@ -17253,6 +17368,11 @@
           "resolved": "https://registry.npmjs.org/acorn/-/acorn-7.4.1.tgz",
           "integrity": "sha512-nQyp0o1/mNdbTO1PO6kHkwSrmgZ0MT/jCCpNiwbUjGoRN4dlBhqJtoQuCnEOKzgTVwg0ZWiCoQy6SxMebQVh8A=="
         },
+        "acorn-walk": {
+          "version": "7.2.0",
+          "resolved": "https://registry.npmjs.org/acorn-walk/-/acorn-walk-7.2.0.tgz",
+          "integrity": "sha512-OPdCF6GsMIP+Az+aWfAAOEt2/+iVDKE7oy6lJ098aoe59oAmK76qV6Gw60SbZ8jHuG2wH058GF4pLFbYamYrVA=="
+        },
         "ansi-styles": {
           "version": "3.2.1",
           "resolved": "https://registry.npmjs.org/ansi-styles/-/ansi-styles-3.2.1.tgz",
diff --git a/package.json b/package.json
index c42dcf79b..2431f5e61 100644
--- a/package.json
+++ b/package.json
@@ -26,6 +26,8 @@
     "@nuxtjs/sitemap": "^2.4.0",
     "@nuxtjs/toast": "^3.3.1",
     "ace-builds": "^1.4.12",
+    "acorn": "^8.0.4",
+    "acorn-walk": "^8.0.1",
     "esprima": "^4.0.1",
     "firebase": "^8.2.3",
     "graphql": "^15.4.0",
@@ -36,6 +38,7 @@
     "paho-mqtt": "^1.1.0",
     "socket.io-client": "^3.1.0",
     "socketio-wildcard": "^2.0.0",
+    "tern": "^0.24.3",
     "v-tooltip": "^2.1.2",
     "vuejs-auto-complete": "^0.9.0",
     "vuex-persist": "^3.1.3",
diff --git a/pages/index.vue b/pages/index.vue
index e9bb256cf..24cee844a 100644
--- a/pages/index.vue
+++ b/pages/index.vue
@@ -507,6 +507,7 @@
                         useWorker: false,
                       }"
                       styles="rounded-b-lg"
+                      completeMode="pre"
                     />
                   </li>
                 </ul>
@@ -548,6 +549,7 @@
                         useWorker: false,
                       }"
                       styles="rounded-b-lg"
+                      completeMode="test"
                     />
                     <div v-if="testReports.length !== 0">
                       <div class="row-wrapper">