@@ -26,10 +26,8 @@ import isArray from 'shared/isArray';
2626
2727import ReactCurrentOwner from './ReactCurrentOwner' ;
2828import { isValidElement , createElement , cloneElement } from './ReactElementProd' ;
29- import { jsxDEV } from './jsx/ReactJSXElement' ;
3029import { setExtraStackFrame } from './ReactDebugCurrentFrame' ;
3130import { describeUnknownElementTypeFrameInDEV } from 'shared/ReactComponentStackFrame' ;
32- import hasOwnProperty from 'shared/hasOwnProperty' ;
3331
3432const REACT_CLIENT_REFERENCE = Symbol . for ( 'react.client.reference' ) ;
3533
@@ -277,152 +275,6 @@ function validateFragmentProps(fragment) {
277275 }
278276}
279277
280- const didWarnAboutKeySpread = { } ;
281-
282- export function jsxWithValidation (
283- type ,
284- props ,
285- key ,
286- isStaticChildren ,
287- source ,
288- self ,
289- ) {
290- if ( __DEV__ ) {
291- const validType = isValidElementType ( type ) ;
292-
293- // We warn in this case but don't throw. We expect the element creation to
294- // succeed and there will likely be errors in render.
295- if ( ! validType ) {
296- let info = '' ;
297- if (
298- type === undefined ||
299- ( typeof type === 'object' &&
300- type !== null &&
301- Object . keys ( type ) . length === 0 )
302- ) {
303- info +=
304- ' You likely forgot to export your component from the file ' +
305- "it's defined in, or you might have mixed up default and named imports." ;
306- }
307-
308- const sourceInfo = getSourceInfoErrorAddendum ( source ) ;
309- if ( sourceInfo ) {
310- info += sourceInfo ;
311- } else {
312- info += getDeclarationErrorAddendum ( ) ;
313- }
314-
315- let typeString ;
316- if ( type === null ) {
317- typeString = 'null' ;
318- } else if ( isArray ( type ) ) {
319- typeString = 'array' ;
320- } else if ( type !== undefined && type . $$typeof === REACT_ELEMENT_TYPE ) {
321- typeString = `<${ getComponentNameFromType ( type . type ) || 'Unknown' } />` ;
322- info =
323- ' Did you accidentally export a JSX literal instead of a component?' ;
324- } else {
325- typeString = typeof type ;
326- }
327-
328- if ( __DEV__ ) {
329- console . error (
330- 'React.jsx: type is invalid -- expected a string (for ' +
331- 'built-in components) or a class/function (for composite ' +
332- 'components) but got: %s.%s' ,
333- typeString ,
334- info ,
335- ) ;
336- }
337- }
338-
339- const element = jsxDEV ( type , props , key , source , self ) ;
340-
341- // The result can be nullish if a mock or a custom function is used.
342- // TODO: Drop this when these are no longer allowed as the type argument.
343- if ( element == null ) {
344- return element ;
345- }
346-
347- // Skip key warning if the type isn't valid since our key validation logic
348- // doesn't expect a non-string/function type and can throw confusing errors.
349- // We don't want exception behavior to differ between dev and prod.
350- // (Rendering will throw with a helpful message and as soon as the type is
351- // fixed, the key warnings will appear.)
352-
353- if ( validType ) {
354- const children = props . children ;
355- if ( children !== undefined ) {
356- if ( isStaticChildren ) {
357- if ( isArray ( children ) ) {
358- for ( let i = 0 ; i < children . length ; i ++ ) {
359- validateChildKeys ( children [ i ] , type ) ;
360- }
361-
362- if ( Object . freeze ) {
363- Object . freeze ( children ) ;
364- }
365- } else {
366- console . error (
367- 'React.jsx: Static children should always be an array. ' +
368- 'You are likely explicitly calling React.jsxs or React.jsxDEV. ' +
369- 'Use the Babel transform instead.' ,
370- ) ;
371- }
372- } else {
373- validateChildKeys ( children , type ) ;
374- }
375- }
376- }
377-
378- if ( hasOwnProperty . call ( props , 'key' ) ) {
379- const componentName = getComponentNameFromType ( type ) ;
380- const keys = Object . keys ( props ) . filter ( k => k !== 'key' ) ;
381- const beforeExample =
382- keys . length > 0
383- ? '{key: someKey, ' + keys . join ( ': ..., ' ) + ': ...}'
384- : '{key: someKey}' ;
385- if ( ! didWarnAboutKeySpread [ componentName + beforeExample ] ) {
386- const afterExample =
387- keys . length > 0 ? '{' + keys . join ( ': ..., ' ) + ': ...}' : '{}' ;
388- console . error (
389- 'A props object containing a "key" prop is being spread into JSX:\n' +
390- ' let props = %s;\n' +
391- ' <%s {...props} />\n' +
392- 'React keys must be passed directly to JSX without using spread:\n' +
393- ' let props = %s;\n' +
394- ' <%s key={someKey} {...props} />' ,
395- beforeExample ,
396- componentName ,
397- afterExample ,
398- componentName ,
399- ) ;
400- didWarnAboutKeySpread [ componentName + beforeExample ] = true ;
401- }
402- }
403-
404- if ( type === REACT_FRAGMENT_TYPE ) {
405- validateFragmentProps ( element ) ;
406- } else {
407- validatePropTypes ( element ) ;
408- }
409-
410- return element ;
411- }
412- }
413-
414- // These two functions exist to still get child warnings in dev
415- // even with the prod transform. This means that jsxDEV is purely
416- // opt-in behavior for better messages but that we won't stop
417- // giving you warnings if you use production apis.
418- export function jsxWithValidationStatic ( type , props , key ) {
419- return jsxWithValidation ( type , props , key , true ) ;
420- }
421-
422- export function jsxWithValidationDynamic ( type , props , key ) {
423- return jsxWithValidation ( type , props , key , false ) ;
424- }
425-
426278export function createElementWithValidation ( type , props , children ) {
427279 const validType = isValidElementType ( type ) ;
428280
0 commit comments