feat: support specPattern, deprecate integrationFolder and componentF…

…older (#19319) * use new specPattern API * remove projectApi.findSpecs * do not require integration folder * support --spec * support --spec * remove old code * remove old code * nuke old code * no appvetor * update * correct url for ct * work on migrating launchpad * update ct spec url * types * types * dead code * remove old endpiont * revert back circle.yml * update missing config * delete spec util * update config * update config * config again * update spec pattern * updated vue config * update spec pattern for ui components * update config for vite dev server * update snapshots * update config * update design system config * fix spec pattern in reporter * update default * update deprecated spec snapshots * update system tests * update run mode output * revert changes * lint * remove scaffold tests * update angular * fix CT * update circle yml * fix system tests for ct * fix tests * work on server unit tests * patch package * patch package again * update test * try not to rely on config async loading too much * normalize specPattern to array * update snapshot * use base name * deal with react-scripts later * update snapshot * hacky way to update snapshots * new hack to update snapshots * trying again * hacky fix * ci: snapshots * ci: snapshots * snapshots * mas updates * update spec API * fix test * fix test * update * update test * fix test * update plugin * update spec * webpack optinos * Update launchpad tests * fix screenshot paths * updated snapshot * change pattern * guard * fix smoke test * patch code coverage * update percy config * fix specs * try updating example project * update snapshots * remove old test * remove snapshot hack * add back appveyor * remove old code * update snapshot * Fix tests * wip * revert snapshot * reverted all snaps * remove only * remove commnet * remove old code * reverted file * lint * revert video compression spec * update snapshot * update spec path logic * update snap * updated snap * snaps * snaps * fix spec * rename ignoreTestFiles to ignoreSpecPattern * update screenshot dir for runner-ct * update deprecations * update * upate * fix test * update snaps * update snap * updating snap * added missing snaps * updated cypress run mode integration spec * electron snapshot * ensure newly scaffold specs are cached * fix launchpad spec * types * update test * transpile based on spec pattern * add back example * remove unnecessary async and nodeVersion * removed old test * update spec pattern and add defensive check around platform * remove unused feature flag * added tests * fix react example * update test * update config * fix spec finding in run mode * fix tests * fixing specs * fix switching between specs * remove invalid test * increase timeout Co-authored-by: estrada9166 <estrada9166@hotmail.com>
cypress-io · Jan 4, 2022 · 792980a · 792980a · cypress-bot · Jan 4, 2022
1 parent a744999
commit 792980a
Show file tree

Hide file tree

Showing 129 changed files with 2,415 additions and 3,664 deletions.
diff --git a/circle.yml b/circle.yml
@@ -1882,46 +1882,6 @@ jobs:
             echo "console.log('hello world')" > hello.ts
             npx tsc hello.ts --noEmit
 
-  # testing scaffolding examples and running them
-  # against example.cypress.io
-  test-cypress-scaffold:
-    resource_class: medium
-    parameters:
-      executor:
-        description: Executor name to use
-        type: executor
-        default: cy-doc
-      wd:
-        description: Working directory, should be OUTSIDE cypress monorepo folder
-        type: string
-        default: /root/test-scaffold
-    <<: *defaults
-    steps:
-      - restore_workspace_binaries
-      - run: mkdir <<parameters.wd>>
-      - run:
-          name: Create new NPM package ⚗️
-          working_directory: <<parameters.wd>>
-          command: npm init -y
-      - run:
-          name: Install dependencies 📦
-          working_directory: <<parameters.wd>>
-          environment:
-            CYPRESS_INSTALL_BINARY: /root/cypress/cypress.zip
-          # let's install Cypress, Jest and any other package that might conflict
-          # https://github.com/cypress-io/cypress/issues/6690
-          command: |
-            npm install /root/cypress/cypress.tgz \
-              typescript jest @types/jest enzyme @types/enzyme
-      - run:
-          name: Scaffold and test examples 🏗
-          working_directory: <<parameters.wd>>
-          environment:
-            CYPRESS_INTERNAL_FORCE_SCAFFOLD: "1"
-          command: |
-            echo 'module.exports = {}' > cypress.config.js
-            npx cypress run
-
   test-full-typescript-project:
     parameters:
       executor:
@@ -2390,9 +2350,6 @@ linux-workflow: &linux-workflow
     - test-types-cypress-and-jest:
         requires:
           - create-build-artifacts
-    - test-cypress-scaffold:
-        requires:
-          - create-build-artifacts
     - test-full-typescript-project:
         requires:
           - create-build-artifacts

diff --git a/cli/schema/cypress.schema.json b/cli/schema/cypress.schema.json
@@ -15,7 +15,7 @@
           "description": "Any values to be set as environment variables. See https://on.cypress.io/environment-variables",
           "body": {}
         },
