From a19073235a65a8278ff262df84f87f155ae9208f Mon Sep 17 00:00:00 2001
From: Joe Enos <joe@jtenos.com>
Date: Sat, 28 Sep 2024 20:14:07 -0700
Subject: [PATCH 1/3] Adding a request delay

---
 public/guide.html    |  6 ++++++
 public/index.html    | 10 +++++++++-
 src/app.js           | 11 +++++++++++
 templates/GUIDE.md   |  7 +++++++
 templates/index.html |  8 ++++++++
 test/app.js          | 25 +++++++++++++++++++++++++
 6 files changed, 66 insertions(+), 1 deletion(-)

diff --git a/public/guide.html b/public/guide.html
index ca2ee02..a887791 100644
--- a/public/guide.html
+++ b/public/guide.html
@@ -181,6 +181,12 @@ <h3 id="nestedresources">Nested resources</h3>
 <li><a href="https://jsonplaceholder.typicode.com/users/1/todos">https://jsonplaceholder.typicode.com/users/1/todos</a></li>
 <li><a href="https://jsonplaceholder.typicode.com/users/1/posts">https://jsonplaceholder.typicode.com/users/1/posts</a></li>
 </ul>
+<h3 id="delay">Delay</h3>
+<p>With any request, add a <code style="padding: 0 !important;">delay=N</code> query string parameter to simulate a slow-running API response.</p>
+<ul>
+<li><a href="https://jsonplaceholder.typicode.com/posts/1/comments?delay=500">https://jsonplaceholder.typicode.com/posts/1/comments?delay=500</a></li>
+<li><a href="https://jsonplaceholder.typicode.com/posts?userId=1&delay=1000">https://jsonplaceholder.typicode.com/posts?userId=1&delay=1000</a></li>
+</ul>
 <p></main></p>
     </div>
 
diff --git a/public/index.html b/public/index.html
index 3e2d875..5ac6c1f 100644
--- a/public/index.html
+++ b/public/index.html
@@ -248,7 +248,15 @@ <h2>Routes</h2>
 
       <p>
         <strong>Note</strong>: you can view detailed examples
-        <a href="/guide/">here</a>.
+        <a href="guide.html">here</a>.
+      </p>
+
+      <!-- Delay -->
+      <h2>Simulate a delay</h2>
+
+      <p>
+        You can simulate a delay by adding a
+        <strong>delay</strong> query parameter (measured in milliseconds) to any route.
       </p>
 
       <!-- JSON Server -->
diff --git a/src/app.js b/src/app.js
index d734af4..6e15cf6 100644
--- a/src/app.js
+++ b/src/app.js
@@ -5,6 +5,17 @@ const data = require('../data.json')
 const app = jsonServer.create()
 const router = jsonServer.router(clone(data), { _isFake: true })
 
