Tests are passing, coverage is not showing - babeljs

I'm trying to get nyc ava and babel to all place nice together. I was having an issue where async / await branches were showing as not covered, so this was working, I'm having trouble integrating the babel-plugin-istanbul plugin for tests.
I have two files in the project, src/index.js and src/test.js.
{
"name": "example",
"version": "1.0.0",
"description": "",
"main": "index.js",
"scripts": {
"test": "ava",
"coverage": "NODE_ENV=test nyc npm run test",
"report": "nyc report --reporter=html",
"report:open": "open ./coverage/index.html",
"cover": "npm run coverage && npm run report && npm run report:open"
},
"keywords": [],
"author": "",
"license": "ISC",
"dependencies": {
"babel-runtime": "^6.26.0",
"bluebird": "^3.5.0",
"lodash": "^4.17.4"
},
"devDependencies": {
"ava": "^0.22.0",
"babel-cli": "^6.26.0",
"babel-plugin-istanbul": "^4.1.4",
"babel-plugin-transform-runtime": "^6.23.0",
"babel-preset-env": "^1.6.0",
"babel-register": "^6.26.0",
"nyc": "^11.2.1",
"sinon": "^3.2.1",
"testdouble": "^3.2.4"
},
"babel": {
"presets": ["env"],
"plugins": ["transform-runtime"],
"env": {
"test": {
"plugins": ["istanbul"]
}
}
},
"ava": {
"require": ["babel-register"],
"babel": "inherit"
},
"nyc": {
"sourceMap": false,
"instrument": false
}
}
Here's whats running:
> example#1.0.0 coverage /Users/me/Desktop/example
> NODE_ENV=test nyc npm run test
> example#1.0.0 test /Users/me/Desktop/example
> ava
11 passed
----------|----------|----------|----------|----------|----------------|
File | % Stmts | % Branch | % Funcs | % Lines |Uncovered Lines |
----------|----------|----------|----------|----------|----------------|
All files | Unknown | Unknown | Unknown | Unknown | |
----------|----------|----------|----------|----------|----------------|
> example#1.0.0 report /Users/me/Desktop/example
> nyc report --reporter=html
> example#1.0.0 report:open /Users/em/Desktop/example
> open ./coverage/index.html
Why isn't src/index.js showing in the coverage?

Try to move test.js under some test folder test/test.js

Related

Why No Matching Commands when I init my first vscode extension?

I init my first vscode extension following this page.
Here is my steps:
npm install -g yo generator-code
yo code
And here is the package.json generated:
{
"name": "helloworld",
"displayName": "helloworld",
"description": "description helloworld",
"version": "0.0.1",
"engines": {
"vscode": "^1.72.0"
},
"categories": [
"Other"
],
"activationEvents": [
"onCommand:helloworld.helloWorld"
],
"main": "./out/extension.js",
"contributes": {
"commands": [
{
"command": "helloworld.helloWorld",
"title": "Hello World"
}
]
},
"scripts": {
"vscode:prepublish": "npm run compile",
"compile": "tsc -p ./",
"watch": "tsc -watch -p ./",
"pretest": "npm run compile && npm run lint",
"lint": "eslint src --ext ts",
"test": "node ./out/test/runTest.js"
},
"devDependencies": {
"#types/glob": "^8.0.0",
"#types/mocha": "^10.0.0",
"#types/node": "16.x",
"#types/vscode": "^1.72.0",
"#typescript-eslint/eslint-plugin": "^5.38.1",
"#typescript-eslint/parser": "^5.38.1",
"#vscode/test-electron": "^2.1.5",
"eslint": "^8.24.0",
"glob": "^8.0.3",
"mocha": "^10.0.0",
"typescript": "^4.8.4"
}
}
When I press H5 to debug, I got no command matched here:
I was stuck here for a while, where is my command??
I've encountered this just now as well. Make sure that engines.vscode in package.json matches the version of vscode you are running:
"engines": {
"vscode": "^1.73.0"
},
I guess the generator will use the latest version available, but you might not have upgraded yet. That was the case for me.
#tacospice pointed out exactly. in package.json, engines.vscode determines minimum version of VSCode. In my case, yo created extension template which set minimum VSCode version(1.74.0) newer than working VSCode(1.70.0). Check Help -> About -> version with package.json.

