nightwatchjs · nothuman2718 · Mar 10, 2024
diff --git a/guide/ci-integrations/run-nightwatch-on-circleci.md b/guide/ci-integrations/run-nightwatch-on-circleci.md
@@ -92,10 +92,10 @@ Click on the pipeline build that just ran followed by the job name i.e. `test`.
     </a>
   </div>
   <div class="next">
-    <a href="https://nightwatchjs.org/guide/network-requests/capture-network-calls.html">
+    <a href="https://nightwatchjs.org/guide/ci-integrations/run-nightwatch-on-gitlab.html">
         <div class="d-flex flex-column">
           <span class="smallT">Next Page</span>
-          <span class="bigT">Capture network calls</span>
+          <span class="bigT">Gitlab CI</span>
         </div>
         <span>→</span>
     </a>

diff --git a/guide/ci-integrations/run-nightwatch-on-gitlab.md b/guide/ci-integrations/run-nightwatch-on-gitlab.md
@@ -125,3 +125,25 @@ You can view the execution output in the shell logs of the particular pipeline r
 
 ### Related articles
 - [How-to guides > Write tests > Run on CI Servers > Jenkins ](https://nightwatchjs.org/guide/ci-integrations/run-nightwatch-on-jenkins.html)
+
+
+<div class="doc-pagination pt-40">
+  <div class="previous">
+    <a href="https://nightwatchjs.org/guide/ci-integrations/run-nightwatch-on-circleci.html">
+      <span>←</span>
+        <div class="d-flex flex-column">
+          <span class="smallT">Back</span>
+          <span class="bigT">Circle CI</span>
+        </div>
+    </a>
+  </div>
+  <div class="next">
+    <a href="https://nightwatchjs.org/guide/network-requests/capture-network-calls.html">
+        <div class="d-flex flex-column">
+          <span class="smallT">Next Page</span>
+          <span class="bigT">Capture network calls</span>
+        </div>
+        <span>→</span>
+    </a>
+  </div>
+</div>
diff --git a/guide/ci-integrations/run-nightwatch-on-jenkins.md b/guide/ci-integrations/run-nightwatch-on-jenkins.md
@@ -99,11 +99,11 @@ Nightwatch also publishes HTML reports which can be published to Jenkins
 
 <div class="doc-pagination pt-40">
   <div class="previous">
-    <a href="https://nightwatchjs.org/guide/debugging-tests/using-debug.html">
+    <a href="https://nightwatchjs.org/guide/running-tests/take-heap-snapshot.html">
       <span>←</span>
         <div class="d-flex flex-column">
           <span class="smallT">Back</span>
-          <span class="bigT">Use.debug()</span>
+          <span class="bigT">Take heap snapshot</span>
         </div>
     </a>
   </div>

diff --git a/guide/component-testing/debugging.md b/guide/component-testing/debugging.md
@@ -83,11 +83,24 @@ You can also use the [integrated debug console](https://nightwatchjs.org/guide/d
 ### Recommended content
 - [Blog > Introducing Component Testing in Nightwatch](https://nightwatchjs.org/blog/introducing-component-testing-in-nightwatch/)
 
-<div class="doc-pagination pt-40">
-  <div class="previous">
-	<a href="https://nightwatchjs.org/guide/component-testing/storybook-component-testing.html">
-	  <span>←</span><div class="d-flex flex-column"><span class="smallT">Back</span><span class="bigT">Storybook integration</span></div>
-	</a>
-  </div>
 
+<div class="doc-pagination pt-40" style="align-items: flex-end">
+ <div class="previous">
+    <a href="https://nightwatchjs.org/guide/component-testing/testing-angular-components.html">
+      <span>←</span>
+        <div class="d-flex flex-column">
+          <span class="smallT">Back</span>
+          <span class="bigT">Using Angular</span>
+        </div>
+    </a>
+  </div>
+  <div class="next">
+    <a href="https://nightwatchjs.org/guide/mobile-app-testing/introduction.html">
+        <div class="d-flex flex-column">
+          <span class="smallT">Next Page</span>
+          <span class="bigT">Mobile App Testing</span>
+        </div>
+        <span>→</span>
+    </a>
+  </div>
 </div>
diff --git a/guide/component-testing/introduction.md b/guide/component-testing/introduction.md
@@ -76,10 +76,23 @@ The only disadvantage would be that it’s going to be a bit slower than the *JS
 - [Blog \> Introducing Component Testing in Nightwatch][6]
 
 <div class="doc-pagination pt-40" style="align-items: flex-end">
-  <div class="next" style="margin-left: auto;">
-	<a href="https://nightwatchjs.org/guide/component-testing/vite-plugin.html">
-      <div class="d-flex flex-column"><span class="smallT">Next Page</span><span class="bigT">Component Testing with Vite</span></div><span>→</span>
-	</a>
+ <div class="previous">
+    <a href="https://nightwatchjs.org/guide/writing-tests/chrome-devtools-recorder.html">
+      <span>←</span>
+        <div class="d-flex flex-column">
+          <span class="smallT">Back</span>
+          <span class="bigT">Chrome Devtools Recorder</span>
+        </div>
+    </a>
+  </div>
+  <div class="next">
+    <a href="https://nightwatchjs.org/guide/component-testing/vite-plugin.html">
+        <div class="d-flex flex-column">
+          <span class="smallT">Next Page</span>
+          <span class="bigT">Using the Vite plugin</span>
+        </div>
+        <span>→</span>
+    </a>
   </div>
 </div>
 

diff --git a/guide/component-testing/storybook-component-testing.md b/guide/component-testing/storybook-component-testing.md
@@ -424,8 +424,8 @@ export default {
 	</a>
   </div>
   <div class="next">
-	<a href="https://nightwatchjs.org/guide/component-testing/debugging.html">
-      <div class="d-flex flex-column"><span class="smallT">Next Page</span><span class="bigT">Debugging component tests</span></div><span>→</span>
+	<a href="https://nightwatchjs.org/guide/component-testing/testing-angular-components.html">
+      <div class="d-flex flex-column"><span class="smallT">Next Page</span><span class="bigT">Using Angular</span></div><span>→</span>
 	</a>
   </div>
 </div>

diff --git a/guide/component-testing/testing-angular-components.md b/guide/component-testing/testing-angular-components.md
@@ -103,3 +103,24 @@ The angular plugin uses webpack dev server to compile and render angular compone
 
 
 [1]:	https://github.com/nightwatchjs/nightwatch-plugin-angular
+
+<div class="doc-pagination pt-40" style="align-items: flex-end">
+ <div class="previous">
+    <a href="https://nightwatchjs.org/guide/component-testing/storybook-component-testing.html">
+      <span>←</span>
+        <div class="d-flex flex-column">
+          <span class="smallT">Back</span>
+          <span class="bigT">Storybook integration</span>
+        </div>
+    </a>
+  </div>
+  <div class="next">
+    <a href="https://nightwatchjs.org/guide/component-testing/debugging.html">
+        <div class="d-flex flex-column">
+          <span class="smallT">Next Page</span>
+          <span class="bigT">Debug component tests</span>
+        </div>
+        <span>→</span>
+    </a>
+  </div>
+</div>
diff --git a/guide/concepts/page-object-model.md b/guide/concepts/page-object-model.md
@@ -104,10 +104,10 @@ From Nightwatch 2 it is also possible to export the page commands as an ES6 clas
     </a>
   </div>
   <div class="next">
-    <a href="https://nightwatchjs.org/guide/concepts/component-testing.html">
+    <a href="https://nightwatchjs.org/guide/writing-tests/introduction.html">
         <div class="d-flex flex-column">
           <span class="smallT">Next Page</span>
-          <span class="bigT">Component testing</span>
+          <span class="bigT">Write Tests</span>
         </div>
         <span>→</span>
     </a>

diff --git a/guide/configuration/aws-devicefarm-settings.md b/guide/configuration/aws-devicefarm-settings.md
@@ -116,10 +116,10 @@ module.exports = (async function() {
     </a>
   </div>
   <div class="next">
-    <a href="https://nightwatchjs.org/guide/writing-tests/test-syntax-bdd.html">
+    <a href="https://nightwatchjs.org/guide/using-page-objects/getting-started.html">
         <div class="d-flex flex-column">
           <span class="smallT">Next Page</span>
-          <span class="bigT">BDD test syntax</span>
+          <span class="bigT">Page Objects</span>
         </div>
         <span>→</span>
     </a>

diff --git a/guide/configuration/nightwatch-configuration-file.md b/guide/configuration/nightwatch-configuration-file.md
@@ -72,11 +72,11 @@ The following packages can be used from NPM and, if installed, Nightwatch will a
 
  <div class="doc-pagination pt-40">
   <div class="previous">
-    <a href="https://nightwatchjs.org/guide/concepts/component-testing.html">
+    <a href="https://nightwatchjs.org/guide/mobile-app-testing/debug-tests.html">
       <span>←</span>
         <div class="d-flex flex-column">
           <span class="smallT">Back</span>
-          <span class="bigT">Component Testing</span>
+          <span class="bigT">Debug Tests</span>
         </div>
     </a>
   </div>

diff --git a/guide/debugging-tests/using-debug.md b/guide/debugging-tests/using-debug.md
@@ -63,10 +63,10 @@ While doing that, users can also interact with the browser and use DevTools to d
     </a>
   </div>
   <div class="next">
-    <a href="https://nightwatchjs.org/guide/ci-integrations/run-nightwatch-on-jenkins.html">
+    <a href="https://nightwatchjs.org/guide/running-tests/capture-console-messages.html">
         <div class="d-flex flex-column">
           <span class="smallT">Next Page</span>
-          <span class="bigT">Jenkins</span>
+          <span class="bigT">Capture browser logs</span>
         </div>
         <span>→</span>
     </a>

diff --git a/guide/migrating-to-nightwatch/from-protractor.md b/guide/migrating-to-nightwatch/from-protractor.md
@@ -271,7 +271,7 @@ The best way to ask for questions or report issues related to Nightwatch Angular
 [PageObjectLink]:https://nightwatchjs.org/api/pageobject/
 [APICommandsLink]:https://nightwatchjs.org/api/commands/
 
-<div class="doc-pagination justify-content-start pt-40">
+<div class="doc-pagination pt-40">
   <div class="previous">
     <a href="https://nightwatchjs.org/guide/migrating-to-nightwatch/from-nightwatch-v1.html">
       <span>←</span>
@@ -281,4 +281,14 @@ The best way to ask for questions or report issues related to Nightwatch Angular
         </div>
     </a>
   </div>
+  <div class="next">
+    <a href="https://nightwatchjs.org/guide/comparison-with-leading-frameworks.html">
+        <div class="d-flex flex-column">
+          <span class="smallT">Next Page</span>
+          <span class="bigT">Comparison with leading frameworks</span>
+        </div>
+        <span>→</span>
+    </a>
+  </div>
 </div>
+
diff --git a/guide/mobile-app-testing/debug-tests.md b/guide/mobile-app-testing/debug-tests.md
@@ -90,8 +90,16 @@ Pass Nightwatch commands/assertions to Nightwatch debug console open in the term
       <span>←</span>
         <div class="d-flex flex-column">
           <span class="smallT">Back</span>
-          <span class="bigT">Running Mobile App Tests</span>
+          <span class="bigT">Run Tests</span>
         </div>
     </a>
   </div>
+  <div class="doc-pagination justify-content-end pt-40">
+  <div class="next">
+    <a href="https://nightwatchjs.org/guide/configuration/nightwatch-configuration-file.html">
+        <div class="d-flex flex-column"><span class="smallT">Next Page</span><span class="bigT">Nightwatch config file</span></div>
+        <span>→</span>
+    </a>
+  </div>
+</div>
 </div>
diff --git a/guide/mobile-app-testing/introduction.md b/guide/mobile-app-testing/introduction.md
@@ -58,12 +58,23 @@ Now that you understand how mobile app testing works with Nightwatch, let's dive
 [image-1]:  https://user-images.githubusercontent.com/1677755/220147111-0c8bd102-cc70-4a7b-bda7-6e597328ace3.png
 
 
-<div class="doc-pagination justify-content-end pt-40">
+<div class="doc-pagination pt-40" style="align-items: flex-end">
+ <div class="previous">
+    <a href="https://nightwatchjs.org/guide/component-testing/debugging.html">
+      <span>←</span>
+        <div class="d-flex flex-column">
+          <span class="smallT">Back</span>
+          <span class="bigT">Debug component tests</span>
+        </div>
+    </a>
+  </div>
   <div class="next">
     <a href="https://nightwatchjs.org/guide/mobile-app-testing/installation.html">
-        <div class="d-flex flex-column"><span class="smallT">Next Page</span><span class="bigT">Installation</span></div>
+        <div class="d-flex flex-column">
+          <span class="smallT">Next Page</span>
+          <span class="bigT">Installation</span>
+        </div>
         <span>→</span>
     </a>
   </div>
 </div>
-
diff --git a/guide/mobile-app-testing/selectors.md b/guide/mobile-app-testing/selectors.md
@@ -66,8 +66,8 @@ Now that you understand selectors, you can use them to write commands & assertio
   </div>
   <div class="doc-pagination justify-content-end pt-40">
   <div class="next">
-    <a href="https://nightwatchjs.org/guide/mobile-app-testing/selectors.html">
-        <div class="d-flex flex-column"><span class="smallT">Next Page</span><span class="bigT">Mobile App Commands</span></div>
+    <a href="https://nightwatchjs.org/guide/mobile-app-testing/commands.html">
+        <div class="d-flex flex-column"><span class="smallT">Next Page</span><span class="bigT">Using Commands</span></div>
         <span>→</span>
     </a>
   </div>

diff --git a/guide/mobile-web-testing/with-appium.md b/guide/mobile-web-testing/with-appium.md
@@ -115,11 +115,11 @@ The [Actions API](https://nightwatchjs.org/api/useractions/) is very general and
 
 <div class="doc-pagination pt-40">
   <div class="previous">
-    <a href="https://nightwatchjs.org/guide/reporters/create-custom-reporter.html">
+    <a href="https://nightwatchjs.org/guide/reporters/dom-history.html">
       <span>←</span>
         <div class="d-flex flex-column">
           <span class="smallT">Back</span>
-          <span class="bigT">Add customer reporter</span>
+          <span class="bigT">DOM History</span>
         </div>
     </a>
   </div>

diff --git a/guide/network-requests/capture-network-calls.md b/guide/network-requests/capture-network-calls.md
@@ -72,7 +72,7 @@ All you need to do is call the `browser.captureNetworkRequests()` command with t
 
 Output from one of the network calls in the example above:
 
-```
+<code style="white-space: pre;" >
   Running Capture network calls:
 ───────────────────────────────────────────────────────────────────────────────────────────────────
 Request Number: 35
@@ -94,19 +94,18 @@ Request headers: {
   'sec-ch-ua-model': '',
   'sec-ch-ua-platform': '"macOS"'
 }
-```
-
+</code>
 ### Recommended content
 - [Chrome DevTools Protocol in Selenium 4](https://www.selenium.dev/documentation/webdriver/bidirectional/chrome_devtools/)
 - [Intercept network responses](https://nightwatchjs.org/guide/network-requests/mock-network-response.html)
 
 <div class="doc-pagination pt-40">
   <div class="previous">
-    <a href="https://nightwatchjs.org/guide/ci-integrations/run-nightwatch-on-circleci.html">
+    <a href="https://nightwatchjs.org/guide/ci-integrations/run-nightwatch-on-gitlab.html">
       <span>←</span>
         <div class="d-flex flex-column">
           <span class="smallT">Back</span>
-          <span class="bigT">CircleCI</span>
+          <span class="bigT">Gitlab CI</span>
         </div>
     </a>
   </div>

diff --git a/guide/quickstarts/create-and-run-a-test-with-selenium-server.md b/guide/quickstarts/create-and-run-a-test-with-selenium-server.md
@@ -163,7 +163,7 @@ For additional help you can jump on to our <a href="https://discord.gg/SN8Da2X">
       <span>←</span>
         <div class="d-flex flex-column">
           <span class="smallT">Back</span>
-          <span class="bigT">Run your first end-to-end test</span>
+          <span class="bigT">Install Nightwatch</span>
         </div>
     </a>
   </div>

diff --git a/guide/reporters/create-custom-reporter.md b/guide/reporters/create-custom-reporter.md
@@ -100,10 +100,10 @@ The `index.js` file needs to implement the same interface as the file-based cust
     </a>
   </div>
   <div class="next">
-    <a href="https://nightwatchjs.org/guide/mobile-web-testing/with-appium.html">
+    <a href="https://nightwatchjs.org/guide/reporters/dom-history.html">
         <div class="d-flex flex-column">
           <span class="smallT">Next Page</span>
-          <span class="bigT">Use Nightwatch with Appium</span>
+          <span class="bigT">DOM history</span>
         </div>
         <span>→</span>
     </a>

diff --git a/guide/reporters/dom-history.md b/guide/reporters/dom-history.md
@@ -65,19 +65,19 @@ Happy debugging!
 
 <div class="doc-pagination pt-40">
   <div class="previous">
-    <a href="https://nightwatchjs.orghttps://nightwatchjs.org/guide/reporters/use-html-reporter.html">
+    <a href="https://nightwatchjs.org/guide/reporters/create-custom-reporter.html">
       <span>←</span>
         <div class="d-flex flex-column">
           <span class="smallT">Back</span>
-          <span class="bigT">HTML reporters</span>
+          <span class="bigT">Add custom reporter</span>
         </div>
     </a>
   </div>
   <div class="next">
-    <a href="https://nightwatchjs.org/guide/reporters/create-custom-reporter.html">
+    <a href="https://nightwatchjs.org/guide/mobile-web-testing/with-appium.html">
         <div class="d-flex flex-column">
           <span class="smallT">Next Page</span>
-          <span class="bigT">Add custom reporter</span>
+          <span class="bigT">Use Nightwatch with Appium</span>
         </div>
         <span>→</span>
     </a>

diff --git a/guide/running-tests/capture-console-messages.md b/guide/running-tests/capture-console-messages.md
@@ -87,11 +87,11 @@ No assertions ran.
 
  <div class="doc-pagination pt-40">
   <div class="previous">
-    <a href="https://nightwatchjs.org/guide/running-tests/programmatic-api.html">
+    <a href="https://nightwatchjs.org/guide/debugging-tests/using-debug.html">
       <span>←</span>
         <div class="d-flex flex-column">
           <span class="smallT">Back</span>
-          <span class="bigT">Use programmatic API</span>
+          <span class="bigT">Use .debug()</span>
         </div>
     </a>
   </div>