From d8f04e2d8cc94f9534dca32816e2e8be853134df Mon Sep 17 00:00:00 2001 From: Francisco Costa Date: Wed, 30 Oct 2019 14:50:46 -0300 Subject: [PATCH 1/2] add UNSAFE prefix on life cycle methods --- src/AvBaseInput.js | 4 ++-- src/AvCheckboxGroup.js | 4 ++-- src/AvForm.js | 4 ++-- src/AvInputContainer.js | 2 +- src/AvRadioGroup.js | 4 ++-- 5 files changed, 9 insertions(+), 9 deletions(-) diff --git a/src/AvBaseInput.js b/src/AvBaseInput.js index 39b0c31..573fb1e 100644 --- a/src/AvBaseInput.js +++ b/src/AvBaseInput.js @@ -77,13 +77,13 @@ export default class AvBaseInput extends Component { this.validate = this.validate.bind(this); } - componentWillMount() { + UNSAFE_componentWillMount() { this.value = this.props.value || this.getDefaultValue(); this.setState({ value: this.value }); this.updateValidations(); } - componentWillReceiveProps(nextProps) { + UNSAFE_componentWillReceiveProps(nextProps) { if (nextProps.name !== this.props.name) { this.context.FormCtrl.unregister(this); } diff --git a/src/AvCheckboxGroup.js b/src/AvCheckboxGroup.js index b89324a..0e7149c 100644 --- a/src/AvCheckboxGroup.js +++ b/src/AvCheckboxGroup.js @@ -77,13 +77,13 @@ export default class AvCheckboxGroup extends Component { }; } - componentWillMount() { + UNSAFE_componentWillMount() { this.value = this.props.value || this.getDefaultValue().value; this.setState({ value: this.value }); this.updateValidations(); } - componentWillReceiveProps(nextProps) { + UNSAFE_componentWillReceiveProps(nextProps) { if (nextProps.name !== this.props.name) { this.context.FormCtrl.unregister(this); } diff --git a/src/AvForm.js b/src/AvForm.js index 9ab6600..cc12750 100644 --- a/src/AvForm.js +++ b/src/AvForm.js @@ -154,9 +154,9 @@ export default class AvForm extends InputContainer { this._isMounted = false; } - componentWillMount() { + UNSAFE_componentWillMount() { this._isMounted = true; - super.componentWillMount(); + super.UNSAFE_componentWillMount(); this._validators = {}; } diff --git a/src/AvInputContainer.js b/src/AvInputContainer.js index e80709d..4092443 100644 --- a/src/AvInputContainer.js +++ b/src/AvInputContainer.js @@ -11,7 +11,7 @@ function validComponent(input) { } export default class InputContainer extends Component { - componentWillMount() { + UNSAFE_componentWillMount() { this._updaters = {}; this._inputs = {}; } diff --git a/src/AvRadioGroup.js b/src/AvRadioGroup.js index e5fb353..4830795 100644 --- a/src/AvRadioGroup.js +++ b/src/AvRadioGroup.js @@ -70,13 +70,13 @@ export default class AvRadioGroup extends Component { }; } - componentWillMount() { + UNSAFE_componentWillMount() { this.value = this.props.value || this.getDefaultValue().value; this.setState({ value: this.value }); this.updateValidations(); } - componentWillReceiveProps(nextProps) { + UNSAFE_componentWillReceiveProps(nextProps) { if (nextProps.name !== this.props.name) { this.context.FormCtrl.unregister(this); } From 05764f866d6196a4a6715efba251d7289e18c6ee Mon Sep 17 00:00:00 2001 From: Francisco Costa Date: Wed, 30 Oct 2019 14:50:55 -0300 Subject: [PATCH 2/2] fix tests --- __test__/AvBaseInput.spec.js | 32 +++++++++++++++---------------- __test__/AvInputContainer.spec.js | 2 +- 2 files changed, 17 insertions(+), 17 deletions(-) diff --git a/__test__/AvBaseInput.spec.js b/__test__/AvBaseInput.spec.js index 62cf054..0cb04a2 100644 --- a/__test__/AvBaseInput.spec.js +++ b/__test__/AvBaseInput.spec.js @@ -74,41 +74,41 @@ describe('BaseInput', function() { describe('component will mount', () => { it('should get the default value', () => { const spy = sinon.spy(this.component, 'getDefaultValue'); - this.component.componentWillMount(); + this.component.UNSAFE_componentWillMount(); expect(spy).to.have.been.calledOnce; }); it('should set the value to the default value', () => { const defaultValue = 'some value'; this.component.props.defaultValue = defaultValue; - this.component.componentWillMount(); + this.component.UNSAFE_componentWillMount(); expect(this.component.value).to.equal(defaultValue); }); it('should set the state value to the default value', () => { const defaultValue = 'some value'; this.component.props.defaultValue = defaultValue; - this.component.componentWillMount(); + this.component.UNSAFE_componentWillMount(); expect(this.setStateSpy).to.have.been.calledWithMatch({ value: defaultValue }); }); it('should set the value to the value prop if provided', () => { const defaultValue = 'some value'; this.component.props.value = defaultValue; - this.component.componentWillMount(); + this.component.UNSAFE_componentWillMount(); expect(this.component.value).to.equal(defaultValue); }); it('should set the state value to the value prop if provided', () => { const defaultValue = 'some value'; this.component.props.value = defaultValue; - this.component.componentWillMount(); + this.component.UNSAFE_componentWillMount(); expect(this.setStateSpy).to.have.been.calledWithMatch({ value: defaultValue }); }); it('should trigger validation', () => { const spy = sinon.spy(this.component, 'validate'); - this.component.componentWillMount(); + this.component.UNSAFE_componentWillMount(); expect(spy).to.have.been.calledOnce; }); }); @@ -117,7 +117,7 @@ describe('BaseInput', function() { it('should do nothing if the value has not changed', () => { this.props.value = 123; const spy = sinon.spy(this.component, 'validate'); - this.component.componentWillReceiveProps(this.props); + this.component.UNSAFE_componentWillReceiveProps(this.props); expect(this.setStateSpy).to.not.have.been.called; expect(spy).to.not.have.been.called; }); @@ -125,33 +125,33 @@ describe('BaseInput', function() { describe('when the value changed', () => { it('should set the value to the new value', () => { const newValue = 2342; - this.component.componentWillReceiveProps({ value: newValue }); + this.component.UNSAFE_componentWillReceiveProps({ value: newValue }); expect(this.component.value).to.equal(newValue); }); it('should set the state value to the default value', () => { const newValue = 2342; - this.component.componentWillReceiveProps({ value: newValue }); + this.component.UNSAFE_componentWillReceiveProps({ value: newValue }); expect(this.setStateSpy).to.have.been.calledWithMatch({ value: newValue }); }); it('should trigger validation', () => { const newValue = 2342; const spy = sinon.spy(this.component, 'validate'); - this.component.componentWillReceiveProps({ value: newValue }); + this.component.UNSAFE_componentWillReceiveProps({ value: newValue }); expect(spy).to.have.been.calledOnce; }); it('should reset the value if multiple has changed from false to true', () => { this.props.multiple = false; - this.component.componentWillReceiveProps({multiple: true}); + this.component.UNSAFE_componentWillReceiveProps({multiple: true}); expect(this.component.value).to.be.empty; expect(this.component.state.value).to.be.empty; }); it('should reset the value if multiple has changed from true to false', () => { this.props.multiple = true; - this.component.componentWillReceiveProps({multiple: false}); + this.component.UNSAFE_componentWillReceiveProps({multiple: false}); expect(this.component.value).to.equal(''); }); }); @@ -160,7 +160,7 @@ describe('BaseInput', function() { describe('when the checked prop changes', () => { it('should set the value to the trueValue when the next props checked prop is true', () => { this.props.checked = false; - this.component.componentWillReceiveProps({ + this.component.UNSAFE_componentWillReceiveProps({ type: 'checkbox', checked: true, trueValue: true, @@ -171,7 +171,7 @@ describe('BaseInput', function() { it('should set the value to the falseValue when the next props checked prop is false', () => { this.props.checked = true; - this.component.componentWillReceiveProps({ + this.component.UNSAFE_componentWillReceiveProps({ type: 'checkbox', checked: false, trueValue: true, @@ -182,7 +182,7 @@ describe('BaseInput', function() { it('should set the state to the new value', () => { this.props.checked = false; - this.component.componentWillReceiveProps({ + this.component.UNSAFE_componentWillReceiveProps({ type: 'checkbox', checked: true, trueValue: true, @@ -195,7 +195,7 @@ describe('BaseInput', function() { describe('when the checked prop changes', () => { it('should not set the state', () => { this.props.checked = true; - this.component.componentWillReceiveProps({ + this.component.UNSAFE_componentWillReceiveProps({ type: 'checkbox', checked: true, trueValue: true, diff --git a/__test__/AvInputContainer.spec.js b/__test__/AvInputContainer.spec.js index 60215f9..8f68ab5 100644 --- a/__test__/AvInputContainer.spec.js +++ b/__test__/AvInputContainer.spec.js @@ -11,7 +11,7 @@ describe('BaseInput', function() { describe('component will mount', () => { it('should get the default value', () => { - this.component.componentWillMount(); + this.component.UNSAFE_componentWillMount(); expect(this.component._inputs).to.eql({}); }); });