What is the difference between Jest and enzyme?

javascript reactjs jasmine jestjs enzyme
Eslam Tahoon picture Eslam Tahoon · Mar 6, 2017 · Viewed 7.8k times · Source

I'm new to Unit testing. I want to test React project. As I started with React documentation which refers to enzyme as test utility which is kind of ambiguous to me.

What is the difference between Jest and enzyme?

  • Is enzyme assertion library or task runner?
  • Can I use karma with Jasmine?
  • What is the best way to test a react-redux project?

Answer

Kirti Chaturvedi picture Kirti Chaturvedi · Apr 12, 2018

Jest is a framework which includes a task runner, assertion library, and mocking support. This means it can execute different unit test cases, write its result in console or log files, create mocks, or verify all the assertions. In short, it will execute the test.

Enzyme, on other hand, is a library that provides a simple interface for writing unit tests. For this purpose, it wraps packages such as React TestUtils, JSDOM and CheerIO. React TestUtils has methods to render a React component into a document and to simulate an event. JSDOM is a JavaScript implementation of the DOM (Document object model). The DOM represents the tree structure of UI components. CheerIO implements a subset of jQuery core and is used to query the DOM.

Enzyme is not a test runner. It doesn't have its own assertion library. It just provides a collection of APIs for unit testing. That's why it could be integrated with Jest or any other task runner.

Yes, you can use karma with jasmine.

Related questions

React testing component prop change with enzyme

I am modifying an example found here: https://github.com/airbnb/enzyme/blob/master/docs/api/ReactWrapper/setProps.md class Foo extends React.Component { render() { return ( <input className={this.props.name} type="text" value={this.props.name} onChange={()=>{}} /&…

Read More
Loop inside React JSX

I'm trying to do something like the following in React JSX (where ObjectRow is a separate component): <tbody> for (var i=0; i < numrows; i++) { <ObjectRow/> } </tbody> I realize and understand why this isn't …

Read More
"SyntaxError: Unexpected token < in JSON at position 0"

In a React app component which handles Facebook-like content feeds, I am running into an error: Feed.js:94 undefined "parsererror" "SyntaxError: Unexpected token < in JSON at position 0 I ran into a similar error which turned out to be a …

Read More