-        "ignoreTestFiles": {
+        "ignoreSpecPattern": {
           "type": [
             "string",
             "array"

diff --git a/cli/types/cypress.d.ts b/cli/types/cypress.d.ts
@@ -2616,8 +2616,14 @@ declare namespace Cypress {
     /**
      * A String or Array of glob patterns used to ignore test files that would otherwise be shown in your list of tests. Cypress uses minimatch with the options: {dot: true, matchBase: true}. We suggest using http://globtester.com to test what files would match.
      * @default "*.hot-update.js"
+     * @deprecated use `ignoreSpecPattern` instead
      */
     ignoreTestFiles: string | string[]
+    /**
+     * A String or Array of glob patterns used to ignore test files that would otherwise be shown in your list of tests. Cypress uses minimatch with the options: {dot: true, matchBase: true}. We suggest using http://globtester.com to test what files would match.
+     * @default "*.hot-update.js"
+     */
+    ignoreSpecPattern: string | string[]
     /**
      * The number of tests for which snapshots and command data are kept in memory. Reduce this number if you are experiencing high memory consumption in your browser during a test run.
      * @default 50
@@ -2691,6 +2697,7 @@ declare namespace Cypress {
     /**
      * Path to folder containing integration test files
      * @default "cypress/integration"
+     * @deprecated
      */
     integrationFolder: string
     /**
@@ -2835,6 +2842,7 @@ declare namespace Cypress {
     blockHosts: null | string | string[]
     /**
      * Path to folder containing component test files.
+     * @deprecated
      */
     componentFolder: false | string
     /**
@@ -2848,6 +2856,12 @@ declare namespace Cypress {
     /**
      * Glob pattern to determine what test files to load.
      */
+    specPattern: string | string[]
+    /**
+     * Glob pattern to determine what test files to load.
+     *
+     * @deprecated Use `specPattern` under `component` or `e2e`
+     */
     testFiles: string | string[]
     /**
      * The user agent the browser sends in all request headers.

diff --git a/npm/angular/cypress.config.ts b/npm/angular/cypress.config.ts
@@ -7,8 +7,7 @@ export default defineConfig({
   'fileServerFolder': 'src',
   'projectId': 'nf7zag',
   'component': {
-    'componentFolder': 'src/app',
-    'testFiles': '**/*cy-spec.ts',
+    'specPattern': 'src/app/**/*cy-spec.ts',
     setupNodeEvents (on, config) {
       return require('./cypress/plugins')(on, config)
     },

diff --git a/npm/angular/package.json b/npm/angular/package.json
@@ -13,7 +13,8 @@
     "app-start": "ng serve",
     "app-build": "ng build",
     "test": "yarn cy:run",
-    "test-ci": "yarn cy:run"
+    "test-ci": "yarn cy:run",
+    "postinstall": "patch-package"
   },
   "dependencies": {
     "@cypress/mount-utils": "0.0.0-development",

diff --git a/npm/angular/patches/@cypress+code-coverage+3.9.5.patch b/npm/angular/patches/@cypress+code-coverage+3.9.5.patch
@@ -0,0 +1,45 @@
+diff --git a/node_modules/@cypress/code-coverage/support-utils.js b/node_modules/@cypress/code-coverage/support-utils.js
+index 31e00ee..0c56908 100644
+--- a/node_modules/@cypress/code-coverage/support-utils.js
++++ b/node_modules/@cypress/code-coverage/support-utils.js
+@@ -10,7 +10,7 @@ const filterSpecsFromCoverage = (totalCoverage, config = Cypress.config) => {
+   const integrationFolder = config('integrationFolder')
+   /** @type {string} Cypress run-time config has test files string pattern */
+   // @ts-ignore
+-  const testFilePattern = config('testFiles')
++  const testFilePattern = config('specPattern')
+
+   // test files chould be:
+   //  wild card string "**/*.*" (default)
+diff --git a/node_modules/@cypress/code-coverage/support.js b/node_modules/@cypress/code-coverage/support.js
+index c99ceb2..f51ce4e 100644
+--- a/node_modules/@cypress/code-coverage/support.js
++++ b/node_modules/@cypress/code-coverage/support.js
+@@ -37,7 +37,6 @@ const logMessage = (s) => {
+  * If there are more files loaded from support folder, also removes them
+  */
+ const filterSupportFilesFromCoverage = (totalCoverage) => {
+-  const integrationFolder = Cypress.config('integrationFolder')
+   const supportFile = Cypress.config('supportFile')
+
+   /** @type {string} Cypress run-time config has the support folder string */
+@@ -50,16 +49,9 @@ const filterSupportFilesFromCoverage = (totalCoverage) => {
+     isSupportFile(filename)
+   )
+
+-  // check the edge case
+-  //   if we have files from support folder AND the support folder is not same
+-  //   as the integration, or its prefix (this might remove all app source files)
+-  //   then remove all files from the support folder
+-  if (!integrationFolder.startsWith(supportFolder)) {
+-    // remove all covered files from support folder
+-    coverage = Cypress._.omitBy(totalCoverage, (fileCoverage, filename) =>
+-      filename.startsWith(supportFolder)
+-    )
+-  }
++  coverage = Cypress._.omitBy(totalCoverage, (fileCoverage, filename) =>
++    filename.startsWith(supportFolder)
++  )
+   return coverage
+ }
+
diff --git a/npm/design-system/cypress.config.js b/npm/design-system/cypress.config.js
@@ -3,17 +3,16 @@ module.exports = {
   viewportHeight: 800,
   video: false,
   projectId: 'z9dxah',
-  testFiles: '**/*spec.{js,jsx,ts,tsx}',
   env: {
     reactDevtools: true,
   },
-  ignoreTestFiles: [
+  ignoreSpecPattern: [
     '**/__snapshots__/*',
     '**/__image_snapshots__/*',
   ],
-  componentFolder: 'src',
   fixturesFolder: false,
   component: {
+    specPattern: 'src/**/*spec.{js,jsx,ts,tsx}',
     devServer (cypressConfig) {
       const { startDevServer } = require('@cypress/vite-dev-server')
 

diff --git a/npm/react/cypress.config.js b/npm/react/cypress.config.js
@@ -5,16 +5,16 @@ module.exports = {
   'viewportHeight': 400,
   'video': false,
   'projectId': 'z9dxah',
-  'testFiles': '**/*spec.{js,jsx,ts,tsx}',
   'env': {
     'reactDevtools': true,
   },
-  'ignoreTestFiles': [
+  'ignoreSpecPattern': [
     '**/__snapshots__/*',
     '**/__image_snapshots__/*',
   ],
   'experimentalFetchPolyfill': true,
   'component': {
+    'specPattern': 'cypress/component/**/*spec.{js,jsx,ts,tsx}',
     devServer (cypressConfig, devServerConfig) {
       const { startDevServer } = require('@cypress/webpack-dev-server')
       const path = require('path')

diff --git a/npm/react/examples/a11y/cypress.config.js b/npm/react/examples/a11y/cypress.config.js
@@ -1,10 +1,10 @@
 module.exports = {
   'video': false,
   'fixturesFolder': false,
-  'testFiles': '**/*spec.js',
   'viewportWidth': 500,
   'viewportHeight': 500,
   'component': {
+    'specPattern': 'cypress/component/**/*spec.js',
     setupNodeEvents (on, config) {
       // load file devServer that comes with this plugin
       // https://github.com/bahmutov/cypress-react-unit-test#install

diff --git a/npm/react/examples/craco/cypress.config.js b/npm/react/examples/craco/cypress.config.js
@@ -1,7 +1,6 @@
 module.exports = {
   'component': {
-    'testFiles': '**/*.test.{js,ts,jsx,tsx}',
-    'componentFolder': 'src',
+    'specPattern': 'cypress/component/**/*.test.{js,ts,jsx,tsx}',
     setupNodeEvents (on, config) {
       const cracoConfig = require('./craco.config.js')
       const devServer = require('@cypress/react/plugins/craco')

diff --git a/npm/react/examples/find-webpack/cypress.config.ts b/npm/react/examples/find-webpack/cypress.config.ts
@@ -4,8 +4,7 @@ export default defineConfig({
   'video': true,
   'projectId': 'jq5xpp',
   'component': {
-    'testFiles': '**/*.spec.{js,ts,jsx,tsx}',
-    'componentFolder': 'src',
+    'specPattern': 'src/**/*.spec.{js,ts,jsx,tsx}',
     devServer (cypressConfig) {
       const findReactScriptsWebpackConfig = require('@cypress/react/plugins/react-scripts/findReactScriptsWebpackConfig')
       const { startDevServer } = require('@cypress/webpack-dev-server')

diff --git a/npm/react/examples/nextjs-webpack-5/cypress.config.js b/npm/react/examples/nextjs-webpack-5/cypress.config.js
@@ -1,11 +1,10 @@
 module.exports = {
   'video': false,
-  'testFiles': '**/*.spec.{js,jsx}',
   'viewportWidth': 500,
   'viewportHeight': 800,
-  'componentFolder': 'cypress/components',
   'pluginsFile': 'cypress/plugins.js',
   'component': {
+    'specPattern': 'cypress/component/**/*.spec.{js,jsx}',
     setupNodeEvents (on, config) {
       const devServer = require('@cypress/react/plugins/next')
 

diff --git a/npm/react/examples/nextjs/cypress.config.js b/npm/react/examples/nextjs/cypress.config.js
@@ -1,14 +1,13 @@
 module.exports = {
   'video': false,
-  'testFiles': '**/*.spec.{js,jsx}',
   'viewportWidth': 500,
   'viewportHeight': 800,
   'experimentalFetchPolyfill': true,
-  'componentFolder': 'cypress/components',
   'env': {
     'coverage': true,
   },
   'component': {
+    'specPattern': 'cypress/components/**/*.spec.{js,jsx}',
     setupNodeEvents (on, config) {
       const devServer = require('@cypress/react/plugins/next')
 

diff --git a/npm/react/examples/react-scripts-folder/cypress.config.js b/npm/react/examples/react-scripts-folder/cypress.config.js
@@ -1,11 +1,10 @@
 module.exports = {
   'video': false,
   'fixturesFolder': false,
-  'testFiles': '**/*cy-spec.js',
   'viewportWidth': 500,
   'viewportHeight': 800,
-  'componentFolder': 'cypress/component',
   'component': {
+    'specPattern': 'cypress/component/**/*cy-spec.js',
     setupNodeEvents (on, config) {
       // load file devServer that comes with this plugin
       // https://github.com/bahmutov/cypress-react-unit-test#install

diff --git a/npm/react/examples/react-scripts-typescript/cypress.config.js b/npm/react/examples/react-scripts-typescript/cypress.config.js
@@ -1,10 +1,9 @@
 module.exports = {
   'video': false,
-  'testFiles': '**/*cy-spec.tsx',
   'viewportWidth': 500,
   'viewportHeight': 800,
-  'componentFolder': 'src',
   'component': {
+    'specPattern': 'src/**/*cy-spec.tsx',
     setupNodeEvents (on, config) {
       const devServer = require('@cypress/react/plugins/react-scripts')
 

diff --git a/npm/react/examples/react-scripts/cypress.config.js b/npm/react/examples/react-scripts/cypress.config.js
@@ -1,11 +1,10 @@
 module.exports = {
   'video': false,
-  'testFiles': '**/*cy-spec.js',
   'viewportWidth': 500,
   'viewportHeight': 800,
   'experimentalFetchPolyfill': true,
-  'componentFolder': 'src',
   'component': {
+    'specPattern': 'src/**/*cy-spec.js',
     setupNodeEvents (on, config) {
       // load file devServer that comes with this plugin
       // https://github.com/bahmutov/cypress-react-unit-test#install

diff --git a/npm/react/examples/sass-and-ts/cypress.config.js b/npm/react/examples/sass-and-ts/cypress.config.js
@@ -1,15 +1,13 @@
 module.exports = {
   'video': false,
   'fixturesFolder': false,
-  'testFiles': '**/*spec.*',
   'viewportWidth': 500,
   'viewportHeight': 500,
-  'componentFolder': 'src',
-  'nodeVersion': 'system',
   'env': {
     'coverage': true,
   },
   'component': {
+    'specPattern': 'src/**/*spec.*',
     setupNodeEvents (on, config) {
       // load Webpack file devServer that comes with this plugin
       // https://github.com/bahmutov/cypress-react-unit-test#install

diff --git a/npm/react/examples/snapshots/cypress.config.js b/npm/react/examples/snapshots/cypress.config.js
@@ -1,10 +1,9 @@
 module.exports = {
   'video': false,
   'fixturesFolder': false,
-  'testFiles': '**/*-spec.js',
   'viewportWidth': 500,
   'viewportHeight': 500,
-  'ignoreTestFiles': [
+  'ignoreSpecPattern': [
     '**/__snapshots__/*',
     '**/__image_snapshots__/*',
   ],
@@ -14,6 +13,7 @@ module.exports = {
     },
   },
   'component': {
+    'specPattern': 'cypress/component/**/*-spec.js',
     setupNodeEvents (on, config) {
       // load file devServer that comes with this plugin
       // https://github.com/bahmutov/cypress-react-unit-test#install

diff --git a/npm/react/examples/tailwind/cypress.config.js b/npm/react/examples/tailwind/cypress.config.js
@@ -1,14 +1,13 @@
 module.exports = {
   'video': false,
   'fixturesFolder': false,
-  'testFiles': '**/*cy-spec.js',
   'viewportWidth': 500,
   'viewportHeight': 500,
-  'componentFolder': 'src',
   'env': {
     'coverage': true,
   },
   config: {
+    'specPattern': 'src/**/*cy-spec.js',
     setupNodeEvents (on, config) {
       // load file devServer that comes with this plugin
       // https://github.com/bahmutov/cypress-react-unit-test#install

diff --git a/npm/react/examples/using-babel-typescript/cypress.config.js b/npm/react/examples/using-babel-typescript/cypress.config.js
@@ -1,11 +1,10 @@
 module.exports = {
   'video': false,
   'fixturesFolder': false,
-  'testFiles': '**/*spec.tsx',
   'viewportWidth': 500,
   'viewportHeight': 500,
-  'componentFolder': 'src',
   'component': {
+    'specPattern': 'src/**/*spec.tsx',
     setupNodeEvents (on, config) {
       // let's bundle spec files and the components they include using
       // the same bundling settings as the project by loading .babelrc

diff --git a/npm/react/examples/using-babel/cypress.config.js b/npm/react/examples/using-babel/cypress.config.js
@@ -1,11 +1,10 @@
 module.exports = {
   'video': false,
   'fixturesFolder': false,
-  'testFiles': '**/*spec.js',
   'viewportWidth': 500,
   'viewportHeight': 500,
-  'componentFolder': 'src',
   'component': {
+    'specPattern': 'src/**/*spec.js',
     setupNodeEvents (on, config) {
       // let's bundle spec files and the components they include using
       // the same bundling settings as the project by loading .babelrc