Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Adds react15CompatibilityMode setting #540

Merged
merged 4 commits into from
Nov 28, 2016
Merged
Show file tree
Hide file tree
Changes from all commits
Commits
File filter

Filter by extension

Filter by extension

Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
32 changes: 28 additions & 4 deletions src/components/connectAdvanced.js
Original file line number Diff line number Diff line change
Expand Up @@ -5,6 +5,8 @@ import { Component, PropTypes, createElement } from 'react'
import Subscription from '../utils/Subscription'
import storeShape from '../utils/storeShape'


let defaultReact15CompatibilityMode = true
let hotReloadingVersion = 0
export default function connectAdvanced(
/*
Expand All @@ -18,7 +20,7 @@ export default function connectAdvanced(

Access to dispatch is provided to the factory so selectorFactories can bind actionCreators
outside of their selector as an optimization. Options passed to connectAdvanced are passed to
the selectorFactory, along with displayName and WrappedComponent, as the second argument.
the selectorFactory, along with displayName and WrappedComponent, as the second argument.

Note that selectorFactory is responsible for all caching/memoization of inbound and outbound
props. Do not use connectAdvanced directly without memoizing results between calls to your
Expand All @@ -35,6 +37,9 @@ export default function connectAdvanced(
// probably overridden by wrapper functions such as connect()
methodName = 'connectAdvanced',

// temporary compatibility setting for React 15. See Connect constructor for details
react15CompatibilityMode = undefined,

// if defined, the name of the property passed to the wrapped element indicating the number of
// calls to render. useful for watching in react devtools for unnecessary re-renders.
renderCountProp = undefined,
Expand All @@ -57,11 +62,12 @@ export default function connectAdvanced(

const contextTypes = {
[storeKey]: storeShape,
[subscriptionKey]: PropTypes.instanceOf(Subscription)
[subscriptionKey]: PropTypes.instanceOf(Subscription),
react15CompatibilityMode: PropTypes.bool,
}
const childContextTypes = {
[subscriptionKey]: PropTypes.instanceOf(Subscription)
}
}

return function wrapWithConnect(WrappedComponent) {
invariant(
Expand Down Expand Up @@ -96,7 +102,19 @@ export default function connectAdvanced(
this.state = {}
this.renderCount = 0
this.store = this.props[storeKey] || this.context[storeKey]
this.parentSub = this.props[subscriptionKey] || this.context[subscriptionKey]

// react15CompatibilityMode controls whether the subscription system is used. This is for
// https://github.com/reactjs/react-redux/issues/525 and should be removed completely when
// react-redux's dependency on react is bumped to mimimum v16, which is expected to include
// PR https://github.com/facebook/react/pull/8204 which fixes the issue.
const compatMode = [
react15CompatibilityMode,
props.react15CompatibilityMode,
context.react15CompatibilityMode,
defaultReact15CompatibilityMode
].find(cm => cm !== undefined && cm !== null)
this.parentSub = compatMode ? null : props[subscriptionKey] || context[subscriptionKey]

this.setWrappedInstance = this.setWrappedInstance.bind(this)

invariant(this.store,
Expand Down Expand Up @@ -256,3 +274,9 @@ export default function connectAdvanced(
return hoistStatics(Connect, WrappedComponent)
}
}

connectAdvanced.setDefaultReact15CompatibilityMode =
function setDefaultReact15CompatibilityMode(compat) {
defaultReact15CompatibilityMode = compat
}

4 changes: 3 additions & 1 deletion src/connect/connect.js
Original file line number Diff line number Diff line change
Expand Up @@ -84,4 +84,6 @@ export function createConnect({
}
}

export default createConnect()
const connect = createConnect()
connect.setDefaultReact15CompatibilityMode = connectAdvanced.setDefaultReact15CompatibilityMode
export default connect
2 changes: 1 addition & 1 deletion test/components/Provider.spec.js
Original file line number Diff line number Diff line change
Expand Up @@ -144,7 +144,7 @@ describe('React', () => {
// The state from parent props should always be consistent with the current state
expect(state).toEqual(parentProps.parentState)
return {}
})
}, null, null, { react15CompatibilityMode: false })
class ChildContainer extends Component {
render() {
return <div />
Expand Down
2 changes: 1 addition & 1 deletion test/components/connect.spec.js
Original file line number Diff line number Diff line change
Expand Up @@ -1698,7 +1698,7 @@ describe('React', () => {
// The state from parent props should always be consistent with the current state
expect(state).toEqual(parentProps.parentState)
return {}
})
}, null, null, { react15CompatibilityMode: false })
class ChildContainer extends Component {
render() {
return <Passthrough {...this.props}/>
Expand Down