After the update to version 13, the component tests do not work.

[cosimogaloi]

Current behavior

After updating to version 13 of Cypress, some tests are giving me the following error.

No tests found. Cypress could not detect tests in this file.

They worked in Version 12

Desired behavior

No response

Test code to reproduce

import {defineConfig} from 'cypress';

export default defineConfig({
    e2e: {
        baseUrl: 'http://localhost:4200',
        supportFile: false,
        video: false
    },
    component: {
        devServer: {
            framework: 'angular',
            bundler: 'webpack'
        },
        specPattern: '**/*.cy.ts'
    }
});

Cypress Version

13.2.0

Node version

18.11.0

Operating System

Mac OS

Debug Logs

No response

Other

No response

[jennifer-shehane]

@cosimogaloi Could you be more specific about the last working version of Cypress? We had a webpack update towards the end of 12.x versions, and I wonder if that’s impacting this. We haven’t had much in 13 that would affect this to my knowledge.

[cosimogaloi]

This is how it works

"cypress": "12.17.4",
` "dependencies": {
        "@angular/common": "^16.2.7",
        "@angular/core": "^16.2.7",
        "@angular/forms": "^16.2.7",
        "@angular/platform-browser": "^16.2.7",
        "@angular/platform-browser-dynamic": "^16.2.7",
        "@angular/router": "^16.2.7",
        "@angular/service-worker": "^16.2.7",
        "@capacitor/app": "5.0.6",
        "@capacitor/core": "5.4.2",
        "@capacitor/haptics": "5.0.6",
        "@capacitor/keyboard": "5.0.6",
        "@capacitor/status-bar": "5.0.6",
        "@ionic/angular": "7.4.3",
        "@ionic/angular-server": "7.4.3",
        "@ionic/cli": "7.1.1",
        "@ionic/storage-angular": "4.0.0",
        "rxjs": "7.8.1",
        "tslib": "^2.6.2",
        "zone.js": "~0.13.3"
    },
    "devDependencies": {
        "@angular-devkit/build-angular": "16.2.4",
        "@angular-eslint/builder": "16.2.0",
        "@angular-eslint/eslint-plugin": "16.2.0",
        "@angular-eslint/eslint-plugin-template": "16.2.0",
        "@angular-eslint/schematics": "16.2.0",
        "@angular-eslint/template-parser": "16.2.0",
        "@angular/cli": "^16.2.4",
        "@angular/compiler": "^16.2.7",
        "@angular/compiler-cli": "^16.2.7",
        "@angular/language-service": "^16.2.7",
        "@angular/localize": "16.2.7",
        "@capacitor/cli": "5.4.2",
        "@cypress/schematic": "2.5.1",
        "@ionic/angular-toolkit": "10.0.0",
        "@types/jasmine": "~4.3.5",
        "@types/jasminewd2": "~2.0.10",
        "@types/node": "20.8.2",
        "@typescript-eslint/eslint-plugin": "6.7.4",
        "@typescript-eslint/parser": "6.7.4",
        "cypress": "12.17.4",
        "eslint": "^8.48.0",
        "eslint-plugin-autofix": "1.1.0",
        "eslint-plugin-import": "2.28.1",
        "eslint-plugin-jsdoc": "46.8.2",
        "eslint-plugin-prefer-arrow": "1.2.3",
        "firebase-tools": "12.6.1",
        "http-server": "14.1.1",
        "jasmine-core": "~5.1.1",
        "jasmine-spec-reporter": "~7.0.0",
        "karma": "~6.4.2",
        "karma-chrome-launcher": "3.2.0",
        "karma-coverage": "~2.2.1",
        "karma-coverage-istanbul-reporter": "~3.0.3",
        "karma-jasmine": "~5.1.0",
        "karma-jasmine-html-reporter": "^2.1.0",
        "leasot": "13.3.0",
        "npm-check-updates": "16.14.4",
        "prettier": "3.0.3",
        "rimraf": "5.0.5",
        "stylelint": "15.10.3",
        "stylelint-config-prettier-scss": "1.0.0",
        "stylelint-config-standard-scss": "11.0.0",
        "stylelint-order": "6.0.3",
        "stylelint-prettier": "4.0.2",
        "ts-node": "~10.9.1",
        "typescript": "~5.0.4",
        "wait-on": "7.0.1"
    },

[jennifer-shehane]

@cosimogaloi Are you saying that Cypress 12.17.4 works? But 13.0.0 is broken?

[cosimogaloi]

Exactly the same test, I'm just updating the Cypress to version 13.

I also did a npm cache clean and a cypress cache clean. I can't explain it.

[tomdglenn91]

Also getting this with Cypress 13, but also with some later versions of 12. Mac OS and Node18 too. I will try 12.17.4 to see if that lines up with @cosimogaloi

[tomdglenn91]

After checking, I still don't get my spec files found.

We searched for specs matching this glob pattern:

  > /Users/<user>/code/projects/<project>/apps/<app_name>/src/**/*.cy.js

Using the following config:

component: {
    devServer: {
      bundler: 'webpack',
      framework: 'react',
      webpackConfig: require('../webpack.common.js'),
    },

I am wondering if there are things in my webpack or tsconfig that I need to be cautious of? Does webpack need to know about the .cy files, and cypress reads them from the web server rather than the file system?

[cosimogaloi]

I found the problem with the route for the test src/app/+auth/* doesn't work for me if I change the route to src/app/auth/* it works

So if I remove the "+" in the route, all the tests work

@jennifer-shehane I understand that this is a bug or did I configure something wrong?

[jennifer-shehane]

@cosimogaloi Sounds like we're getting closer, I have a few questions to clarify:

• Could you specify where in your code this file is with the + character? Is this in the source code?
• Did you try 12.17.4 version to see if it works or does not work in that version? That would help narrow down the issue
• Can you provide a repo of code that recreates the issue with the + character?

Thanks.

[cosimogaloi]

I can't promote the code, unfortunately, but I can provide you with the path.

src/app/+auth/login/auth-login-form/auth-login-form.cy.ts In that case, the + is in the name of a folder +auth.

In version 12.17.4, it works, and after installing any version of 13.x, it no longer works.

[ShellyDCMS]

I also experienced the same problem. updating node version fixed it. @cosimogaloi , what node version (node -v) are you using? It should be 18 or greater.

[cosimogaloi]

My version is 18.11 but thanks for the input.

[KarineBrandelli]

Same issue here! Updated from 12.17.4 to 13.5.0 and the tests are 'not found'.

I'm using React + Webpack and Node 18.12.1.

I'm also using @badeball/cypress-cucumber-preprocessor and my cypress.config.ts looks like this:

import { defineConfig } from 'cypress'
import type * as Webpack from 'webpack'
import { devServer } from '@cypress/webpack-dev-server'
import { addCucumberPreprocessorPlugin } from '@badeball/cypress-cucumber-preprocessor'

const webpackConfig = (
  cypressConfig: Cypress.PluginConfigOptions
): Webpack.Configuration => {
  return {
    resolve: {
      extensions: ['.tsx', '.jsx', '.ts', '.js']
    },
    module: {
      rules: [
        {
          test: /\.tsx?$/,
          exclude: [/node_modules/],
          use: [
            {
              loader: 'ts-loader',
              options: { transpileOnly: true }
            }
          ]
        },
        {
          test: /\.ts$/,
          exclude: [/node_modules/],
          use: [
            {
              loader: 'babel-loader'
            }
          ]
        },
        {
          test: /\.feature$/,
          use: [
            {
              loader: '@badeball/cypress-cucumber-preprocessor/webpack',
              options: cypressConfig
            }
          ]
        }
      ]
    }
  }
}

export default defineConfig({
  component: {
    specPattern: './cypress/integration/**/*.feature',
    devServer(devServerConfig) {
      return devServer({
        ...devServerConfig,
        framework: 'react',
        webpackConfig: webpackConfig(devServerConfig.cypressConfig)
      })
    },
    async setupNodeEvents(on, config) {
      await addCucumberPreprocessorPlugin(on, config)

      return config
    },
    env: {
      codeCoverage: {
        exclude: ['cypress/**/*.*']
      },
      TAGS: '@focus'
    }
  }
})

My tests are in my cypress/integration folder

@jennifer-shehane any thoughts? 🥲

[rexizam]

I'm facing the same problem with Cypress v13.6.0, NX v16.9.1, Node v18 and rspack core v0.3.14

Here is my cypress config:

component: {
    supportFile: "cypress/support/index.ts",
    specPattern: "**/*.component-test.{ts,tsx}",
    experimentalSingleTabRunMode: false,
    defaultCommandTimeout: 10000,
    devServer: {
      framework: "react",
      bundler: "webpack",
    },
    setupNodeEvents(on, config) {
      failFast(on, config);

      config.env.GRAPHQL_SCHEMA = schema;
      return config;
    },
  },

rspack server configuration:

devServer: {
      allowedHosts: "all",
      historyApiFallback: true,
      port: PORT,
      hot: true,
      client: {
        overlay: false,
      },
    },
    mode: "development",
    devtool: "source-map",
    module: {
      rules: [
        {
          test: /\.tsx?$/,
          exclude: /(node_modules)/,
          use: {
            loader: "swc-loader",
            options: {
              jsc: {
                transform: {
                  react: {
                    runtime: "automatic",
                  },
                },
                paths: {
                  "@instrument-ui": [`${root}/apps/instrument-ui`],
                  "@packages/*": [`${root}/packages/*`],
                },
                parser: {
                  syntax: "typescript",
                  tsx: true,
                },
                baseUrl: root,
              },
            },
          },
        },
      ],
    },
    plugins: [new DotenvPlugin({ path: `${root}/apps/instrument-ui/.env`, systemvars: true }), new NodePolyfill()],
    resolve: {
      extensions: [".ts", ".tsx", ".mjs", ".js", ".jsx"],
      tsConfigPath: `${root}/tsconfig.base.json`,
      fallback: {
        path: false,
      },
    },

When I run the tests with webpack v5.88.2 everything works fine.

[xfsnowind]

I'm facing the same problem with Cypress v13.6.0, NX v16.9.1, Node v18 and rspack core v0.3.14

Here is my cypress config:

component: {
    supportFile: "cypress/support/index.ts",
    specPattern: "**/*.component-test.{ts,tsx}",
    experimentalSingleTabRunMode: false,
    defaultCommandTimeout: 10000,
    devServer: {
      framework: "react",
      bundler: "webpack",
    },
    setupNodeEvents(on, config) {
      failFast(on, config);

      config.env.GRAPHQL_SCHEMA = schema;
      return config;
    },
  },

