update code to make the routing test pass

Author: bahmutov

README.md

@@ -339,6 +339,12 @@ Set environment variable `DEBUG=netlify-plugin-cypress` to see the debug logs. T
   Switch to using Chromium browser that seems to be a bit more reliable. Use <code>browser = "chromium"</code> setting.
 </details>
 
+## Changelog
+
+### v1 to v2
+
+- We have changed the default testing phase. In v1 the tests executed after building the site by default. In v2 the tests run against the deployed URL by default, and you need to enable the testing during `preBuild` or `postBuild` steps.
+
 ## License
 
 This project is licensed under the terms of the [MIT license](LICENSE.md).

manifest.yml

@@ -1,10 +1,17 @@
 name: netlify-plugin-cypress
 inputs:
-  # these settings apply during onSuccess step
+  # by default the Cypress tests run against the deployed URL
+  # and these settings apply during the "onSuccess" step
   - name: enable
     description: Run tests against the preview or production deploy
     default: true
 
+  # Cypress comes with built-in Electron browser
+  # and this NPM package installs Chromium browser
+  - name: browser
+    description: Allowed values are chromium, electron
+    default: chromium
+
   - name: record
     description: Record test results to Cypress Dashboard
     default: false
@@ -24,12 +31,6 @@ inputs:
       If recording to Cypress Dashboard,
       pass the tag with "cypress run --record --tag ..."
 
-  # Cypress comes with built-in Electron browser
-  # and this NPM package installs Chromium browser
-  - name: browser
-    description: Allowed values are chromium, electron
-    default: chromium
-
   # tells the plugin how to start the server using custom command
   # and waiting for an url, record to the dashboard, tag, etc
   # see README "testing the site before build"

package-lock.json

@@ -24,7 +24,8 @@
     "debug": "4.1.1",
     "got": "10.7.0",
     "local-web-server": "^4.2.1",
-    "puppeteer": "^7.0.1"
+    "puppeteer": "^7.0.1",
+    "ramda": "0.27.1"
   },
   "repository": {
     "type": "git",

package.json

@@ -1,5 +1,6 @@
 // @ts-check
 const { stripIndent } = require('common-tags')
+const R = require('ramda')
 const debug = require('debug')('netlify-plugin-cypress')
 const debugVerbose = require('debug')('netlify-plugin-cypress:verbose')
 const { ping, getBrowserPath, serveFolder } = require('./utils')
@@ -278,21 +279,26 @@ const hasRecordKey = () => typeof process.env.CYPRESS_RECORD_KEY === 'string'
 
 module.exports = {
   onPreBuild: async (arg) => {
+    // we need to install everything to be ready
     await install(arg)
     await cypressVerify(arg)
     await cypressInfo(arg)
 
-    debug('cypress plugin preBuild inputs %o', arg.inputs)
-    const preBuildInputs = arg.inputs && arg.inputs.preBuild
-    if (!preBuildInputs) {
-      debug('there are no preBuild inputs')
+    const { inputs, utils } = arg
+
+    const preBuildInputs = inputs.preBuild || {}
+    debug('preBuild inputs %o', preBuildInputs)
+
+    const enablePreBuildTests = Boolean(preBuildInputs.enable)
+    if (!enablePreBuildTests) {
+      debug('Skipping preBuild tests')
       return
     }
 
-    const browser = arg.inputs.browser || DEFAULT_BROWSER
+    const browser = preBuildInputs.browser || DEFAULT_BROWSER
 
-    const closeServer = startServerMaybe(arg.utils.run, preBuildInputs)
-    await waitOnMaybe(arg.utils.build, preBuildInputs)
+    const closeServer = startServerMaybe(utils.run, preBuildInputs)
+    await waitOnMaybe(utils.build, preBuildInputs)
 
     const baseUrl = preBuildInputs['wait-on']
     const record = hasRecordKey() && Boolean(preBuildInputs.record)
@@ -323,47 +329,49 @@ module.exports = {
       closeServer()
     }
 
-    const errorCallback = arg.utils.build.failBuild.bind(arg.utils.build)
-    const summaryCallback = arg.utils.status.show.bind(arg.utils.status)
+    const errorCallback = utils.build.failBuild.bind(utils.build)
+    const summaryCallback = utils.status.show.bind(utils.status)
 
     processCypressResults(results, errorCallback, summaryCallback)
   },
 
-  onPostBuild: async (arg) => {
-    debugVerbose('postBuild arg %o', arg)
-    debug('cypress plugin postBuild inputs %o', arg.inputs)
+  onPostBuild: async ({ inputs, constants, utils }) => {
+    debugVerbose('===postBuild===')
 
-    const skipTests = Boolean(arg.inputs.skip)
-    if (skipTests) {
-      console.log('Skipping tests because skip=true')
+    const postBuildInputs = inputs.postBuild || {}
+    debug('cypress plugin postBuild inputs %o', postBuildInputs)
+
+    const enablePostBuildTests = Boolean(postBuildInputs.enable)
+    if (!enablePostBuildTests) {
+      debug('Skipping postBuild tests')
       return
     }
 
-    const fullPublishFolder = arg.constants.PUBLISH_DIR
+    const fullPublishFolder = constants.PUBLISH_DIR
     debug('folder to publish is "%s"', fullPublishFolder)
 
-    const browser = arg.inputs.browser || DEFAULT_BROWSER
+    const browser = postBuildInputs.browser || DEFAULT_BROWSER
 
     // only if the user wants to record the tests and has set the record key
     // then we should attempt recording
-    const record = hasRecordKey() && Boolean(arg.inputs.record)
+    const record = hasRecordKey() && Boolean(postBuildInputs.record)
 
-    const spec = arg.inputs.spec
+    const spec = postBuildInputs.spec
     let group
     let tag
     if (record) {
-      group = arg.inputs.group || 'postBuild'
+      group = postBuildInputs.group || 'postBuild'
 
-      if (arg.inputs.tag) {
-        tag = arg.inputs.tag
+      if (postBuildInputs.tag) {
+        tag = postBuildInputs.tag
       } else {
         tag = process.env.CONTEXT
       }
     }
-    const spa = arg.inputs.spa
+    const spa = postBuildInputs.spa
 
-    const errorCallback = arg.utils.build.failBuild.bind(arg.utils.build)
-    const summaryCallback = arg.utils.status.show.bind(arg.utils.status)
+    const errorCallback = utils.build.failBuild.bind(utils.build)
+    const summaryCallback = utils.status.show.bind(utils.status)
 
     await postBuild({
       fullPublishFolder,
@@ -382,11 +390,12 @@ module.exports = {
    * Executes after successful Netlify deployment.
    * @param {any} arg
    */
-  onSuccess: async (arg) => {
-    debugVerbose('onSuccess arg %o', arg)
+  onSuccess: async ({ utils, inputs, constants }) => {
+    debugVerbose('onSuccess arg %o', { utils, inputs, constants })
 
-    const { utils, inputs, constants } = arg
-    debug('onSuccess inputs %o', inputs)
+    // extract test run parameters
+    const onSuccessInputs = R.omit(['preBuild', 'postBuild'], inputs || {})
+    debug('onSuccess inputs %o', onSuccessInputs)
 
     const isLocal = constants.IS_LOCAL
     const siteName = process.env.SITE_NAME
@@ -397,16 +406,9 @@ module.exports = {
       isLocal,
     })
 
-    // extract test run parameters
-    const onSuccessInputs = inputs.onSuccess
-    if (!onSuccessInputs) {
-      debug('no onSuccess inputs, skipping testing the deployed url')
-      return
-    }
-
-    const enableTests = Boolean(onSuccessInputs.enable)
-    if (!enableTests) {
-      console.log('Skipping tests because enable=false')
+    const enableOnSuccessTests = Boolean(onSuccessInputs.enable)
+    if (!enableOnSuccessTests) {
+      debug('Skipping onSuccess tests')
       return
     }
 
@@ -419,7 +421,7 @@ module.exports = {
       return errorCallback('Missing DEPLOY_PRIME_URL')
     }
 
-    const browser = arg.inputs.browser || DEFAULT_BROWSER
+    const browser = onSuccessInputs.browser || DEFAULT_BROWSER
 
     // only if the user wants to record the tests and has set the record key
     // then we should attempt recording

src/index.js

@@ -5,6 +5,11 @@ This example tests the redirect fallback that makes client-side routing defined
 
 ![Test screenshot](images/routing.png)
 
+These tests run:
+- [x] before the build
+- [x] after the build
+- [ ] on deploy success
+
 ## Local build
 
-Use command `npm run netlify:build` to try the plugin locally
+Use command `DEBUG=netlify-plugin-cypress npm run netlify:build` to try the plugin locally

tests/routing/README.md

@@ -8,6 +8,8 @@ publish = "build"
 CYPRESS_CACHE_FOLDER = "./node_modules/CypressBinary"
 # set TERM variable for terminal output
 TERM = "xterm"
+# do not print too many progress messages
+CI = "1"
 
 [[plugins]]
   # local Cypress plugin will test our site after it is built
@@ -17,15 +19,22 @@ TERM = "xterm"
   # run Cypress tests once on the site before it is built
   # and then after building the static folder
 
+  [plugins.inputs]
+    # these settings apply to the default step onSuccess
+    # in this case, we do not want to run any tests after deploy
+    enable = false
+
   # let's run tests against development server
   # before building it (and testing the built site)
   [plugins.inputs.preBuild]
+    enable = true
     start = 'npm start'
     wait-on = 'http://localhost:3000'
     wait-on-timeout = '45' # seconds
 
   # and test the built site after
-  [plugins.inputs]
+  [plugins.inputs.postBuild]
+    enable = true
     # must allow our test server to redirect unknown routes to "/"
     # so that client-side routing can correctly route them
     # can be set to true or "index.html" (or similar fallback filename in the built folder)