Error: Jest: Got error running globalSetup ../#shelf/jest-mongodb/setup.js, reason: Instance Exited before being ready and without throwing an error

I'm following the documentation on jestjs.io. When I try to run a test I get this error:
Error: Jest: Got error running globalSetup - /home/.../node_modules/#shelf/jest-mongodb/setup.js, reason: Instance Exited before being ready and without throwing an error!
This happened both when I've used typescript and also when I created a simple app using javascript instead:
package.json:
{
"name": "mongojest",
"version": "1.0.0",
"main": "index.js",
"license": "MIT",
"devDependencies": {
"#shelf/jest-mongodb": "^3.0.1"
},
"scripts": {
"test": "jest"
},
"dependencies": {
"jest": "^28.1.0"
}
}
jest.config.js:
module.exports = {
coverageProvider: "v8",
"preset": "#shelf/jest-mongodb"
};
I haven't made any changes other than the minimum installs to get it running.
I got around this issue by installing Ubuntu 20.04. I was using the newer Ubuntu 22.04 and it seem to have caused some issues.
I installed typescript in my project. That was enough to run. Follow my configuration files
//package.json
{
"name": "research-with-programmers-api",
"version": "1.0.0",
"description": "",
"main": "index.js",
"scripts": {
"test": "jest --passWithNoTests --silent --noStackTrace --runInBand",
"test:verbose": "jest --passWithNoTests --runInBand",
"test:unit": "yarn test -- --watch -c jest-unit-config.ts",
"test:integration": "yarn test -- --watch -c jest-integration-config.ts",
"test:staged": "yarn test -- --findRelatedTest",
"test:ci": "yarn test -- --coverage"
},
"keywords": [],
"author": "",
"license": "ISC",
"devDependencies": {
"#shelf/jest-mongodb": "^4.1.0",
"#types/bcrypt": "^5.0.0",
"#types/jest": "^28.1.8",
"#types/mongodb": "^4.0.7",
"#types/node": "^18.7.13",
"#types/validator": "^13.7.6",
"#typescript-eslint/eslint-plugin": "^5.0.0",
"eslint": "^8.0.1",
"eslint-config-standard-with-typescript": "^22.0.0",
"eslint-plugin-import": "^2.25.2",
"eslint-plugin-n": "^15.0.0",
"eslint-plugin-promise": "^6.0.0",
"git-commit-msg-linter": "^4.1.3",
"husky": "^8.0.1",
"jest": "^29.0.1",
"lint-staged": "^13.0.3",
"ts-jest": "^28.0.8",
"ts-node": "^10.9.1",
"typescript": "^4.8.2"
},
"dependencies": {
"bcrypt": "^5.0.1",
"mongodb": "^4.10.0",
"validator": "^13.7.0"
}
}
//jest-config.ts
export default {
roots: ['<rootDir>/src'],
collectCoverageFrom: [
'<rootDir>/src/**/*.ts',
'!<rootDir>/src/**/protocols/*.ts',
'!<rootDir>/src/**/*protocols.ts',
'!<rootDir>/src/**/models/*.ts',
'!<rootDir>/src/**/usecases/*.ts',
'!<rootDir>/src/**/index.ts'
],
collectCoverage: true,
coverageDirectory: 'coverage',
coverageProvider: 'v8',
testEnvironment: 'node',
preset: '#shelf/jest-mongodb',
transform: {
'.+\\.ts$': 'ts-jest'
}
}
// jest-mongodb-config.ts
export default {
mongodbMemoryServerOptions: {
instance: {
dbName: 'jest'
},
binary: {
version: '4.0.3',
skipMD5: true
},
autoStart: false
}
}

