169 lines
6.5 KiB
JavaScript
169 lines
6.5 KiB
JavaScript
(function (global, factory) {
|
|
typeof exports === 'object' && typeof module !== 'undefined' ? factory(exports) :
|
|
typeof define === 'function' && define.amd ? define(['exports'], factory) :
|
|
(factory((global.reactLifecyclesCompat = {})));
|
|
}(this, (function (exports) { 'use strict';
|
|
|
|
/**
|
|
* Copyright (c) 2013-present, Facebook, Inc.
|
|
*
|
|
* This source code is licensed under the MIT license found in the
|
|
* LICENSE file in the root directory of this source tree.
|
|
*/
|
|
|
|
function componentWillMount() {
|
|
// Call this.constructor.gDSFP to support sub-classes.
|
|
var state = this.constructor.getDerivedStateFromProps(this.props, this.state);
|
|
if (state !== null && state !== undefined) {
|
|
this.setState(state);
|
|
}
|
|
}
|
|
|
|
function componentWillReceiveProps(nextProps) {
|
|
// Call this.constructor.gDSFP to support sub-classes.
|
|
// Use the setState() updater to ensure state isn't stale in certain edge cases.
|
|
function updater(prevState) {
|
|
var state = this.constructor.getDerivedStateFromProps(nextProps, prevState);
|
|
return state !== null && state !== undefined ? state : null;
|
|
}
|
|
// Binding "this" is important for shallow renderer support.
|
|
this.setState(updater.bind(this));
|
|
}
|
|
|
|
function componentWillUpdate(nextProps, nextState) {
|
|
try {
|
|
var prevProps = this.props;
|
|
var prevState = this.state;
|
|
this.props = nextProps;
|
|
this.state = nextState;
|
|
this.__reactInternalSnapshotFlag = true;
|
|
this.__reactInternalSnapshot = this.getSnapshotBeforeUpdate(
|
|
prevProps,
|
|
prevState
|
|
);
|
|
} finally {
|
|
this.props = prevProps;
|
|
this.state = prevState;
|
|
}
|
|
}
|
|
|
|
// React may warn about cWM/cWRP/cWU methods being deprecated.
|
|
// Add a flag to suppress these warnings for this special case.
|
|
componentWillMount.__suppressDeprecationWarning = true;
|
|
componentWillReceiveProps.__suppressDeprecationWarning = true;
|
|
componentWillUpdate.__suppressDeprecationWarning = true;
|
|
|
|
function polyfill(Component) {
|
|
var prototype = Component.prototype;
|
|
|
|
if (!prototype || !prototype.isReactComponent) {
|
|
throw new Error('Can only polyfill class components');
|
|
}
|
|
|
|
if (
|
|
typeof Component.getDerivedStateFromProps !== 'function' &&
|
|
typeof prototype.getSnapshotBeforeUpdate !== 'function'
|
|
) {
|
|
return Component;
|
|
}
|
|
|
|
// If new component APIs are defined, "unsafe" lifecycles won't be called.
|
|
// Error if any of these lifecycles are present,
|
|
// Because they would work differently between older and newer (16.3+) versions of React.
|
|
var foundWillMountName = null;
|
|
var foundWillReceivePropsName = null;
|
|
var foundWillUpdateName = null;
|
|
if (typeof prototype.componentWillMount === 'function') {
|
|
foundWillMountName = 'componentWillMount';
|
|
} else if (typeof prototype.UNSAFE_componentWillMount === 'function') {
|
|
foundWillMountName = 'UNSAFE_componentWillMount';
|
|
}
|
|
if (typeof prototype.componentWillReceiveProps === 'function') {
|
|
foundWillReceivePropsName = 'componentWillReceiveProps';
|
|
} else if (typeof prototype.UNSAFE_componentWillReceiveProps === 'function') {
|
|
foundWillReceivePropsName = 'UNSAFE_componentWillReceiveProps';
|
|
}
|
|
if (typeof prototype.componentWillUpdate === 'function') {
|
|
foundWillUpdateName = 'componentWillUpdate';
|
|
} else if (typeof prototype.UNSAFE_componentWillUpdate === 'function') {
|
|
foundWillUpdateName = 'UNSAFE_componentWillUpdate';
|
|
}
|
|
if (
|
|
foundWillMountName !== null ||
|
|
foundWillReceivePropsName !== null ||
|
|
foundWillUpdateName !== null
|
|
) {
|
|
var componentName = Component.displayName || Component.name;
|
|
var newApiName =
|
|
typeof Component.getDerivedStateFromProps === 'function'
|
|
? 'getDerivedStateFromProps()'
|
|
: 'getSnapshotBeforeUpdate()';
|
|
|
|
throw Error(
|
|
'Unsafe legacy lifecycles will not be called for components using new component APIs.\n\n' +
|
|
componentName +
|
|
' uses ' +
|
|
newApiName +
|
|
' but also contains the following legacy lifecycles:' +
|
|
(foundWillMountName !== null ? '\n ' + foundWillMountName : '') +
|
|
(foundWillReceivePropsName !== null
|
|
? '\n ' + foundWillReceivePropsName
|
|
: '') +
|
|
(foundWillUpdateName !== null ? '\n ' + foundWillUpdateName : '') +
|
|
'\n\nThe above lifecycles should be removed. Learn more about this warning here:\n' +
|
|
'https://fb.me/react-async-component-lifecycle-hooks'
|
|
);
|
|
}
|
|
|
|
// React <= 16.2 does not support static getDerivedStateFromProps.
|
|
// As a workaround, use cWM and cWRP to invoke the new static lifecycle.
|
|
// Newer versions of React will ignore these lifecycles if gDSFP exists.
|
|
if (typeof Component.getDerivedStateFromProps === 'function') {
|
|
prototype.componentWillMount = componentWillMount;
|
|
prototype.componentWillReceiveProps = componentWillReceiveProps;
|
|
}
|
|
|
|
// React <= 16.2 does not support getSnapshotBeforeUpdate.
|
|
// As a workaround, use cWU to invoke the new lifecycle.
|
|
// Newer versions of React will ignore that lifecycle if gSBU exists.
|
|
if (typeof prototype.getSnapshotBeforeUpdate === 'function') {
|
|
if (typeof prototype.componentDidUpdate !== 'function') {
|
|
throw new Error(
|
|
'Cannot polyfill getSnapshotBeforeUpdate() for components that do not define componentDidUpdate() on the prototype'
|
|
);
|
|
}
|
|
|
|
prototype.componentWillUpdate = componentWillUpdate;
|
|
|
|
var componentDidUpdate = prototype.componentDidUpdate;
|
|
|
|
prototype.componentDidUpdate = function componentDidUpdatePolyfill(
|
|
prevProps,
|
|
prevState,
|
|
maybeSnapshot
|
|
) {
|
|
// 16.3+ will not execute our will-update method;
|
|
// It will pass a snapshot value to did-update though.
|
|
// Older versions will require our polyfilled will-update value.
|
|
// We need to handle both cases, but can't just check for the presence of "maybeSnapshot",
|
|
// Because for <= 15.x versions this might be a "prevContext" object.
|
|
// We also can't just check "__reactInternalSnapshot",
|
|
// Because get-snapshot might return a falsy value.
|
|
// So check for the explicit __reactInternalSnapshotFlag flag to determine behavior.
|
|
var snapshot = this.__reactInternalSnapshotFlag
|
|
? this.__reactInternalSnapshot
|
|
: maybeSnapshot;
|
|
|
|
componentDidUpdate.call(this, prevProps, prevState, snapshot);
|
|
};
|
|
}
|
|
|
|
return Component;
|
|
}
|
|
|
|
exports.polyfill = polyfill;
|
|
|
|
Object.defineProperty(exports, '__esModule', { value: true });
|
|
|
|
})));
|