E2e test report generate in jest and nest.js node - node.js

Have used jest --config /path/jest-e2.json --coverage
But it's not generating any files only blank index file. Though test are running. I want to have a report of e2e test.
e2e setting
{
"moduleFileExtensions": ["js", "json", "ts"],
"rootDir": ".",
"testEnvironment": "node",
"testRegex": ".e2e-spec.ts$",
"transform": {
"^.+\\.(t|j)s$": "ts-jest"
},
"coverageDirectory": "../coverage/e2e",
"coverageReporters" : ["json", "lcov", "text", "clover"],
"coveragePathIgnorePatterns": [
".module.ts$",
".spec.ts$"
]
}

I had a similar issue generating coverage for my Ogma integration tests, it seems Jest won't collect coverage from outside the rootDir. To fix this, I set my rootDir as my project root (made the jest-integration.config.js on the same level as package.json) and told it to only collect coverage from src/**/*.ts while ignoring *.spec.ts files. Fixed the issue for me (it's a monorepo so the collectCoverageFrom structure is slightly different, but the idea is the same)

Related

Jest - SyntaxError: Cannot use import statement outside a module with #nestjs/axios

I'm just trying to run some integration tests on a nestjs app, but I'm getting the following error:
SyntaxError: Cannot use import statement outside a module
I spent a lot of time on this problem that should be easy to fix but I can't deal with it.
This problem occurs with #nestjs/axios lib which uses ESM instead of CommonJs. After doing some research, I saw that theoretically I should run the tests with this command:
yarn node --experimental-vm-modules $(yarn bin jest)
But nothing i do works
I also don't understand why this file is being matched since it is in node_modules
Can someone help me?
My Jest config:
"jest": {
"moduleFileExtensions": [
"js",
"json",
"ts"
],
"rootDir": "",
"preset": "ts-jest",
"testRegex": ".spec.ts$",
"transform": {
"^.+\\.(t|j)s$": "ts-jest"
},
"coverageDirectory": "./coverage",
"testEnvironment": "node",
"globalSetup": "<rootDir>/tests/jest.setup.ts",
"globalTeardown": "<rootDir>/tests/jest.teardown.ts"
}
My versions:
"#nestjs/axios": "^1.0.1",
"#types/jest": "^24.0.18",
"jest": "^26.0.0",
"ts-jest": "^26.5.5",
"typescript": "^4.2.3"
I've already tried putting node_modules (which is already jest's default behavior) in the transformIgnorePatterns setting, but it's not working.
The lib I'm having this error is an internal lib (node_modules/#bank/auth/node_modules/#nestjs/axios/node_modules/axios/index.js:1), could it be the reason for the problem?
This has to do with jest and ts-jest seeing the library as an ESM module due to how the package.json is set up. You should be able to add this to your jest config and have no issues.
moduleNameMapper: {
'^axios$': require.resolve('axios'),
},
This should force jest to resolve the library correctly from node_modules

Config changes not being picked up when running test coverage with Jest

I am looking for a way to exclude entire folders/files from my testing coverage with Jest. I have gone through the official Jest documentations several times, but have been unable to get it to work. I've come to the conclusion that maybe my jest.config.js isn't being picked up, because no matter what changes I make to the collectCoverageFrom or testPathIgnorePatterns fields, the test coverage return does not change, and it includes everything, even the things I am trying to exclude. Here is my test coverage script in the package.json:
"test-coverage": "npm test --config='jest.config.js' --coverage "
and here is my jest.config.js:
module.exports = {
roots: ['<rootDir>', '<rootDir>/src', '<rootDir>/tests'],
testEnvironment: 'jsdom',
testPathIgnorePatterns: ['/node_modules/'],
collectCoverage: true,
collectCoverageFrom: ['./src/**/*.{js, jsx}', '!**/node_modules/**', '!**/vendor/**'],
coverageDirectory: './coverage',
}
For the files I am excluding, I am just using this format: !src/folder/file.js as per the official jest
documentation.
Any help appreciated.
Things I did to troubleshoot:
I added the path to the Jest config into the test-coverage command, but that was unsuccessful.
I have set the collectCoverage field above to true, no success.
I added the jest config to the actual package.json, but even that
did not change anything. Here is the format for it inside my
package.json:
"jest": {
"roots": ["<rootDir>", "<rootDir>/src","<rootDir>/tests"],
"testEnvironment": "jsdom",
"testPathIgnorePatterns": ["/node_modules/"],
"collectCoverage": true,
"collectCoverageFrom": ["./src/**/*.{js,jsx}","!**/node_modules/**","!**/vendor/**"],
"coverageDirectory": "./coverage"
}

