URL incorrectly adds trailing slash

🐛 Bug Report

URL polyfill in React Native 0.59 is broken because it’s not compliant to WHATWG URL Standard. And it’s broken even for the simplest use cases.

To Reproduce

const url = new URL('https://facebook.github.io/react-native/img/header_logo.png');
console.log(url);

Expected Behavior

https://facebook.github.io/react-native/img/header_logo.png

Actual Behavior

https://facebook.github.io/react-native/img/header_logo.png/

Note the trailing slash causes the URL points to a 404 page.

Environment

  React Native Environment Info:
    System:
      OS: macOS 10.14.4
      CPU: (12) x64 Intel(R) Core(TM) i7-8750H CPU @ 2.20GHz
      Memory: 823.64 MB / 16.00 GB
      Shell: 3.2.57 - /bin/bash
    Binaries:
      Node: 10.15.0
      Yarn: 1.15.2
      npm: 6.5.0
      Watchman: 4.9.0
    SDKs:
      iOS SDK:
        Platforms: iOS 12.2, macOS 10.14, tvOS 12.2, watchOS 5.2
      Android SDK:
        API Levels: 28
        Build Tools: 28.0.3
        System Images: android-28 | Intel x86 Atom_64, android-28 | Google APIs Intel x86 Atom
    IDEs:
      Android Studio: 3.3 AI-182.5107.16.33.5314842
      Xcode: 10.2/10E125 - /usr/bin/xcodebuild
    npmPackages:
      react: 16.8.3 => 16.8.3 
      react-native: 0.59.4 => 0.59.4 

Possible Cause

https://github.com/facebook/react-native/blob/65033d7078654bae2a87e4791dbb725110ae6bad/Libraries/Blob/URL.js#L146-L149

This code was introduced in https://github.com/facebook/react-native/pull/22901 .

[charpeni]

👋 You should check this out: https://github.com/charpeni/react-native-url-polyfill.

[redreceipt]

I’ll second this issue, having to add a goofy workaround

    const url = new URL(baseURL);
    // NOTE: RN adds a trailing slash
    // https://github.com/facebook/react-native/issues/24428
    url._url = url.toString().endsWith('/')
      ? url.toString().slice(0, -1)
      : url.toString();