Why does my `react-scripts` test not recognize the Jest function `toMatchObject`?

2.1k views Asked by At

I am testing a React app, having essentially followed the standard, officially-blessed create-react-app setup.

I have written my test as follows:

import React from 'react';
import {shallow} from 'enzyme';

import MyComponent from './MyComponent';

describe('MyComponent', () => {
    it('should have the expected properties', () => {
        const wrapper = shallow(<MyComponent/>);
        expect(wrapper.props()).toMatchObject({a: 1});
    });
});

My package.json contains the following:

{
  ...
  "devDependencies": {
    "enzyme": "^2.6.0",
    "react-scripts": "0.8.3",
    ...
  },
  "dependencies": {
    "react": "^15.4.1",
    ...
  },
  "scripts": {
    "test": "react-scripts test --env=jsdom",
    ...
  },
  "jest": {
    "automock": false
  }
}

When I run the tests I get the following error message: TypeError: expect(...).toMatchObject is not a function.

However, the react-scripts documentation states that Jest is one of the built-in tools used, e.g. I don't have to npm install it. And the Jest documentation clearly shows that toMatchObject is a function.

So why do I get this error message?

1

There are 1 answers

3
Andrew Willems On BEST ANSWER

tl;dr: Run npm install jest to get the latest (v18+) jest.

Original answer in early Dec 2016:

I have discovered that this is an issue with Jest itself. It is documented here. If I read it correctly, it's not so much a bug as it is a feature-in-the-works that made its way into the documentation before it was actually ready for public release. Apparently, it should be coming out any day now. In the mean time, someone (the Jest team? someone else?) has provided a helper which can be found here to fill in for this matcher until its officially available. I haven't actually tried this helper, and I suspect it might disappear soon, but I thought I'd let any interested readers know about it if they really want this feature.

Update in early January 2017:

According to this website the toMatchObject matcher was included in Jest on approximately Jan 3, 2017. That was for Jest v18 (18.0.0? ... it's currently at 18.1.0). This was still not included in the basic React download, as this matcher still did not work for me when I deleted my node_modules folder and re-npm install-ed everything. However, if I specifically updated jest with npm install jest then node_modules/jest/package.json indicated that jest was now updated (for me on Jan 15, 2017, updated to version 18.1.0) and toMatchObject now seems to work.

...Actually, the solution in the above paragraph seems fickle, as it did work when I initially used it, but then stopped working again shortly after that (after again re-deleting node_modules, re-npm installing everything, re-doing npm install jest, and even trying @Scimonster's suggestion from the comments, i.e. deleting node_modules/react-scripts/node_modules/jest). I did find another working hack: manually adding the actual toMatchObject code from here to node_modules/react-scripts/node_modules/jest-matchers/build/matchers.js (after reverting some ES6/typescript/babel?-ish syntax). I presume this will all be fixed in a not-too-far-in-the-future update to React, but for now this works for me (at least for the moment!).