How to ignore a module in angular production build with optimisation flag set to true

I am working on an angular 8 WebRTC app in which I am using rainbow web sdk node module. The problem I have is if I build the solution with the flag --optimization=true to get the bundle size optimized; then it gives the following error.
Uncaught Error: [$injector:unpr]
http://errors.angularjs.org/1.7.5/$injector/unpr?p0=webConferenceServiceProvider%20%3C-%20webConferenceService%20%3C-%20conversationService%20%3C-%20botService%20%3C-%20connectionService%20%3C-%20rainbowSDK
But, if I set the flag --optimization=false then it works and the bundle size increases significantly which is not good for production.
The SDK is written in AngularJS 1.7.5 that I have included as a dependency on the index.html page. I had a discussion with the SDK developer and he confirmed to me that the SDK runs an angularJS app. If I use the optimization flag in my project; it mangles the module name which is why the SDK doesn't work.
He suggested not to optimize the build. But then I have a huge bundle size that is not compressed and minified.
I have tried custom webpack configuration to ignore the SDK import in production build optimization but still, the SDK gets modified and shows the same error in console while browsing the application.
Question:
What can be done to ignore the 'mangling' of rainbow-web-sdk module in ng build --prod with --optimization=true to get an optimized bundle at the output?
I have the following configuration in the angular.json file for a production build.
"build": {
"builder": "#angular-devkit/build-angular:browser",
"options": {
"outputPath": "dist",
"index": "src/index.html",
"main": "src/main.ts",
"tsConfig": "src/tsconfig.json",
"polyfills": "src/polyfills.ts",
"assets": [
"src/assets"
],
"styles": [],
"scripts": []
},
"configurations": {
"production": {
"optimization": false,
"outputHashing": "all",
"sourceMap": false,
"extractCss": true,
"namedChunks": false,
"aot": true,
"extractLicenses": true,
"vendorChunk": false,
"buildOptimizer": true,
"fileReplacements": [{
"replace": "src/environments/environment.ts",
"with": "src/environments/environment.prod.ts"
}]
}
}
}
To try out, here is a github sample angular 8 app uploaded by the sdk developer.

How to collect code coverage for spawned sub-processes using Jest?

I am writing integration tests for a CLI. All the unit tests are written using Jest as out-of-the-box it produces code coverage without any configuration, but unfortunately it does not instrument sub-processes, for example executed via Node's spawn and fork commands.
I have tried to introduce nyc into the mix as suggested in this comment on a GitHub issue however it has not worked for me.
I have played with various configurations (based on the initial aforementioned suggestion and also ideas from these issues: 1, 2), however either I get no coverage statistics at all or only coverage for my unit tests, not the integration tests that spawn sub-processes.
The relevant parts of my package.json which configures nyc and Jest:
"scripts": {
"test": "cross-env NODE_ENV=test nyc --clean jest --coverage",
},
"jest": {
"verbose": true,
"testURL": "http://localhost/",
"globalSetup": "./jest.setup.js",
"transform": {
"^.+\\.js$": "babel-jest"
},
"collectCoverage": false
},
"nyc": {
"include": [
"packages/*/src/**/*.js"
],
"reporter": [
"html"
]
},
I am using execa to run the sub-processes and do so as follows:
await execa("nyc --reporter none node", args);

Bootstrap 4 not working with Angular CLI

