From 76cc4c9cf66805baa51de92c6509c4a4baafc1c5 Mon Sep 17 00:00:00 2001 From: Flarnie Marchan Date: Tue, 5 Sep 2017 16:13:45 -0700 Subject: [PATCH] Add test for warning for camelCased unknown props **what is the change?:** When we render unknown props, they get converted to lower-case. This may be unexpected for people, or break what they are expecting to happen. Let's warn in this case and ask them to explicitly pass the lower-cased attribute name. **why make this change?:** To avoid corner case buggy results for users. **test plan:** NOTE: ~~~It does NOT pass right now. This is a known issue. Should we change and just expect a warning, but allow the attribute value to be set? `yarn run test src/renderers/dom/shared/__tests__/ReactDOMAttribute-test.js` **issue:** https://github.com/facebook/react/issues/10399 --- .../shared/__tests__/ReactDOMAttribute-test.js | 15 +++++++++++++++ 1 file changed, 15 insertions(+) diff --git a/src/renderers/dom/shared/__tests__/ReactDOMAttribute-test.js b/src/renderers/dom/shared/__tests__/ReactDOMAttribute-test.js index 6ead95c78d416..1dcb4747f6d00 100644 --- a/src/renderers/dom/shared/__tests__/ReactDOMAttribute-test.js +++ b/src/renderers/dom/shared/__tests__/ReactDOMAttribute-test.js @@ -133,5 +133,20 @@ describe('ReactDOM unknown attribute', () => { ); expectDev(console.error.calls.count()).toBe(1); }); + + it('removes camelCased unknown props and warns', () => { + spyOn(console, 'error'); + + var el = document.createElement('div'); + ReactDOM.render(
, el); + expect(el.firstChild.hasAttribute('hELLo')).toBe(false); + expect(el.firstChild.hasAttribute('hello')).toBe(false); + + expectDev(normalizeCodeLocInfo(console.error.calls.argsFor(0)[0])).toBe( + 'Warning: Invalid prop `hELLo` on
tag. Did you mean `hello`?' + + ' in div (at **)', + ); + expectDev(console.error.calls.count()).toBe(1); + }); }); });