Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Jump to bottom

Error with cypress e2e test after dependency update #78

Open
maumau27 opened this issue Oct 31, 2024 · 8 comments
Open

Error with cypress e2e test after dependency update #78

maumau27 opened this issue Oct 31, 2024 · 8 comments

Comments

@maumau27
Copy link

maumau27 commented Oct 31, 2024 •
edited by jennifer-shehane
Loading

I encountered an error when running e2e test unit after an update of a dependency.
I was using @cypress ^13.0.0; that was using @cypress/request 3.0.5 as a dependency.
Two days ago, I started having problems. I found that the dependency @cypress/request changed to 3.0.6.
And by forcing the use of @cypress/request 3.0.5, the error was fixed.
I noticed that the dependency tough-cookie changed from 4.1.3 to 5.0.0.

The error was the following:

Error: Webpack Compilation Error
Module build failed: UnhandledSchemeError: Reading from "node:url" is not handled by plugins (Unhandled scheme).
Webpack supports "data:" and "file:" URIs by default.
You may need an additional plugin to handle "node:" URIs.
    at handle (dist/my-app/node_modules/@cypress/webpack-preprocessor/dist/index.js:212:23)
    at finalCallback (dist/my-app/node_modules/webpack/lib/Compiler.js:498:32)
    at dist/my-app/node_modules/webpack/lib/Compiler.js:576:17
    at dist/my-app/node_modules/webpack/lib/HookWebpackError.js:67:2
    at Hook.eval [as callAsync] (eval at create (dist/my-app/node_modules/tapable/lib/HookCodeFactory.js:33:10), <anonymous>:6:1)
    at Hook.CALL_ASYNC_DELEGATE [as _callAsync] (dist/my-app/node_modules/tapable/lib/Hook.js:18:14)
    at Cache.storeBuildDependencies (dist/my-app/node_modules/webpack/lib/Cache.js:126:37)
    at dist/my-app/node_modules/webpack/lib/Compiler.js:572:19
    at Hook.eval [as callAsync] (eval at create (dist/my-app/node_modules/tapable/lib/HookCodeFactory.js:33:10), <anonymous>:6:1)
    at Hook.CALL_ASYNC_DELEGATE [as _callAsync] (dist/my-app/node_modules/tapable/lib/Hook.js:18:14)
    at dist/my-app/node_modules/webpack/lib/Compiler.js:568:23
    at Compiler.emitRecords (dist/my-app/node_modules/webpack/lib/Compiler.js:1044:4)
    at dist/my-app/node_modules/webpack/lib/Compiler.js:558:11
    at dist/my-app/node_modules/webpack/lib/Compiler.js:1007:14
    at Hook.eval [as callAsync] (eval at create (dist/my-app/node_modules/tapable/lib/HookCodeFactory.js:33:10), <anonymous>:6:1)
    at Hook.CALL_ASYNC_DELEGATE [as _callAsync] (dist/my-app/node_modules/tapable/lib/Hook.js:18:14)
    at dist/my-app/node_modules/webpack/lib/Compiler.js:1004:27
    at dist/my-app/node_modules/neo-async/async.js:2818:7
    at done (dist/my-app/node_modules/neo-async/async.js:3522:9)
    at Hook.eval [as callAsync] (eval at create (dist/my-app/node_modules/tapable/lib/HookCodeFactory.js:33:10), <anonymous>:6:1)
    at Hook.CALL_ASYNC_DELEGATE [as _callAsync] (dist/my-app/node_modules/tapable/lib/Hook.js:18:14)
    at dist/my-app/node_modules/webpack/lib/Compiler.js:833:33
    at dist/my-app/node_modules/graceful-fs/graceful-fs.js:143:16
    at dist/.cache/Cypress/13.0.0/Cypress/resources/app/node_modules/@packages/server/node_modules/graceful-fs/graceful-fs.js:143:16
    at dist/.cache/Cypress/13.0.0/Cypress/resources/app/node_modules/@packages/server/node_modules/graceful-fs/graceful-fs.js:143:16
    at dist/.cache/Cypress/13.0.0/Cypress/resources/app/node_modules/@packages/server/node_modules/graceful-fs/graceful-fs.js:61:14
    at FSReqCallback.oncomplete (node:fs:192:23)

My WebPack config is:

module.exports = (on, config) => {
    const webpackPreprocessor = require('@cypress/webpack-batteries-included-preprocessor');
    const webpackOptions = webpackPreprocessor.defaultOptions.webpackOptions;

    webpackOptions.module.rules.unshift({
        test: /\.m?js$/,
        resolve: {
            fullySpecified: false,
        },
        use: {
            loader: 'babel-loader',
            options: {
                plugins: ['@angular/compiler-cli/linker/babel'],
                compact: false,
                cacheDirectory: true,
            },
        },
    });

    webpackOptions.module.rules.unshift({
        test: /\.node$/,
        resolve: {
            fullySpecified: false,
        },
        use: {
            loader: 'node-loader',
        },
    });

    on(
        'file:preprocessor',
        webpackPreprocessor({
            webpackOptions: webpackOptions,
            typescript: require.resolve('typescript'),
        })
    );

    return config;
};
@MikeMcC399
Copy link

@maumau27

Could you add information about the versions of other dependencies you are using:

@angular
webpack

etc.

If the release of @cypress/request@3.0.6 is causing a breaking change, it may need to be reverted and the change re-released as @cypress/request@4.0.0 instead

@maumau27
Copy link
Author

@MikeMcC399

Here is the information.

"dependencies": {
        "@angular/animations": "^14.3.0",
        "@angular/cdk": "~14.2.7",
        "@angular/common": "^14.3.0",
        "@angular/compiler": "^14.3.0",
        "@angular/core": "^14.3.0",
        "@angular/forms": "^14.3.0",
        "@angular/localize": "^14.3.0",
        "@angular/platform-browser": "^14.3.0",
        "@angular/platform-browser-dynamic": "^14.3.0",
        "@angular/router": "^14.3.0",
        "@ng-bootstrap/ng-bootstrap": "~13.1.1",
        "@popperjs/core": "^2.10.2",
        "@swimlane/ngx-datatable": "~20.1.0",
        "angular-split": "^13.0.0",
        "bootstrap": "~5.2.0",
        "fabric": "^4.4.0",
        "ngx-color-picker": "^12.0.1",
        "ngx-mask": "^13.0.0",
        "rxjs": "^7.4.0",
        "tslib": "^2.0.0",
        "zone.js": "~0.11.4"
    },
    "devDependencies": {
        "@angular-devkit/build-angular": "~14.2.9",
        "@angular-devkit/core": "~14.2.9",
        "@angular-devkit/schematics": "~14.2.9",
        "@angular-eslint/builder": "14.0.0",
        "@angular-eslint/eslint-plugin": "14.0.0",
        "@angular-eslint/eslint-plugin-template": "14.0.0",
        "@angular-eslint/schematics": "14.0.0",
        "@angular-eslint/template-parser": "14.0.0",
        "@angular/cli": "^14.2.13",
        "@angular/compiler-cli": "^14.3.0",
        "@babel/core": "^7.24.4",
        "@babel/preset-env": "^7.24.4",
        "@cypress/webpack-batteries-included-preprocessor": "^3.0.2",
        "@cypress/webpack-preprocessor": "^5.4.4",
        "@stomp/stompjs": "^6.1.0",
        "@types/fabric": "^4.2.5",
        "@types/jasmine": "^4.0.0",
        "@types/jasminewd2": "~2.0.3",
        "@types/lodash-es": "^4.17.4",
        "@types/node": "^16.0.0",
        "@types/resize-observer-browser": "^0.1.7",
        "@types/webpack": "^5.28.0",
        "@typescript-eslint/eslint-plugin": "^6.21.0",
        "@typescript-eslint/parser": "^6.21.0",
        "angular-in-memory-web-api": "^0.14.0",
        "babel-loader": "^9.1.3",
        "codelyzer": "^6.0.0",
        "cypress": "~13.0.0",
        "electron": "22.0.0",
        "electron-builder": "24.9.1",
        "electron-reload": "^1.5.0",
        "eslint": "^7.6.0",
        "eslint-config-prettier": "^8.3.0",
        "eslint-plugin-import": "2.22.1",
        "eslint-plugin-jasmine": "^4.1.3",
        "eslint-plugin-jsdoc": "30.7.6",
        "eslint-plugin-prefer-arrow": "1.2.2",
        "eslint-plugin-prettier": "^4.0.0",
        "jasmine-core": "~5.1.1",
        "jasmine-spec-reporter": "~5.0.0",
        "jquery": "^3.5.1",
        "karma": "^6.3.16",
        "karma-chrome-launcher": "~3.1.0",
        "karma-coverage-istanbul-reporter": "~3.0.2",
        "karma-jasmine": "^4.0.0",
        "karma-jasmine-html-reporter": "^1.7.0",
        "lodash-es": "^4.17.21",
        "moment": "^2.29.1",
        "ng-mocks": "^14.12.1",
        "node-loader": "^2.0.0",
        "npm-run-all": "^4.1.5",
        "prettier": "^2.5.1",
        "prettier-plugin-organize-imports": "^2.3.4",
        "sockjs-client": "^1.6.1",
        "start-server-and-test": "^1.12.0",
        "ts-node": "~8.3.0",
        "typescript": "~4.8.4",
        "wait-on": "^5.2.1",
        "webpack": "^5.91.0"
    }