Babel : As of v7.0.0-beta.55, we've removed Babel's Stage presets

I'm trying to create a build for this project but I've faced this issue with babel :
Error: [BABEL] D:\open-source\React\react-notify\src\components\Notification\Action\index.js:
As of v7.0.0-beta.55, we've removed Babel's Stage presets.
Please consider reading our blog post on this decision at
https://babeljs.io/blog/2018/07/27/removing-babels-stage-presets
for more details. TL;DR is that it's more beneficial in the
long run to explicitly add which proposals to use.
For a more automatic migration, we have updated babel-upgrade,
https://github.com/babel/babel-upgrade to do this for you with
"npx babel-upgrade".
If you want the same configuration as before:
{
"plugins": [
// Stage 2
["#babel/plugin-proposal-decorators", { "legacy": true }],
"#babel/plugin-proposal-function-sent",
"#babel/plugin-proposal-export-namespace-from",
"#babel/plugin-proposal-numeric-separator",
"#babel/plugin-proposal-throw-expressions",
// Stage 3
"#babel/plugin-syntax-dynamic-import",
"#babel/plugin-syntax-import-meta",
["#babel/plugin-proposal-class-properties", { "loose": false }],
"#babel/plugin-proposal-json-strings"
]
}
If you're using the same configuration across many separate projects,
keep in mind that you can also create your own custom presets with
whichever plugins and presets you're looking to use.
module.exports = function() {
return {
plugins: [
require("#babel/plugin-syntax-dynamic-import"),
[require("#babel/plugin-proposal-decorators"), { "legacy": true }],
[require("#babel/plugin-proposal-class-properties"), { "loose": false }],
],
presets: [
// ...
],
};
};
my package.json:
{
"name": "react-notify",
"version": "0.1.0",
"description": "Push notification component for React",
"main": "dist/index.js",
"module": "dist/index.js",
"babel": {
"presets": [
"#babel/react",
"#babel/env",
"#babel/stage-2"
]
},
"license": "MIT",
"dependencies": {
"#babel/runtime": "^7.11.2",
"#fortawesome/fontawesome-svg-core": "^1.2.30",
"#fortawesome/free-brands-svg-icons": "^5.14.0",
"#fortawesome/free-solid-svg-icons": "^5.14.0",
"#fortawesome/react-fontawesome": "^0.1.11",
"#testing-library/jest-dom": "^4.2.4",
"#testing-library/react": "^9.5.0",
"#testing-library/user-event": "^7.2.1",
"react": "^16.13.1",
"react-dom": "^16.13.1",
"react-scripts": "3.4.3",
"styled-components": "^5.2.0"
},
"scripts": {
"start": "react-scripts start",
"build": "SET NODE_ENV=production && rm -rf dist && mkdir dist && npx babel src/components/Notification --out-dir dist --copy-files",
"test": "react-scripts test",
"eject": "react-scripts eject",
"storybook": "start-storybook -p 6006 -s public",
"build-storybook": "build-storybook -s public"
},
"eslintConfig": {
"extends": "react-app"
},
"browserslist": {
"production": [
">0.2%",
"not dead",
"not op_mini all"
],
"development": [
"last 1 chrome version",
"last 1 firefox version",
"last 1 safari version"
]
},
"resolutions": {
"styled-components": "^5"
},
"devDependencies": {
"#babel/cli": "^7.11.6",
"#babel/core": "^7.11.6",
"#babel/preset-env": "^7.11.5",
"#babel/preset-react": "^7.10.4",
"#babel/preset-stage-2": "^7.8.3",
"#storybook/addon-actions": "^6.0.21",
"#storybook/addon-essentials": "^6.0.21",
"#storybook/addon-links": "^6.0.21",
"#storybook/node-logger": "^6.0.21",
"#storybook/preset-create-react-app": "^3.1.4",
"#storybook/react": "^6.0.21",
"enzyme": "^3.11.0",
"enzyme-adapter-react-16": "^1.15.4",
"enzyme-to-json": "^3.5.0",
"react-addons-test-utils": "^15.6.2",
"react-is": "^16.13.1",
"react-test-renderer": "^16.13.1"
}
}
I tried :
npx babel-upgrade
But still facing the same issue.
My Action/index.js:
import React, { useContext } from "react"
import PropTypes from "prop-types"
import { Button, Wrapper } from "./Styled"
import Context from "../context"
const Action = ({ name, onClick }) => {
const { type } = useContext(Context);
if (!(typeof onClick === "function")) {
throw new Error("Action event should be a function")
}
return (< Wrapper >
<Button type={type} onClick={onClick}>{name}</Button>
</Wrapper >)
}
Action.propTypes = {
name: PropTypes.string.isRequired,
onClick: PropTypes.func.isRequired
}
export default Action
Why I faced this issue?
Babel had stopped supporting Stage Presets in the configuration. Read this article.
How to solve the issue?
By running this command :
npx babel-upgrade
Then:
npm install
This will replace the legacy dependencies with :
"devDependencies": {
"#babel/cli": "^7.11.6",
"#babel/core": "^7.11.6",
"#babel/plugin-proposal-class-properties": "^7.0.0",
"#babel/plugin-proposal-decorators": "^7.0.0",
"#babel/plugin-proposal-export-namespace-from": "^7.0.0",
"#babel/plugin-proposal-function-sent": "^7.0.0",
"#babel/plugin-proposal-json-strings": "^7.0.0",
"#babel/plugin-proposal-numeric-separator": "^7.0.0",
"#babel/plugin-proposal-throw-expressions": "^7.0.0",
"#babel/plugin-syntax-dynamic-import": "^7.0.0",
"#babel/plugin-syntax-import-meta": "^7.0.0",
}
And replace the configuration with :
"babel": {
"presets": [
"#babel/react",
"#babel/env"
]
},

