fix: split utils into support and task utils (cypress-io#202)

* fix: split utils for task from utils for support file

* fix typo

* add TypeScript type check

* move function

* fix options

Author: bahmutov

.circleci/config.yml

@@ -17,8 +17,16 @@ jobs:
       - checkout
       - node/with-cache:
           steps:
-            - run: CYPRESS_INSTALL_BINARY=0 npm ci
-      - run: npm run format:check
+            - run:
+                name: Install dependencies 📦
+                # installs NPM dependencies but skips Cypress
+                command: CYPRESS_INSTALL_BINARY=0 npm ci
+      - run:
+          name: Code style check 🧹
+          command: npm run format:check
+      - run:
+          name: Types lint 🧹
+          command: npm run types
 
   publish:
     description: Publishes the new version of the plugin to NPM

cypress/integration/filtering.js

@@ -1,4 +1,4 @@
-const { filterSpecsFromCoverage } = require('../../utils')
+const { filterSpecsFromCoverage } = require('../../support-utils')
 
 describe('minimatch', () => {
   it('string matches', () => {

cypress/integration/spec.js

@@ -3,7 +3,7 @@
 /// <reference types="Cypress" />
 
 import { add } from '../unit'
-const { fixSourcePathes } = require('../../utils')
+const { fixSourcePaths } = require('../../support-utils')
 
 context('Page test', () => {
   beforeEach(() => {
@@ -54,7 +54,7 @@ context('Unit tests', () => {
       }
     }
 
-    fixSourcePathes(coverage)
+    fixSourcePaths(coverage)
 
     expect(coverage).to.deep.eq({
       '/absolute/src/component.vue': {

package.json

@@ -15,7 +15,8 @@
     "format": "prettier --write '*.js'",
     "format:check": "prettier --check '*.js'",
     "check:markdown": "find *.md -exec npx markdown-link-check {} \\;",
-    "effective:config": "circleci config process .circleci/config.yml | sed /^#/d"
+    "effective:config": "circleci config process .circleci/config.yml | sed /^#/d",
+    "types": "tsc --noEmit --allowJs *.js cypress/integration/*.js"
   },
   "peerDependencies": {
     "cypress": "*"

support-utils.js

@@ -0,0 +1,67 @@
+// @ts-check
+// helper functions that are safe to use in the browser
+// from support.js file - no file system access
+
+/**
+ * remove coverage for the spec files themselves,
+ * only keep "external" application source file coverage
+ */
+const filterSpecsFromCoverage = (totalCoverage, config = Cypress.config) => {
+  const integrationFolder = config('integrationFolder')
+  // @ts-ignore
+  const testFilePattern = config('testFiles')
+
+  // test files chould be:
+  //  wild card string "**/*.*" (default)
+  //  wild card string "**/*spec.js"
+  //  list of wild card strings or names ["**/*spec.js", "spec-one.js"]
+  const testFilePatterns = Array.isArray(testFilePattern)
+    ? testFilePattern
+    : [testFilePattern]
+
+  const isUsingDefaultTestPattern = testFilePattern === '**/*.*'
+
+  const isTestFile = filename => {
+    const matchedPattern = testFilePatterns.some(specPattern =>
+      Cypress.minimatch(filename, specPattern)
+    )
+    const matchedEndOfPath = testFilePatterns.some(specPattern =>
+      filename.endsWith(specPattern)
+    )
+    return matchedPattern || matchedEndOfPath
+  }
+
+  const isInIntegrationFolder = filename =>
+    filename.startsWith(integrationFolder)
+
+  const isA = (fileCoverge, filename) => isInIntegrationFolder(filename)
+  const isB = (fileCoverge, filename) => isTestFile(filename)
+
+  const isTestFileFilter = isUsingDefaultTestPattern ? isA : isB
+
+  const coverage = Cypress._.omitBy(totalCoverage, isTestFileFilter)
+  return coverage
+}
+
+/**
+ * Replace source-map's path by the corresponding absolute file path
+ * (coverage report wouldn't work with source-map path being relative
+ * or containing Webpack loaders and query parameters)
+ */
+function fixSourcePaths(coverage) {
+  Object.values(coverage).forEach(file => {
+    const { path: absolutePath, inputSourceMap } = file
+    const fileName = /([^\/\\]+)$/.exec(absolutePath)[1]
+    if (!inputSourceMap || !fileName) return
+
+    if (inputSourceMap.sourceRoot) inputSourceMap.sourceRoot = ''
+    inputSourceMap.sources = inputSourceMap.sources.map(source =>
+      source.includes(fileName) ? absolutePath : source
+    )
+  })
+}
+
+module.exports = {
+  fixSourcePaths,
+  filterSpecsFromCoverage
+}

support.js

@@ -1,7 +1,7 @@
 /// <reference types="cypress" />
 // @ts-check
 
-const { filterSpecsFromCoverage } = require('./utils')
+const { filterSpecsFromCoverage } = require('./support-utils')
 
 /**
  * Sends collected code coverage object to the backend code
@@ -35,6 +35,7 @@ const logMessage = s => {
 const filterSupportFilesFromCoverage = totalCoverage => {
   const integrationFolder = Cypress.config('integrationFolder')
   const supportFile = Cypress.config('supportFile')
+  // @ts-ignore
   const supportFolder = Cypress.config('supportFolder')
 
   const isSupportFile = filename => filename === supportFile
@@ -61,12 +62,14 @@ const registerHooks = () => {
 
   const hasE2ECoverage = () => Boolean(windowCoverageObjects.length)
 
+  // @ts-ignore
   const hasUnitTestCoverage = () => Boolean(window.__coverage__)
 
   before(() => {
     // we need to reset the coverage when running
     // in the interactive mode, otherwise the counters will
     // keep increasing every time we rerun the tests
+    // @ts-ignore
     cy.task('resetCoverage', { isInteractive: Cypress.config('isInteractive') })
   })
 
@@ -133,7 +136,9 @@ const registerHooks = () => {
 
     // there might be server-side code coverage information
     // we should grab it once after all tests finish
+    // @ts-ignore
     const baseUrl = Cypress.config('baseUrl') || cy.state('window').origin
+    // @ts-ignore
     const runningEndToEndTests = baseUrl !== Cypress.config('proxyUrl')
     const specType = Cypress._.get(Cypress.spec, 'specType', 'integration')
     const isIntegrationSpec = specType === 'integration'
@@ -152,7 +157,9 @@ const registerHooks = () => {
         log: false,
         failOnStatusCode: false
       })
-        .then(r => Cypress._.get(r, 'body.coverage', null), { log: false })
+        .then(r => {
+          return Cypress._.get(r, 'body.coverage', null)
+        })
         .then(coverage => {
           if (!coverage) {
             // we did not get code coverage - this is the
@@ -171,6 +178,7 @@ const registerHooks = () => {
     // then we will have unit test coverage
     // NOTE: spec iframe is NOT reset between the tests, so we can grab
     // the coverage information only once after all tests have finished
+    // @ts-ignore
     const unitTestCoverage = window.__coverage__
     if (unitTestCoverage) {
       sendCoverage(unitTestCoverage, 'unit')

utils.js renamed to task-utils.js

@@ -1,3 +1,6 @@
+// helper functions to use from "task.js" plugins code
+// that need access to the file system
+
 // @ts-check
 /// <reference types="cypress" />
 const { readFileSync, writeFileSync, existsSync } = require('fs')
@@ -26,65 +29,6 @@ function checkAllPathsNotFound(nycFilename) {
   return allFilesAreMissing
 }
 
-/**
- * remove coverage for the spec files themselves,
- * only keep "external" application source file coverage
- */
-const filterSpecsFromCoverage = (totalCoverage, config = Cypress.config) => {
-  const integrationFolder = config('integrationFolder')
-  // @ts-ignore
-  const testFilePattern = config('testFiles')
-
-  // test files chould be:
-  //  wild card string "**/*.*" (default)
-  //  wild card string "**/*spec.js"
-  //  list of wild card strings or names ["**/*spec.js", "spec-one.js"]
-  const testFilePatterns = Array.isArray(testFilePattern)
-    ? testFilePattern
-    : [testFilePattern]
-
-  const isUsingDefaultTestPattern = testFilePattern === '**/*.*'
-
-  const isTestFile = filename => {
-    const matchedPattern = testFilePatterns.some(specPattern =>
-      Cypress.minimatch(filename, specPattern)
-    )
-    const matchedEndOfPath = testFilePatterns.some(specPattern =>
-      filename.endsWith(specPattern)
-    )
-    return matchedPattern || matchedEndOfPath
-  }
-
-  const isInIntegrationFolder = filename =>
-    filename.startsWith(integrationFolder)
-
-  const isA = (fileCoverge, filename) => isInIntegrationFolder(filename)
-  const isB = (fileCoverge, filename) => isTestFile(filename)
-
-  const isTestFileFilter = isUsingDefaultTestPattern ? isA : isB
-
-  const coverage = Cypress._.omitBy(totalCoverage, isTestFileFilter)
-  return coverage
-}
-
-/**
- * Replace source-map's path by the corresponding absolute file path
- * (coverage report wouldn't work with source-map path being relative
- * or containing Webpack loaders and query parameters)
- */
-function fixSourcePathes(coverage) {
-  Object.values(coverage).forEach(file => {
-    const { path: absolutePath, inputSourceMap } = file
-    const fileName = /([^\/\\]+)$/.exec(absolutePath)[1]
-    if (!inputSourceMap || !fileName) return
-
-    if (inputSourceMap.sourceRoot) inputSourceMap.sourceRoot = ''
-    inputSourceMap.sources = inputSourceMap.sources.map(source =>
-      source.includes(fileName) ? absolutePath : source
-    )
-  })
-}
-
 /**
  * A small debug utility to inspect paths saved in NYC output JSON file
  */
@@ -251,8 +195,6 @@ function tryFindingLocalFiles(nycFilename) {
 }
 
 module.exports = {
-  fixSourcePathes,
-  filterSpecsFromCoverage,
   showNycInfo,
   resolveRelativePaths,
   checkAllPathsNotFound,

task.js

@@ -4,12 +4,12 @@ const { join, resolve } = require('path')
 const { existsSync, mkdirSync, readFileSync, writeFileSync } = require('fs')
 const execa = require('execa')
 const {
-  fixSourcePathes,
   showNycInfo,
   resolveRelativePaths,
   checkAllPathsNotFound,
   tryFindingLocalFiles
-} = require('./utils')
+} = require('./task-utils')
+const { fixSourcePaths } = require('./support-utils')
 const NYC = require('nyc')
 
 const debug = require('debug')('code-coverage')
@@ -79,7 +79,7 @@ const tasks = {
     const coverage = JSON.parse(sentCoverage)
     debug('parsed sent coverage')
 
-    fixSourcePathes(coverage)
+    fixSourcePaths(coverage)
     const previous = existsSync(nycFilename)
       ? JSON.parse(readFileSync(nycFilename, 'utf8'))
       : istanbul.createCoverageMap({})