Fix fastAddProperties to properly nullify style props (#30334)

## Summary

This PR fixes the `fastAddProperties` function. Now it nullifies a prop
if it was defined in one of the items of a style array, but then set to
`undefined` or `null` in one of the subsequent items. E.g. `style:
[{top: 0}, {top: undefined}]` should evaluate to `{top: null}`. Also
added a test case for that.

## How did you test this change?
```
yarn test packages/react-native-renderer -r=xplat --variant=false
yarn test packages/react-native-renderer -r=xplat --variant=true
yarn flow native
```

DiffTrain build for commit https://github.com/facebook/react/commit/f510ece86d4621d3b0faf9fe59d850f7807dbb16.
This commit is contained in:
dmytrorykun
2024-07-15 09:38:05 -07:00
parent 7d4aaba495
commit 7e80855357
14 changed files with 74 additions and 68 deletions
+1 -1
View File
@@ -1 +1 @@
19.0.0-native-fb-fc1371f6-20240715
19.0.0-native-fb-f510ece8-20240715
@@ -7,7 +7,7 @@
* @noflow
* @nolint
* @preventMunge
* @generated SignedSource<<807d7defa7798acbd559251923830aa0>>
* @generated SignedSource<<76bb9ad89a4d88877387c71561477406>>
*/
"use strict";
@@ -15187,14 +15187,14 @@ __DEV__ &&
scheduleRoot: scheduleRoot,
setRefreshHandler: setRefreshHandler,
getCurrentFiber: getCurrentFiberForDevTools,
reconcilerVersion: "19.0.0-native-fb-fc1371f6-20240715"
reconcilerVersion: "19.0.0-native-fb-f510ece8-20240715"
});
})({
findFiberByHostInstance: function () {
throw Error("TestRenderer does not support findFiberByHostInstance()");
},
bundleType: 1,
version: "19.0.0-native-fb-fc1371f6-20240715",
version: "19.0.0-native-fb-f510ece8-20240715",
rendererPackageName: "react-test-renderer"
});
exports._Scheduler = Scheduler;
@@ -7,7 +7,7 @@
* @noflow
* @nolint
* @preventMunge
* @generated SignedSource<<41bfc6c5964719c61efcaacbfd9ccbe1>>
* @generated SignedSource<<55912220a6d317097bfdce7a18f89b5a>>
*/
"use strict";
@@ -9406,7 +9406,7 @@ var devToolsConfig$jscomp$inline_1034 = {
throw Error("TestRenderer does not support findFiberByHostInstance()");
},
bundleType: 0,
version: "19.0.0-native-fb-fc1371f6-20240715",
version: "19.0.0-native-fb-f510ece8-20240715",
rendererPackageName: "react-test-renderer"
};
var internals$jscomp$inline_1223 = {
@@ -9437,7 +9437,7 @@ var internals$jscomp$inline_1223 = {
scheduleRoot: null,
setRefreshHandler: null,
getCurrentFiber: null,
reconcilerVersion: "19.0.0-native-fb-fc1371f6-20240715"
reconcilerVersion: "19.0.0-native-fb-f510ece8-20240715"
};
if ("undefined" !== typeof __REACT_DEVTOOLS_GLOBAL_HOOK__) {
var hook$jscomp$inline_1224 = __REACT_DEVTOOLS_GLOBAL_HOOK__;
@@ -7,7 +7,7 @@
* @noflow
* @nolint
* @preventMunge
* @generated SignedSource<<50896144af79bc0d06cc1efa52989bd2>>
* @generated SignedSource<<6da80fcc0b995a2ab635400377d3a276>>
*/
"use strict";
@@ -10026,7 +10026,7 @@ var devToolsConfig$jscomp$inline_1117 = {
throw Error("TestRenderer does not support findFiberByHostInstance()");
},
bundleType: 0,
version: "19.0.0-native-fb-fc1371f6-20240715",
version: "19.0.0-native-fb-f510ece8-20240715",
rendererPackageName: "react-test-renderer"
};
(function (internals) {
@@ -10070,7 +10070,7 @@ var devToolsConfig$jscomp$inline_1117 = {
scheduleRoot: null,
setRefreshHandler: null,
getCurrentFiber: null,
reconcilerVersion: "19.0.0-native-fb-fc1371f6-20240715"
reconcilerVersion: "19.0.0-native-fb-f510ece8-20240715"
});
exports._Scheduler = Scheduler;
exports.act = act;
@@ -7,7 +7,7 @@
* @noflow
* @nolint
* @preventMunge
* @generated SignedSource<<9e43796dad26b65aef2351c647691b29>>
* @generated SignedSource<<774ee23c4580a270ea6ffd6e54c906bb>>
*/
"use strict";
@@ -1748,7 +1748,7 @@ __DEV__ &&
exports.useTransition = function () {
return resolveDispatcher().useTransition();
};
exports.version = "19.0.0-native-fb-fc1371f6-20240715";
exports.version = "19.0.0-native-fb-f510ece8-20240715";
"undefined" !== typeof __REACT_DEVTOOLS_GLOBAL_HOOK__ &&
"function" ===
typeof __REACT_DEVTOOLS_GLOBAL_HOOK__.registerInternalModuleStop &&
@@ -7,7 +7,7 @@
* @noflow
* @nolint
* @preventMunge
* @generated SignedSource<<46ebc18bdae76b802420ba85977104d3>>
* @generated SignedSource<<6d4d7fcf84be677792e205532a36c190>>
*/
"use strict";
@@ -604,4 +604,4 @@ exports.useSyncExternalStore = function (
exports.useTransition = function () {
return ReactSharedInternals.H.useTransition();
};
exports.version = "19.0.0-native-fb-fc1371f6-20240715";
exports.version = "19.0.0-native-fb-f510ece8-20240715";
@@ -7,7 +7,7 @@
* @noflow
* @nolint
* @preventMunge
* @generated SignedSource<<a6beab1e2ddc879fd5524db195123a39>>
* @generated SignedSource<<5faabf73666ec4dc0d2fa62bc5fd9940>>
*/
"use strict";
@@ -608,7 +608,7 @@ exports.useSyncExternalStore = function (
exports.useTransition = function () {
return ReactSharedInternals.H.useTransition();
};
exports.version = "19.0.0-native-fb-fc1371f6-20240715";
exports.version = "19.0.0-native-fb-f510ece8-20240715";
"undefined" !== typeof __REACT_DEVTOOLS_GLOBAL_HOOK__ &&
"function" ===
typeof __REACT_DEVTOOLS_GLOBAL_HOOK__.registerInternalModuleStop &&
@@ -1 +1 @@
fc1371f6bf656821e92c3c41bf65f58686504001
f510ece86d4621d3b0faf9fe59d850f7807dbb16
@@ -7,7 +7,7 @@
* @noflow
* @nolint
* @preventMunge
* @generated SignedSource<<c187e11a9478ecae821aa269657417f6>>
* @generated SignedSource<<33b19db231c19a7465cf06a85e551523>>
*/
"use strict";
@@ -1336,11 +1336,14 @@ __DEV__ &&
return payload;
}
for (i in props) {
var prop = props[i];
if (void 0 !== prop) {
var attributeConfig = validAttributes[i];
if (null != attributeConfig) {
var newValue = void 0;
var prop = props[i],
attributeConfig = validAttributes[i];
if (null != attributeConfig) {
var newValue = void 0;
if (void 0 === prop)
if (payload && void 0 !== payload[i]) newValue = null;
else continue;
else
"function" === typeof prop
? (newValue = !0)
: "object" !== typeof attributeConfig
@@ -1348,10 +1351,9 @@ __DEV__ &&
: "function" === typeof attributeConfig.process
? (newValue = attributeConfig.process(prop))
: "function" === typeof attributeConfig.diff && (newValue = prop);
void 0 !== newValue
? (payload || (payload = {}), (payload[i] = newValue))
: (payload = fastAddProperties(payload, prop, attributeConfig));
}
void 0 !== newValue
? (payload || (payload = {}), (payload[i] = newValue))
: (payload = fastAddProperties(payload, prop, attributeConfig));
}
}
return payload;
@@ -16811,12 +16813,12 @@ __DEV__ &&
scheduleRoot: scheduleRoot,
setRefreshHandler: setRefreshHandler,
getCurrentFiber: getCurrentFiberForDevTools,
reconcilerVersion: "19.0.0-native-fb-fc1371f6-20240715"
reconcilerVersion: "19.0.0-native-fb-f510ece8-20240715"
});
})({
findFiberByHostInstance: getInstanceFromNode,
bundleType: 1,
version: "19.0.0-native-fb-fc1371f6-20240715",
version: "19.0.0-native-fb-f510ece8-20240715",
rendererPackageName: "react-native-renderer",
rendererConfig: {
getInspectorDataForInstance: getInspectorDataForInstance,
@@ -7,7 +7,7 @@
* @noflow
* @nolint
* @preventMunge
* @generated SignedSource<<e70e2f329e5ac6a6a2556a1a11ffc8f2>>
* @generated SignedSource<<d389f07884880b4a598ea92a00df86e9>>
*/
"use strict";
@@ -1529,11 +1529,14 @@ function fastAddProperties(payload, props, validAttributes) {
return payload;
}
for (i in props) {
var prop = props[i];
if (void 0 !== prop) {
var attributeConfig = validAttributes[i];
if (null != attributeConfig) {
var newValue = void 0;
var prop = props[i],
attributeConfig = validAttributes[i];
if (null != attributeConfig) {
var newValue = void 0;
if (void 0 === prop)
if (payload && void 0 !== payload[i]) newValue = null;
else continue;
else
"function" === typeof prop
? (newValue = !0)
: "object" !== typeof attributeConfig
@@ -1541,10 +1544,9 @@ function fastAddProperties(payload, props, validAttributes) {
: "function" === typeof attributeConfig.process
? (newValue = attributeConfig.process(prop))
: "function" === typeof attributeConfig.diff && (newValue = prop);
void 0 !== newValue
? (payload || (payload = {}), (payload[i] = newValue))
: (payload = fastAddProperties(payload, prop, attributeConfig));
}
void 0 !== newValue
? (payload || (payload = {}), (payload[i] = newValue))
: (payload = fastAddProperties(payload, prop, attributeConfig));
}
}
return payload;
@@ -10626,7 +10628,7 @@ var roots = new Map(),
devToolsConfig$jscomp$inline_1136 = {
findFiberByHostInstance: getInstanceFromNode,
bundleType: 0,
version: "19.0.0-native-fb-fc1371f6-20240715",
version: "19.0.0-native-fb-f510ece8-20240715",
rendererPackageName: "react-native-renderer",
rendererConfig: {
getInspectorDataForInstance: getInspectorDataForInstance,
@@ -10669,7 +10671,7 @@ var internals$jscomp$inline_1362 = {
scheduleRoot: null,
setRefreshHandler: null,
getCurrentFiber: null,
reconcilerVersion: "19.0.0-native-fb-fc1371f6-20240715"
reconcilerVersion: "19.0.0-native-fb-f510ece8-20240715"
};
if ("undefined" !== typeof __REACT_DEVTOOLS_GLOBAL_HOOK__) {
var hook$jscomp$inline_1363 = __REACT_DEVTOOLS_GLOBAL_HOOK__;
@@ -7,7 +7,7 @@
* @noflow
* @nolint
* @preventMunge
* @generated SignedSource<<d8be9c00f80e631c9664177db73e5c3b>>
* @generated SignedSource<<eaa0badf9f8e7256b11c8a2b348e64fd>>
*/
"use strict";
@@ -1533,11 +1533,14 @@ function fastAddProperties(payload, props, validAttributes) {
return payload;
}
for (i in props) {
var prop = props[i];
if (void 0 !== prop) {
var attributeConfig = validAttributes[i];
if (null != attributeConfig) {
var newValue = void 0;
var prop = props[i],
attributeConfig = validAttributes[i];
if (null != attributeConfig) {
var newValue = void 0;
if (void 0 === prop)
if (payload && void 0 !== payload[i]) newValue = null;
else continue;
else
"function" === typeof prop
? (newValue = !0)
: "object" !== typeof attributeConfig
@@ -1545,10 +1548,9 @@ function fastAddProperties(payload, props, validAttributes) {
: "function" === typeof attributeConfig.process
? (newValue = attributeConfig.process(prop))
: "function" === typeof attributeConfig.diff && (newValue = prop);
void 0 !== newValue
? (payload || (payload = {}), (payload[i] = newValue))
: (payload = fastAddProperties(payload, prop, attributeConfig));
}
void 0 !== newValue
? (payload || (payload = {}), (payload[i] = newValue))
: (payload = fastAddProperties(payload, prop, attributeConfig));
}
}
return payload;
@@ -11336,7 +11338,7 @@ var roots = new Map(),
devToolsConfig$jscomp$inline_1217 = {
findFiberByHostInstance: getInstanceFromNode,
bundleType: 0,
version: "19.0.0-native-fb-fc1371f6-20240715",
version: "19.0.0-native-fb-f510ece8-20240715",
rendererPackageName: "react-native-renderer",
rendererConfig: {
getInspectorDataForInstance: getInspectorDataForInstance,
@@ -11392,7 +11394,7 @@ var roots = new Map(),
scheduleRoot: null,
setRefreshHandler: null,
getCurrentFiber: null,
reconcilerVersion: "19.0.0-native-fb-fc1371f6-20240715"
reconcilerVersion: "19.0.0-native-fb-f510ece8-20240715"
});
exports.createPortal = function (children, containerTag) {
return createPortal$1(
@@ -7,7 +7,7 @@
* @noflow
* @nolint
* @preventMunge
* @generated SignedSource<<ab02954b794765fe68c9cb9644087ac1>>
* @generated SignedSource<<fd8c5816169e40a05f759444daf33511>>
*/
"use strict";
@@ -16999,11 +16999,11 @@ __DEV__ &&
var emptyObject = {};
Object.freeze(emptyObject);
var isomorphicReactPackageVersion = React.version;
if ("19.0.0-native-fb-fc1371f6-20240715" !== isomorphicReactPackageVersion)
if ("19.0.0-native-fb-f510ece8-20240715" !== isomorphicReactPackageVersion)
throw Error(
'Incompatible React versions: The "react" and "react-native-renderer" packages must have the exact same version. Instead got:\n - react: ' +
(isomorphicReactPackageVersion +
"\n - react-native-renderer: 19.0.0-native-fb-fc1371f6-20240715\nLearn more: https://react.dev/warnings/version-mismatch")
"\n - react-native-renderer: 19.0.0-native-fb-f510ece8-20240715\nLearn more: https://react.dev/warnings/version-mismatch")
);
if (
"function" !==
@@ -17051,12 +17051,12 @@ __DEV__ &&
scheduleRoot: scheduleRoot,
setRefreshHandler: setRefreshHandler,
getCurrentFiber: getCurrentFiberForDevTools,
reconcilerVersion: "19.0.0-native-fb-fc1371f6-20240715"
reconcilerVersion: "19.0.0-native-fb-f510ece8-20240715"
});
})({
findFiberByHostInstance: getInstanceFromTag,
bundleType: 1,
version: "19.0.0-native-fb-fc1371f6-20240715",
version: "19.0.0-native-fb-f510ece8-20240715",
rendererPackageName: "react-native-renderer",
rendererConfig: {
getInspectorDataForInstance: getInspectorDataForInstance,
@@ -7,7 +7,7 @@
* @noflow
* @nolint
* @preventMunge
* @generated SignedSource<<4b2464da555845662b7117ab2c659d6f>>
* @generated SignedSource<<a2971cab9eb7b72016a85890000a9ee8>>
*/
"use strict";
@@ -10780,11 +10780,11 @@ function traverseOwnerTreeUp(hierarchy, instance) {
traverseOwnerTreeUp(hierarchy, instance);
}
var isomorphicReactPackageVersion = React.version;
if ("19.0.0-native-fb-fc1371f6-20240715" !== isomorphicReactPackageVersion)
if ("19.0.0-native-fb-f510ece8-20240715" !== isomorphicReactPackageVersion)
throw Error(
'Incompatible React versions: The "react" and "react-native-renderer" packages must have the exact same version. Instead got:\n - react: ' +
(isomorphicReactPackageVersion +
"\n - react-native-renderer: 19.0.0-native-fb-fc1371f6-20240715\nLearn more: https://react.dev/warnings/version-mismatch")
"\n - react-native-renderer: 19.0.0-native-fb-f510ece8-20240715\nLearn more: https://react.dev/warnings/version-mismatch")
);
if (
"function" !==
@@ -10834,7 +10834,7 @@ var roots = new Map(),
devToolsConfig$jscomp$inline_1210 = {
findFiberByHostInstance: getInstanceFromTag,
bundleType: 0,
version: "19.0.0-native-fb-fc1371f6-20240715",
version: "19.0.0-native-fb-f510ece8-20240715",
rendererPackageName: "react-native-renderer",
rendererConfig: {
getInspectorDataForInstance: getInspectorDataForInstance,
@@ -10877,7 +10877,7 @@ var internals$jscomp$inline_1457 = {
scheduleRoot: null,
setRefreshHandler: null,
getCurrentFiber: null,
reconcilerVersion: "19.0.0-native-fb-fc1371f6-20240715"
reconcilerVersion: "19.0.0-native-fb-f510ece8-20240715"
};
if ("undefined" !== typeof __REACT_DEVTOOLS_GLOBAL_HOOK__) {
var hook$jscomp$inline_1458 = __REACT_DEVTOOLS_GLOBAL_HOOK__;
@@ -7,7 +7,7 @@
* @noflow
* @nolint
* @preventMunge
* @generated SignedSource<<d791c8826fdba1b7d0835589cd9d82de>>
* @generated SignedSource<<ce3f17ac83aab7c99650f55fc2e294ba>>
*/
"use strict";
@@ -11491,11 +11491,11 @@ function traverseOwnerTreeUp(hierarchy, instance) {
traverseOwnerTreeUp(hierarchy, instance);
}
var isomorphicReactPackageVersion = React.version;
if ("19.0.0-native-fb-fc1371f6-20240715" !== isomorphicReactPackageVersion)
if ("19.0.0-native-fb-f510ece8-20240715" !== isomorphicReactPackageVersion)
throw Error(
'Incompatible React versions: The "react" and "react-native-renderer" packages must have the exact same version. Instead got:\n - react: ' +
(isomorphicReactPackageVersion +
"\n - react-native-renderer: 19.0.0-native-fb-fc1371f6-20240715\nLearn more: https://react.dev/warnings/version-mismatch")
"\n - react-native-renderer: 19.0.0-native-fb-f510ece8-20240715\nLearn more: https://react.dev/warnings/version-mismatch")
);
if (
"function" !==
@@ -11545,7 +11545,7 @@ var roots = new Map(),
devToolsConfig$jscomp$inline_1291 = {
findFiberByHostInstance: getInstanceFromTag,
bundleType: 0,
version: "19.0.0-native-fb-fc1371f6-20240715",
version: "19.0.0-native-fb-f510ece8-20240715",
rendererPackageName: "react-native-renderer",
rendererConfig: {
getInspectorDataForInstance: getInspectorDataForInstance,
@@ -11601,7 +11601,7 @@ var roots = new Map(),
scheduleRoot: null,
setRefreshHandler: null,
getCurrentFiber: null,
reconcilerVersion: "19.0.0-native-fb-fc1371f6-20240715"
reconcilerVersion: "19.0.0-native-fb-f510ece8-20240715"
});
exports.__SECRET_INTERNALS_DO_NOT_USE_OR_YOU_WILL_BE_FIRED = {
computeComponentStackForErrorReporting: function (reactTag) {