Electron App Not Starting after I build it

I have installed the electron-packager npm module globally and run npm run build to build my application.
When I do this, the app seems to build properly and it outputs an application (see picture). However, the date/time on the application is from over a month ago. Furthermore, when I open the application, it simply presents a blank screen.
Below, please find my package.json and accompanying pictures.
{
"name": "turtlecreeklane",
"version": "0.0.1",
"author": "Tanner Houghton <houta483#uchicago.edu>",
"description": "An electron-vue project",
"license": "ISC",
"main": "./dist/electron/main.js",
"scripts": {
"build": "electron-packager . TCL",
"build:dir": "node .electron-vue/build.js && electron-builder --dir",
"build:clean": "cross-env BUILD_TARGET=clean node .electron-vue/build.js",
"build:web": "cross-env BUILD_TARGET=web node .electron-vue/build.js",
"dev": "./start_backend.sh& node .electron-vue/dev-runner.js",
"pack": "npm run pack:main && npm run pack:renderer",
"pack:main": "cross-env NODE_ENV=production webpack --progress --colors --config .electron-vue/webpack.main.config.js",
"pack:renderer": "cross-env NODE_ENV=production webpack --progress --colors --config .electron-vue/webpack.renderer.config.js",
"postinstall": ""
},
"build": {
"productName": "turtlecreeklane",
"appId": "com.example.yourapp",
"directories": {
"output": "build"
},
"files": [
"dist/electron/**/*"
],
"dmg": {
"contents": [
{
"x": 410,
"y": 150,
"type": "link",
"path": "/Applications"
},
{
"x": 130,
"y": 150,
"type": "file"
}
]
},
"mac": {
"icon": "build/icons/Icon-48"
},
"win": {
"icon": "build/icons/icon.ico"
},
"linux": {
"icon": "build/icons"
}
},
"dependencies": {
"axios": "^0.19.2",
"body-parser": "^1.19.0",
"cookie-parser": "^1.4.5",
"ejs": "^3.0.2",
"electron-unhandled": "^3.0.2",
"express": "^4.17.1",
"multer": "^1.4.2",
"path": "^0.12.7",
"pillow": "0.0.9",
"vue": "^2.5.16",
"vue-axios": "^2.1.5",
"vuex": "^3.1.3"
},
"devDependencies": {
"ajv": "^6.5.0",
"babel-core": "^6.26.3",
"babel-loader": "^7.1.4",
"babel-minify-webpack-plugin": "^0.3.1",
"babel-plugin-transform-runtime": "^6.23.0",
"babel-preset-env": "^1.7.0",
"babel-preset-stage-0": "^6.24.1",
"babel-register": "^6.26.0",
"cfonts": "^2.1.2",
"chalk": "^2.4.1",
"copy-webpack-plugin": "^4.5.1",
"cross-env": "^5.1.6",
"css-loader": "^0.28.11",
"del": "^3.0.0",
"devtron": "^1.4.0",
"electron": "^2.0.4",
"electron-builder": "^20.19.2",
"electron-debug": "^1.5.0",
"electron-devtools-installer": "^2.2.4",
"electron-packager": "^14.2.1",
"electron-prebuilt": "^1.4.13",
"file-loader": "^1.1.11",
"html-webpack-plugin": "^3.2.0",
"mini-css-extract-plugin": "0.4.0",
"multispinner": "^0.2.1",
"node-loader": "^0.6.0",
"style-loader": "^0.21.0",
"url-loader": "^1.0.1",
"vue-html-loader": "^1.2.4",
"vue-loader": "^15.2.4",
"vue-style-loader": "^4.1.0",
"vue-template-compiler": "^2.5.16",
"webpack": "^4.15.1",
"webpack-cli": "^3.0.8",
"webpack-dev-server": "^3.1.4",
"webpack-hot-middleware": "^2.22.2",
"webpack-merge": "^4.1.3"
}
}
Picture showing that the project seems to be built but the date if for over a month ago...
Picture showing that the app looks blank after it is opened
Thanks,
Tanner

