https://github.com/jackall3n/enzyme-dive
Dive 🏊🏼♂️
https://github.com/jackall3n/enzyme-dive
dive enzyme react testing typescript
Last synced: about 2 months ago
JSON representation
Dive 🏊🏼♂️
- Host: GitHub
- URL: https://github.com/jackall3n/enzyme-dive
- Owner: jackall3n
- Created: 2020-01-23T13:43:49.000Z (over 6 years ago)
- Default Branch: master
- Last Pushed: 2023-12-15T08:38:47.000Z (over 2 years ago)
- Last Synced: 2025-09-30T12:53:05.039Z (9 months ago)
- Topics: dive, enzyme, react, testing, typescript
- Language: TypeScript
- Size: 37.1 KB
- Stars: 0
- Watchers: 1
- Forks: 0
- Open Issues: 2
-
Metadata Files:
- Readme: README.md
Awesome Lists containing this project
README
🏊🏼♂ Dive deep️
## Installation
#### 1. Add Package
```typescript
yarn add enzyme-dive --dev
```
#### 2. Extend Enzyme in your setup file
```typescript
import * as Enzyme from 'enzyme';
import Adapter from 'enzyme-adapter-react-xx';
import configure from "enzyme-dive";
Enzyme.configure({ adapter: new Adapter() });
// The magic 🧙🏼♂️
configure(Enzyme.ShallowWrapper);
```
## Usage
### diveTo(selector)
Use this to dive until you reach your component. This can be useful if you've got many HoC wrappers.
```typescript
import React from 'react';
import { shallow } from "enzyme";
import Component from './Component';
import ChildComponent from './ChildComponent';
describe('', function() {
it("should render child", () => {
const wrapper = shallow().diveTo(ChildComponent);
expect(wrapper).toMatchSnapshot();
});
});
```
---
### diveDeep(depth)
Dive through your nodes a specified amount
```typescript
import React from 'react';
import { shallow } from "enzyme";
import Component from './Component';
describe('', function() {
it("should render", () => {
// const wrapper = shallow().dive().dive().dive().dive().dive();
const wrapper = shallow().diveDeep(5);
expect(wrapper).toMatchSnapshot();
});
});
```