Cypress and Angular: TypeError: The "paths[1]" argument must be of type string. Received an...

I recently upgraded my Angular version from 17 to 19 and my Cypress test setup broke. I use cypress-real-events and cypress-image-snapshot. Here is the error I get:

TypeError: The "paths[1]" argument must be of type string. Received an instance of Object
at validateString (node:internal/validators:162:11)
at Object.resolve (nodeath:1101:7)
at getCommonConfig (/app/node_modules/@angular-devkit/build-angular/src/tools/webpack/configs/common.js:280:24)
at async Promise.all (index 0)
at async generateWebpackConfig (/app/node_modules/@angular-devkit/build-angular/src/utils/webpack-browser-config.js:64:22)
at async generateBrowserWebpackConfigFromContext (/app/node_modules/@angular-devkit/build-angular/src/utils/webpack-browser-config.js:119:20)
at async getAngularCliWebpackConfig (/root/.cache/Cypress/13.6.4/Cypress/resources/app/node_modules/@packages/server/node_modules/@cypress/webpack-dev-server/dist/helpers/angularHandler.js:165:24)
at async angularHandler (/root/.cache/Cypress/13.6.4/Cypress/resources/app/node_modules/@packages/server/node_modules/@cypress/webpack-dev-server/dist/helpers/angularHandler.js:205:27)
at async getPreset (/root/.cache/Cypress/13.6.4/Cypress/resources/app/node_modules/@packages/server/node_modules/@cypress/webpack-dev-server/dist/devServer.js:94:20)
at async Function.devServer.create (/root/.cache/Cypress/13.6.4/Cypress/resources/app/node_modules/@packages/server/node_modules/@cypress/webpack-dev-server/dist/devServer.js:111:61)
at async /root/.cache/Cypress/13.6.4/Cypress/resources/app/node_modules/@packages/server/node_modules/@cypress/webpack-dev-server/dist/devServer.js:26:24


I'm hoping this can be fixed with a configuration change. I found this issue. Here is my cypress.config.ts:

import { addMatchImageSnapshotPlugin } from '@simonsmith/cypress-image-snapshot/plugin';

export default defineConfig({
component: {
supportFile: 'cypress/support/component.ts',
devServer: {
framework: 'angular',
bundler: 'webpack',
},
setupNodeEvents(on, config) {
on('task', {
log(message) {
console.log(message);
return null;
},
});
addMatchImageSnapshotPlugin(on);
},
specPattern: '**/*.cy.ts',
},
});


Here are my packages and versions:

"@simonsmith/cypress-image-snapshot": "^9.0.1",
"cypress": "^13.6.4",
"cypress-real-events": "^1.12.0",


Is there a way I can fix this without upgrading my packages and cypress to v14? The package cypress-image-snapshot has not been updated in awhile and it looks like cypress-real-events might be on an earlier version of cypress as well.

Continue reading...