From ffcaef64e4041f0ebbbede979af0ae816ceee571 Mon Sep 17 00:00:00 2001 From: Nick Gerleman Date: Fri, 10 Sep 2021 00:56:18 -0700 Subject: [PATCH] Fix BorderExample Crash on Out of Tree Platforms (#32120) Summary: https://github.com/facebook/react-native/commit/9b4f8e01442356f820e135fae3849063b2b8c92c#diff-ee44452e2deeb3a607e863852bb720518875b88c4e78ea7dc76805488bfb1818 added examples to the border test page using PlatformColor. An iOS specific instance was later conditioned to only iOS in https://github.com/facebook/react-native/commit/f6d0f9deaccdc53114d47b8a69c49fda7cb1f8e1#diff-ee44452e2deeb3a607e863852bb720518875b88c4e78ea7dc76805488bfb1818 but one example remains that has values for Android, and iOS only. This causes a crash on at least RNW, since none of the PlatformColors are valid. This change addsa a fallback to black for unsupported platforms, and also adds a Windows PlatformColor for kicks (and marginal extra usefuleness). ## Changelog [Internal] [Fixed] - Fix BorderExample Crash on Out of Tree Platforms Pull Request resolved: https://github.com/facebook/react-native/pull/32120 Test Plan: Validated on RNTester on Windows. Reviewed By: yungsters Differential Revision: D30822765 Pulled By: lunaleaps fbshipit-source-id: 6b3e65204259205bb2f3c9153a2361d1decebe98 --- packages/rn-tester/js/examples/Border/BorderExample.js | 10 ++++++---- 1 file changed, 6 insertions(+), 4 deletions(-) diff --git a/packages/rn-tester/js/examples/Border/BorderExample.js b/packages/rn-tester/js/examples/Border/BorderExample.js index 1c256df9aba..34a4db8b16c 100644 --- a/packages/rn-tester/js/examples/Border/BorderExample.js +++ b/packages/rn-tester/js/examples/Border/BorderExample.js @@ -183,10 +183,12 @@ const styles = StyleSheet.create({ }, border15: { borderWidth: 10, - borderColor: PlatformColor( - 'systemGray4', - '@android:color/holo_orange_dark', - ), + borderColor: Platform.select({ + ios: PlatformColor('systemGray4'), + android: PlatformColor('@android:color/holo_orange_dark'), + windows: PlatformColor('SystemAccentColorDark1'), + default: 'black', + }), }, border16: { borderWidth: 10,