Cypress + @chromatic-com/cypress/support causes error

Hi,

I'm facing a problem when I am using Cypress with Chromatic -> When I run my tests, I'm facing this error (It appends randomly in the testing process)

@epsor/tests-e2e:test: Your configFile threw an error from: cypress.config.js
@epsor/tests-e2e:test: 
@epsor/tests-e2e:test: We stopped running your tests because your config file crashed.
@epsor/tests-e2e:test: 
@epsor/tests-e2e:test: TypeError: The first argument must be of type string or an instance of Buffer, ArrayBuffer, or Array or an Array-like Object. Received undefined
@epsor/tests-e2e:test:     at Function.from (node:buffer:319:9)
@epsor/tests-e2e:test:     at /Users/alex/Prog/front/node_modules/.pnpm/@chromatic-com+cypress@0.6.12_@babel+preset-env@7.24.6_@babel+core@7.24.6__@types+react-dom@1_ohmygoonbkdwhlsd37lzp72gmq/node_modules/@chromatic-com/cypress/dist/index.js:16:47176
@epsor/tests-e2e:test:     at Array.map (<anonymous>)
@epsor/tests-e2e:test:     at writeArchives (/Users/alex/Prog/front/node_modules/.pnpm/@chromatic-com+cypress@0.6.12_@babel+preset-env@7.24.6_@babel+core@7.24.6__@types+react-dom@1_ohmygoonbkdwhlsd37lzp72gmq/node_modules/@chromatic-com/cypress/dist/index.js:16:47142)
@epsor/tests-e2e:test:     at /Users/alex/Prog/front/node_modules/.pnpm/@chromatic-com+cypress@0.6.12_@babel+preset-env@7.24.6_@babel+core@7.24.6__@types+react-dom@1_ohmygoonbkdwhlsd37lzp72gmq/node_modules/@chromatic-com/cypress/dist/index.js:16:47715
@epsor/tests-e2e:test:     at new Promise (<anonymous>)
@epsor/tests-e2e:test:     at saveArchives (/Users/alex/Prog/front/node_modules/.pnpm/@chromatic-com+cypress@0.6.12_@babel+preset-env@7.24.6_@babel+core@7.24.6__@types+react-dom@1_ohmygoonbkdwhlsd37lzp72gmq/node_modules/@chromatic-com/cypress/dist/index.js:16:47700)
@epsor/tests-e2e:test:     at prepareArchives (/Users/alex/Prog/front/node_modules/.pnpm/@chromatic-com+cypress@0.6.12_@babel+preset-env@7.24.6_@babel+core@7.24.6__@types+react-dom@1_ohmygoonbkdwhlsd37lzp72gmq/node_modules/@chromatic-com/cypress/dist/index.js:16:47904)
@epsor/tests-e2e:test:     at invoke (/Users/alex/Library/Caches/Cypress/13.10.0/Cypress.app/Contents/Resources/app/packages/server/lib/plugins/child/run_plugins.js:248:16)
@epsor/tests-e2e:test:     at /Users/alex/Library/Caches/Cypress/13.10.0/Cypress.app/Contents/Resources/app/packages/server/lib/plugins/util.js:59:14
@epsor/tests-e2e:test:     at tryCatcher (/Users/alex/Library/Caches/Cypress/13.10.0/Cypress.app/Contents/Resources/app/node_modules/bluebird/js/release/util.js:16:23)
@epsor/tests-e2e:test:     at Function.Promise.attempt.Promise.try (/Users/alex/Library/Caches/Cypress/13.10.0/Cypress.app/Contents/Resources/app/node_modules/bluebird/js/release/method.js:39:29)
@epsor/tests-e2e:test:     at Object.wrapChildPromise (/Users/alex/Library/Caches/Cypress/13.10.0/Cypress.app/Contents/Resources/app/packages/server/lib/plugins/util.js:58:23)
@epsor/tests-e2e:test:     at RunPlugins.taskExecute (/Users/alex/Library/Caches/Cypress/13.10.0/Cypress.app/Contents/Resources/app/packages/server/lib/plugins/child/run_plugins.js:254:10)
@epsor/tests-e2e:test:     at RunPlugins.execute (/Users/alex/Library/Caches/Cypress/13.10.0/Cypress.app/Contents/Resources/app/packages/server/lib/plugins/child/run_plugins.js:166:21)
@epsor/tests-e2e:test:     at EventEmitter.<anonymous> (/Users/alex/Library/Caches/Cypress/13.10.0/Cypress.app/Contents/Resources/app/packages/server/lib/plugins/child/run_plugins.js:56:12)
@epsor/tests-e2e:test:     at EventEmitter.emit (node:events:519:28)
@epsor/tests-e2e:test:     at EventEmitter.emit (node:domain:488:12)
@epsor/tests-e2e:test:     at process.<anonymous> (/Users/alex/Library/Caches/Cypress/13.10.0/Cypress.app/Contents/Resources/app/packages/server/lib/plugins/util.js:33:22)
@epsor/tests-e2e:test:     at process.emit (node:events:519:28)
@epsor/tests-e2e:test:     at process.emit (node:domain:488:12)
@epsor/tests-e2e:test:     at process.emit.sharedData.processEmitHook.installedValue [as emit] (/Users/alex/Library/Caches/Cypress/13.10.0/Cypress.app/Contents/Resources/app/node_modules/@cspotcode/source-map-support/source-map-support.js:745:40)
@epsor/tests-e2e:test:     ...Finishing writing to cache...                                                                                               
                       employee-interface:start:     ...Finishing writing to cache...

I tried many things, but when I remove import '@chromatic-com/cypress/support' from my e2e.ts file, I am not facing the error anymore 👌 (But this line is needed ofc)

