Unit testing with jest in React Native project (“Not a function” error)

Question

I am working on a React Native project (v0.46). I've been able to write component snapshot tests successfully, but I'm having trouble wrapping my head around unit testing JavaScript ES6 functions.

Here are my functions in FakeUtils.js:

export function sum(a, b) {
    return a + b;
}

export function subtract(a, b) {
    return a - b;
}

And here are my tests for them:

import sum from '../src/utils/FakeUtils.js';
import subtract from '../src/utils/FakeUtils.js';

describe('sum', () => {   
    it('should sum 2 nums', () => {
        expect(sum(1,2)).toBe(3);
    });
});

describe('subtract', () => {   
    it('should subtract 2 nums', () => {
        expect(subtract(2,1)).toBe(1);
    });
});

When I run npm test, this is the output I receive:

FAIL  __tests__/FakeUtilsTest.js
  ● sum › should sum 2 nums

    TypeError: (0 , _FakeUtils2.default) is not a function

      at Object.<anonymous> (__tests__/FakeUtilsTest.js:6:31)
      at tryCallTwo (node_modules/promise/lib/core.js:45:5)
      at doResolve (node_modules/promise/lib/core.js:200:13)
      at new Promise (node_modules/promise/lib/core.js:66:3)
      at Promise.resolve.then.el (node_modules/p-map/index.js:42:16)
      at tryCallOne (node_modules/promise/lib/core.js:37:12)
      at node_modules/promise/lib/core.js:123:15

  ● subtract › should subtract 2 nums

    TypeError: (0 , _FakeUtils2.default) is not a function

      at Object.<anonymous> (__tests__/FakeUtilsTest.js:12:31)
      at tryCallTwo (node_modules/promise/lib/core.js:45:5)
      at doResolve (node_modules/promise/lib/core.js:200:13)
      at new Promise (node_modules/promise/lib/core.js:66:3)
      at Promise.resolve.then.el (node_modules/p-map/index.js:42:16)
      at tryCallOne (node_modules/promise/lib/core.js:37:12)
      at node_modules/promise/lib/core.js:123:15

Any idea what I'm doing wrong here?

Answer 1

Your import statements are off a bit. Try this instead:

import { sum, subtract } from '../src/utils/FakeUtils.js';

Since you aren't exporting with the default keyword, you need to place your imports in curly braces. You can only have one default export, so this approach makes sense.

Answer 2

I happens because you are exporting your functions incorrectly in relation to import. You should export it this way

const function sum(a, b) {
  return a + b;
}

const function subtract(a, b) {
  return a - b;
}
export { sum, subtract}

or import it this way

import {sum, subtract } from '../src/utils/FakeUtils.js';

Answer 3

You are importing the functions wrong. You can't do import sum from '../src/utils/FakeUtils.js'; import subtract from '../src/utils/FakeUtils.js' import sum from '../src/utils/FakeUtils.js'; import subtract from '../src/utils/FakeUtils.js'

Unless you are default exporting the functions , like:

default export sum;

It works that way to ease with importing modules with one exported object. In your case you need to import not default functions , like:

import {subtract,sum} from '../src/utils/FakeUtils.js'