@MikeMcC399
Copy link

@maumau27

Thanks for the version information! It seems you are using Angular 14, for example "@angular/core": "^14.3.0"

According to https://angular.dev/reference/releases#actively-supported-versions

Angular versions v2 to v15 are no longer supported.

I'm looking to see if the issue is reproducible using supported versions of Angular.

@maumau27
Copy link
Author

@MikeMcC399

Thanks for looking into it.
I will update the Angular version in the future.
In the mean time, I'm using version 3.0.5 of @cypress/request.
In case you re-release the version, I can revert that change.

@MikeMcC399
Copy link

@maumau27

Thanks for looking into it. I will update the Angular version in the future.

Good idea!

(Unrelated, but I also notice that you're using an unsupported version ESLint v7, where currently ESLint v9 is the minimum.)

In the mean time, I'm using version 3.0.5 of @cypress/request.

Also good!

In case you re-release the version, I can revert that change.

I can't speak for the Cypress.io team who own the package, as I'm external. I guess it will depend if there are significant compatibility issues reported by other users with supported dependencies. The update resolved a deprecation issue, so it was a necessary step forward. Anyway it is good that you reported your issue!

@maumau27
Copy link
Author

@MikeMcC399

Thanks for the support.

(Unrelated, but I also notice that you're using an unsupported version ESLint v7, where currently ESLint v9 is the minimum.)

I will be looking into that. Thanks for the notice.

I can't speak for the Cypress.io team who own the package, as I'm external. I guess it will depend if there are significant compatibility issues reported by other users with supported dependencies. The update resolved a deprecation issue, so it was a necessary step forward. Anyway it is good that you reported your issue!

Okay, I will be monoriting to see if there are any changes to the version.
Did you manage to reproduce the error in a supported version of angular?

Thanks again for the quick response.

@MikeMcC399
Copy link

@maumau27

Could you please say which version of Node.js you are using? Note that Cypress is aligned with Node.js releases and needs a minimum Node.js 18.x

According to https://angular.dev/reference/versions#unsupported-angular-versions Angular 14 needs Node.js 14 or 16 and these are no longer supported by Cypress.

@maumau27
Copy link
Author

@MikeMcC399

I'm using node 16.18.1.

According to https://angular.dev/reference/versions#unsupported-angular-versions Angular 14 needs Node.js 14 or 16 and these are no longer supported by Cypress.

I see, that's okay. Until I make the upgrade to a newer version of Angular, I can use the fixed version of @cypress/resources.
I wanted to report the issue just in case.

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Assignees
No one assigned
Labels
None yet
Projects
None yet
Milestone
No milestone
Development

No branches or pull requests
2 participants
@maumau27 @MikeMcC399