Move null-input-value-prop warning into devtool, add stack trace (#7040)
Jim committed
Jun 14, 2016 at 16:34 UTC
97d89fa5bf9a09efdac1d6deb3242d8f2cda0bf6
5 files changed
+52
-54
src/renderers/dom/client/wrappers/ReactDOMInput.js
-17
@@ -22,7 +22,6 @@ var warning = require('warning');
22
23
var didWarnValueLink = false;
24
var didWarnCheckedLink = false;
25
-var didWarnValueNull = false;
25
var didWarnValueDefaultValue = false;
26
var didWarnCheckedDefaultChecked = false;
27
var didWarnControlledToUncontrolled = false;
@@ -35,19 +34,6 @@ function forceUpdateIfMounted() {
34
}
35
}
36
38
-function warnIfValueIsNull(props) {
39
- if (props != null && props.value === null && !didWarnValueNull) {
40
- warning(
41
- false,
42
- '`value` prop on `input` should not be null. ' +
43
- 'Consider using the empty string to clear the component or `undefined` ' +
44
- 'for uncontrolled components.'
45
- );
46
-
47
- didWarnValueNull = true;
48
- }
49
-}
50
-
37
function isControlled(props) {
38
var usesChecked = props.type === 'checkbox' || props.type === 'radio';
39
return usesChecked ? props.checked !== undefined : props.value !== undefined;
@@ -149,7 +135,6 @@ var ReactDOMInput = {
135
);
136
didWarnValueDefaultValue = true;
137
}
152
- warnIfValueIsNull(props);
138
}
139
140
var defaultValue = props.defaultValue;
@@ -169,8 +154,6 @@ var ReactDOMInput = {
154
var props = inst._currentElement.props;
155
156
if (__DEV__) {
172
- warnIfValueIsNull(props);
173
-
157
var controlled = isControlled(props);
158
var owner = inst._currentElement._owner;
159
src/renderers/dom/client/wrappers/ReactDOMSelect.js
-18
@@ -19,7 +19,6 @@ var ReactUpdates = require('ReactUpdates');
19
var warning = require('warning');
20
21
var didWarnValueLink = false;
22
-var didWarnValueNull = false;
22
var didWarnValueDefaultValue = false;
23
24
function updateOptionsIfPendingUpdateAndMounted() {
@@ -45,19 +44,6 @@ function getDeclarationErrorAddendum(owner) {
44
return '';
45
}
46
48
-function warnIfValueIsNull(props) {
49
- if (props != null && props.value === null && !didWarnValueNull) {
50
- warning(
51
- false,
52
- '`value` prop on `select` should not be null. ' +
53
- 'Consider using the empty string to clear the component or `undefined` ' +
54
- 'for uncontrolled components.'
55
- );
56
-
57
- didWarnValueNull = true;
58
- }
59
-}
60
-
47
var valuePropNames = ['value', 'defaultValue'];
48
49
/**
@@ -168,7 +154,6 @@ var ReactDOMSelect = {
154
mountWrapper: function(inst, props) {
155
if (__DEV__) {
156
checkSelectPropTypes(inst, props);
171
- warnIfValueIsNull(props);
157
}
158
159
var value = LinkedValueUtils.getValue(props);
@@ -205,9 +190,6 @@ var ReactDOMSelect = {
190
191
postUpdateWrapper: function(inst) {
192
var props = inst._currentElement.props;
208
- if (__DEV__) {
209
- warnIfValueIsNull(props);
210
- }
193
194
// After the initial mount, we control selected-ness manually so don't pass
195
// this value down
src/renderers/dom/client/wrappers/ReactDOMTextarea.js
-19
@@ -20,7 +20,6 @@ var invariant = require('invariant');
20
var warning = require('warning');
21
22
var didWarnValueLink = false;
23
-var didWarnValueNull = false;
23
var didWarnValDefaultVal = false;
24
25
function forceUpdateIfMounted() {
@@ -30,19 +29,6 @@ function forceUpdateIfMounted() {
29
}
30
}
31
33
-function warnIfValueIsNull(props) {
34
- if (props != null && props.value === null && !didWarnValueNull) {
35
- warning(
36
- false,
37
- '`value` prop on `textarea` should not be null. ' +
38
- 'Consider using the empty string to clear the component or `undefined` ' +
39
- 'for uncontrolled components.'
40
- );
41
-
42
- didWarnValueNull = true;
43
- }
44
-}
45
-
32
/**
33
* Implements a <textarea> host component that allows setting `value`, and
34
* `defaultValue`. This differs from the traditional DOM API because value is
@@ -109,7 +95,6 @@ var ReactDOMTextarea = {
95
);
96
didWarnValDefaultVal = true;
97
}
112
- warnIfValueIsNull(props);
98
}
99
100
@@ -159,10 +144,6 @@ var ReactDOMTextarea = {
144
updateWrapper: function(inst) {
145
var props = inst._currentElement.props;
146
162
- if (__DEV__) {
163
- warnIfValueIsNull(props);
164
- }
165
-
147
var node = ReactDOMComponentTree.getNodeFromInstance(inst);
148
var value = LinkedValueUtils.getValue(props);
149
if (value != null) {
src/renderers/dom/shared/ReactDOMDebugTool.js
+2
@@ -11,6 +11,7 @@
11
12
'use strict';
13
14
+var ReactDOMNullInputValuePropDevtool = require('ReactDOMNullInputValuePropDevtool');
15
var ReactDOMUnknownPropertyDevtool = require('ReactDOMUnknownPropertyDevtool');
16
var ReactDebugTool = require('ReactDebugTool');
17
@@ -68,5 +69,6 @@ var ReactDOMDebugTool = {
69
};
70
71
ReactDOMDebugTool.addDevtool(ReactDOMUnknownPropertyDevtool);
72
+ReactDOMDebugTool.addDevtool(ReactDOMNullInputValuePropDevtool);
73
74
module.exports = ReactDOMDebugTool;
src/renderers/dom/shared/devtools/ReactDOMNullInputValuePropDevtool.js
new
+50
@@ -0,0 +1,50 @@
1
+/**
2
+ * Copyright 2013-present, Facebook, Inc.
3
+ * All rights reserved.
4
+ *
5
+ * This source code is licensed under the BSD-style license found in the
6
+ * LICENSE file in the root directory of this source tree. An additional grant
7
+ * of patent rights can be found in the PATENTS file in the same directory.
8
+ *
9
+ * @providesModule ReactDOMNullInputValuePropDevtool
10
+ */
11
+
12
+'use strict';
13
+
14
+var ReactComponentTreeDevtool = require('ReactComponentTreeDevtool');
15
+
16
+var warning = require('warning');
17
+
18
+var didWarnValueNull = false;
19
+
20
+function handleElement(debugID, element) {
21
+ if (element == null) {
22
+ return;
23
+ }
24
+ if (element.type !== 'input' && element.type !== 'textarea' && element.type !== 'select') {
25
+ return;
26
+ }
27
+ if (element.props != null && element.props.value === null && !didWarnValueNull) {
28
+ warning(
29
+ false,
30
+ '`value` prop on `%s` should not be null. ' +
31
+ 'Consider using the empty string to clear the component or `undefined` ' +
32
+ 'for uncontrolled components.%s',
33
+ element.type,
34
+ ReactComponentTreeDevtool.getStackAddendumByID(debugID)
35
+ );
36
+
37
+ didWarnValueNull = true;
38
+ }
39
+}
40
+
41
+var ReactDOMUnknownPropertyDevtool = {
42
+ onBeforeMountComponent(debugID, element) {
43
+ handleElement(debugID, element);
44
+ },
45
+ onBeforeUpdateComponent(debugID, element) {
46
+ handleElement(debugID, element);
47
+ },
48
+};
49
+
50
+module.exports = ReactDOMUnknownPropertyDevtool;