Error on command add

[hasanalpzengin]

Hi, it's pretty similar issue to #217 but the topic was closed. I am having the following error:

X [ERROR] Could not resolve "fs"

    node_modules/@visual-regression-tracker/agent-cypress/dist/plugin.js:13:21:
      13 │ const fs_1 = require("fs");
         ╵                      ~~~~

  The package "fs" wasn't found on the file system but is built into node. Are you trying to bundle for node? You can use "platform: 'node'" to do that, which will remove this error.

X [ERROR] Could not resolve "fs"

    node_modules/@visual-regression-tracker/sdk-js/dist/helpers/config.helper.js:4:21:
      4 │ const fs_1 = require("fs");
        ╵                      ~~~~

  The package "fs" wasn't found on the file system but is built into node. Are you trying to bundle for node? You can use "platform: 'node'" to do that, which will remove this error.

X [ERROR] Could not resolve "fs"

    node_modules/@visual-regression-tracker/sdk-js/dist/helpers/dto.helper.js:8:37:
      8 │ const fs_1 = __importDefault(require("fs"));
        ╵                                      ~~~~

  The package "fs" wasn't found on the file system but is built into node. Are you trying to bundle for node? You can use "platform: 'node'" to do that, which will remove this error.

Oops...we found an error preparing this test file:

  > cypress\support\index.ts

The error was:

Error: Build failed with 3 errors:
node_modules/@visual-regression-tracker/agent-cypress/dist/plugin.js:13:21: ERROR: Could not resolve "fs"
node_modules/@visual-regression-tracker/sdk-js/dist/helpers/config.helper.js:4:21: ERROR: Could not resolve "fs"
node_modules/@visual-regression-tracker/sdk-js/dist/helpers/dto.helper.js:8:37: ERROR: Could not resolve "fs"
    at failureErrorWithLog (C:\Users\HASAZEN\GitHub\testproject-cbportal-user-interface\node_modules\esbuild\lib\main.js:1650:15)
    at C:\Users\HASAZEN\GitHub\testproject-cbportal-user-interface\node_modules\esbuild\lib\main.js:1059:25
    at runOnEndCallbacks (C:\Users\HASAZEN\GitHub\testproject-cbportal-user-interface\node_modules\esbuild\lib\main.js:1485:45)
    at buildResponseToResult (C:\Users\HASAZEN\GitHub\testproject-cbportal-user-interface\node_modules\esbuild\lib\main.js:1057:7)
    at C:\Users\HASAZEN\GitHub\testproject-cbportal-user-interface\node_modules\esbuild\lib\main.js:1086:16
    at responseCallbacks.<computed> (C:\Users\HASAZEN\GitHub\testproject-cbportal-user-interface\node_modules\esbuild\lib\main.js:703:9)
    at handleIncomingPacket (C:\Users\HASAZEN\GitHub\testproject-cbportal-user-interface\node_modules\esbuild\lib\main.js:763:9)
    at Socket.readFromStdout (C:\Users\HASAZEN\GitHub\testproject-cbportal-user-interface\node_modules\esbuild\lib\main.js:679:7)
    at Socket.emit (node:events:513:28)
    at Socket.emit (node:domain:489:12)
    at addChunk (node:internal/streams/readable:324:12)
    at readableAddChunk (node:internal/streams/readable:297:9)
    at Socket.Readable.push (node:internal/streams/readable:234:10)

when I try to add commands to my e2e project.

Cypress version is: 13.7.3

Is this problem fixed completely with the new version ?

[pashidlos]

@hasanalpzengin chances are that it's related to major version upgrade could you reproduce it with Cypress 12 and VRT agent 5.7.0 ?

[hasanalpzengin]

I have tried Cypress 12 but not VRT agent but didn't work. Sorry for late reply. I stopped investigation after that. Thanks a lot for your help :)

[whenlit]

Hi, I had the same problem trying to use agent-cypress with esbuild. You can fix this by adding esbuild-plugins-node-modules-polyfill.

Hope this helps someone, for example someone who is trying to get this to work in Cypress + Cucumber using @badeball/cypress-cucumber-preprocessor (like me).

[TestRepo100]

Hi Whenlit, Thanks for getting the solution for this issue. Can you please guide how and where we need to use modules-polyfill.. will wait for your answer

[whenlit]

Ah yes. This is added in your cypress config file, say cypress.config.ts. I'll add a more or less complete example for cypress/cucumber:

import { defineConfig } from 'cypress';
import cypressOnFix from 'cypress-on-fix';
import createBundler from '@bahmutov/cypress-esbuild-preprocessor';
import { addCucumberPreprocessorPlugin } from '@badeball/cypress-cucumber-preprocessor';
import createEsbuildPlugin from '@badeball/cypress-cucumber-preprocessor/esbuild';
import { nodeModulesPolyfillPlugin } from 'esbuild-plugins-node-modules-polyfill';   // <--- add this

const config = {
  e2e: {
    async setupNodeEvents(cypressOn, config: Cypress.PluginConfigOptions): Promise<Cypress.PluginConfigOptions> {
      // Make sure plugins don't overwrite each other's event handlers
      const on = cypressOnFix(cypressOn);

      // Add cucumber preprocessor
      await addCucumberPreprocessorPlugin(on, config);

      on(
        file:preprocessor',
        createBundler({
          plugins: [
            nodeModulesPolyfillPlugin(),     // <--- and this
            createEsbuildPlugin(config)
          ]
        })
      );

      // Return the config object as it might have been modified by the plugin.
      return config;
    },
  }
};

export default defineConfig(config);