Restore Previous Behavior for StyleSheet Validation of Null/Undefined Styles (#29171)
Summary: https://github.com/facebook/react-native/issues/27264 changed stylesheet validation to avoid enumerating properties on the prototype of a style. It introduces a secondary behavior change, where null/undefined styles used to be tolerated but now lead to an exception. This is because `for in undefined` will noop where `for of Object.keys(undefined)` will throw. This scenario of undefined/null styles seems to actually show up in practice and was previously well tolerated. E.g. `Button.js` has code that looks like this: ```jsx const styles = StyleSheet.create({ button: Platform.select({ ios: {}, android: { elevation: 4, // Material design blue from https://material.google.com/style/color.html#color-color-palette backgroundColor: '#2196F3', borderRadius: 2, }, }), ``` For non ios/Android platforms, that creates a style object which looks like: ```js { button: undefined, ... } ``` This previously meant that the component would be unstyled if created, but now means out-of-tree platforms throw if the builtin Button component is required. This change restores the previous `for in` loop but adds a `hasOwnProperty` check to avoid properties on prototypes. ## Changelog [General] [Fixed] - Restore Previous Behavior for StyleSheet Validation of Null/Undefined Styles Pull Request resolved: https://github.com/facebook/react-native/pull/29171 Test Plan: Validated that importing Buttons will no longer cause an exception, and that invalid properties are still caught. Reviewed By: JoshuaGross Differential Revision: D22118379 Pulled By: TheSavior fbshipit-source-id: 650c64b934ccd12a3dc1b75e95debc359925ad73
This commit is contained in:
Родитель
530d11c506
Коммит
e75557b48f
|
@ -51,6 +51,9 @@ class StyleSheetValidation {
|
||||||
if (!__DEV__ || global.__RCTProfileIsProfiling) {
|
if (!__DEV__ || global.__RCTProfileIsProfiling) {
|
||||||
return;
|
return;
|
||||||
}
|
}
|
||||||
|
if (!styles[name]) {
|
||||||
|
return;
|
||||||
|
}
|
||||||
const styleProps = Object.keys(styles[name]);
|
const styleProps = Object.keys(styles[name]);
|
||||||
for (const prop of styleProps) {
|
for (const prop of styleProps) {
|
||||||
StyleSheetValidation.validateStyleProp(
|
StyleSheetValidation.validateStyleProp(
|
||||||
|
|
Загрузка…
Ссылка в новой задаче