Prepare for cypress in CI #2771

.gitignore

@@ -9,4 +9,6 @@ includes/freemius/assets/img/caldera-forms.png
 bin/caldera-forms
 
 wordpress/*
-wp-content/*
+wp-content/*
+cypress/screenshots/*
+cypress/videos/*

README.md

@@ -111,7 +111,8 @@ The local server is [http://localhost:8228](http://localhost:8228)
 * `composer wp:setup-tests` - Adds test forms and puts them on pages.
 * `npm test` - Run JavaScript test watcher
 * `npm run test:once` - Run JavaScript unit tests once
-
+* `npm run test:e2e` - Start Cypress e2e test runner.
+* `npm run test:e2e:ci` - Trigger Cypress.io test record.
 ### Release To WordPress.org
 ##### Requires
 * [svn](https://subversion.apache.org/quick-start#installing-the-client)

cypress.json

@@ -1,9 +1,10 @@
 {
   "env": {
-    "wp_site" : {
-      "url" : "http://localhost:8228",
+    "wp_site": {
+      "url": "http://localhost:8228",
       "user": "admin",
       "pass": "password"
     }
-  }
+  },
+  "projectId": "3jgs4a"
 }

cypress/README.md

@@ -4,21 +4,36 @@ Cypress opens a small app called "Cypress" and Chrome. You start this with the c
 
 In the Cypress app, you should se a list of tests, you can click one to launch it in Chrome or you can click the "Run All Specs" button to run all of the tests.
 
-### Run tests:
+### Run Tests Individually With Test Runner
+
+* Start local dev environment.
+    - See main readme
+* Start test runner
+    - See main readme
+    - TL;DR `composer wp:start`
+* Choose a test suite to run from Cypress menu
+
+
+## Performing A Test Run
+
+A test run in Cypress records -- using video and screenshots -- a run of all test specs. You can watch the videos, they are in `cypress/videos`. The videos and screenshots directories should be git ignored. We use the Cypress.io service to record these in CI.
+
+* https://docs.cypress.io/guides/guides/screenshots-and-videos.html
 
-1) Start local dev environment (See main readme)
-2) Start test runner (See main readme)
-3) Choose a test suite to run from Cypress menu
 
 ## Runner Not Working?
 * Cypress gets 404s for all pages?
     - Did you start the development environment? `composer wp:start`
     - Are you trying to use your own URL? You need to modify cypress.json's env, but then you will break it for everyone, please use the provided environment.
 * Error in Cypress' Chrome `Whoops, we can't run your tests. This browser was not launched through Cypress. Tests cannot run.`
+
 ## How To Add A Test
 * Export your form
 * Save form in `cypress/forms` using form ID as file name
 * Add an entry in `cypress/test.json` to `forms` with:
     - `formId` - Required. The ID of the form
     - `pageSlug` - Optional. Slug of page to put form on. Skip for admin tests.
-    - `ghostId` - Optional. ID of Ghost Inspector test if it exists.
+    - `ghostId` - Optional. ID of Ghost Inspector test if it exists.
+* Add test file to `cypress/integration`
+    - https://docs.cypress.io/guides/getting-started/writing-your-first-test.html#Add-a-test-file
+

package.json

@@ -28,7 +28,9 @@
     "test": "npm run test:watch",
     "test:watch": "jest --watch",
     "test:once": "jest",
-    "test:e2e": "cypress open"
+    "test:e2e": "cypress open",
+    "test:e2e:ci": "cypress run"
+
   },
   "browserslist": [
     "last 2 versions",