jest: Tests fail only with `--coverage`

This may be a bug with our configuration, but so far I can’t see anything that would be causing it.

We’re using kyt, and have enjoyed using Jest with Enzyme for testing. jest and jest --watch work perfectly. However, some tests fail (I can’t see a pattern) when running jest --coverage when they work fine otherwise.

It seems that the failing tests all suffer from the same issue, that the component isn’t actually being created / is empty. Example errors:

Method “html” is only meant to be run on a single node. 0 found instead.
Method “props” is only meant to be run on a single node. 0 found instead.
expect(received).toBe(expected) -- Expected value to be (using ===): 3 -- Received: 0 (looking the number of components expected under certain conditions).

My expectation is that test --coverage doesn’t do anything differently than test and test --watch… but I could be wrong, and as mentioned, I realise this could be something we’ve done wrong.

Node v6.9.0 / npm v3.10.8 Jest v16.0.1 (running with jsdom as the test environment) Enzyme v2.4.1

An example of a full failure:

 FAIL  components/views/Account/MyComponent/index.test.js
  ● Should render two buttons

    expect(received).toBe(expected)

    Expected value to be (using ===):
      2
    Received:
      0

      at Object.<anonymous> (components/views/Account/MyComponent/index.test.js:12:40)
      at handle (../node_modules/worker-farm/lib/child/index.js:41:8)
      at process.<anonymous> (../node_modules/worker-farm/lib/child/index.js:47:3)
      at emitTwo (../events.js:106:13)
      at process.emit (../events.js:191:7)
      at process.nextTick (../internal/child_process.js:744:12)
      at _combinedTickCallback (../internal/process/next_tick.js:67:7)
      at process._tickCallback (../internal/process/next_tick.js:98:9)

Any help or pointers would be greatly appreciated.

About this issue

Original URL
State: closed
Created 8 years ago
Reactions: 22
Comments: 19 (5 by maintainers)

Most upvoted comments

Have similar failure in one of my tests:

…
    Received value does not match stored snapshot 1.

    - Snapshot
    + Received
…
    -        <ToolbarButton
    +        <Component
…

I was able to fix it by replacing an arrow function component with a regular function:

-const ToolbarButton = (props) => (
-    <Button
-        {...props}
-        bsStyle="link"
-        bsSize="small"
-        gray
-    />
-);
+function ToolbarButton(props) {
+    return (
+        <Button
+            {...props}
+            bsStyle="link"
+            bsSize="small"
+            gray
+        />
+    );
+}

sapegin on Nov 29, 2016

This is also affecting me, though in my case its failing with snapshots. If I run npm test it works just fine, but if I add the --coverage flag it fails.

<Image /> › Should render a fallback image when it fails loading

    expect(value).toMatchSnapshot()

    Received value does not match stored snapshot 1.

    - Snapshot
    + Received

      <div
        className="image-wrapper"
        style={
          Object {
            "height": "250",
            "width": "300",
          }
        }>
        <div
          className="image-fallback fallback-small">
          <function SvgIcon() {_classCallCheck(this, SvgIcon);return _possibleConstructorReturn(this, (SvgIcon.__proto__ || Object.getPrototypeOf(SvgIcon)).apply(this, arguments));}
            className="fallback-icon"
            glyph="some_mocked_file" />
        </div>
    -   <function ImageView() {_classCallCheck(this, ImageView);return _possibleConstructorReturn(this, (ImageView.__proto__ || Object.getPrototypeOf(ImageView)).apply(this, arguments));}
    +   <function ImageView() {/* istanbul ignore next */++cov_1drc2k6ou6.f[10];++cov_1drc2k6ou6.s[38];_classCallCheck(this, ImageView); /* istanbul ignore next */++cov_1drc2k6ou6.s[39];return _possibleConstructorReturn(this, ( /* istanbul ignore next */(++cov_1drc2k6ou6.b[15][0], ImageView.__proto__) || /* istanbul ignore next */(++cov_1drc2k6ou6.b[15][1], Object.getPrototypeOf(ImageView))).apply(this, arguments));}
          aspect={undefined}
          className="image"
          height="250"
          size="14x14"
          src=""
          width="300" />
      </div>

      at Object.<anonymous> (app/components/controls/items/Image/Component.test.jsx:47:30)

victorhqc on Oct 27, 2016

I’m having the same problem as described, on different piece of code. Updating babel-jest and jest to version 17 did not help.

Velinsky on Nov 13, 2016

For the record, I had this issue with my tests failing, but only when using --coverage. I solved it by using find with a reference to the component instead of a string:

import SomeComponent from 'components/SomeComponent';

it('should do something cool', () => {
   const tree = shallow(<OtherComponent />);

  const comp = tree.find('SomeComponent').dive(); // Fails
  const comp = tree.find(SomeComponent).dive(); // Works
});

I believe this has to do with Istanbul removing the name of the component, which causes the find to not find anything, after which any assertions done against it will fail. References work because they don’t rely on Sstanbul keeping any names

eliihen on Jul 4, 2017

Can you try to update Jest? We published a patch to pretty-format that should fix this.

cpojer on Nov 4, 2016

Updating jest-cli solved the issue.

Gyvastis on Nov 9, 2017

npm i babel-plugin-istanbul@next fixed a similar issue for me.

There has been more development over at the thread @cpojer shared: https://github.com/istanbuljs/babel-plugin-istanbul/issues/63#issuecomment-270025161

funwithtriangles on Feb 23, 2017

The problem here is the istanbul coverage transform which makes functions anonymous when it shouldn’t 😦

See https://github.com/istanbuljs/babel-plugin-istanbul/issues/63

cpojer on Nov 29, 2016