[^0.71.0] - borderLeftColor and borderRightColor is not rendered properly

[lfrallon]

Description

I apologise in advance if this is not the right place to submit an issue like this.

Version

0.71.2

Output of npx react-native info

System:
OS: Linux 6.1 Fedora Linux 37 (Workstation Edition)
CPU: (4) x64 Intel(R) Core(TM) i3-4030U CPU @ 1.90GHz
Memory: 983.09 MB / 7.21 GB
Shell: 5.9 - /usr/bin/zsh
Binaries:
Node: 18.12.1 - ~/.nvm/versions/node/v18.12.1/bin/node
Yarn: 1.22.19 - ~/.nvm/versions/node/v18.12.1/bin/yarn
npm: 8.19.2 - ~/.nvm/versions/node/v18.12.1/bin/npm
Watchman: 20221126.133621.0 - /usr/local/bin/watchman
SDKs:
Android SDK:
API Levels: 23, 26, 27, 28, 29, 30, 31, 33
Build Tools: 24.0.0, 24.0.1, 24.0.2, 24.0.3, 28.0.3, 29.0.2, 30.0.2, 30.0.3, 31.0.0, 33.0.0
System Images: android-30 | Google APIs Intel x86 Atom
Android NDK: Not Found
IDEs:
Android Studio: Not Found
Languages:
Java: 19.0.1 - /usr/bin/javac
npmPackages:
@react-native-community/cli: Not Found
react: 18.2.0 => 18.2.0
react-native: ^0.71.0 => 0.71.2
npmGlobalPackages:
react-native: Not Found

Steps to reproduce

The usual way to run the react-native app.

Snack, code example, screenshot, or link to a repository

import React from 'react';
import {
  StyleSheet,
  View,
} from 'react-native';
import {SafeAreaView} from 'react-native-safe-area-context';

const App: React.FC = () => {
  return (
    <SafeAreaView style={[styles.container]}>
        <View style={styles.scanRegion}>
            <View style={styles.scanRegionContainer}>
              <View style={styles.scanTopRegion}>
                <View style={styles.topLeftRegion} />
                <View style={styles.topRightRegion} />
              </View>
              <View style={styles.scanBottomRegion}>
                <View style={styles.bottomLeftRegion} />
                <View style={styles.bottomRightRegion} />
              </View>
            </View>
          </View>
    </SafeAreaView>
  );
}

export default App;

const styles = StyleSheet.create({
  bottomLeftRegion: {
      borderLeftWidth: 6,
      borderBottomWidth: 6,
      borderBottomLeftRadius: 20,
      borderLeftColor: '#FFFFFF',
      borderBottomColor: '#FFFFFF',
      width: 50,
      height: 50,
  },
  bottomRightRegion: {
      borderRightWidth: 6,
      borderBottomWidth: 6,
      borderBottomRightRadius: 20,
      borderRightColor: '#FFFFFF',
      borderBottomColor: '#FFFFFF',
      width: 50,
      height: 50,
    },
  container: {
      flex: 1,
  },
  scanRegion: {
      position: 'absolute',
      top: '20%',
      left: '15%',
      width: '70%',
      height: '30%',
    },
  scanRegionContainer: {
      padding: 20,
      flex: 1,
  },
  scanBottomRegion: {
      flexDirection: 'row',
      justifyContent: 'space-between',
  },
  scanTopRegion: {
      flex: 1,
      flexDirection: 'row',
      justifyContent: 'space-between',
  },
  topLeftRegion: {
      borderLeftWidth: 6,
      borderTopWidth: 6,
      borderTopLeftRadius: 20,
      borderLeftColor: '#FFFFFF',
      borderTopColor: '#FFFFFF',
      width: 50,
      height: 50,
  },
  topRightRegion: {
      borderRightWidth: 6,
      borderTopWidth: 6,
      borderTopRightRadius: 20,
      borderRightColor: '#FFFFFF',
      borderTopColor: '#FFFFFF',
      width: 50,
      height: 50,
  },
});