From 226213f61f7359ea9bbe5efdb643544b46f58d8b Mon Sep 17 00:00:00 2001 From: Toru Kobayashi Date: Thu, 20 Jul 2017 17:26:39 +0900 Subject: [PATCH] Fix Transition passes through all props to children in production build --- src/Transition.js | 18 ++++++++++++++++-- test/Transition-test.js | 34 ++++++++++++++++++++++++++++++++++ 2 files changed, 50 insertions(+), 2 deletions(-) diff --git a/src/Transition.js b/src/Transition.js index c6118abc..29e85877 100644 --- a/src/Transition.js +++ b/src/Transition.js @@ -303,7 +303,21 @@ class Transition extends React.Component { } const {children, ...childProps} = this.props; - Object.keys(Transition.propTypes).forEach(key => delete childProps[key]); + // filter props for Transtition + delete childProps.in; + delete childProps.mountOnEnter; + delete childProps.unmountOnExit; + delete childProps.appear; + delete childProps.enter; + delete childProps.exit; + delete childProps.timeout; + delete childProps.addEndListener; + delete childProps.onEnter; + delete childProps.onEntering; + delete childProps.onEntered; + delete childProps.onExit; + delete childProps.onExiting; + delete childProps.onExited; if (typeof children === 'function') { return children(status, childProps) @@ -313,7 +327,6 @@ class Transition extends React.Component { return React.cloneElement(child, childProps); } } - Transition.propTypes = { /** * A `function` child can be used instead of a React element. @@ -449,6 +462,7 @@ Transition.propTypes = { onExited: PropTypes.func, }; + // Name the function so it is clearer in the documentation function noop() {} diff --git a/test/Transition-test.js b/test/Transition-test.js index 37c7957b..d0be7c18 100644 --- a/test/Transition-test.js +++ b/test/Transition-test.js @@ -55,6 +55,40 @@ describe('Transition', () => { .render(); }); + it('should pass filtered props to children', () => { + class Child extends React.Component { + render() { + return
child
; + } + } + const child = tsp( + {}} + onEnter={() => {}} + onEntering={() => {}} + onEntered={() => {}} + onExit={() => {}} + onExiting={() => {}} + onExited={() => {}} + > + + + ) + .render() + .find(Child); + + expect(child.props()).toEqual({foo: 'foo', bar: 'bar'}); + }); + describe('entering', () => { let instance;