Merge branch 'master' into issue1916

.travis.yml

@@ -28,6 +28,8 @@ matrix:
       env: REACT=16
     - node_js: "lts/*"
       env: REACT=16.8.5 RENDERER=16.8.5
+    - node_js: "lts/*"
+      env: REACT=16.8.5 RENDERER=16.8.3
     - node_js: "lts/*"
       env: REACT=16.8.3
     - node_js: "lts/*"
@@ -65,6 +67,10 @@ matrix:
       env: KARMA=true REACT=15
     - node_js: "6"
       env: KARMA=true REACT=16
+    - node_js: "lts/*"
+      env: REACT=16.8.5 RENDERER=16.8.3
+    - node_js: "lts/*"
+      env: REACT=16.8 RENDERER=16.7
   exclude:
     - node_js: "6"
       env: REACT=0.13

docs/api/ReactWrapper/debug.md

@@ -31,7 +31,7 @@ function Bar() {
   return (
     <div className="bar">
       <span>Non-Foo</span>
-      <Foo baz="bax" />
+      <Foo baz="bax" object={{ a: 1, b: 2 }} />
     </div>
   );
 }
@@ -44,13 +44,13 @@ console.log(mount(<Bar id="2" />).debug());
 
 Would output the following to the console:
 <!-- eslint-disable -->
-```jsx
+```text
 <Bar id="2">
   <div className="bar">
     <span>
       Non-Foo
     </span>
-    <Foo baz="bax">
+    <Foo baz="bax" object={{...}}>
       <div className="foo">
         <span>
           Foo
@@ -68,7 +68,7 @@ console.log(mount(<Bar id="2" />).find(Foo).debug());
 ```
 Would output the following to the console:
 <!-- eslint-disable -->
-```jsx
+```text
 <Foo baz="bax">
   <div className="foo">
     <span>
@@ -83,7 +83,7 @@ console.log(mount(<Bar id="2" />).find(Foo).debug({ ignoreProps: true }));
 ```
 Would output the following to the console:
 <!-- eslint-disable -->
-```jsx
+```text
 <Foo>
   <div>
     <span>
@@ -92,3 +92,19 @@ Would output the following to the console:
   </div>
 </Foo>
 ```
+
+and:
+```jsx
+console.log(mount(<Bar id="2" />).find(Foo).debug({ verbose: true }));
+```
+Would output the following to the console:
+<!-- eslint-disable -->
+```text
+<Foo baz="bax" object={{ a: 1, b: 2 }}>
+  <div className="foo">
+    <span>
+      Foo
+    </span>
+  </div>
+</Foo>
+```

docs/api/ShallowWrapper/debug.md

@@ -8,6 +8,7 @@ console when tests are not passing when you expect them to.
 
 `options` (`Object` [optional]):
 - `options.ignoreProps`: (`Boolean` [optional]): Whether props should be omitted in the resulting string. Props are included by default.
+- `options.verbose`: (`Boolean` [optional]): Whether arrays and objects passed as props should be verbosely printed.
 
 #### Returns
 
@@ -21,7 +22,12 @@ function Book({ title, pages }) {
   return (
     <div>
       <h1 className="title">{title}</h1>
-      {pages && <NumberOfPages pages={pages} />}
+      {pages && (
+        <NumberOfPages
+          pages={pages}
+          object={{ a: 1, b: 2 }}
+        />
+      )}
     </div>
   );
 }
@@ -56,8 +62,8 @@ console.log(wrapper.debug());
 Outputs to console:
 ```text
 <div>
- <h1 className="title">Huckleberry Finn</h1>
- <NumberOfPages pages="633 pages" />
+  <h1 className="title">Huckleberry Finn</h1>
+  <NumberOfPages pages="633 pages" object={{...}}/>
 </div>
 ```
 
@@ -73,7 +79,25 @@ console.log(wrapper.debug({ ignoreProps: true }));
 Outputs to console:
 ```text
 <div>