rspack server configuration:

devServer: {
      allowedHosts: "all",
      historyApiFallback: true,
      port: PORT,
      hot: true,
      client: {
        overlay: false,
      },
    },
    mode: "development",
    devtool: "source-map",
    module: {
      rules: [
        {
          test: /\.tsx?$/,
          exclude: /(node_modules)/,
          use: {
            loader: "swc-loader",
            options: {
              jsc: {
                transform: {
                  react: {
                    runtime: "automatic",
                  },
                },
                paths: {
                  "@instrument-ui": [`${root}/apps/instrument-ui`],
                  "@packages/*": [`${root}/packages/*`],
                },
                parser: {
                  syntax: "typescript",
                  tsx: true,
                },
                baseUrl: root,
              },
            },
          },
        },
      ],
    },
    plugins: [new DotenvPlugin({ path: `${root}/apps/instrument-ui/.env`, systemvars: true }), new NodePolyfill()],
    resolve: {
      extensions: [".ts", ".tsx", ".mjs", ".js", ".jsx"],
      tsConfigPath: `${root}/tsconfig.base.json`,
      fallback: {
        path: false,
      },
    },

When I run the tests with webpack v5.88.2 everything works fine.

@rexizam I had similar config with you, Cypress 13.0.0, Nx 16.0.3, Rspack 0.3.14 and cypress-rspack-dev-server 0.0.3. Everything works on Cypress 12.17.4, but got this No tests found after upgrading to 13.0.0

