From 88d9c763a91a484196252ee28c67a080c4fa04fb Mon Sep 17 00:00:00 2001 From: Toru Kobayashi Date: Sat, 23 Sep 2017 21:53:43 +0900 Subject: [PATCH 1/2] Fix componentDidUpdate no longer receives prevContext on React v16 --- .../enzyme-adapter-react-13/src/ReactThirteenAdapter.js | 1 + .../enzyme-adapter-react-14/src/ReactFourteenAdapter.js | 1 + .../src/ReactFifteenFourAdapter.js | 1 + .../enzyme-adapter-react-15/src/ReactFifteenAdapter.js | 1 + packages/enzyme-test-suite/test/ShallowWrapper-spec.jsx | 9 ++++----- packages/enzyme/src/ShallowWrapper.js | 6 +++++- 6 files changed, 13 insertions(+), 6 deletions(-) diff --git a/packages/enzyme-adapter-react-13/src/ReactThirteenAdapter.js b/packages/enzyme-adapter-react-13/src/ReactThirteenAdapter.js index 16bd1924e..86b831557 100644 --- a/packages/enzyme-adapter-react-13/src/ReactThirteenAdapter.js +++ b/packages/enzyme-adapter-react-13/src/ReactThirteenAdapter.js @@ -144,6 +144,7 @@ class ReactThirteenAdapter extends EnzymeAdapter { let isDOM = false; let cachedNode = null; return { + supportPrevContextArgumentOfComponentDidUpdate: true, render(el, context) { cachedNode = el; /* eslint consistent-return: 0 */ diff --git a/packages/enzyme-adapter-react-14/src/ReactFourteenAdapter.js b/packages/enzyme-adapter-react-14/src/ReactFourteenAdapter.js index af93f3973..af0362715 100644 --- a/packages/enzyme-adapter-react-14/src/ReactFourteenAdapter.js +++ b/packages/enzyme-adapter-react-14/src/ReactFourteenAdapter.js @@ -116,6 +116,7 @@ class ReactFifteenAdapter extends EnzymeAdapter { let isDOM = false; let cachedNode = null; return { + supportPrevContextArgumentOfComponentDidUpdate: true, render(el, context) { cachedNode = el; /* eslint consistent-return: 0 */ diff --git a/packages/enzyme-adapter-react-15.4/src/ReactFifteenFourAdapter.js b/packages/enzyme-adapter-react-15.4/src/ReactFifteenFourAdapter.js index cc982eb8d..0c344606b 100644 --- a/packages/enzyme-adapter-react-15.4/src/ReactFifteenFourAdapter.js +++ b/packages/enzyme-adapter-react-15.4/src/ReactFifteenFourAdapter.js @@ -146,6 +146,7 @@ class ReactFifteenFourAdapter extends EnzymeAdapter { let isDOM = false; let cachedNode = null; return { + supportPrevContextArgumentOfComponentDidUpdate: true, render(el, context) { cachedNode = el; /* eslint consistent-return: 0 */ diff --git a/packages/enzyme-adapter-react-15/src/ReactFifteenAdapter.js b/packages/enzyme-adapter-react-15/src/ReactFifteenAdapter.js index 4f6b34097..e050c7a8f 100644 --- a/packages/enzyme-adapter-react-15/src/ReactFifteenAdapter.js +++ b/packages/enzyme-adapter-react-15/src/ReactFifteenAdapter.js @@ -146,6 +146,7 @@ class ReactFifteenAdapter extends EnzymeAdapter { let isDOM = false; let cachedNode = null; return { + supportPrevContextArgumentOfComponentDidUpdate: true, render(el, context) { cachedNode = el; /* eslint consistent-return: 0 */ diff --git a/packages/enzyme-test-suite/test/ShallowWrapper-spec.jsx b/packages/enzyme-test-suite/test/ShallowWrapper-spec.jsx index 306910ac2..d7aeb413a 100644 --- a/packages/enzyme-test-suite/test/ShallowWrapper-spec.jsx +++ b/packages/enzyme-test-suite/test/ShallowWrapper-spec.jsx @@ -3231,7 +3231,7 @@ describe('shallow', () => { 'componentDidUpdate', { foo: 'bar' }, { foo: 'baz' }, { foo: 'state' }, { foo: 'state' }, - { foo: 'context' }, // this will be gone in 16 + REACT16 ? undefined : { foo: 'context' }, ], [ 'componentWillReceiveProps', @@ -3257,7 +3257,7 @@ describe('shallow', () => { 'componentDidUpdate', { foo: 'baz' }, { foo: 'bax' }, { foo: 'state' }, { foo: 'state' }, - { foo: 'context' }, + REACT16 ? undefined : { foo: 'context' }, ], ], ); @@ -3440,7 +3440,6 @@ describe('shallow', () => { }); context('updating state', () => { - // NOTE: There is a bug in react 16 shallow renderer where prevContext is not passed it('should call shouldComponentUpdate, componentWillUpdate and componentDidUpdate', () => { const spy = sinon.spy(); @@ -3501,7 +3500,7 @@ describe('shallow', () => { 'componentDidUpdate', { foo: 'props' }, { foo: 'props' }, { foo: 'bar' }, { foo: 'baz' }, - { foo: 'context' }, + REACT16 ? undefined : { foo: 'context' }, ], ]); }); @@ -3661,7 +3660,7 @@ describe('shallow', () => { 'componentDidUpdate', { foo: 'props' }, { foo: 'props' }, { foo: 'state' }, { foo: 'state' }, - { foo: 'bar' }, + REACT16 ? undefined : { foo: 'bar' }, ], ]); }); diff --git a/packages/enzyme/src/ShallowWrapper.js b/packages/enzyme/src/ShallowWrapper.js index d18da5e37..3426106de 100644 --- a/packages/enzyme/src/ShallowWrapper.js +++ b/packages/enzyme/src/ShallowWrapper.js @@ -311,7 +311,11 @@ class ShallowWrapper { instance && typeof instance.componentDidUpdate === 'function' ) { - instance.componentDidUpdate(prevProps, state, prevContext); + if (this[RENDERER].supportPrevContextArgumentOfComponentDidUpdate) { + instance.componentDidUpdate(prevProps, state, prevContext); + } else { + instance.componentDidUpdate(prevProps, state); + } } this.update(); // If it doesn't need to rerender, update only its props. From a08df671f8b52874f6feff6057a82a11f1e7c0ef Mon Sep 17 00:00:00 2001 From: Leland Richardson Date: Mon, 25 Sep 2017 21:44:06 -0700 Subject: [PATCH 2/2] update to instance-level options --- .../enzyme-adapter-react-13/src/ReactThirteenAdapter.js | 8 +++++++- .../enzyme-adapter-react-14/src/ReactFourteenAdapter.js | 8 +++++++- .../src/ReactFifteenFourAdapter.js | 8 +++++++- .../enzyme-adapter-react-15/src/ReactFifteenAdapter.js | 8 +++++++- packages/enzyme-test-suite/package.json | 3 +-- packages/enzyme/src/ShallowWrapper.js | 8 ++++++-- 6 files changed, 35 insertions(+), 8 deletions(-) diff --git a/packages/enzyme-adapter-react-13/src/ReactThirteenAdapter.js b/packages/enzyme-adapter-react-13/src/ReactThirteenAdapter.js index 86b831557..2f2d6968d 100644 --- a/packages/enzyme-adapter-react-13/src/ReactThirteenAdapter.js +++ b/packages/enzyme-adapter-react-13/src/ReactThirteenAdapter.js @@ -96,6 +96,13 @@ function instanceToTree(inst) { } class ReactThirteenAdapter extends EnzymeAdapter { + constructor() { + super(); + this.options = { + ...this.options, + supportPrevContextArgumentOfComponentDidUpdate: true, + }; + } createMountRenderer(options) { assertDomAvailable('mount'); const domNode = options.attachTo || global.document.createElement('div'); @@ -144,7 +151,6 @@ class ReactThirteenAdapter extends EnzymeAdapter { let isDOM = false; let cachedNode = null; return { - supportPrevContextArgumentOfComponentDidUpdate: true, render(el, context) { cachedNode = el; /* eslint consistent-return: 0 */ diff --git a/packages/enzyme-adapter-react-14/src/ReactFourteenAdapter.js b/packages/enzyme-adapter-react-14/src/ReactFourteenAdapter.js index af0362715..0c1eda79d 100644 --- a/packages/enzyme-adapter-react-14/src/ReactFourteenAdapter.js +++ b/packages/enzyme-adapter-react-14/src/ReactFourteenAdapter.js @@ -68,6 +68,13 @@ function instanceToTree(inst) { } class ReactFifteenAdapter extends EnzymeAdapter { + constructor() { + super(); + this.options = { + ...this.options, + supportPrevContextArgumentOfComponentDidUpdate: true, + }; + } createMountRenderer(options) { assertDomAvailable('mount'); const domNode = options.attachTo || global.document.createElement('div'); @@ -116,7 +123,6 @@ class ReactFifteenAdapter extends EnzymeAdapter { let isDOM = false; let cachedNode = null; return { - supportPrevContextArgumentOfComponentDidUpdate: true, render(el, context) { cachedNode = el; /* eslint consistent-return: 0 */ diff --git a/packages/enzyme-adapter-react-15.4/src/ReactFifteenFourAdapter.js b/packages/enzyme-adapter-react-15.4/src/ReactFifteenFourAdapter.js index 0c344606b..8d085f442 100644 --- a/packages/enzyme-adapter-react-15.4/src/ReactFifteenFourAdapter.js +++ b/packages/enzyme-adapter-react-15.4/src/ReactFifteenFourAdapter.js @@ -98,6 +98,13 @@ function instanceToTree(inst) { } class ReactFifteenFourAdapter extends EnzymeAdapter { + constructor() { + super(); + this.options = { + ...this.options, + supportPrevContextArgumentOfComponentDidUpdate: true, + }; + } createMountRenderer(options) { assertDomAvailable('mount'); const domNode = options.attachTo || global.document.createElement('div'); @@ -146,7 +153,6 @@ class ReactFifteenFourAdapter extends EnzymeAdapter { let isDOM = false; let cachedNode = null; return { - supportPrevContextArgumentOfComponentDidUpdate: true, render(el, context) { cachedNode = el; /* eslint consistent-return: 0 */ diff --git a/packages/enzyme-adapter-react-15/src/ReactFifteenAdapter.js b/packages/enzyme-adapter-react-15/src/ReactFifteenAdapter.js index e050c7a8f..19aef1359 100644 --- a/packages/enzyme-adapter-react-15/src/ReactFifteenAdapter.js +++ b/packages/enzyme-adapter-react-15/src/ReactFifteenAdapter.js @@ -98,6 +98,13 @@ function instanceToTree(inst) { } class ReactFifteenAdapter extends EnzymeAdapter { + constructor() { + super(); + this.options = { + ...this.options, + supportPrevContextArgumentOfComponentDidUpdate: true, + }; + } createMountRenderer(options) { assertDomAvailable('mount'); const domNode = options.attachTo || global.document.createElement('div'); @@ -146,7 +153,6 @@ class ReactFifteenAdapter extends EnzymeAdapter { let isDOM = false; let cachedNode = null; return { - supportPrevContextArgumentOfComponentDidUpdate: true, render(el, context) { cachedNode = el; /* eslint consistent-return: 0 */ diff --git a/packages/enzyme-test-suite/package.json b/packages/enzyme-test-suite/package.json index 070a254cc..ffb68183b 100644 --- a/packages/enzyme-test-suite/package.json +++ b/packages/enzyme-test-suite/package.json @@ -40,5 +40,4 @@ "react": "^15.5.0", "react-dom": "^15.5.0" } -} - +} \ No newline at end of file diff --git a/packages/enzyme/src/ShallowWrapper.js b/packages/enzyme/src/ShallowWrapper.js index 3426106de..47b7d6039 100644 --- a/packages/enzyme/src/ShallowWrapper.js +++ b/packages/enzyme/src/ShallowWrapper.js @@ -311,7 +311,7 @@ class ShallowWrapper { instance && typeof instance.componentDidUpdate === 'function' ) { - if (this[RENDERER].supportPrevContextArgumentOfComponentDidUpdate) { + if (adapter.options.supportPrevContextArgumentOfComponentDidUpdate) { instance.componentDidUpdate(prevProps, state, prevContext); } else { instance.componentDidUpdate(prevProps, state); @@ -405,7 +405,11 @@ class ShallowWrapper { instance && typeof instance.componentDidUpdate === 'function' ) { - instance.componentDidUpdate(prevProps, prevState, prevContext); + if (adapter.options.supportPrevContextArgumentOfComponentDidUpdate) { + instance.componentDidUpdate(prevProps, prevState, prevContext); + } else { + instance.componentDidUpdate(prevProps, prevState); + } } this.update(); });