From 956ad40062893348575392b58762722618c4c044 Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?=D0=90=D0=BD=D0=B4=D1=80=D0=B5=D0=B9=20=D0=92=2E=20=D0=92?= =?UTF-8?q?=D0=B0=D1=81=D0=B8=D0=BB=D1=8C=D0=B5=D0=B2?= Date: Sun, 10 Dec 2017 03:14:43 +0600 Subject: [PATCH 1/6] fix #11759. false positive warning in IE11 when using React.Fragment --- packages/react/src/ReactElementValidator.js | 10 +++++++--- packages/shared/ReactSymbols.js | 13 +++++++++++++ 2 files changed, 20 insertions(+), 3 deletions(-) diff --git a/packages/react/src/ReactElementValidator.js b/packages/react/src/ReactElementValidator.js index 10b0723ca9fb5..45d801eeeeb0d 100644 --- a/packages/react/src/ReactElementValidator.js +++ b/packages/react/src/ReactElementValidator.js @@ -15,7 +15,11 @@ import lowPriorityWarning from 'shared/lowPriorityWarning'; import describeComponentFrame from 'shared/describeComponentFrame'; import getComponentName from 'shared/getComponentName'; -import {getIteratorFn, REACT_FRAGMENT_TYPE} from 'shared/ReactSymbols'; +import { + getIteratorFn, + REACT_FRAGMENT_TYPE, + isReactSymbol, +} from 'shared/ReactSymbols'; import checkPropTypes from 'prop-types/checkPropTypes'; import warning from 'fbjs/lib/warning'; @@ -281,7 +285,7 @@ export function createElementWithValidation(type, props, children) { const validType = typeof type === 'string' || typeof type === 'function' || - typeof type === 'symbol' || + isReactSymbol(type) || typeof type === 'number'; // We warn in this case but don't throw. We expect the element creation to // succeed and there will likely be errors in render. @@ -336,7 +340,7 @@ export function createElementWithValidation(type, props, children) { } } - if (typeof type === 'symbol' && type === REACT_FRAGMENT_TYPE) { + if (type === REACT_FRAGMENT_TYPE) { validateFragmentProps(element); } else { validatePropTypes(element); diff --git a/packages/shared/ReactSymbols.js b/packages/shared/ReactSymbols.js index d914c0f25e270..788484f07d8bc 100644 --- a/packages/shared/ReactSymbols.js +++ b/packages/shared/ReactSymbols.js @@ -40,3 +40,16 @@ export function getIteratorFn(maybeIterable: ?any): ?() => ?Iterator<*> { } return null; } + +const reactSymbols = [ + REACT_ELEMENT_TYPE, + REACT_CALL_TYPE, + REACT_RETURN_TYPE, + REACT_PORTAL_TYPE, + REACT_FRAGMENT_TYPE, + MAYBE_ITERATOR_SYMBOL, + FAUX_ITERATOR_SYMBOL, +]; +export function isReactSymbol(type: any) { + return reactSymbols.some(r => type === r); +} From 69de7f9e27b1b259419ad9ab28a3309f9f4a5063 Mon Sep 17 00:00:00 2001 From: Andrey Vassilyev Date: Sun, 10 Dec 2017 12:03:38 +0600 Subject: [PATCH 2/6] simplify createElementWithValidation type check --- packages/react/src/ReactElementValidator.js | 10 +++------- packages/shared/ReactSymbols.js | 13 ------------- 2 files changed, 3 insertions(+), 20 deletions(-) diff --git a/packages/react/src/ReactElementValidator.js b/packages/react/src/ReactElementValidator.js index 45d801eeeeb0d..5cba0707ffc3a 100644 --- a/packages/react/src/ReactElementValidator.js +++ b/packages/react/src/ReactElementValidator.js @@ -15,11 +15,7 @@ import lowPriorityWarning from 'shared/lowPriorityWarning'; import describeComponentFrame from 'shared/describeComponentFrame'; import getComponentName from 'shared/getComponentName'; -import { - getIteratorFn, - REACT_FRAGMENT_TYPE, - isReactSymbol, -} from 'shared/ReactSymbols'; +import {getIteratorFn, REACT_FRAGMENT_TYPE} from 'shared/ReactSymbols'; import checkPropTypes from 'prop-types/checkPropTypes'; import warning from 'fbjs/lib/warning'; @@ -285,8 +281,8 @@ export function createElementWithValidation(type, props, children) { const validType = typeof type === 'string' || typeof type === 'function' || - isReactSymbol(type) || - typeof type === 'number'; + typeof type === 'number' || + type === 'REACT_FRAGMENT_TYPE'; // We warn in this case but don't throw. We expect the element creation to // succeed and there will likely be errors in render. if (!validType) { diff --git a/packages/shared/ReactSymbols.js b/packages/shared/ReactSymbols.js index 788484f07d8bc..d914c0f25e270 100644 --- a/packages/shared/ReactSymbols.js +++ b/packages/shared/ReactSymbols.js @@ -40,16 +40,3 @@ export function getIteratorFn(maybeIterable: ?any): ?() => ?Iterator<*> { } return null; } - -const reactSymbols = [ - REACT_ELEMENT_TYPE, - REACT_CALL_TYPE, - REACT_RETURN_TYPE, - REACT_PORTAL_TYPE, - REACT_FRAGMENT_TYPE, - MAYBE_ITERATOR_SYMBOL, - FAUX_ITERATOR_SYMBOL, -]; -export function isReactSymbol(type: any) { - return reactSymbols.some(r => type === r); -} From 926e87c749b3383f7da99af2099a6d925dd4a3dc Mon Sep 17 00:00:00 2001 From: Andrey Vassilyev Date: Sun, 10 Dec 2017 21:33:46 +0600 Subject: [PATCH 3/6] fix mistake --- packages/react/src/ReactElementValidator.js | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/packages/react/src/ReactElementValidator.js b/packages/react/src/ReactElementValidator.js index 5cba0707ffc3a..100ea6b71e5e2 100644 --- a/packages/react/src/ReactElementValidator.js +++ b/packages/react/src/ReactElementValidator.js @@ -282,7 +282,7 @@ export function createElementWithValidation(type, props, children) { typeof type === 'string' || typeof type === 'function' || typeof type === 'number' || - type === 'REACT_FRAGMENT_TYPE'; + type === REACT_FRAGMENT_TYPE; // We warn in this case but don't throw. We expect the element creation to // succeed and there will likely be errors in render. if (!validType) { From 0046a175fc5519b4056305db711a1dcace84264c Mon Sep 17 00:00:00 2001 From: Dan Abramov Date: Sun, 10 Dec 2017 16:38:26 +0000 Subject: [PATCH 4/6] Add an explanation --- packages/react/src/ReactElementValidator.js | 2 ++ 1 file changed, 2 insertions(+) diff --git a/packages/react/src/ReactElementValidator.js b/packages/react/src/ReactElementValidator.js index 100ea6b71e5e2..ffc5844d2d9f1 100644 --- a/packages/react/src/ReactElementValidator.js +++ b/packages/react/src/ReactElementValidator.js @@ -282,7 +282,9 @@ export function createElementWithValidation(type, props, children) { typeof type === 'string' || typeof type === 'function' || typeof type === 'number' || + // Note: its typeof might be other than 'symbol' if it's a polyfill. type === REACT_FRAGMENT_TYPE; + // We warn in this case but don't throw. We expect the element creation to // succeed and there will likely be errors in render. if (!validType) { From ce74340af15de3f90d55f1a58716a0da4192dc2b Mon Sep 17 00:00:00 2001 From: Dan Abramov Date: Sun, 10 Dec 2017 16:39:40 +0000 Subject: [PATCH 5/6] We shouldn't use `number` for anything else --- packages/react/src/ReactElementValidator.js | 1 - 1 file changed, 1 deletion(-) diff --git a/packages/react/src/ReactElementValidator.js b/packages/react/src/ReactElementValidator.js index ffc5844d2d9f1..a729794013724 100644 --- a/packages/react/src/ReactElementValidator.js +++ b/packages/react/src/ReactElementValidator.js @@ -281,7 +281,6 @@ export function createElementWithValidation(type, props, children) { const validType = typeof type === 'string' || typeof type === 'function' || - typeof type === 'number' || // Note: its typeof might be other than 'symbol' if it's a polyfill. type === REACT_FRAGMENT_TYPE; From 9775a0156d1c3f6854282da5e6a333ef01dcfa26 Mon Sep 17 00:00:00 2001 From: Dan Abramov Date: Sun, 10 Dec 2017 16:40:17 +0000 Subject: [PATCH 6/6] Clarify further --- packages/react/src/ReactElementValidator.js | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/packages/react/src/ReactElementValidator.js b/packages/react/src/ReactElementValidator.js index a729794013724..cfa2afa00f3df 100644 --- a/packages/react/src/ReactElementValidator.js +++ b/packages/react/src/ReactElementValidator.js @@ -281,7 +281,7 @@ export function createElementWithValidation(type, props, children) { const validType = typeof type === 'string' || typeof type === 'function' || - // Note: its typeof might be other than 'symbol' if it's a polyfill. + // Note: its typeof might be other than 'symbol' or 'number' if it's a polyfill. type === REACT_FRAGMENT_TYPE; // We warn in this case but don't throw. We expect the element creation to