开玩笑的模拟功能

Question

I am new to JavaScript testing and currently trying to write some test cases for a store (just an ES6 class) I created. I am using Jest as this is what we usually use for React projects, although here I am not testing a React Component but just a class wrapping a functionality.

The class I am testing extends another class, and has various methods defined in it. I want to test these methods (whether they are called or not), and also whether the properties declared in the class change as and when the corresponding class methods are called.

Now I have read about mocking functions, but from what I understand, they can only do checks like how many times a function is called, but can't replicate the functionality. But in my case, I need the functionality of the methods because I will be checking the class member values these methods change when called.

I am not sure if this is the right approach. Is it wrong to test functions in Jest without mocking? And inferentially, to test the internal workings of functions? When do we mock functions while testing?

The issue I am facing is that the project I am working on is a large one where there are multiple levels of dependencies of classes/functions, and it becomes difficult to test it through Jest as it will need to go through all of them. As I am using alias for file paths in the project, Jest throws errors if it doesn't find any module. I know its possible to use Webpack with Jest, but many of the dependent classes/functions in the code are not in React, and their alias file paths are not maintained by Webpack.

import { getData } from 'service/common/getData';

class Wrapper extends baseClass {
    someVariable = false;
    payload = null;

    changeVariable() {
        this.someVariable = true;
    }

    async getData() {
        super.start();
        response = await fetchData();
        this.payload = response;
        super.end();
    }
}

This is a small representation of the actual code I have. Can't post the entire class here as I am working on a remote machine. Basically, I want to test whether changeVariable gets called when invoked, and whether it successfully changes someVariable to true when called; and similarly, check the value of payload after network request is complete. Note that fetchData is defined in some other file, but is critical to testing getData method. Also the path used here ( service/common/getData ) for importing getData is not the absolute path but an alias NOT defined in Webpack, but somewhere else. Jest can't resolve getData because of this. I will not have to worry about this if I mock getData , but then I will not be able to test its functionality I believe.

Answer 1

@maverick It's perfectly okay to test your class methods using jest. Check the code example in the link -

https://repl.it/repls/ClumsyCumbersomeAdware

index.js

class Wrapper {
  constructor(){
    this.someVariable = false;
  }
  changeVariable(){
    this.someVariable = true;
  }

  getData(){
    return new Promise(resolve => resolve('some data'));
  }
}


module.exports = Wrapper;

index.test.js

const Wrapper = require('./index');

const wrapper = new Wrapper();

describe('Wrapper tests', () => {
  it('should changeVariable', () => {
    wrapper.changeVariable();
    expect(wrapper.someVariable).toBe(true);
  });

  it('should get some data', () => {
    wrapper.getData().then( res => expect(res).toBe('some data'));
  });
});

This is a very simplistic example and in real life the async calls are much more complicated and dependent of 3rd party libraries or other project modules. In such cases it makes sense to have all the dependencies injected in out class and then mocked individually. For Example -

class GMapService {
  constructor(placesApi, directionApi){
      this.placesApi = placesApi;
      this.directionApi = directionApi;
  }

  getPlaceDetails(){
    this.placesApi.getDetails('NYC');
  }

  getDirections(){
    this.directionApi.getDirections('A', 'B');
  }
}

Now you can easily mock placesApi and directionApi, and test them individually without actually requiring Google Map dependencies.

Hope this helps ! 😇