JEST - TypeError：无法读取未定义的属性“then”

Question

I am using Jest with ES2015, trying to test this component that makes an ajax call (ajax call done with jQuery) on form submit. I'm just trying to mock the value returned and test the value is updated in the component. But I receive this error:

  - TypeError: Cannot read property 'then' of undefined

Below is the code for ajax call:

accountValidate(name, email).then(this.showMsg);

showMsg(response) {
    if (!response.authenticated) {
      this.setState({msg: response.msg})
    }
  }

accountValidate(name, email) {
    return($.ajax({
      type: 'POST',
      url: `/users/authenticate`,
      headers: { 
        'Accept': 'application/json',
        'Content-Type': 'application/json'
      },
      dataType: 'json',
      data: JSON.stringify({name: name, email: email})
    }));
  }

Here is the code for Jest:

let testMsg = {msg: 'testing msg'}
const msgResponse = Promise.resolve(testMsg);
accountValidate.mockClear();
accountValidate.mockReturnValue(msgResponse);

      return msgResponse.then(() => {
          console.log('test');
      });

Answer 1

It's really late but maybe it helps someone. I would try it like that:

let testMsg = {msg: 'testing msg'}

beforeEach(() => {
      (accountValidate: any).mockClear();
      (accountValidate: any).mockReturnValue(
        new Promise(resolve => {
          resolve(testMsg);
        })
      );
    });

Answer 2

Hi we were getting the same error in the test env we are using the typescript, testing-library/react

I was using node v 14.X but other person was using node 16.X and above they were getting this error. So I updated my node version then able to replicate it on my local.

Then In test file, added the mockcall in the act, as it is affecting in updating the state also

act(() => {
  mockAxios.post.mockImplementation(
    async () => Promise.resolve(availabilitySuccessMockData)
  );
});