Add unknown property warning for use of `autofocus` (#7694)
hkal committed
Oct 3, 2016 at 10:51 UTC
f6fdfd1bf0d13e51098a6009c2c85687b1245c9b
2 files changed
+22
-1
src/renderers/dom/shared/DOMProperty.js
+5
-1
@@ -193,9 +193,13 @@ var DOMProperty = {
193
/**
194
* Mapping from lowercase property names to the properly cased version, used
195
* to warn in the case of missing properties. Available only in __DEV__.
196
+ *
197
+ * autofocus is predefined, because adding it to the property whitelist
198
+ * causes unintended side effects.
199
+ *
200
* @type {Object}
201
*/
198
- getPossibleStandardName: __DEV__ ? {} : null,
202
+ getPossibleStandardName: __DEV__ ? {autofocus: 'autoFocus'} : null,
203
204
/**
205
* All of the isCustomAttribute() functions that have been injected.
src/renderers/dom/shared/__tests__/ReactDOMComponent-test.js
+17
@@ -1495,5 +1495,22 @@ describe('ReactDOMComponent', () => {
1495
//since hard coding the line number would make test too brittle
1496
expect(parseInt(previousLine, 10) + 12).toBe(parseInt(currentLine, 10));
1497
});
1498
+
1499
+ it('should suggest property name if available', () => {
1500
+ spyOn(console, 'error');
1501
+
1502
+ ReactTestUtils.renderIntoDocument(React.createElement('label', {for: 'test'}));
1503
+ ReactTestUtils.renderIntoDocument(React.createElement('input', {type: 'text', autofocus: true}));
1504
+
1505
+ expect(console.error.calls.count()).toBe(2);
1506
+
1507
+ expect(console.error.calls.argsFor(0)[0]).toBe(
1508
+ 'Warning: Unknown DOM property for. Did you mean htmlFor?\n in label'
1509
+ );
1510
+
1511
+ expect(console.error.calls.argsFor(1)[0]).toBe(
1512
+ 'Warning: Unknown DOM property autofocus. Did you mean autoFocus?\n in input'
1513
+ );
1514
+ });
1515
});
1516
});