dotenv not working after transcompile with Babel

I have code reading .env using dotenv that is working in dev but after transcompiling with Babel the values from process.env are undefined. I created a sample program to illustrate the problem which is below.
If I'm in projectRoot and run
npm run start-w
then
console.log(process.env.VAR1)
prints the value 'var1Val'
However, if I do
npm run build
cd dist
node index.js
the value of VAR1 is 'undefined'.
index.js
import 'dotenv/config'
console.log('VAR1', process.env.VAR1)
.env
VAR1=var1val
VAR2=var2val
VAR3=var3val
.babelrc
{
"presets": ["#babel/preset-env"],
"plugins": [
"#babel/plugin-transform-runtime",
]
}
package.json
{
"name": "dotenv.node-babel",
"version": "1.0.0",
"description": "",
"main": "index.js",
"dependencies": {
"#babel/runtime": "^7.4.3",
"dotenv": "^7.0.0"
},
"devDependencies": {
"#babel/cli": "^7.4.3",
"#babel/core": "^7.4.3",
"#babel/node": "^7.2.2",
"#babel/plugin-transform-runtime": "^7.4.3",
"#babel/preset-env": "^7.4.3",
"#types/dotenv": "^6.1.1",
"nodemon": "^1.18.11",
"rimraf": "^2.6.3"
},
"scripts": {
"clean-dist": "rimraf dist",
"build": "npm run-script clean-dist && babel . -d dist --ignore node_modules",
"start": "babel-node index.js",
"start-w": "NODE_ENV=devLocal nodemon --exec babel-node index.js"
},
"author": "",
"license": "ISC"
}
If you do not have a .env file in your build directory, try creating one. I guess that's why the environment variable is undefined.