Introduction to the

Here’s a quote from jEST:

Jest is an enjoyable JavaScript testing framework that focuses on simplicity. It applies to, but is not limited to, projects that use Babel, TypeScript, Node, React, Angular, and Vue

As stated on the official website, JEST is an easy-to-use testing framework, and many frameworks use JEST for unit testing. So jEST is also a great tool for us, and it’s always good to learn

start

The installation

You can use NPM or YARN for installation

npm install jest --save-dev
// or
yarn add jest --dev
Copy the code

Test whether the installation is successful

  • Start by writing a function that needs to be tested
function sum(a, b){
 return a + b
}
module.exports = sum
Copy the code
  • Create a sum.test.js file and write our test case
const sum = require('./sum')
test('adds 1 + 2 to equal 3', () = > { // Exact match is equal to 3
 expect(sum(1.2)).toBe(3)
})
Copy the code
  • Configure the script command in package. json
{
 "scripts": {
  "test": "jest"
 }
}
Copy the code
  • Run the test
yarn test
// or
npm run test
Copy the code
  • The results of
PASS  ./sum.test.js
✓ adds 1 + 2 to equal 3 (5ms)
Copy the code

When the result is pass, the test passed and the JEST test framework was installed successfully!

Common Test apis

Ordinary matching machine
  • toBeNull

Checks whether null is matched

  • toBeUndefined

Check whether undefined matches

  • toBeDefined

In contrast to toBeUndefined, match is not undefined

  • toBeTruthy

Check that the Boolean value is true

  • toBeFalsy

Check that the Boolean value is false

  • not

The not

  • ToEqual and place

ToBe uses object. is to test for exact equality. If you want to check the value of an object, use toEqual instead

Example:

test('null', () = > {  const a = null;
  expect(a).toBeNull();
  expect(a).toBeDefined();
  expect(a).not.toBeUndefined();
 expect(a).not.toBeTruthy();  expect(a).toBeFalsy(); });  test('zero', () = > { const b = 0;  expect(b).not.toBeNull();  expect(b).toBeDefined();  expect(b).not.toBeUndefined();  expect(b).not.toBeTruthy();  expect(b).toBeFalsy(); }) Copy the code
Digital matching machine
  • toBeGreaterThan

Determines that the return value is greater than the expected value

  • toBeGreaterThanOrEqual

Determine whether the return value is greater than or equal to the expected value

  • toBeLessThan

Determines that the return value is less than the expected value

  • toBeLessThanOrEqual

Determines that the return value is less than or equal to the expected value

  • toBe

Check that the return values are all equal to the expected value

  • toEqual

Determine that the object value is equal to the expected value

  • toBeCloseTo

Determines that floating point numbers are equal within the allowed margin of error

Example:

test('two plus two', () = > {  const value = 2 + 2;
  expect(value).toBeGreaterThan(3);
  expect(value).toBeGreaterThanOrEqual(3.5);
  expect(value).toBeLessThan(5);
 expect(value).toBeLessThanOrEqual(4.5);   // toBe and toEqual are equivalent for numbers  expect(value).toBe(4);  expect(value).toEqual(4); });  test('Add two floating point numbers', () = > { const value = 0.1 + 0.2;  / / expect (value). Place (0.3); This is an error because floating point numbers have rounding errors  expect(value).toBeCloseTo(0.3); // This sentence can run }); Copy the code
String matcher
  • toMatch

Determines if there are expected characters

Example:

test('there is no I in team', () = > {  expect('team').not.toMatch(/I/);
});

test('but there is a "stop" in Christoph', () = > { expect('Christoph').toMatch(/stop/); }); Copy the code
Array matcher
  • toContain

Determines whether the array contains a value

Example:

const shoppingList = [
  'diapers'.  'kleenex'.  'trash bags'.  'paper towels'. 'beer'.];  test('the shopping list has beer on it', () = > { expect(shoppingList).toContain('beer');  expect(new Set(shoppingList)).toContain('beer'); }); Copy the code
Throw error matcher

Example:

function compileAndroidCode() {
  throw new Error('you are using the wrong JDK');
}

test('compiling android goes as expected', () = > { expect(compileAndroidCode).toThrow();  expect(compileAndroidCode).toThrow(Error);   // You can also use the exact error message or a regexp  expect(compileAndroidCode).toThrow('you are using the wrong JDK');  expect(compileAndroidCode).toThrow(/JDK/); }); Copy the code

Hook functions prepared before and after multiple tests

If you have something to set up repeatedly for multiple tests, you can use beforeEach and afterEach. For example, consider some tests that interact with a city information database. You must call the method initializeCityDatabase() before each test and you must call the method clearCityDatabase() after each test.

beforeEach((a)= > {
  initializeCityDatabase();
});

afterEach((a)= > {
 clearCityDatabase(); });  test('city database has Vienna', () = > { expect(isCity('Vienna')).toBeTruthy(); });  test('city database has San Juan', () = > { expect(isCity('San Juan')).toBeTruthy(); }); Copy the code

In some cases, you only need to do this once at the beginning of the file and cache the data for later operations. Jest provides beforeAll and afterAll to handle this situation

beforeAll((a)= > {
  return initializeCityDatabase();
});

afterAll((a)= > {
 return clearCityDatabase(); });  test('city database has Vienna', () = > { expect(isCity('Vienna')).toBeTruthy(); });  test('city database has San Juan', () = > { expect(isCity('San Juan')).toBeTruthy(); }); Copy the code

Describe about grouping blocks 

beforeAll((a)= > {
  return initializeCityDatabase();
});

afterAll((a)= > {
 return clearCityDatabase(); });  test('city database has Vienna', () = > { expect(isCity('Vienna')).toBeTruthy(); });  test('city database has San Juan', () = > { expect(isCity('San Juan')).toBeTruthy(); }) Copy the code

Grouping is similar to namespaces in that we block our tests so that they are organized.

summary

This is a summary and documentation of some simple uses of jEST tests. Welcome to refer to the correction, feel helpful to give a thumbs-up, thank you!