I've installed Bootstrap 4 using node into an Angular 2 project by following this guide:
https://github.com/angular/angular-cli/wiki/stories-include-bootstrap
Followed the instructions to the letter, but now when I try and run the application using ng serve I get compile errors.
ERROR in ./node_modules/css-loader?{"sourceMap":false,"importLoaders":1}!./node_modules/postcss-loader/lib?{"ident":"postcss","sourceMap":false}!./node_modules/bootstrap/dist/css/bootstrap.min.css
Module build failed: BrowserslistError: Unknown browser major
at error (D:\GitKracken\KnightOwlUI2018\KOWebUi\node_modules\browserslist\index.js:37:11)
at Function.browserslist.checkName (D:\GitKracken\KnightOwlUI2018\KOWebUi\node_modules\browserslist\index.js:320:18)
at Function.select (D:\GitKracken\KnightOwlUI2018\KOWebUi\node_modules\browserslist\index.js:438:37)
at D:\GitKracken\KnightOwlUI2018\KOWebUi\node_modules\browserslist\index.js:207:41
at Array.forEach (native)
at browserslist (D:\GitKracken\KnightOwlUI2018\KOWebUi\node_modules\browserslist\index.js:196:13)
at Browsers.parse (D:\GitKracken\KnightOwlUI2018\KOWebUi\node_modules\autoprefixer\lib\browsers.js:44:14)
at new Browsers (D:\GitKracken\KnightOwlUI2018\KOWebUi\node_modules\autoprefixer\lib\browsers.js:39:28)
at loadPrefixes (D:\GitKracken\KnightOwlUI2018\KOWebUi\node_modules\autoprefixer\lib\autoprefixer.js:56:18)
at plugin (D:\GitKracken\KnightOwlUI2018\KOWebUi\node_modules\autoprefixer\lib\autoprefixer.js:62:18)
at LazyResult.run (D:\GitKracken\KnightOwlUI2018\KOWebUi\node_modules\postcss-loader\node_modules\postcss\lib\lazy-result.js:277:20)
at LazyResult.asyncTick (D:\GitKracken\KnightOwlUI2018\KOWebUi\node_modules\postcss-loader\node_modules\postcss\lib\lazy-result.js:192:32)
at LazyResult.asyncTick (D:\GitKracken\KnightOwlUI2018\KOWebUi\node_modules\postcss-loader\node_modules\postcss\lib\lazy-result.js:204:22)
at LazyResult.asyncTick (D:\GitKracken\KnightOwlUI2018\KOWebUi\node_modules\postcss-loader\node_modules\postcss\lib\lazy-result.js:204:22)
at processing.Promise.then._this2.processed (D:\GitKracken\KnightOwlUI2018\KOWebUi\node_modules\postcss-loader\node_modules\postcss\lib\lazy-result.js:231:20)
at LazyResult.async (D:\GitKracken\KnightOwlUI2018\KOWebUi\node_modules\postcss-loader\node_modules\postcss\lib\lazy-result.js:228:27)
# ./node_modules/bootstrap/dist/css/bootstrap.min.css 4:14-131
# multi ./node_modules/bootstrap/dist/css/bootstrap.min.css ./src/styles.css
My apps section of my .angular-cli.json file (as far as I can see) seems ok and is the only file I changed since installing Bootstrap 4 and the physical bootstrap files are in the node modules folder. My node_modules folder is in the root of the project on the same level as the src folder just as the cli sets it up by default.
"apps": [
{
"root": "src",
"outDir": "dist",
"assets": [
"assets",
"favicon.ico"
],
"index": "index.html",
"main": "main.ts",
"polyfills": "polyfills.ts",
"test": "test.ts",
"tsconfig": "tsconfig.app.json",
"testTsconfig": "tsconfig.spec.json",
"prefix": "app",
"styles": [
"../node_modules/bootstrap/dist/css/bootstrap.min.css",
"styles.css"
],
"scripts": [],
"environmentSource": "environments/environment.ts",
"environments": {
"dev": "environments/environment.ts",
"prod": "environments/environment.prod.ts"
}
}
],
Have I missed a step somewhere? Or maybe the guide I'm ready is out of date, I'm just not sure, but this feels like it should be really simple and should just work?
Have you seen this bug report?
Basically, two main solutions I get from this:
Try with other minor versions of Bootstrap
Use Sass and import Bootstrap Sass files instead of adding Bootstrap minified CSS in angular-cli.json
Personally I copy the entire Sass code from Bootstrap Github tags into my project. This gives me more flexibility.

Resources