enzyme: clarify installation section

This commit is contained in:
Rico Sta. Cruz 2017-10-12 18:12:44 +08:00
parent fe728b7322
commit 9600eda7a5
No known key found for this signature in database
GPG Key ID: CAAD38AE2962619A
1 changed files with 37 additions and 34 deletions

View File

@ -9,7 +9,40 @@ intro: |
--- ---
## Getting started ## Getting started
{: .-three-column}
### Mounting
{: .-prime}
```js
import {shallow, mount} from 'enzyme'
```
{: .-setup}
```js
wrap = shallow(<MyComponent />)
```
```js
wrap = mount(<MyComponent />)
```
Shallow wrapping doesn't descend down to sub-components.
A full mount also mounts sub-components.
See: [Shallow rendering](http://airbnb.io/enzyme/docs/api/shallow.html),
[Full rendering](http://airbnb.io/enzyme/docs/api/mount.html)
### Debugging
```js
console.log(wrap.debug())
```
Shows HTML for debugging purposes.
See: [debug()](http://airbnb.io/enzyme/docs/api/ReactWrapper/debug.html)
## Installing
### Initial setup ### Initial setup
@ -39,29 +72,9 @@ Enzyme.configure({ adapter: new Adapter() })
} }
``` ```
This configures Enzyme for React v16, and Jest to automatically configure Enzyme for you. There are other adapters in Enzyme's [installation instructions](http://airbnb.io/enzyme/#installation). This configures Enzyme for React v16, and Jest to automatically configure Enzyme for you. There are other adapters in Enzyme's installation instructions.
### Mounting See: [Installation](http://airbnb.io/enzyme/#installation)
{: .-prime}
```js
import {shallow, mount} from 'enzyme'
```
{: .-setup}
```js
wrap = shallow(<MyComponent />)
```
```js
wrap = mount(<MyComponent />)
```
Shallow wrapping doesn't descend down to sub-components.
A full mount also mounts sub-components.
See: [Shallow rendering](http://airbnb.io/enzyme/docs/api/shallow.html),
[Full rendering](http://airbnb.io/enzyme/docs/api/mount.html)
### Jest snapshots ### Jest snapshots
@ -89,20 +102,10 @@ it('works', () => {
}) })
``` ```
Converts an Enzyme wrapper to a format compatible with Jest snapshots. Optional, but recommended: This allows you to use Enzyme wrappers with Jest snapshots.
See: [enzyme-to-json](https://www.npmjs.com/package/enzyme-to-json) See: [enzyme-to-json](https://www.npmjs.com/package/enzyme-to-json)
### Debugging
```js
console.log(wrap.debug())
```
Shows HTML for debugging purposes.
See: [debug()](http://airbnb.io/enzyme/docs/api/ReactWrapper/debug.html)
## ReactWrapper ## ReactWrapper
### Traversing ### Traversing