Documentation generation (#1610)

Co-authored-by: Isha Gupta <40794215+IshaGupta18@users.noreply.github.com>
Co-authored-by: IshaGupta18 <ishagupta1828@gmail.com>
Co-authored-by: Liyas Thomas <liyascthomas@gmail.com>

assets/md/docs.md

@@ -1,218 +1,12 @@
+**Table of Contents**
+
+{{#collections}}
+{{>folderContents}}
+{{/collections}}
+
 {{#collections}}
 
-# {{name}}
+{{>folderBody}}
-
-## {{#folders}}
-
-## Folder: {{name}}
-
-{{#requests}}
-
-### {{name}}
-
-**Method**: {{method}}
-
-**Request URL**: `{{{url}}}{{{path}}}`
-
-{{#isHeaders}}
-**Headers**:
-
-<table>
-<tr>
-<th>Key</th>
-<th>Value</th>
-</tr>
-{{#headers}}
-<tr>
-<td>{{{key}}}</td>
-<td>`{{{value}}}`</td>
-</tr>
-{{/headers}}
-</table>
-{{/isHeaders}}
-
-{{#isParams}}
-**Parameters**:
-
-<table>
-<tr>
-<th>type</th>
-<th>Key</th>
-<th>Value</th>
-</tr>
-{{#params}}
-<tr>
-<td>{{type}}</td>
-<td>{{{key}}}</td>
-<td>{{{value}}}</td>
-</tr>
-{{/params}}
-</table>
-{{/isParams}}
-
-{{#isAuth}}
-**Authentication Type**: {{{auth}}}  
-{{/isAuth}}
-
-{{#bearerToken}}
-**Bearer Token**: `{{{.}}}`
-{{/bearerToken}}
-
-{{#isAuthBasic}}
-Username: `{{{httpUser}}}`  
-Password: `{{{httpPassword}}}`
-{{/isAuthBasic}}
-
-{{#isRawParams}}
-**RawParams**:
-
-```json
-{{{rawParams}}}
-```
-
-{{/isRawParams}}
-
-{{#contentType}}
-**ContentType**: `{{{contentType}}}`
-{{/contentType}}
-
-{{#preRequestScript}}
-**Pre Request Script**:
-
-```js
-{
-  {
-    {
-      preRequestScript
-    }
-  }
-}
-```
-
-{{/preRequestScript}}
-
-{{#testScript}}
-**Test Script**:
-
-```js
-{
-  {
-    {
-      testScript
-    }
-  }
-}
-```
-
-{{/testScript}}
-
-{{/requests}}
-
----
-
-{{/folders}}
-
-{{#requests}}
-
-## {{name}}
-
-**Method**: {{method}}
-
-**Request URL**: `{{{url}}}{{{path}}}`
-
-{{#isHeaders}}
-**Headers**:
-
-<table>
-<tr>
-<th>Key</th>
-<th>Value</th>
-</tr>
-{{#headers}}
-<tr>
-<td>{{{key}}}</td>
-<td>`{{{value}}}`</td>
-</tr>
-{{/headers}}
-</table>
-{{/isHeaders}}
-
-{{#isParams}}
-**Parameters**:
-
-<table>
-<tr>
-<th>type</th>
-<th>Key</th>
-<th>Value</th>
-</tr>
-{{#params}}
-<tr>
-<td>{{type}}</td>
-<td>{{{key}}}</td>
-<td>{{{value}}}</td>
-</tr>
-{{/params}}
-</table>
-{{/isParams}}
-
-{{#isAuth}}
-**Authentication Type**: {{{auth}}}  
-{{/isAuth}}
-
-{{#bearerToken}}
-**Bearer Token**: `{{{.}}}`
-{{/bearerToken}}
-
-{{#isAuthBasic}}
-Username: `{{{httpUser}}}`  
-Password: `{{{httpPassword}}}`
-{{/isAuthBasic}}
-
-{{#isRawParams}}
-**Raw Parameters**:
-
-```json
-{{{rawParams}}}
-```
-
-{{/isRawParams}}
-
-{{#contentType}}
-**Content Type**: `{{{contentType}}}`
-{{/contentType}}
-
-{{#preRequestScript}}
-**Pre Request Script**:
-
-```js
-{
-  {
-    {
-      preRequestScript
-    }
-  }
-}
-```
-
-{{/preRequestScript}}
-
-{{#testScript}}
-**Test Script**:
-
-```js
-{
-  {
-    {
-      testScript
-    }
-  }
-}
-```
-
-{{/testScript}}
-
-{{/requests}}
 
 {{/collections}}
 

assets/md/folderBody.md

@@ -0,0 +1,113 @@
+{{nesting_level}} {{name}}
+
+{{#requests}}
+
+{{nesting_level}} Request: {{name}}
+
+**Method**: {{method}}
+
+**Request URL**:
+
+```
+{{{url}}}{{{path}}}
+```
+
+{{#isHeaders}}
+**Headers**:
+
+<table>
+<tr>
+<th>Key</th>
+<th>Value</th>
+</tr>
+{{#headers}}
+<tr>
+<td>{{{key}}}</td>
+<td>`{{{value}}}`</td>
+</tr>
+{{/headers}}
+</table>
+{{/isHeaders}}
+
+{{#isParams}}
+**Parameters**:
+
+<table>
+<tr>
+<th>type</th>
+<th>Key</th>
+<th>Value</th>
+</tr>
+{{#params}}
+<tr>
+<td>{{type}}</td>
+<td>{{{key}}}</td>
+<td>{{{value}}}</td>
+</tr>
+{{/params}}
+</table>
+{{/isParams}}
+
+{{#isAuth}}
+**Authentication Type**: {{{auth}}}  
+{{/isAuth}}
+
+{{#bearerToken}}
+**Bearer Token**: `{{{.}}}`
+{{/bearerToken}}
+
+{{#isAuthBasic}}
+Username: `{{{httpUser}}}`  
+Password: `{{{httpPassword}}}`
+{{/isAuthBasic}}
+
+{{#isRawParams}}
+**Raw Parameters**:
+
+```json
+{{{rawParams}}}
+```
+
+{{/isRawParams}}
+
+{{#contentType}}
+**Content Type**: `{{{contentType}}}`
+{{/contentType}}
+
+{{#isPreRequestScript}}
+**Pre Request Script**:
+
+```js
+{
+  {
+    {
+      preRequestScript
+    }
+  }
+}
+```
+
+{{/isPreRequestScript}}
+
+{{#isTestScript}}
+**Test Script**:
+
+```js
+{
+  {
+    {
+      testScript
+    }
+  }
+}
+```
+
+{{/isTestScript}}
+
+{{/requests}}
+
+{{#folders}}
+
+{{> folderBody }}
+
+{{/folders}}

assets/md/folderContents.md

@@ -0,0 +1,4 @@
+{{{id}}} <a href="#{{ref}}"> {{name}} </a> <br>
+{{#folders}}
+{{> folderContents}}
+{{/folders}}

pages/doc.vue

@@ -100,6 +100,8 @@
 import { fb } from "~/helpers/fb"
 import Mustache from "mustache"
 import DocsTemplate from "~/assets/md/docs.md"
+import folderContents from "~/assets/md/folderContents.md"
+import folderBody from "~/assets/md/folderBody.md"
 
 export default {
   data() {
@@ -163,32 +165,64 @@ export default {
       this.$refs.collectionUpload.value = ""
     },
 
+    assignIDs(items, pref, nesting_level) {
+      for (var i = 0; i < items.length; ++i) {
+        items[i].id = `&emsp;${pref}${i + 1}.`
+        items[i].ref = `${items[i].name.split(" ").join("-")}`
+        items[i].nesting_level = nesting_level
+        items[i].folders = this.assignIDs(items[i].folders, items[i].id, nesting_level + "#")
+        for (var j = 0; j < items[i].requests.length; ++j) {
+          items[i].requests[j].id = `&emsp;${items[i].id}${i + 1}`
+          items[i].requests[j].ref = `${items[i].requests[j].name.split(" ").join("-")}`
+          items[i].requests[j].nesting_level = nesting_level + "#"
+        }
+      }
+      return items
+    },
+
     getDoc() {
       try {
         this.items = JSON.parse(this.collectionJSON)
+        this.assignIDs(this.items, "", "#")
         this.$toast.clear()
         this.$toast.info(this.$t("docs_generated"), {
           icon: "book",
         })
-        const docsMarkdown = Mustache.render(DocsTemplate, {
+        const docsMarkdown = Mustache.render(
-          collections: this.items,
+          DocsTemplate,
-          isHeaders() {
+          {
-            return this.headers.length
+            collections: this.items,
+            isHeaders() {
+              return this.headers.length
+            },
+            isParams() {
+              return this.params.length
+            },
+            isAuth() {
+              return this.auth !== "None"
+            },
+            isAuthBasic() {
+              return this.httpUser && this.httpPassword
+            },
+            isRawParams() {
+              return this.rawParams && this.rawParams !== "{}"
+            },
+            isPreRequestScript() {
+              return (
+                this.preRequestScript &&
+                this.preRequestScript != `// pw.env.set('variable', 'value');`
+              )
+            },
+            isTestScript() {
+              return this.testScript && this.testScript != `// pw.expect('variable').toBe('value');`
+            },
           },
-          isParams() {
+          {
-            return this.params.length
+            folderContents: folderContents,
-          },
+            folderBody: folderBody,
-          isAuth() {
+          }
-            return this.auth !== "None"
+        )
-          },
+        this.docsMarkdown = docsMarkdown.replace(/^\s*[\r\n]/gm, "\n\n")
-          isAuthBasic() {
-            return this.httpUser && this.httpPassword
-          },
-          isRawParams() {
-            return this.rawParams && this.rawParams !== "{}"
-          },
-        })
-        this.docsMarkdown = docsMarkdown.replace(/^\s*[\r\n]/gm, "\n")
       } catch (e) {
         this.$toast.error(e, {
           icon: "code",