+app.use((req, res, next) => {
+  if (req.query.delay) {
+    const delay = parseInt(req.query.delay, 10)
+    if (delay > 0) {
+      setTimeout(next, delay)
+      return
+    }
+  }
+  next()
+})
+
 app.use((req, res, next) => {
   if (req.path === '/') return next()
   router.db.setState(clone(data))
diff --git a/templates/GUIDE.md b/templates/GUIDE.md
index 5563566..681f8f6 100644
--- a/templates/GUIDE.md
+++ b/templates/GUIDE.md
@@ -163,4 +163,11 @@ Available nested routes:
 * https://jsonplaceholder.typicode.com/users/1/todos
 * https://jsonplaceholder.typicode.com/users/1/posts
 
+### Delay
+
+With any request, add a <code style="padding: 0 !important;">delay=N</code> query string parameter to simulate a slow-running API response.
+
+* https://jsonplaceholder.typicode.com/posts/1/comments?delay=500
+* https://jsonplaceholder.typicode.com/posts?userId=1&delay=1000
+
 </main>
diff --git a/templates/index.html b/templates/index.html
index 291ad22..808883f 100644
--- a/templates/index.html
+++ b/templates/index.html
@@ -198,6 +198,14 @@ <h2>Routes</h2>
         <a href="guide.html">here</a>.
       </p>
 
+      <!-- Delay -->
+      <h2>Simulate a delay</h2>
+
+      <p>
+        You can simulate a delay by adding a
+        <strong>delay</strong> query parameter (measured in milliseconds) to any route.
+      </p>
+
       <!-- JSON Server -->
       <h2>Use your own data</h2>
       <!-- <p>
diff --git a/test/app.js b/test/app.js
index 8c2036b..4af92cd 100644
--- a/test/app.js
+++ b/test/app.js
@@ -8,6 +8,18 @@ test('GET /', (t) => {
     .expect(200, (err) => t.end(err))
 })
 
+test('GET /?delay=100', (t) => {
+  const start = Date.now()
+  request(app)
+    .get('/?delay=100')
+    .expect(200, (err) => {
+      const end = Date.now()
+      t.assert(end - start >= 100, `actual response time ${end - start}`)
+      t.assert(end - start < 200, `actual response time ${end - start}`)
+      t.end(err)
+    })
+})
+
 test('POST /', (t) => {
   const max = 10
   t.plan(max * 3)
@@ -34,3 +46,16 @@ test('POST /', (t) => {
       })
   }
 })
+
+test('POST /posts?delay=100', (t) => {
+  const start = Date.now()
+  request(app)
+    .post('/posts?delay=100')
+    .send({ body: 'foo' })
+    .expect(201, (err) => {
+      const end = Date.now()
+      t.assert(end - start >= 100, `actual response time ${end - start}`)
+      t.assert(end - start < 200, `actual response time ${end - start}`)
+      t.end(err)
+    })
+})

From 771cbdf3725ba4166428057d07d05f58654592c0 Mon Sep 17 00:00:00 2001
From: Joe Enos <joe@jtenos.com>
Date: Sat, 28 Sep 2024 20:20:29 -0700
Subject: [PATCH 2/3] Fixing guide in the template so it doesn't re-break the
 public file.

---
 public/index.html    | 2 +-
 templates/index.html | 2 +-
 2 files changed, 2 insertions(+), 2 deletions(-)

diff --git a/public/index.html b/public/index.html
index 5ac6c1f..d9b6b90 100644
--- a/public/index.html
+++ b/public/index.html
@@ -248,7 +248,7 @@ <h2>Routes</h2>
 
       <p>
         <strong>Note</strong>: you can view detailed examples
-        <a href="guide.html">here</a>.
+        <a href="/guide">here</a>.
       </p>
 
       <!-- Delay -->
diff --git a/templates/index.html b/templates/index.html
index 808883f..ae14ae1 100644
--- a/templates/index.html
+++ b/templates/index.html
@@ -195,7 +195,7 @@ <h2>Routes</h2>
 
       <p>
         <strong>Note</strong>: you can view detailed examples
-        <a href="guide.html">here</a>.
+        <a href="/guide">here</a>.
       </p>
 
       <!-- Delay -->

From a2b527cf567ccf6a7afeff59a0c9e3820b96aa3b Mon Sep 17 00:00:00 2001
From: Joe Enos <joe@jtenos.com>
Date: Sat, 28 Sep 2024 20:21:41 -0700
Subject: [PATCH 3/3] Adding trailing slash.

---
 public/index.html    | 2 +-
 templates/index.html | 2 +-
 2 files changed, 2 insertions(+), 2 deletions(-)

diff --git a/public/index.html b/public/index.html
index d9b6b90..265a419 100644
--- a/public/index.html
+++ b/public/index.html
@@ -248,7 +248,7 @@ <h2>Routes</h2>
 
       <p>
         <strong>Note</strong>: you can view detailed examples
-        <a href="/guide">here</a>.
+        <a href="/guide/">here</a>.
       </p>
 
       <!-- Delay -->
diff --git a/templates/index.html b/templates/index.html
index ae14ae1..46eddff 100644
--- a/templates/index.html
+++ b/templates/index.html
@@ -195,7 +195,7 @@ <h2>Routes</h2>
 
       <p>
         <strong>Note</strong>: you can view detailed examples
-        <a href="/guide">here</a>.
+        <a href="/guide/">here</a>.
       </p>
 
       <!-- Delay -->