mammadataei / cypress-vite

Run Cypress specs using Vite
MIT License
88 stars 11 forks source link

Spec files not being copied to cache #70

Open marina-mosti opened 1 year ago

marina-mosti commented 1 year ago

Hello @mammadataei , thanks for your work on this amazing lib! I'm having an issue with the dreaded ENOENT problem. I've read through all the related issues but even though it seems to be somehow related to #33 and #5 it seems different enough that I think it warrants a new issue. Hope I'm wrong and its an easy fix.

I am getting the following errors:

cypress:server:controllers:spec sending spec { filePath: '/var/lib/buildkite-agent/.config/Cypress/cy/production/projects/wizard-a31bccd8e01911a6f192543af17cd61f/bundles/tests/e2e/specs/create-assignment.js' } +268ms
  cypress:server:controllers:spec preprocessor error for spec 'tests/e2e/specs/create-assignment.js': Error: ENOENT: no such file or directory, stat '/var/lib/buildkite-agent/.config/Cypress/cy/production/projects/wizard-a31bccd8e01911a6f192543af17cd61f/bundles/tests/e2e/specs/create-assignment.js' +3ms
Oops...we found an error preparing this test file:
  > tests/e2e/specs/create-assignment.js
The error was:
Error: ENOENT: no such file or directory, stat '/var/lib/buildkite-agent/.config/Cypress/cy/production/projects/wizard-a31bccd8e01911a6f192543af17cd61f/bundles/tests/e2e/specs/create-assignment.js'

After deleting cypress cache and doing a clean install, I noticed that the spec files are no longer being copied to the cypress cache where cypress is assuming it will find them for a run.

image
cypress.config.js ```js const { defineConfig } = require('cypress') const vitePreprocessor = require('cypress-vite') const path = require('path') module.exports = defineConfig({ retries: 1, defaultCommandTimeout: 8000, responseTimeout: 40000, requestTimeout: 10000, projectId: 'cqy9ir', fixturesFolder: 'tests/e2e/fixtures', screenshotsFolder: 'tests/e2e/screenshots', videosFolder: 'tests/e2e/videos', includeShadowDom: true, e2e: { setupNodeEvents (on) { on('file:preprocessor', vitePreprocessor({ configPath: path.resolve(__dirname, './vite.config.js') })) }, baseUrl: 'https://localhost.voicethread.net:3009', specPattern: 'tests/e2e/specs/**/*.{js,jsx,ts,tsx}', supportFile: 'tests/e2e/support/index.js' } }) ```
vite.config.js ```js import { defineConfig } from 'vite' import vue from '@vitejs/plugin-vue' import loadVersion from 'vite-plugin-package-version' import commonjs from '@rollup/plugin-commonjs' import { serverConfig, compilerOptions } from '../vite.global.config' const path = require('path') const aliases = require('../aliases.config.js').webpack // https://vitejs.dev/config/ export default defineConfig(({ mode }) => { return { plugins: [ loadVersion(), vue({ template: { compilerOptions: compilerOptions() } }), commonjs() ], build: { rollupOptions: { output: { entryFileNames: 'js/app.js', chunkFileNames: 'js/[name].js', // Force all assets to be named app.X, this may be an issue if we ever decide to bundle // into the build images, or other assets but we'll cross that bridge when we get to it // since leaving it at the default of [name] will make BE have to restructure a lot of things // to not collapse staging/prod assetFileNames: 'css/app.[ext]', // Disables chunking of JS manualChunks: undefined } }, commonjsOptions: { // https://github.com/vitejs/vite/issues/2679#issuecomment-994772493 include: [] }, sourcemap: true }, server: serverConfig('net'), resolve: { alias: { '@': path.resolve(__dirname, './src'), ...aliases } }, optimizeDeps: { include: [ '@root/tailwind.config.js' ] } } }) ```

Any help is dearly appreciated

marina-mosti commented 1 year ago

Definitely not stale ^^

mammadataei commented 1 year ago

@marina-mosti Indeed, it's not. I made a lot of attempts, but I couldn't identify the root cause of the issue. I would be thankful if you could assist me in reproducing or finding the source of the bug. Running Cypress in debug mode is also an option you can try.

