[My Notes from Aris] Fun with Jest on VSCode

Use ES5 (Simple)

setup project (run in terminal)

mkdir test-jest
code test-jest
npm init -y
npm i -D jest

sum.js

module.exports.sum = (a, b) => {
return a + b;
}

index.test.js

const { sum } = require('./sum.js');
test('should success', () => {
expect(sum(1, 3)).toEqual(4);
})

Run Test

• Test for all files

jest 

• Test only one file

jest index.test.js

• Test only spesifict

jest index.test.js -t 'should success'

• Test auto run with change --watch

jest index.test.js -t 'should success' --watch

Result

result

Pro

• Simple
• Fast

Con

• can’t run ES6

Using Environment

environment is important for saving your sensitive data.

install library npm i dotenv

.env

TEST='no'

test.env

TEST='yes'

sum.js

module.exports.sum = (a, b) => {
let env = process.env.TEST;
console.log(env);
return a + b;
}

.gitignore

node_modules/
.env
.env.test

index.test.js

require("dotenv").config({ path: './.env.test' });
const { sum } = require('./sum.js');
describe('sum', () => {
beforeEach(() => {
jest.resetModules(); // remove cache
})
test('should success', () => {
expect(sum(1, 3)).toEqual(4);
})
})

pro

• safe your sensitive data / api key
• easy change data prod and dev without change code

con

• make more complex

Using ES6

es6 more easy for coding then es5

install npm install --save-dev babel-jest

change your package.json

{
   "scripts": {
     "test": "jest"
   },
   "jest": {
     "transform": {
       "^.+\\.[t|j]sx?$": "babel-jest"
     }
   }
 }

after configuration, then enables transforms for ES2015+

install package `npm install @babel/preset-env — save-dev

create babel.config.json

{
   "presets": ["@babel/preset-env"]
 }

change file from commonJS to es6

file sum.js

export const sum = (a, b) => {
let env = process.env.TEST;
console.log(env);
return a + b;
}

change file index.test.js

require("dotenv").config({ path: './.env.test' });
import { sum } from './sum.js';

describe('sum', () => {
beforeEach(() => {
jest.resetModules(); // remove cache
})
test('should success', () => {
expect(sum(1, 3)).toEqual(4);
})
})

Using Mock API

Make fast testing rest api with mock. this testing for logica

install package axios

npm i axios

Create file `ConnectApi.js`

import axios from 'axios';
export const getTitle = async () => {
let dataRes = await axios.get('http://localhost:3001');
return dataRes.data[0].title;
}

update index.test.js with add library

import axios from 'axios';
jest.mock('axios');
import { getTitle } from './ConnectApi';

add test on index.test.js

describe('test_api', () => {
test('get title', async () => {
let dataMock = {
error: false,
message: 'OK',
data: [
{ title: 'test' },
{ title: 'test2' }
]
}axios.get.mockResolvedValueOnce(dataMock);let title = await getTitle();
expect(title).toEqual('test');})
})

Using Express (server with nodejs)

add super test

npm install supertest --save-dev

Using Rest API (client)

make integration test

add install super agent

npm install superagent

Using VS Code

using

https://marketplace.visualstudio.com/items?itemName=Orta.vscode-jest

when using Jest Plugin

when use it error on your project (have many sub projects), you can user jest-runner

https://marketplace.visualstudio.com/items?itemName=firsttris.vscode-jest-runner

when use it, you must see configuration. because you not see the configration. so, jest not running.

after you setting the configuration. show can run on file test. like this:

Note: If the project has many projects. Then jest will error. So, you have to choose a project.

Repo:

GitHub - Ariska138/learning-jest-nodejs

Refferensi:

Getting Started · Jest

Ariska138/learning-jest-nodejs

Does Jest support ES6 import/export?

Babel · The compiler for next generation JavaScript

3 Ways To Mock Axios In Jest

supertest

superagent

Jest Runner - Visual Studio Marketplace