Add e2e tests

.travis.yml

@@ -15,12 +15,19 @@ language: node_js
 node_js:
  - "12"
 
+addons:
+ apt:
+  packages:
+   - libgconf-2-4 # cypress binary dependency
+
 env:
  - DEPLOY_ENV=POSTWOMAN_IO
 
 cache:
+ npm: true
  directories:
   - "node_modules"
+  - ~/.cache
 
 branches:
  only:
@@ -30,6 +37,9 @@ install:
  - "npm install firebase-tools"
  - "npm install"
 
+before_script:
+ - "npm run test"
+
 script:
  - "cd functions"
  - "npm install"

cypress.json

@@ -0,0 +1,9 @@
+{
+	"baseUrl": "http://localhost:3000",
+	"integrationFolder": "tests/e2e/integration",
+	"screenshotsFolder": "tests/e2e/screenshots",
+	"fixturesFolder": "tests/e2e/fixtures",
+	"supportFile": "tests/e2e/support",
+	"pluginsFile": false,
+	"video": false
+}

package.json

@@ -11,7 +11,11 @@
         "build": "nuxt build",
         "start": "nuxt start",
         "pregenerate": "node build.js",
-        "generate": "nuxt generate"
+        "generate": "nuxt generate",
+        "e2e": "cypress run",
+        "e2e:open": "cypress open",
+        "dev:e2e": "start-server-and-test dev http://localhost:3000 e2e:open",
+        "test": "start-server-and-test dev http://localhost:3000 e2e"
     },
     "dependencies": {
         "@nuxtjs/axios": "^5.6.0",
@@ -28,7 +32,9 @@
         "yargs-parser": "^14.0.0"
     },
     "devDependencies": {
+        "cypress": "^3.4.1",
         "node-sass": "^4.12.0",
-        "sass-loader": "^7.3.1"
+        "sass-loader": "^7.3.1",
+        "start-server-and-test": "^1.10.3"
     }
 }

tests/e2e/fixtures/catapi.json

@@ -0,0 +1 @@
+{ "message": "FAKE Cat API" }

tests/e2e/integration/app.starter.spec.js

@@ -0,0 +1,7 @@
+describe('Visit home', () => {
+  it('Have a page title with "Postwoman"', () => {
+    cy.visit('/')
+      .get('title')
+      .should('contain','Postwoman')
+  })
+})

tests/e2e/integration/feature.url-queries.spec.js

@@ -0,0 +1,57 @@
+describe('Methods', () => {
+  const methods = [ 'POST', 'HEAD', 'POST', 'PUT', 'DELETE','OPTIONS', 'PATCH']
+  methods.forEach(method => {
+      it(`Change the default method GET to ${method} with url query`, () => {
+        cy.visit(`/?method=${method}`)
+          .get('#method').contains(method)
+      })
+  })
+})
+
+describe('Url and path', () => {
+  it('Change default url with query and reset default path to empty string and make a request to cat api', () => {
+      cy.seedAndVisit('catapi', '/?url=https://api.thecatapi.com&path=')
+      .get('#url').then(el => expect(el.val() === 'https://api.thecatapi.com').to.equal(true))
+      .get("#path").then(el => expect(el.val() === '').to.equal(true))
+      .get('#response-details-wrapper').should($wrapper => {
+        expect($wrapper).to.contain('FAKE Cat API')
+      })
+  })
+})
+
+describe('Authentication', () => {
+  it(`Change default auth 'None' to 'Basic' and set httpUser and httpPassword with url query`, () => {
+    cy.visit(`?&auth=Basic&httpUser=foo&httpPassword=bar`, { retryOnStatusCodeFailure: true })
+      .get('#authentication').contains('Authentication').click()
+        .then(() => { 
+          cy.get('input[name="http_basic_user"]', { timeout: 500 })
+            .invoke('val')
+            .then(user => {
+              expect(user === 'foo').to.equal(true)
+              cy.log('Success! user === foo')
+            })
+
+          cy.get('input[name="http_basic_passwd"]')
+            .invoke('val')
+            .then(user => { 
+              expect(user === 'bar').to.equal(true)
+              cy.log('Success! password === bar')
+            })
+        })
+  })
+
+  const base64Tkn = encodeURI(btoa('{"alg":"HS256", "typ": "JWT"}'))
+
+  it(`Change default auth 'None' to 'Bearer token' and set bearerToken with url query`, () => {
+    cy.visit(`/?auth=Bearer Token&bearerToken=${base64Tkn}`, { retryOnStatusCodeFailure: true })
+        .get('#authentication').contains('Authentication').click()
+          .then(() => {
+            cy.get('input[name="bearer_token"]', { timeout: 500 })
+              .invoke('val')
+              .then(tkn => {
+                expect(tkn === base64Tkn).to.equal(true)
+                cy.log(`Success! input[name="bearer_token"] === ${base64Tkn}`)
+              })
+          })
+  })
+})

tests/e2e/support/commands.js

@@ -0,0 +1,16 @@
+/**
+* Creates cy.seedAndVisit() function
+* This function will go to some path and wait for some fake response from 'src/tests/fixtures/*.json'
+* @param { String } seedData The name of json at 'src/tests/fixtures/
+* @param { String } path The path or query parameters to go -ex. '/?path=/api/users'
+* @param { String } method The fake request method
+*/
+Cypress.Commands.add('seedAndVisit', (seedData, path = '/', method = 'GET') => {
+  cy.server()
+    .route(method, 'https://api.thecatapi.com/', `fixture:${seedData}`).as(
+    'load'
+  )
+  cy.visit(path)
+    .get('#send').click()
+    .wait('@load')
+})

tests/e2e/support/index.js

@@ -0,0 +1 @@
+import './commands'