I am running Cypress using this command : ELECTRON_EXTRA_LAUNCH_ARGS=--remote-debugging-port=9222 cypress run

And here my cypress.config.ts file (I am using Typescript for this file, I tried JS but this not solving the issue) :

import { defineConfig } from 'cypress'
import createBundler from '@bahmutov/cypress-esbuild-preprocessor'
import { addCucumberPreprocessorPlugin } from '@badeball/cypress-cucumber-preprocessor'
import { createEsbuildPlugin } from '@badeball/cypress-cucumber-preprocessor/esbuild'
import { installPlugin } from '@chromatic-com/cypress'
// cypress.config.js

export default defineConfig({
  e2e: {
    specPattern: '**/*.feature',
    baseUrl: 'http://localhost:3000',
    retries: 2,
    screenshotOnRunFailure: false,
    async setupNodeEvents(on, config) {
      await addCucumberPreprocessorPlugin(on, config)
      installPlugin(on, config)
      on(
        'file:preprocessor',
        createBundler({
          plugins: [createEsbuildPlugin(config)],
        })
      )
      return config
    },
  },
})

Any ideas ? Thanks a lot for your help 💪

Running into this same issue preventing us from setting up chromatic with Cypress. Hunting down a fix...

We can reproduce this locally on our development environment.

import {installPlugin} from '@chromatic-com/cypress';
import {defineConfig} from 'cypress';

export default defineConfig({
  env: {
    disableAutoSnapshot: true, // was testing to see if autoSnapshot was an issue
  },
  reporterOptions: {
    mochaFile: 'test-results/cypress/results.xml',
  },
  requestTimeout: 10000,
  chromeWebSecurity: false,
  trashAssetsBeforeRuns: true,
  video: true,
  e2e: {
    setupNodeEvents(on, config) {
      installPlugin(on, config);

    },
    baseUrl: 'https://127.0.0.1:8080',
  },
  component: {
    devServer: {
      framework: 'react',
      bundler: 'vite',
    },
  },
});

At random intervals of test passes this error pops up:


Your configFile threw an error from: cypress.config.js

We stopped running your tests because your config file crashed.

TypeError: The first argument must be of type string or an instance of Buffer, ArrayBuffer, or Array or an Array-like Object. Received undefined
    at Function.from (node:buffer:319:9)
    at /Users/joshuaweaver/Work/teamgantt-web-client/node_modules/@chromatic-com/cypress/dist/index.js:16:47176
    at Array.map (<anonymous>)
    at writeArchives (/Users/joshuaweaver/Work/teamgantt-web-client/node_modules/@chromatic-com/cypress/dist/index.js:16:47142)
    at /Users/joshuaweaver/Work/teamgantt-web-client/node_modules/@chromatic-com/cypress/dist/index.js:16:47715
    at new Promise (<anonymous>)
    at saveArchives (/Users/joshuaweaver/Work/teamgantt-web-client/node_modules/@chromatic-com/cypress/dist/index.js:16:47700)
    at prepareArchives (/Users/joshuaweaver/Work/teamgantt-web-client/node_modules/@chromatic-com/cypress/dist/index.js:16:47904)
    at invoke (/Users/joshuaweaver/Library/Caches/Cypress/13.6.6/Cypress.app/Contents/Resources/app/packages/server/lib/plugins/child/run_plugins.js:248:16)
    at /Users/joshuaweaver/Library/Caches/Cypress/13.6.6/Cypress.app/Contents/Resources/app/packages/server/lib/plugins/util.js:59:14
    at tryCatcher (/Users/joshuaweaver/Library/Caches/Cypress/13.6.6/Cypress.app/Contents/Resources/app/node_modules/bluebird/js/release/util.js:16:23)
    at Function.Promise.attempt.Promise.try (/Users/joshuaweaver/Library/Caches/Cypress/13.6.6/Cypress.app/Contents/Resources/app/node_modules/bluebird/js/release/method.js:39:29)
    at Object.wrapChildPromise (/Users/joshuaweaver/Library/Caches/Cypress/13.6.6/Cypress.app/Contents/Resources/app/packages/server/lib/plugins/util.js:58:23)
    at RunPlugins.taskExecute (/Users/joshuaweaver/Library/Caches/Cypress/13.6.6/Cypress.app/Contents/Resources/app/packages/server/lib/plugins/child/run_plugins.js:254:10)
    at RunPlugins.execute (/Users/joshuaweaver/Library/Caches/Cypress/13.6.6/Cypress.app/Contents/Resources/app/packages/server/lib/plugins/child/run_plugins.js:166:21)
    at EventEmitter.<anonymous> (/Users/joshuaweaver/Library/Caches/Cypress/13.6.6/Cypress.app/Contents/Resources/app/packages/server/lib/plugins/child/run_plugins.js:56:12)
    at EventEmitter.emit (node:events:519:28)
    at EventEmitter.emit (node:domain:488:12)
    at process.<anonymous> (/Users/joshuaweaver/Library/Caches/Cypress/13.6.6/Cypress.app/Contents/Resources/app/packages/server/lib/plugins/util.js:33:22)
    at process.emit (node:events:519:28)
    at process.emit (node:domain:488:12)
    at process.emit.sharedData.processEmitHook.installedValue [as emit] (/Users/joshuaweaver/Library/Caches/Cypress/13.6.6/Cypress.app/Contents/Resources/app/node_modules/@cspotcode/source-map-support/source-map-support.js:745:40)
    at emit (node:internal/child_process:951:14)
    at processTicksAndRejections (node:internal/process/task_queues:83:21)

chromaui / chromatic-e2e

Cypress + @chromatic-com/cypress/support causes error #154