@@ -292,7 +292,7 @@ function setProp(
292
292
key : string ,
293
293
value : mixed ,
294
294
isCustomComponentTag : boolean ,
295
- rawProps : any ,
295
+ props : any ,
296
296
) : void {
297
297
switch ( key ) {
298
298
case 'style ': {
@@ -325,7 +325,7 @@ function setProp(
325
325
}
326
326
const nextHtml : any = value . __html ;
327
327
if ( nextHtml != null ) {
328
- if ( rawProps . children != null ) {
328
+ if ( props . children != null ) {
329
329
throw new Error (
330
330
'Can only set one of `children` or `props.dangerouslySetInnerHTML`.' ,
331
331
) ;
@@ -1093,15 +1093,15 @@ function diffHydratedStyles(domElement: Element, value: mixed) {
1093
1093
function diffHydratedCustomComponent (
1094
1094
domElement : Element ,
1095
1095
tag : string ,
1096
- rawProps : Object ,
1096
+ props : Object ,
1097
1097
parentNamespaceDev : string ,
1098
1098
extraAttributeNames : Set < string > ,
1099
1099
) {
1100
- for ( const propKey in rawProps ) {
1101
- if ( ! rawProps . hasOwnProperty ( propKey ) ) {
1100
+ for ( const propKey in props ) {
1101
+ if ( ! props . hasOwnProperty ( propKey ) ) {
1102
1102
continue ;
1103
1103
}
1104
- const nextProp = rawProps [ propKey ] ;
1104
+ const nextProp = props [ propKey ] ;
1105
1105
if ( nextProp == null ) {
1106
1106
continue ;
1107
1107
}
@@ -1111,7 +1111,7 @@ function diffHydratedCustomComponent(
1111
1111
}
1112
1112
continue ;
1113
1113
}
1114
- if ( rawProps . suppressHydrationWarning === true ) {
1114
+ if ( props . suppressHydrationWarning === true ) {
1115
1115
// Don't bother comparing. We're ignoring all these warnings.
1116
1116
continue ;
1117
1117
}
@@ -1184,15 +1184,15 @@ function diffHydratedCustomComponent(
1184
1184
function diffHydratedGenericElement (
1185
1185
domElement : Element ,
1186
1186
tag : string ,
1187
- rawProps : Object ,
1187
+ props : Object ,
1188
1188
parentNamespaceDev : string ,
1189
1189
extraAttributeNames : Set < string > ,
1190
1190
) {
1191
- for ( const propKey in rawProps ) {
1192
- if ( ! rawProps . hasOwnProperty ( propKey ) ) {
1191
+ for ( const propKey in props ) {
1192
+ if ( ! props . hasOwnProperty ( propKey ) ) {
1193
1193
continue ;
1194
1194
}
1195
- const nextProp = rawProps [ propKey ] ;
1195
+ const nextProp = props [ propKey ] ;
1196
1196
if ( nextProp == null ) {
1197
1197
continue ;
1198
1198
}
@@ -1202,7 +1202,7 @@ function diffHydratedGenericElement(
1202
1202
}
1203
1203
continue ;
1204
1204
}
1205
- if ( rawProps . suppressHydrationWarning === true ) {
1205
+ if ( props . suppressHydrationWarning === true ) {
1206
1206
// Don't bother comparing. We're ignoring all these warnings.
1207
1207
continue ;
1208
1208
}
@@ -1288,13 +1288,13 @@ function diffHydratedGenericElement(
1288
1288
export function diffHydratedProperties (
1289
1289
domElement : Element ,
1290
1290
tag : string ,
1291
- rawProps : Object ,
1291
+ props : Object ,
1292
1292
isConcurrentMode : boolean ,
1293
1293
shouldWarnDev : boolean ,
1294
1294
parentNamespaceDev : string ,
1295
1295
) : null | Array < mixed > {
1296
1296
if ( __DEV__ ) {
1297
- validatePropertiesInDevelopment ( tag , rawProps ) ;
1297
+ validatePropertiesInDevelopment ( tag , props ) ;
1298
1298
}
1299
1299
1300
1300
// TODO: Make sure that we check isMounted before firing any of these events.
@@ -1337,35 +1337,44 @@ export function diffHydratedProperties(
1337
1337
listenToNonDelegatedEvent ( 'toggle' , domElement ) ;
1338
1338
break ;
1339
1339
case 'input' :
1340
- ReactDOMInputInitWrapperState ( domElement , rawProps ) ;
1340
+ ReactDOMInputInitWrapperState ( domElement , props ) ;
1341
1341
// We listen to this event in case to ensure emulated bubble
1342
1342
// listeners still fire for the invalid event.
1343
1343
listenToNonDelegatedEvent ( 'invalid' , domElement ) ;
1344
+ // TODO: Make sure we check if this is still unmounted or do any clean
1345
+ // up necessary since we never stop tracking anymore.
1346
+ track ( ( domElement : any ) ) ;
1347
+ // For input and textarea we current always set the value property at
1348
+ // post mount to force it to diverge from attributes. However, for
1349
+ // option and select we don't quite do the same thing and select
1350
+ // is not resilient to the DOM state changing so we don't do that here.
1351
+ // TODO: Consider not doing this for input and textarea.
1352
+ ReactDOMInputPostMountWrapper ( domElement , props , true ) ;
1344
1353
break ;
1345
1354
case 'option' :
1346
- ReactDOMOptionValidateProps ( domElement , rawProps ) ;
1355
+ ReactDOMOptionValidateProps ( domElement , props ) ;
1347
1356
break ;
1348
1357
case 'select' :
1349
- ReactDOMSelectInitWrapperState ( domElement , rawProps ) ;
1358
+ ReactDOMSelectInitWrapperState ( domElement , props ) ;
1350
1359
// We listen to this event in case to ensure emulated bubble
1351
1360
// listeners still fire for the invalid event.
1352
1361
listenToNonDelegatedEvent ( 'invalid' , domElement ) ;
1353
1362
break ;
1354
1363
case 'textarea' :
1355
- ReactDOMTextareaInitWrapperState ( domElement , rawProps ) ;
1364
+ ReactDOMTextareaInitWrapperState ( domElement , props ) ;
1356
1365
// We listen to this event in case to ensure emulated bubble
1357
1366
// listeners still fire for the invalid event.
1358
1367
listenToNonDelegatedEvent ( 'invalid' , domElement ) ;
1368
+ // TODO: Make sure we check if this is still unmounted or do any clean
1369
+ // up necessary since we never stop tracking anymore.
1370
+ track ( ( domElement : any ) ) ;
1371
+ ReactDOMTextareaPostMountWrapper ( domElement , props ) ;
1359
1372
break ;
1360
1373
}
1361
1374
1362
- if ( rawProps . hasOwnProperty ( 'onScroll ') ) {
1363
- listenToNonDelegatedEvent ( 'scroll ', domElement) ;
1364
- }
1365
-
1366
1375
let updatePayload = null ;
1367
1376
1368
- const children = rawProps . children ;
1377
+ const children = props . children ;
1369
1378
// For text content children we compare against textContent. This
1370
1379
// might match additional HTML that is hidden when we read it using
1371
1380
// textContent. E.g. "foo" will match "f<span>oo</span>" but that still
@@ -1377,7 +1386,7 @@ export function diffHydratedProperties(
1377
1386
// TODO: Should we use domElement.firstChild.nodeValue to compare?
1378
1387
if ( typeof children === 'string ' || typeof children === 'number ') {
1379
1388
if ( domElement . textContent !== '' + children ) {
1380
- if ( rawProps . suppressHydrationWarning !== true ) {
1389
+ if ( props . suppressHydrationWarning !== true ) {
1381
1390
checkForUnmatchedText (
1382
1391
domElement . textContent ,
1383
1392
children,
@@ -1391,6 +1400,15 @@ export function diffHydratedProperties(
1391
1400
}
1392
1401
}
1393
1402
1403
+ if ( props . onScroll != null ) {
1404
+ listenToNonDelegatedEvent ( 'scroll' , domElement ) ;
1405
+ }
1406
+
1407
+ if ( props . onClick != null ) {
1408
+ // TODO: This cast may not be sound for SVG, MathML or custom elements.
1409
+ trapClickOnNonInteractiveElement ( ( ( domElement : any ) : HTMLElement ) ) ;
1410
+ }
1411
+
1394
1412
if ( __DEV__ && shouldWarnDev ) {
1395
1413
const extraAttributeNames : Set < string > = new Set ( ) ;
1396
1414
const attributes = domElement . attributes ;
@@ -1411,60 +1429,31 @@ export function diffHydratedProperties(
1411
1429
extraAttributeNames . add ( attributes [ i ] . name ) ;
1412
1430
}
1413
1431
}
1414
- if ( isCustomComponent ( tag , rawProps ) ) {
1432
+ if ( isCustomComponent ( tag , props ) ) {
1415
1433
diffHydratedCustomComponent (
1416
1434
domElement ,
1417
1435
tag ,
1418
- rawProps ,
1436
+ props ,
1419
1437
parentNamespaceDev ,
1420
1438
extraAttributeNames ,
1421
1439
) ;
1422
1440
} else {
1423
1441
diffHydratedGenericElement (
1424
1442
domElement ,
1425
1443
tag ,
1426
- rawProps ,
1444
+ props ,
1427
1445
parentNamespaceDev ,
1428
1446
extraAttributeNames ,
1429
1447
) ;
1430
1448
}
1431
1449
if (
1432
1450
extraAttributeNames . size > 0 &&
1433
- rawProps . suppressHydrationWarning !== true
1451
+ props . suppressHydrationWarning !== true
1434
1452
) {
1435
1453
warnForExtraAttributes ( extraAttributeNames ) ;
1436
1454
}
1437
1455
}
1438
1456
1439
- switch ( tag ) {
1440
- case 'input ':
1441
- // TODO: Make sure we check if this is still unmounted or do any clean
1442
- // up necessary since we never stop tracking anymore.
1443
- track ( ( domElement : any ) ) ;
1444
- ReactDOMInputPostMountWrapper ( domElement , rawProps , true ) ;
1445
- break ;
1446
- case 'textarea ':
1447
- // TODO: Make sure we check if this is still unmounted or do any clean
1448
- // up necessary since we never stop tracking anymore.
1449
- track ( ( domElement : any ) ) ;
1450
- ReactDOMTextareaPostMountWrapper ( domElement , rawProps ) ;
1451
- break ;
1452
- case 'select ':
1453
- case 'option ':
1454
- // For input and textarea we current always set the value property at
1455
- // post mount to force it to diverge from attributes. However, for
1456
- // option and select we don't quite do the same thing and select
1457
- // is not resilient to the DOM state changing so we don't do that here.
1458
- // TODO: Consider not doing this for input and textarea.
1459
- break ;
1460
- default :
1461
- if ( typeof rawProps . onClick === 'function' ) {
1462
- // TODO: This cast may not be sound for SVG, MathML or custom elements.
1463
- trapClickOnNonInteractiveElement ( ( ( domElement : any ) : HTMLElement ) ) ;
1464
- }
1465
- break ;
1466
- }
1467
-
1468
1457
return updatePayload ;
1469
1458
}
1470
1459
0 commit comments