- <h1>Huckleberry Finn</h1>
- <NumberOfPages />
+  <h1>Huckleberry Finn</h1>
+  <NumberOfPages />
+</div>
+```
+
+
+```jsx
+const wrapper = shallow((
+  <Book
+    title="Huckleberry Finn"
+    pages="633 pages"
+  />
+));
+console.log(wrapper.debug({ verbose: true }));
+```
+Outputs to console:
+```text
+<div>
+  <h1 className="title">Huckleberry Finn</h1>
+  <NumberOfPages pages="633 pages" object={{ a: 1, b: 2 }}/>
 </div>
 ```

docs/api/shallow.md

@@ -50,8 +50,9 @@ describe('<MyComponent />', () => {
   - `options.disableLifecycleMethods`: (`Boolean` [optional]): If set to true, `componentDidMount`
 is not called on the component, and `componentDidUpdate` is not called after
 [`setProps`](ShallowWrapper/setProps.md) and [`setContext`](ShallowWrapper/setContext.md). Default to `false`.
-- `options.wrappingComponent`: (`ComponentType` [optional]): A component that will render as a parent of the `node`. It can be used to provide context to the `node`, among other things. See the [`getWrappingComponent()` docs](ShallowWrapper/getWrappingComponent.md) for an example. **Note**: `wrappingComponent` _must_ render its children.
-- `options.wrappingComponentProps`: (`Object` [optional]): Initial props to pass to the `wrappingComponent` if it is specified.
+  - `options.wrappingComponent`: (`ComponentType` [optional]): A component that will render as a parent of the `node`. It can be used to provide context to the `node`, among other things. See the [`getWrappingComponent()` docs](ShallowWrapper/getWrappingComponent.md) for an example. **Note**: `wrappingComponent` _must_ render its children.
+  - `options.wrappingComponentProps`: (`Object` [optional]): Initial props to pass to the `wrappingComponent` if it is specified.
+  - `options.suspenseFallback`: (`Boolean` [optional]): If set to true, when rendering `Suspense` enzyme will replace all the lazy components in children with `fallback` element prop. Otherwise it won't handle fallback of lazy component. Default to `true`. Note: not supported in React < 16.6.
 
 #### Returns
 

docs/guides/migration-from-2-to-3.md

@@ -102,6 +102,49 @@ Although this is a breaking change, I believe the new behavior is closer to what
 actually expect and want. Having enzyme wrappers be immutable results in more deterministic tests
 that are less prone to flakiness from external factors.
 
+### Calling `props()` after a state change
+
+In `enzyme` v2, executing an event that would change a component state (and in turn update props) would return those updated props via the `.props` method.
+
+Now, in `enzyme` v3, you are required to re-find the component; for example:
+
+```jsx
+class Toggler extends React.Component {
+  constructor(...args) {
+    super(...args);
+    this.state = { on: false };
+  }
+
+  toggle() {
+    this.setState(({ on }) => ({ on: !on }));
+  }
+
+  render() {
+    const { on } = this.state;
+    return (<div id="root">{on ? 'on' : 'off'}</div>);
+  }
+}
+
+it('passes in enzyme v2, fails in v3', () => {
+  const wrapper = mount(<Toggler />);
+  const root = wrapper.find('#root');
+  expect(root.text()).to.equal('off');
+
+  wrapper.instance().toggle();
+
+  expect(root.text()).to.equal('on');
+});
+
+it('passes in v2 and v3', () => {
+  const wrapper = mount(<Toggler />);
+  expect(wrapper.find('#root').text()).to.equal('off');
+
+  wrapper.instance().toggle();
+
+  expect(wrapper.find('#root').text()).to.equal('on');
+});
+```
+
 ## `children()` now has slightly different meaning
 
 enzyme has a `.children()` method which is intended to return the rendered children of a wrapper.

env.js

@@ -129,19 +129,20 @@ Promise.resolve()
       .map(key => `${key}@${key.startsWith('react') ? reactVersion : peerDeps[key]}`);
 
     if (process.env.RENDERER) {
-      installs.push(`react-test-renderer@${process.env.RENDERER}`);
+      // eslint-disable-next-line no-param-reassign
+      adapterJson.dependencies['react-test-renderer'] = process.env.RENDERER;
     }
 
     // eslint-disable-next-line no-param-reassign
     testJson.dependencies[adapterName] = adapterJson.version;
 
-    return Promise.all([
+    return writeJSON(adapterPackageJsonPath, adapterJson, true).then(() => Promise.all([
       // npm install the peer deps at the root
       run('npm', 'i', '--no-save', ...installs),
 
       // add the adapter to the dependencies of the test suite
       writeJSON(testPackageJsonPath, testJson, true),
-    ]);
+    ]));
   })
   .then(() => run('lerna', 'bootstrap', '--hoist=\'react*\''))
   .then(() => getJSON(testPackageJsonPath))

packages/enzyme-adapter-react-16.1/src/ReactSixteenOneAdapter.js

@@ -326,7 +326,7 @@ class ReactSixteenOneAdapter extends EnzymeAdapter {
           throw new TypeError(`ReactWrapper::simulate() event '${event}' does not exist`);
         }
         // eslint-disable-next-line react/no-find-dom-node
-        eventFn(nodeToHostNode(node), mock);
+        eventFn(adapter.nodeToHostNode(node), mock);
       },
       batchedUpdates(fn) {
         return fn();

packages/enzyme-adapter-react-16.2/src/ReactSixteenTwoAdapter.js

@@ -328,7 +328,7 @@ class ReactSixteenTwoAdapter extends EnzymeAdapter {
           throw new TypeError(`ReactWrapper::simulate() event '${event}' does not exist`);
         }
         // eslint-disable-next-line react/no-find-dom-node
-        eventFn(nodeToHostNode(node), mock);
+        eventFn(adapter.nodeToHostNode(node), mock);
       },
       batchedUpdates(fn) {
         return fn();

packages/enzyme-adapter-react-16.3/src/ReactSixteenThreeAdapter.js

@@ -347,7 +347,7 @@ class ReactSixteenThreeAdapter extends EnzymeAdapter {
           throw new TypeError(`ReactWrapper::simulate() event '${event}' does not exist`);
         }
         // eslint-disable-next-line react/no-find-dom-node
-        eventFn(nodeToHostNode(node), mock);
+        eventFn(adapter.nodeToHostNode(node), mock);
       },
       batchedUpdates(fn) {
         return fn();