feat(test): e2e failing test using Cypress for #3

.gitignore

@@ -1,2 +1,3 @@
 node_modules/
 npm-debug.log
+failed-*.json

.travis.yml

@@ -3,11 +3,16 @@ cache:
   directories:
     - node_modules
 notifications:
-  email: false
+  email: true
 node_js:
   - '6'
 before_script:
   - npm prune
+  - npm i -g cypress-cli
+script:
+  - npm test
+  # ignore result because is failing on purpose
+  - cypress ci || true
 after_success:
   - npm run semantic-release
 branches:

cypress.json

@@ -0,0 +1,3 @@
+{
+  "projectId": "kqsspw"
+}

cypress/fixtures/example.json

@@ -0,0 +1,5 @@
+{
+  "name": "Using fixtures to represent data",
+  "email": "[email protected]",
+  "body": "Fixtures are a great way to mock data for responses to routes"
+}

cypress/integration/failing-spec.js

@@ -0,0 +1,18 @@
+describe('cypress failed log', () => {
+  beforeEach(() => {
+    cy.visit('https://glebbahmutov.com')
+  })
+
+  // this test fails on purpose
+  it('finds aliens', () => {
+    cy.contains('a', 'videos')
+      .click()
+      .wait(100)
+
+    cy.url()
+      .should('contain', 'videos')
+
+    cy.contains('Aliens')
+      .should('be.visible')
+  })
+})

cypress/support/commands.js

@@ -0,0 +1,39 @@
+// ***********************************************
+// This example commands.js shows you how to
+// create the custom command: 'login'.
+//
+// The commands.js file is a great place to
+// modify existing commands and create custom
+// commands for use throughout your tests.
+//
+// You can read more about custom commands here:
+// https://on.cypress.io/api/commands
+// ***********************************************
+//
+// Cypress.addParentCommand("login", function(email, password){
+//   var email    = email || "[email protected]"
+//   var password = password || "foobar"
+//
+//   var log = Cypress.Log.command({
+//     name: "login",
+//     message: [email, password],
+//     consoleProps: function(){
+//       return {
+//         email: email,
+//         password: password
+//       }
+//     }
+//   })
+//
+//   cy
+//     .visit("/login", {log: false})
+//     .contains("Log In", {log: false})
+//     .get("#email", {log: false}).type(email, {log: false})
+//     .get("#password", {log: false}).type(password, {log: false})
+//     .get("button", {log: false}).click({log: false}) //this should submit the form
+//     .get("h1", {log: false}).contains("Dashboard", {log: false}) //we should be on the dashboard now
+//     .url({log: false}).should("match", /dashboard/, {log: false})
+//     .then(function(){
+//       log.snapshot().end()
+//     })
+// })

cypress/support/defaults.js

@@ -0,0 +1,17 @@
+// ***********************************************
+// This example defaults.js shows you how to
+// customize the internal behavior of Cypress.
+//
+// The defaults.js file is a great place to
+// override defaults used throughout all tests.
+//
+// ***********************************************
+//
+// Cypress.Server.defaults({
+//   delay: 500,
+//   whitelist: function(xhr){}
+// })
+
+// Cypress.Cookies.defaults({
+//   whitelist: ["session_id", "remember_token"]
+// })

cypress/support/index.js

@@ -0,0 +1,24 @@
+// ***********************************************************
+// This example support/index.js is processed and
+// loaded automatically before your other test files.
+//
+// This is a great place to put global configuration and
+// behavior that modifies Cypress.
+//
+// You can change the location of this file or turn off
+// automatically serving support files with the
+// 'supportFile' configuration option.
+//
+// You can read more here:
+// https://on.cypress.io/guides/configuration#section-global
+// ***********************************************************
+
+// Import commands.js and defaults.js
+// using ES2015 syntax:
+import "./commands"
+import "./defaults"
+
+// Alternatively you can use CommonJS syntax:
+// require("./commands")
+// require("./defaults")
+require('../..')

package.json

@@ -61,7 +61,8 @@
     "size": "t=\"$(npm pack .)\"; wc -c \"${t}\"; tar tvf \"${t}\"; rm \"${t}\";",
     "test": "npm run unit",
     "unit": "mocha src/*-spec.js",
-    "semantic-release": "semantic-release pre && npm publish && semantic-release post"
+    "semantic-release": "semantic-release pre && npm publish && semantic-release post",
+    "failed-test": "echo Test failed, details in $1"
   },
   "devDependencies": {
     "ban-sensitive-files": "1.8.4",

src/index.js

@@ -18,21 +18,39 @@ function writeFailedTestInfo ({title, testName, testError, testCommands}) {
   // const runCmd = `npm run failed-test -- ${filename}`
   // pass filename as environment variable
 
-  // for now assume we are running from the root of
-  // the project and the shell script is in node_modules
-  const runCmd = './node_modules/cypress-failed-log/on-failed.sh'
+  // try discovering the shell script filename
+  const candidates = [
+    './node_modules/cypress-failed-log/on-failed.sh',
+    './on-failed.sh'
+  ]
   const options = {
     failOnNonZeroExit: false,
     env: {
       FAILED_FILENAME: filename
     }
   }
-  cy.exec(runCmd, options)
+
+  function onFailedExec (result) {
+    console.log('running cy.exec has failed')
+    console.log(result)
+    cy.log(JSON.stringify(result))
+    cy.writeFile('failed-exec.json', JSON.stringify(result, null, 2))
+  }
+
+  cy.exec(candidates[0], options)
+    .then(result => {
+      if (result.code) {
+        onFailedExec(result)
+        return cy.exec(candidates[1], options)
+      } else {
+        console.log('ran npm command successfully', candidates[0])
+        return result
+      }
+    })
     .then(result => {
-      console.log('result of running npm command')
-      console.log(result)
-      cy.log(JSON.stringify(result))
-      cy.writeFile('failed-exec.json', JSON.stringify(result, null, 2))
+      if (result.code) {
+        onFailedExec(result)
+      }
     })
     .log('ran "npm run failed-test" with the failed test filename', filename)
 }