nichita-pasecinic commented 1 year ago

@marina-mosti This is due to build.rollupOptions.output. Changes for bundle filenames breaks the cypress vite

marina-mosti commented 1 year ago

Hey @mammadataei @nichita-pasecinic thanks for the suggestions, sadly it doesn't seem that the rollup option here is the issue,since the files that arent been found are the actual tests - not the app code itself.

Regardless, I tried modifying my cypress config to not use any custom vite configuration and I keep getting the exact same error.

const { defineConfig } = require('cypress')
const vitePreprocessor = require('cypress-vite')

module.exports = defineConfig({
  chromeWebSecurity: false,
  retries: 1,
  defaultCommandTimeout: 8000,
  responseTimeout: 40000,
  requestTimeout: 10000,
  projectId: 'XXX'
  fixturesFolder: 'tests/e2e/fixtures',
  screenshotsFolder: 'tests/e2e/screenshots',
  videosFolder: 'tests/e2e/videos',
  includeShadowDom: true,
  e2e: {
    setupNodeEvents (on) {
      on('file:preprocessor', vitePreprocessor())
    },
    baseUrl: 'https://localhost:3009',
    specPattern: 'tests/e2e/specs/**/*.{js,jsx,ts,tsx}',
    supportFile: 'tests/e2e/support/index.js'
  }
})
marina-mosti commented 1 year ago

As for debug mode, I don't see anything that helps me understand the problem:

  cypress-vite User config path: undefined +0ms
GET /__/ 200 2.085 ms - -
GET /__/assets/polyfills-03994127.js 200 6.026 ms - -
GET /__/assets/index-67d8978e.css 200 1.827 ms - -
GET /__/assets/index-67d905f1.js 200 1.256 ms - -
GET /__cypress/runner/cypress_runner.css 200 1.071 ms - -
GET /__/assets/Specs-a43ec126.js 200 0.944 ms - 523
GET /__/assets/route-block-c0a8bdd8.js 200 1.337 ms - 45
GET /__/assets/InlineCodeFragment-63f519c9.css 200 4.107 ms - 310
GET /__/assets/Index-f90bad12.css 200 4.229 ms - -
GET /__/assets/TrackedBanner.vue_vue_type_script_setup_true_lang-c3989c58.js 200 1.972 ms - -
GET /__/assets/box-open_x48-ca775d1c.js 200 4.167 ms - -
GET /__/assets/InlineCodeFragment.vue_vue_type_script_setup_true_lang-6dc264c7.js 200 2.964 ms - -
GET /__/assets/SpecPatterns.vue_vue_type_script_setup_true_lang-3428020b.js 200 2.837 ms - -
GET /__/assets/Index-5fac075b.js 200 2.631 ms - -
GET /__/assets/graphql-c3480f1d.js 200 2.458 ms - 535
GET /__/assets/SpecNameDisplay.vue_vue_type_script_setup_true_lang-cdc0c0bc.js 200 2.096 ms - -
GET /__/assets/PromoHeader.vue_vue_type_script_setup_true_lang-ca4739b5.js 200 2.045 ms - -
GET /__/assets/settings_x16-41d3608c.js 200 1.635 ms - -
GET /__/assets/cypress_s-29af549a.png 200 0.625 ms - 4425
GET /__/assets/chrome-98045c79.svg 200 1.012 ms - -
GET /__/assets/electron-fb07f5cc.svg 200 1.349 ms - -
GET /__/assets/firefox-9be61e66.svg 200 0.902 ms - -
GET /__cypress/runner/cypress_runner.js 200 1.450 ms - -
GET /__/assets/Runner-ad79f59f.css 200 2.510 ms - -
GET /__/assets/Switch.vue_vue_type_script_setup_true_lang-47b3a31d.js 200 1.126 ms - -
GET /__/assets/refresh_x16-87d1364b.js 200 0.893 ms - -
GET /__/assets/Runner-a4fd72bb.js 200 0.974 ms - -
  cypress-vite Preprocessing file /Users/marina/Developer/vtfe/universal/tests/e2e/specs/thread-editor/creating-threads.e2e.js +8s
  cypress-vite Watcher for file /Users/marina/Developer/vtfe/universal/tests/e2e/specs/thread-editor/creating-threads.e2e.js cached +2ms