[jordanpowell88]

@cosimogaloi can you create an example repo? I'd love to take a look at this

[xfsnowind]

I found the reason of this no tests found here, it can be fixed by this commit of cypress/webpack-dev-server of this new loader. For rspack, with the dev-server cypress-rspack-dev-server, old and new loader are both applied: https://github.com/th3fallen/cypress-rspack-dev-server/blob/5165ecb220afc4489d5ef72ef0a4eb582fe01cc1/src/loader.ts#L27

[rexizam]

I found the reason of this no tests found here, it can be fixed by this commit of cypress/webpack-dev-server of this new loader. For rspack, with the dev-server cypress-rspack-dev-server, old and new loader are both applied: https://github.com/th3fallen/cypress-rspack-dev-server/blob/5165ecb220afc4489d5ef72ef0a4eb582fe01cc1/src/loader.ts#L27

Can you publish the updated version of cypress-rspack-dev-server on npm please ? 🙂

[xfsnowind]

I found the reason of this no tests found here, it can be fixed by this commit of cypress/webpack-dev-server of this new loader. For rspack, with the dev-server cypress-rspack-dev-server, old and new loader are both applied: https://github.com/th3fallen/cypress-rspack-dev-server/blob/5165ecb220afc4489d5ef72ef0a4eb582fe01cc1/src/loader.ts#L27

Can you publish the updated version of cypress-rspack-dev-server on npm please ? 🙂

Yes, done

[cypress-app-bot]

This issue has not had any activity in 180 days. Cypress evolves quickly and the reported behavior should be tested on the latest version of Cypress to verify the behavior is still occurring. It will be closed in 14 days if no updates are provided.

[cypress-app-bot]

This issue has been closed due to inactivity.