chore: remove reliance on json placeholder server in stubbing-spying__intercept example (#908)

Author: ryanthemanuel

examples/stubbing-spying__intercept/app.js

@@ -55,7 +55,7 @@ const loadUsers = (nUsers = 3) => {
       console.log('loading %d users', nUsers)
       document.querySelector('#users').innerText = ''
 
-      fetch(`https://jsonplaceholder.cypress.io/users?_limit=${nUsers}`, {
+      fetch(`http://localhost:7081/users?_limit=${nUsers}`, {
         method: 'GET',
         headers: {
           'Accept': 'application/json',
@@ -90,7 +90,7 @@ const loadUser = (id) => {
     console.log('loading user #%d', id)
     document.querySelector('#users').innerText = ''
 
-    fetch(`https://jsonplaceholder.cypress.io/users/${id}`)
+    fetch(`http://localhost:7081/users/${id}`)
     .then((r) => r.json())
     .then((user) => {
       const users = [user]
@@ -116,7 +116,7 @@ function postUser () {
     name: 'Joe Smith',
   }
 
-  return fetch('https://jsonplaceholder.cypress.io/users', {
+  return fetch('http://localhost:7081/users', {
     method: 'POST',
     headers: {
       'Accept': 'application/json',
@@ -128,11 +128,11 @@ function postUser () {
 
 function putUser () {
   const user = {
-    id: 101,
+    id: 1,
     name: 'Joe Smith',
   }
 
-  return fetch('https://jsonplaceholder.cypress.io/users/1', {
+  return fetch('http://localhost:7081/users/1', {
     method: 'PUT',
     headers: {
       'Accept': 'application/json',

examples/stubbing-spying__intercept/cypress/e2e/matching-spec.cy.js

@@ -25,11 +25,11 @@ describe('intercept', () => {
         // confirm that both interceptors are matched
         cy.wait('@users')
         .its('request.url')
-        .should('equal', 'https://jsonplaceholder.cypress.io/users/2')
+        .should('equal', 'http://localhost:7081/users/2')
 
         cy.wait('@secondUser')
         .its('request.url')
-        .should('equal', 'https://jsonplaceholder.cypress.io/users/2')
+        .should('equal', 'http://localhost:7081/users/2')
       })
 
       it('use regex to match exactly', () => {
@@ -41,7 +41,7 @@ describe('intercept', () => {
         // only the second interceptor should match
         cy.wait('@secondUser')
         .its('request.url')
-        .should('equal', 'https://jsonplaceholder.cypress.io/users/2')
+        .should('equal', 'http://localhost:7081/users/2')
       })
 
       it('use regex to match exactly and check if the other intercept has not fired', () => {
@@ -57,7 +57,7 @@ describe('intercept', () => {
         // only the second interceptor should match
         cy.wait('@secondUser')
         .its('request.url')
-        .should('equal', 'https://jsonplaceholder.cypress.io/users/2')
+        .should('equal', 'http://localhost:7081/users/2')
         // but the first intercept should have never fired
         .then(() => {
           expect(usersMatched, 'users intercept').to.be.false

examples/stubbing-spying__intercept/cypress/e2e/spy-on-fetch-spec.cy.js

@@ -63,7 +63,7 @@ describe('intercept', () => {
     })
 
     it('spying on 2nd domain', () => {
-      cy.intercept('https://jsonplaceholder.cypress.io/users*').as('users')
+      cy.intercept('http://localhost:7081/users*').as('users')
       cy.get('#load-users').click()
       cy.wait('@users').its('response.body').should('have.length', 3)
       .its('0') // grab the first user from the list

examples/stubbing-spying__intercept/cypress/e2e/stub-fetch-spec.cy.js

@@ -200,7 +200,7 @@ describe('intercept', () => {
         username: 'Test User',
       }]
 
-      cy.intercept({ url: 'https://jsonplaceholder.cypress.io/users*' }, {
+      cy.intercept({ url: 'http://localhost:7081/users*' }, {
         body: users,
         headers: {
           'access-control-allow-origin': Cypress.config('baseUrl'),

examples/stubbing-spying__intercept/package.json

@@ -7,9 +7,9 @@
     "cypress:open": "../../node_modules/.bin/cypress open",
     "cypress:run": "../../node_modules/.bin/cypress run",
     "cypress:run:record": "../../node_modules/.bin/cypress run --record",
-    "dev": "../../node_modules/.bin/start-test 7080 cypress:open",
-    "start": "node server.js --port 7080",
-    "test:ci": "../../node_modules/.bin/start-test 7080 cypress:run",
-    "test:ci:record": "../../node_modules/.bin/start-test 7080 cypress:run:record"
+    "dev": "../../node_modules/.bin/start-test \"7080|7081\" cypress:open",
+    "start": "node server.js --port1 7080 --port2 7081",
+    "test:ci": "../../node_modules/.bin/start-test \"7080|7081\" cypress:run",
+    "test:ci:record": "../../node_modules/.bin/start-test \"7080|7081\" cypress:run:record"
   }
 }

examples/stubbing-spying__intercept/server.js

@@ -4,12 +4,15 @@ const path = require('path')
 const minimist = require('minimist')
 const express = require('express')
 const morgan = require('morgan')
+const cors = require('cors')
 
 const fruits = require('./fruits')
+const users = require('./users')
 const app = express()
 
 // get port from passed in args from scripts/start.js
-const port = minimist(process.argv.slice(2)).port
+const port1 = minimist(process.argv.slice(2)).port1
+const port2 = minimist(process.argv.slice(2)).port2
 
 app.use(morgan('dev'))
 app.use(express.static('.'))
@@ -76,4 +79,55 @@ app.get('/req-headers', (req, res) => {
   res.json(req.headers)
 })
 
-app.listen(port)
+app.listen(port1)
+
+const app2 = express()
+
+app2.disable('etag')
+app2.use(morgan('dev'))
+app2.use(cors())
+app2.use(express.json())
+
+app2.get('/', (req, res) => {
+  res.sendFile(`${__dirname}/index.html`)
+})
+
+app2.get('/users/:id', (req, res) => {
+  const id = parseInt(req.params.id)
+  const user = users.find((u) => u.id === id)
+
+  if (user) {
+    return res.json(user)
+  }
+
+  res.status(404).json({ error: 'User not found' })
+})
+
+app2.get('/users', (req, res) => {
+  const limit = req.query._limit
+
+  if (limit) {
+    return res.json(users.slice(0, limit))
+  }
+
+  return res.json(users)
+})
+
+app2.post('/users', (req, res) => {
+  res.sendStatus(201)
+})
+
+app2.put('/users/:id', (req, res) => {
+  const id = parseInt(req.params.id)
+  const user = users.find((u) => u.id === id)
+
+  if (user) {
+    return res.json({
+      ...req.body,
+    })
+  }
+
+  res.status(404).json({ error: 'User not found' })
+})
+
+app2.listen(port2)