GET /__cypress/iframes/tests%2Fe2e%2Fspecs%2Fthread-editor%2Fcreating-threads.e2e.js?browserFamily=chromium 200 3.507 ms - -
  cypress-vite Preprocessing file /Users/marina/Developer/vtfe/universal/tests/e2e/support/index.js +43ms
  cypress-vite Watcher for file /Users/marina/Developer/vtfe/universal/tests/e2e/support/index.js cached +0ms
  cypress-vite Preprocessing file /Users/marina/Developer/vtfe/universal/tests/e2e/specs/thread-editor/creating-threads.e2e.js +1ms
ENOENT: no such file or directory, stat '/Users/marina/Library/Application Support/Cypress/cy/production/projects/universal-e4305f5ea46758e8b5632fefaead7646/bundles/tests/e2e/specs/thread-editor/creating-threads.e2e.js'
GET /__cypress/tests?p=tests/e2e/specs/thread-editor/creating-threads.e2e.js 200 224.082 ms - 330
ENOENT: no such file or directory, stat '/Users/marina/Library/Application Support/Cypress/cy/production/projects/universal-e4305f5ea46758e8b5632fefaead7646/bundles/tests/e2e/support/index.js'
nichita-pasecinic commented 1 year ago

@marina-mosti this worked for me

vitePreprocessor({
          configFile: false, // <- do not use vite app config
          mode: 'development',
          // overwrite vite specific configurations that are used in cypress tests
          resolve: {
            alias: {
              '@': resolve(__dirname, './src'),
            },
          },
        }),
marina-mosti commented 1 year ago

Amazing thanks @nichita-pasecinic that seemed to get it working 👍🏻

nichita-pasecinic commented 1 year ago

@marina-mosti I'd still keep the issue open as cypress-vite does not correctly resolve the rollupOptions from vite.config.ts

nichita-pasecinic commented 12 months ago

Hi @mammadataei will this be fixed ?

mammadataei commented 11 months ago

@nichita-pasecinic If you know the cause or solution, I would gladly fix it.

nichita-pasecinic commented 11 months ago

@mammadataei The only details I know: the build of the cypress tests has different structure because of custom vite build configuration

If vite config file has: (this creates /assets/ folder)

rollupOptions: {
        output: {
          assetFileNames: `assets/[name]-[hash]-${Date.now()}[extname]`,
          entryFileNames: `assets/[name]-[hash]-${Date.now()}.js`,
        },
      }

The cypress build (for me is at path: C:\Users\MyUser\AppData\Roaming\Cypress\cy\production\projects\project-name-d2ee9029ca9bcd7256770bba162aa729\bundles\cypress\e2e)

The content of build path is has the structure defined in application vite.config.ts (with custom /assets/ folder) - which is bad.

nichita-pasecinic commented 10 months ago

This definitely should not be closed

mammadataei commented 9 months ago

@mammadataei The only details I know: the build of the cypress tests has different structure because of custom vite build configuration

If vite config file has: (this creates /assets/ folder)

rollupOptions: {
        output: {
          assetFileNames: `assets/[name]-[hash]-${Date.now()}[extname]`,
          entryFileNames: `assets/[name]-[hash]-${Date.now()}.js`,
        },
      }

The cypress build (for me is at path: C:\Users\MyUser\AppData\Roaming\Cypress\cy\production\projects\project-name-d2ee9029ca9bcd7256770bba162aa729\bundles\cypress\e2e)

The content of build path is has the structure defined in application vite.config.ts (with custom /assets/ folder) - which is bad.

Thanks @nichita-pasecinic I think this might be a good starting point. I'll try to reproduce the error, hopefully I can find a solution.

nichita-pasecinic commented 8 months ago

@mammadataei please reopen (for sake of QAs that are waiting for it - not me though 😄 )