Setting borderStyle on <View> to dashed or dotted for a single side does not render correctly on both iOS and Android

[Eyesonly88]

🐛 Bug Report

Setting the CSS property borderStyle to dashed or dotted for a single side on a View component does not work on both iOS and Android.

The docs show available values: https://facebook.github.io/react-native/docs/view-style-props#borderstyle

Android renders solid line for both dashed/dotted

iOS does not render anything for dashed/dotted

To Reproduce

Set a borderStyle css property on a View for a single side like this:

borderLeftWidth: 3,
borderLeftColor: 'red',
borderStyle: 'dashed',

Expected Behavior

A dashed border is rendered correctly on iOS and Android

Code Example

Snack: https://snack.expo.io/@mido/react-native-borderstyle-dashed-and-dotted-broken

Environment

  React Native Environment Info:
    System:
      OS: macOS 10.14.4
      CPU: (8) x64 Intel(R) Core(TM) i7-7820HQ CPU @ 2.90GHz
      Memory: 977.25 MB / 16.00 GB
      Shell: 5.3 - /bin/zsh
    Binaries:
      Node: 8.12.0 - ~/.nvm/versions/node/v8.12.0/bin/node
      Yarn: 1.6.0 - /usr/local/bin/yarn
      npm: 6.4.1 - ~/.nvm/versions/node/v8.12.0/bin/npm
      Watchman: 4.9.0 - /usr/local/bin/watchman
    SDKs:
      iOS SDK:
        Platforms: iOS 12.2, macOS 10.14, tvOS 12.2, watchOS 5.2
      Android SDK:
        API Levels: 21, 22, 23, 24, 25, 26, 27
        Build Tools: 26.0.3, 27.0.3, 28.0.2, 28.0.3
        System Images: android-24 | Google APIs Intel x86 Atom, android-27 | Google Play Intel x86 Atom, android-28 | Google APIs Intel x86 Atom
    IDEs:
      Android Studio: 3.1 AI-173.4907809
      Xcode: 10.2/10E125 - /usr/bin/xcodebuild
    npmPackages:
      react: 16.8.3 => 16.8.3
      react-native: 0.59.2 => 0.59.2
    npmGlobalPackages:
      react-native-log-ios: 1.0.1

[react-native-bot]

It looks like you are using an older version of React Native. Please update to the latest release, v0.59 and verify if the issue still exists.

The "Resolution: Old Version" label will be removed automatically once you edit your original post with the results of running `react-native info` on a project using the latest release.

[Eyesonly88]

Tested on 0.59.2 as well and it's still broken.

[retyui]

#23537

[Eyesonly88]

@retyui thanks for the link. This bug is specifically talking about <View> borderStyle prop which should be supported according to the docs.

[michalchudziak]

I was able to reproduce the issue with the latest release (0.59.5)