cypress open not working

[MartinLednarLedo]

Current behavior

Hi,

I have migrated my older project to Vite 6 and I wanted to try Cypress for e2e tests. After installing via npm i cypress --save-dev and running npx cypress open the cypress window is opened I see the loading spinner but in terminal i get

DevTools listening on ws://127.0.0.1:61172/devtools/browser/2f003097-2fcf-41b0-9a91-5717591641cc

node:internal/modules/run_main:123
    triggerUncaughtException(
    ^
TypeError [Error]: value.replace is not a function
    at normalizeSlashes (/Users/martinlednar/Library/Caches/Cypress/14.0.0/Cypress.app/Contents/Resources/app/node_modules/ts-node/dist/util.js:62:18)
    at Object.getExtendsConfigPath (/Users/martinlednar/Library/Caches/Cypress/14.0.0/Cypress.app/Contents/Resources/app/node_modules/ts-node/dist/ts-internals.js:24:54)
    at readConfig (/Users/martinlednar/Library/Caches/Cypress/14.0.0/Cypress.app/Contents/Resources/app/node_modules/ts-node/dist/configuration.js:127:64)
    at findAndReadConfig (/Users/martinlednar/Library/Caches/Cypress/14.0.0/Cypress.app/Contents/Resources/app/node_modules/ts-node/dist/configuration.js:50:84)
    at create (/Users/martinlednar/Library/Caches/Cypress/14.0.0/Cypress.app/Contents/Resources/app/node_modules/ts-node/dist/index.js:143:69)
    at register (/Users/martinlednar/Library/Caches/Cypress/14.0.0/Cypress.app/Contents/Resources/app/node_modules/ts-node/dist/index.js:124:19)
    at Object.registerAndCreateEsmHooks (/Users/martinlednar/Library/Caches/Cypress/14.0.0/Cypress.app/Contents/Resources/app/node_modules/ts-node/dist/esm.js:25:49)
    at file:///Users/martinlednar/Library/Caches/Cypress/14.0.0/Cypress.app/Contents/Resources/app/node_modules/ts-node/esm/transpile-only.mjs:8:7
    at ModuleJob.run (node:internal/modules/esm/module_job:262:25)
    at async onImport.tracePromise.__proto__ (node:internal/modules/esm/loader:482:26)

These are my dependencies

 "devDependencies": {
        "@chromatic-com/storybook": "^3.2.3",
        "@kazupon/vue-i18n-loader": "^0.5.0",
        "@riesenia/fe-configs": "^2.0.2",
        "@rollup/plugin-inject": "^5.0.5",
        "@storybook/addon-essentials": "^8.4.7",
        "@storybook/addon-interactions": "^8.4.7",
        "@storybook/addon-onboarding": "^8.4.7",
        "@storybook/blocks": "^8.4.7",
        "@storybook/test": "^8.4.7",
        "@storybook/vue3": "^8.4.7",
        "@storybook/vue3-vite": "^8.4.7",
        "@testing-library/vue": "^8.1.0",
        "@tsconfig/node22": "^22.0.0",
        "@types/axios": "^0.9.36",
        "@types/jquery": "^3.5.32",
        "@types/lodash.debounce": "^4.0.9",
        "@types/node": "^22.10.5",
        "@types/smoothscroll-polyfill": "^0.3.4",
        "@types/underscore": "^1.13.0",
        "@types/wnumb": "^1.2.3",
        "@vitejs/plugin-vue": "^5.2.1",
        "@vitest/eslint-plugin": "^1.1.25",
        "@vue/tsconfig": "^0.7.0",
        "cypress": "^14.0.0",
        "jsdom": "^26.0.0",
        "sass": "^1.39.0",
        "storybook": "^8.4.7",
        "typescript": "^5.7.2",
        "typescript-eslint": "^8.20.0",
        "vite": "5.4.11",
        "vite-plugin-checker": "^0.8.0",
        "vite-plugin-live-reload": "^3.0.4",
        "vitest": "^3.0.3",
        "vue-eslint-parser": "^9.4.3",
        "vue-loader": "^15.10.1",
        "vue-tsc": "~2.1.6"
    },
    "dependencies": {
        "axios": "^1.7.9",
        "bootstrap-multiselect": "^0.9.15",
        "bootstrap-notify": "^3.1.3",
        "easytimer.js": "^4.3.1",
        "flatpickr": "^4.6.13",
        "jquery": "~1.12.4",
        "jquery-validation": "^1.19.2",
        "lg-video": "^1.3.0",
        "lightgallery": "^1.9.0",
        "nouislider": "^15.7.1",
        "smoothscroll-polyfill": "^0.4.4",
        "sweetalert2": "^10.10.1",
        "swiper": "^8.1.4",
        "tippy.js": "^6.2.7",
        "underscore": "^1.8.3",
        "uninstall": "^0.0.0",
        "vanilla-lazyload": "^17.4.0",
        "vue": "^3.5.13",
        "vue-i18n": "^10.0.5",
        "vue-virtual-scroll-list": "^2.3.5",
        "vuex": "^4.1.0",
        "wnumb": "^1.2.0"
    }

When i tried fresh installation in my Nuxt3 apps, they are using Vite v5.4.11 the Cypress works fine. That's why I tried this version also in my project, but it didn't help.

Also I dont know if it's relevant, but in my project the installation of cypress takes signifcantly more time than in nuxt projects.

Could you suggest what am I doing wrong? Thank you very much for any help

Desired behavior

No response

Test code to reproduce

Don't have any tests and the unfortunately repo is private.

Cypress Version

14.0.0

Node version

22.7.0

Operating System

MacOS 14.7.1

Debug Logs

Other

No response

[AtofStryker]

Hi @MartinLednarLedo. Thank you for opening an issue. I have created a repository with a basic reproduction but I am unable to reproduce. Are you able to help me fill in the blanks?

[MartinLednarLedo]

Hi @AtofStryker thank you for quick response. So to provide more details about the setup, which is not IMO ordinary:

• The whole tech stack of the project is CakePHP, Typescript, Vite

What is different from your repository?

1. Package.json

• type field is set to module

2. cypress.config.ts

import { defineConfig } from "cypress";

export default defineConfig({
    e2e: {},
});

3. My vite.config.ts

/** @type {import('vite').UserConfig} */
/// <reference types="vitest/config" />

import path from "path";
import { defineConfig } from "vite";

//** PLUGINS **/ //
import vue from "@vitejs/plugin-vue";
import liveReload from "vite-plugin-live-reload";
import checker from "vite-plugin-checker";

export default defineConfig({
    plugins: [
        vue(),
        liveReload(["**/*.ctp", "**/*.php"]),
        checker({
            typescript: true,
            vueTsc: true,
            overlay: true,
            enableBuild: false,
        }),
    ],
    root: "./",
    publicDir: "public",
    appType: "mpa",
    build: {
        manifest: true,
        outDir: "webroot", // Output directory for built files
        emptyOutDir: false,
        rollupOptions: {
            input: {
                ...getImportScssFiles("resources/css"),
                ...getJsFiles("resources/js"),
            },
            output: {
                entryFileNames: nameAssets,
                assetFileNames: nameAssets,
            },
        },
    },
    css: {
        preprocessorOptions: {
            scss: {
                api: "modern-compiler",
            },
        },
    },
    server: {
        port: 3000,
    },
    resolve: {
        alias: {
            PATH_ALIASES
        },
    },
    test: { // Vitest config
        globals: true,
        environment: "jsdom",
        include: ["**/*.spec.ts"],
        setupFiles: ["./tests/unit/vitest-setup.ts"],
    },
});

4. My ts-configs

• tsconfig.base.json

{
    "extends": ["@tsconfig/node22/tsconfig.json", "@vue/tsconfig/tsconfig.dom.json"],
    "compilerOptions": {
        "baseUrl": ".",
        "esModuleInterop": true,
        "forceConsistentCasingInFileNames": true,
        "allowJs": true,
        "checkJs": false,
        "strict": true,
        "skipLibCheck": true,
        "noImplicitThis": true,
        "isolatedModules": true,
        "verbatimModuleSyntax": true,
        "resolveJsonModule": true,
        "jsx": "preserve",
        "paths": {
            ALIASES
        }
    },
    "exclude": ["./dist", "./bin", "./vendor/**/*", "./webroot", "**/*.js", "./node_modules"]
}

• tsconfig.json

{
    "extends": ["./tsconfig.base.json"],
    "compilerOptions": {
        "baseUrl": ".",
        "lib": ["ESNext", "DOM", "DOM.Iterable"],
        "types": ["node", "vite/client"]
    },
    "include": ["**/*.ts", "**/*.vue", "vite-env.d.ts", "global.d.ts", "vue-shim.d.ts"]
}

Just for the test i created new cakePHP app and installed cypress. It seems that cake is causing the cypress to download so long but cypress opened successfully so I think the error has to be caused by some of the files mentioned above.

Hope this helped to clarify some things. If you need anything else to help you dedug the issue, let my know.