# Jest Utils Collection of helpers to be used in Jest tests code. **Why?** — We use Jest for unit testing of our code. Some common tests demand too much boilerplate code. To reduce amount of this boilerplate code, we provide collection of auxiliary functions that will help to speed-up writing of the tests, and ensure that everybody does everything in the same manner across our projects. **IMPORTANT:** This module is intended only for use inside Jest tests! Its code depends on Jest environment and development dependencies! This module provides the following functions: - **`findInDomByClass(dom, className)`** — Just an auxiliary alias for [`findRenderedDOMComponentWithClass(..)`](https://reactjs.org/docs/test-utils.html#findrendereddomcomponentwithclass) from `react-dom/test-utils`; - **`render(component)`** — Renders provided ReactJS component into JSON representation of the component tree, using [`react-test-renderer`](https://www.npmjs.com/package/react-test-renderer), e.g.: ```jsx import { JU } from 'topcoder-react-utils'; console.log(JU.render(
Example
)); ``` - **`renderDom(component)`** — Renders given ReactJS component into DOM, using `react-dom/test-utils`. In many cases you will want to render and find a rendered node in the resulting tree, you can do it like this: ```jsx import React from 'react'; import { JU } from 'topcoder-react-utils/jest-utils'; const dom = JU.renderDom(
Example component, containing a button you want to find in the render.
); const button = JU.findInDomByClass(dom, 'BUTTON'); ``` - **`shallowRender(component)`** — Generates a shallow render of the provided ReactJS component, using [react-test-renderer/shallow](https://reactjs.org/docs/shallow-renderer.html) and returns the result. ```jsx import { JU } from 'topcoder-react-utils/jest-utils'; console.log(JU.shallowRender(
Example
)); ``` - **`shallowSnapshot(component)`** — Makes a shallow snapshot test of the given ReactJS component, and also returns JSON representation of the rendered component tree. Under the hood it uses `shallowRender(component)` to generate the render, then executes `expect(RENDER_RESULT).toMatchSnapshot()`, and finally returns the `RENDER_RESULT` to the caller. ```jsx // Sample Jest test. import { JU } from 'topcoder-react-utils/jest-utils'; test('A snapshot test', () => { console.log(JU.shallowSnapshot(
Example
)); }); ``` - **`simulate`** — Just an alias for the [`Simulate`](https://reactjs.org/docs/test-utils.html#simulate) from `react-dom/test-utils`. - **`snapshot(component)`** — Makes snapshot test of the given ReactJS component, and also returns JSON representation of the rendered component tree. Under the hood, it uses `render(component)` to render it, then executes `expect(RENDER_RESULT).toMatchSnapshot()`, and then returns the `RENDER_RESULT`. ```jsx // Sample Jest test. import { JU } from 'topcoder-react-utils/jest-utils'; test('A snapshot test', () => { console.log(JU.snapshot(
Example
)); }); ```