From 1841580d5111103348dc204cec5ca0dd0cf12d59 Mon Sep 17 00:00:00 2001
From: Andrew Clark <acdlite@me.com>
Date: Tue, 17 Nov 2015 12:03:44 -0800
Subject: [PATCH] Change mapPropsOnChange so that propsMapper only receives the
 dependent props. Resulting object is combined with non-dependent props.

Closes #60
---
 .../__tests__/mapPropsOnChange-test.js        | 43 ++++++++++---------
 src/packages/recompose/mapPropsOnChange.js    | 10 +++--
 2 files changed, 30 insertions(+), 23 deletions(-)

diff --git a/src/packages/recompose/__tests__/mapPropsOnChange-test.js b/src/packages/recompose/__tests__/mapPropsOnChange-test.js
index debe41c1..4d5604e5 100644
--- a/src/packages/recompose/__tests__/mapPropsOnChange-test.js
+++ b/src/packages/recompose/__tests__/mapPropsOnChange-test.js
@@ -1,52 +1,55 @@
 import React from 'react'
 import { expect } from 'chai'
 import omit from 'lodash/object/omit'
-import { mapPropsOnChange, withState, compose } from 'recompose'
+import { mapPropsOnChange, withState, flattenProp, compose } from 'recompose'
 import createSpy from 'recompose/createSpy'
 
 import { renderIntoDocument } from 'react-addons-test-utils'
 
 describe('mapPropsOnChange()', () => {
-  it('maps owner props to child props, only when dependent props update', () => {
+  it('maps subset of owner props to child props', () => {
     const mapSpy = sinon.spy()
     const spy = createSpy()
     const StringConcat = compose(
-      withState('strings', 'updateStrings', ['do', 're', 'mi']),
-      withState('foobar', 'updateFoobar', 'foobar'),
-      mapPropsOnChange('strings', ({ strings, ...rest }) => {
-        mapSpy()
-        return {
-          ...rest,
-          string: strings.join('')
+      withState('strings', 'updateStrings', { a: 'a', b: 'b', c: 'c' }),
+      flattenProp('strings'),
+      mapPropsOnChange(
+        ['a', 'b'],
+        ({ a, b }) => {
+          mapSpy()
+          return {
+            foobar: a + b
+          }
         }
-      }),
+      ),
       spy
     )('div')
 
     expect(StringConcat.displayName).to.equal(
-      'withState(withState(mapPropsOnChange(spy(div))))'
+      'withState(flattenProp(mapPropsOnChange(spy(div))))'
     )
 
     renderIntoDocument(<StringConcat />)
 
-    expect(omit(spy.getProps(), ['updateStrings', 'updateFoobar'])).to.eql({
-      string: 'doremi',
-      foobar: 'foobar'
+    expect(omit(spy.getProps(), ['updateStrings'])).to.eql({
+      c: 'c',
+      foobar: 'ab'
     })
     expect(mapSpy.callCount).to.equal(1)
 
+    spy.getProps().updateStrings(strings => ({ ...strings, c: 'baz' }))
     // Does not re-map for non-dependent prop updates
-    spy.getProps().updateFoobar(() => 'barbaz')
     expect(mapSpy.callCount).to.equal(1)
+
     expect(omit(spy.getProps(), ['updateStrings', 'updateFoobar'])).to.eql({
-      string: 'doremi',
-      foobar: 'foobar'
+      c: 'baz',
+      foobar: 'ab'
     })
 
-    spy.getProps().updateStrings(strings => [...strings, 'fa'])
+    spy.getProps().updateStrings(strings => ({ ...strings, a: 'foo', 'b': 'bar' }))
     expect(omit(spy.getProps(), ['updateStrings', 'updateFoobar'])).to.eql({
-      string: 'doremifa',
-      foobar: 'barbaz'
+      c: 'baz',
+      foobar: 'foobar'
     })
     expect(mapSpy.callCount).to.equal(2)
   })
diff --git a/src/packages/recompose/mapPropsOnChange.js b/src/packages/recompose/mapPropsOnChange.js
index b87d9980..44712d10 100644
--- a/src/packages/recompose/mapPropsOnChange.js
+++ b/src/packages/recompose/mapPropsOnChange.js
@@ -1,5 +1,6 @@
 import { Component } from 'react'
 import pick from 'lodash/object/pick'
+import omit from 'lodash/object/omit'
 import shallowEqual from './shallowEqual'
 import createHelper from './createHelper'
 import createElement from './createElement'
@@ -8,19 +9,22 @@ const mapPropsOnChange = (depdendentPropKeys, propsMapper, BaseComponent) => {
   const pickDependentProps = props => pick(props, depdendentPropKeys)
 
   return class extends Component {
-    childProps = propsMapper(this.props)
+    computedProps = propsMapper(this.props)
 
     componentWillReceiveProps(nextProps) {
       if (!shallowEqual(
         pickDependentProps(this.props),
         pickDependentProps(nextProps)
       )) {
-        this.childProps = propsMapper(nextProps)
+        this.computedProps = propsMapper(nextProps)
       }
     }
 
     render() {
-      return createElement(BaseComponent, this.childProps)
+      return createElement(BaseComponent, {
+        ...this.computedProps,
+        ...omit(this.props, depdendentPropKeys)
+      })
     }
   }
 }