Last active
August 24, 2018 18:35
-
-
Save jamesreggio/caea042d7a9cd87065a187d5f1f97c62 to your computer and use it in GitHub Desktop.
Self-applying patch to work around react-redux#914 (invariant failures when using `connect` upon a component wrapped in `React.forwardRef`)
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
#!/bin/sh | |
############################################################################### | |
# USAGE | |
############################################################################### | |
# 1. Install the `react-is` package in your project with | |
# `npm i --save react-is` or `yarn add react-is`. | |
# | |
# 2. Place this script in the root of your repository, alongside `package.json`. | |
# | |
# 3. Run this script after running `npm install` or `yarn`. | |
############################################################################### | |
# This script will apply a patch to `react-redux` in order to workaround invariant | |
# failures when using `connect` with a component wrapped via `React.forwardRef`. | |
# | |
# This patch is fairly dumb: all it does is change the invariant to use the new | |
# `isValidElementType` method in `react-is`, which has support for `forwardRef`. | |
# | |
# react-redux#1000, when merged, will eliminate the need for this patch. | |
############################################################################### | |
patch -p0 -N << END_OF_PATCH | |
*** node_modules/react-redux/lib/components/connectAdvanced.js 2018-08-22 20:22:42.000000000 -0400 | |
--- connectAdvanced.js 2018-08-24 14:20:06.000000000 -0400 | |
*************** | |
*** 16,21 **** | |
--- 16,23 ---- | |
var _react = require('react'); | |
+ var _reactIs = require('react-is'); | |
+ | |
var _Subscription = require('../utils/Subscription'); | |
var _Subscription2 = _interopRequireDefault(_Subscription); | |
*************** | |
*** 98,104 **** | |
var childContextTypes = (_childContextTypes = {}, _childContextTypes[subscriptionKey] = _PropTypes.subscriptionShape, _childContextTypes); | |
return function wrapWithConnect(WrappedComponent) { | |
! (0, _invariant2.default)(typeof WrappedComponent == 'function', 'You must pass a component to the function returned by ' + (methodName + '. Instead received ' + JSON.stringify(WrappedComponent))); | |
var wrappedComponentName = WrappedComponent.displayName || WrappedComponent.name || 'Component'; | |
--- 100,106 ---- | |
var childContextTypes = (_childContextTypes = {}, _childContextTypes[subscriptionKey] = _PropTypes.subscriptionShape, _childContextTypes); | |
return function wrapWithConnect(WrappedComponent) { | |
! (0, _invariant2.default)(_reactIs.isValidElementType(WrappedComponent), 'You must pass a component to the function returned by ' + (methodName + '. Instead received ' + JSON.stringify(WrappedComponent))); | |
var wrappedComponentName = WrappedComponent.displayName || WrappedComponent.name || 'Component'; | |
*************** | |
*** 303,306 **** | |
return (0, _hoistNonReactStatics2.default)(Connect, WrappedComponent); | |
}; | |
! } | |
\ No newline at end of file | |
--- 305,308 ---- | |
return (0, _hoistNonReactStatics2.default)(Connect, WrappedComponent); | |
}; | |
! } | |
END_OF_PATCH |
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment