Jest: Jest pass tests and doesn't create snapshots

Created on 9 Jun 2017 · 5Comments · Source: facebook/jest

Do you want to request a feature or report a bug?
Bug

What is the current behavior?
Jest runs tests and pass them all, without creating snapshots.

First test with react-test-renderer:

import React from 'react';
import renderer from 'react-test-renderer';

import LandingPage from '../LandingPage';


test('the Landing page', () => {
  it('renders correctly', () => {
    const tree = renderer.create(
      <LandingPage />
    ).toJSON();
    expect(tree).toMatchSnapshot();
  });
});

Second test with enzyme:

// Nice article to write tests
// https://hackernoon.com/testing-react-components-with-jest-and-enzyme-41d592c174f
import React from 'react';
import { shallow } from 'enzyme';

import Task from '../Task';


test('the Task component', () => {
  it('renders correctly', () => {
    const wrapper = shallow(
      <Task />
    ).toJSON();
    expect(wrapper).toMatchSnapshot();
    expect(wrapper.is('Grid')).toBeTruthy();
  });
}

Output jest:

$ ./node_modules/.bin/jest --no-cache
 PASS  src/components/__tests__/LandingPage-test.js
 PASS  src/components/Dashboard/__tests__/Task-test.js                                                

Test Suites: 2 passed, 2 total                     
Tests:       2 passed, 2 total                     
Snapshots:   0 total     
Time:        1.822s      
Ran all test suites.

If the current behavior is a bug, please provide the steps to reproduce and either a repl.it demo through https://repl.it/languages/jest or a minimal repository on GitHub that we can yarn install and yarn test.
since nobody else reported this issue, I believe it has to do with my system... If you really need this minimal repository, please let me know and I'll make it (just a bit time consuming).

What is the expected behavior?
2 snapshots to be created in their respective __tests__/__snapshots__/ directory.

Please provide your exact Jest configuration and mention your Jest, node, yarn/npm version and operating system.

// jestsetup.js
// Make Enzyme functions available in all test files without importing
import { shallow, render, mount } from 'enzyme'; // eslint-disable-line

global.shallow = shallow;
global.render = render;
global.mount = mount;

// Fail tests on any warning
console.error = message => {  // eslint-disable-line
   throw new Error(message);
}

//package.json
{
  ..
  "devDependencies": {
    "babel-jest": "^20.0.3",
    "enzyme": "^2.8.2",
    "enzyme-to-json": "^1.5.1",
    "identity-obj-proxy": "^3.0.0",
    "jest": "^20.0.4",
    "react-test-renderer": "^15.5.4"
  },
  "jest": {
    "setupFiles": [
      "./jestsetup.js"
    ],
    "modulePaths": [
      "../node_modules",
      "./node_modules"
    ],
    "snapshotSerializers": [
      "./node_modules/enzyme-to-json/serializer"
    ],
    "moduleNameMapper": {
      "^.+\\.(css|less)$": "identity-obj-proxy"
    }
  },
  "scripts": {
    "test": "jest",
    "test:watch": "jest --watch",
    "test:coverage": "jest --coverage"
  },
  ...
}

Node v8.1.0
npm 5.0.3
Arch Linux

Needs More Info

Source

AdrienLemaire

Most helpful comment

For future reference: if it doesn't save __snapshots__, make sure you're not mocking fs.writeFileSync :rofl:

Tymek on 30 Nov 2018

😄3 👎1

All 5 comments

Can you provide a repro of this? Have you tried with other Node versions and different OS?

thymikee on 9 Jun 2017

@Fandekasp ping.

thymikee on 19 Jun 2017

As shown in the examples above, my problem was putting a it() within a test(). Either I should use only test(), or wrap the it() within a describe. Having other issues with the snapshots being useless, but this is related to relay modern. Closing.

AdrienLemaire on 20 Jun 2017

For future reference: if it doesn't save __snapshots__, make sure you're not mocking fs.writeFileSync :rofl:

Tymek on 30 Nov 2018

😄3 👎1

I am using Angular 8 with jest-preset-angular. All my test case are passed. However, would not generate '__snapshot__'

Test Suites: 36 passed, 36 total
Tests: 72 passed, 72 total
Snapshots: 0 total
Time: 78.442s
Ran all test suites.
jestGlobalMocks.ts

Object.defineProperty(window, 'CSS', {value: null});
Object.defineProperty(document, 'doctype', {
  value: '<!DOCTYPE html>'
});
Object.defineProperty(window, 'getComputedStyle', {
  value: () => {
    return {
      display: 'none',
      appearance: ['-webkit-appearance'],
      getPropertyValue: () => {}
    };
  }
});
Object.defineProperty(window, 'matchMedia', {
  value: () => ({
      matches: false,
      addListener: () => {},
      removeListener: () => {}
  })
});
/**
 * ISSUE: https://github.com/angular/material2/issues/7101
 * Workaround for JSDOM missing transform property
 */
Object.defineProperty(document.body.style, 'transform', {
  value: () => {
    return {
      enumerable: true,
      configurable: true,
    };
  },
});

setupJest.ts

import 'jest-preset-angular';
import 'hammerjs';
import './jestGlobalMocks';

tsconfig.spec.json

  "compilerOptions": {
    "esModuleInterop": true,
    "allowJs": true
}

Package.json file.

 "jest": {
    "preset": "jest-preset-angular",
    "setupFilesAfterEnv": [
      "<rootDir>/src/setupJest.ts"
    ],
    "moduleFileExtensions": ["ts", "html", "js", "json"],
    "transform": {
      "^.+\\.(ts|js|html)$": "ts-jest"
    },
    "testPathIgnorePatterns": [
      "<rootDir>/node_modules/",
      "<rootDir>/src/test.ts",
      "<rootDir/dist"
    ],
    "globals": {
      "ts-jest": {
        "tsConfig": "<rootDir>/tsconfig.spec.json",
        "stringifyContentPathRegex": "\\.html$",
        "astTransformers": [
          "<rootDir>/node_modules/jest-preset-angular/InlineHtmlStripStylesTransformer.js"
        ]
      }
    },
    "moduleNameMapper": {
      "^@env/(.*)$": "<rootDir>/src/environments/$1",
      "^@shared/(.*)$": "<rootDir>/src/app/shared/$1",
      "^@services/(.*)$": "<rootDir>/src/app/core/services/$1",
      "^@directives/(.*)$": "<rootDir>/src/app/core/directives/$1"
    },
    "snapshotSerializers": [
      "<rootDir>/node_modules/jest-preset-angular/AngularSnapshotSerializer.js",
      "<rootDir>/node_modules/jest-preset-angular/HTMLCommentSerializer.js"
    ],
    "verbose": true,
    "bail":1,
    "collectCoverage": true,
    "coverageReporters": ["json","json-summary","lcov", "html"]
  }

Environment Details

System:
OS: Windows 10
CPU: (4) x64 Intel(R) Core(TM) i7-7500U CPU @ 2.70GHz
Binaries:
Node: 10.16.0 - C:\Program Files\nodejs\node.EXE
npm: 6.9.0 - C:\Users\kachhiaj\Projects\global-portal-enterprise\node_modules.bin\npm.CMD