Implement URL and URLSearchParams

Author: charpeni

Diff for: .eslintrc.js

@@ -1 +1 @@
-module.exports = { extends: "@react-native-community" };
+module.exports = {extends: '@react-native-community'};

Diff for: .prettierrc

@@ -1,5 +1,4 @@
 {
-  "requirePragma": true,
   "singleQuote": true,
   "trailingComma": "all",
   "bracketSpacing": false,

Diff for: babel.config.js

@@ -0,0 +1,3 @@
+module.exports = {
+  presets: ['module:metro-react-native-babel-preset'],
+};

Diff for: js/URL.js

@@ -0,0 +1,53 @@
+import {URL as whatwgUrl} from 'whatwg-url-without-unicode';
+import NativeBlobModule from 'react-native/Libraries/Blob/NativeBlobModule';
+
+let BLOB_URL_PREFIX = null;
+
+if (
+  NativeBlobModule &&
+  typeof NativeBlobModule.getConstants().BLOB_URI_SCHEME === 'string'
+) {
+  const constants = NativeBlobModule.getConstants();
+  BLOB_URL_PREFIX = constants.BLOB_URI_SCHEME + ':';
+  if (typeof constants.BLOB_URI_HOST === 'string') {
+    BLOB_URL_PREFIX += `//${constants.BLOB_URI_HOST}/`;
+  }
+}
+
+/**
+ * To allow Blobs be accessed via `content://` URIs,
+ * you need to register `BlobProvider` as a ContentProvider in your app's `AndroidManifest.xml`:
+ *
+ * ```xml
+ * <manifest>
+ *   <application>
+ *     <provider
+ *       android:name="com.facebook.react.modules.blob.BlobProvider"
+ *       android:authorities="@string/blob_provider_authority"
+ *       android:exported="false"
+ *     />
+ *   </application>
+ * </manifest>
+ * ```
+ * And then define the `blob_provider_authority` string in `res/values/strings.xml`.
+ * Use a dotted name that's entirely unique to your app:
+ *
+ * ```xml
+ * <resources>
+ *   <string name="blob_provider_authority">your.app.package.blobs</string>
+ * </resources>
+ * ```
+ */
+
+whatwgUrl.createObjectURL = function createObjectURL(blob) {
+  if (BLOB_URL_PREFIX === null) {
+    throw new Error('Cannot create URL for blob!');
+  }
+  return `${BLOB_URL_PREFIX}${blob.data.blobId}?offset=${blob.data.offset}&size=${blob.size}`;
+};
+
+whatwgUrl.revokeObjectURL = function revokeObjectURL(url) {
+  // Do nothing.
+};
+
+export const URL = whatwgUrl;

Diff for: js/URLSearchParams.js

@@ -0,0 +1 @@
+export {URLSearchParams} from 'whatwg-url-without-unicode';

Diff for: js/__tests__/URL-test.js

@@ -0,0 +1,64 @@
+import {URL} from '../URL';
+
+describe('URL', function() {
+  it('should pass Mozilla Dev Network examples', () => {
+    const a = new URL('/', 'https://developer.mozilla.org');
+    expect(a.href).toBe('https://developer.mozilla.org/');
+    const b = new URL('https://developer.mozilla.org');
+    expect(b.href).toBe('https://developer.mozilla.org/');
+    const c = new URL('en-US/docs', b);
+    expect(c.href).toBe('https://developer.mozilla.org/en-US/docs');
+    const d = new URL('/en-US/docs', b);
+    expect(d.href).toBe('https://developer.mozilla.org/en-US/docs');
+    const f = new URL('/en-US/docs', d);
+    expect(f.href).toBe('https://developer.mozilla.org/en-US/docs');
+    const g = new URL(
+      '/en-US/docs',
+      'https://developer.mozilla.org/fr-FR/toto',
+    );
+    expect(g.href).toBe('https://developer.mozilla.org/en-US/docs');
+    const h = new URL('/en-US/docs', a);
+    expect(h.href).toBe('https://developer.mozilla.org/en-US/docs');
+  });
+
+  it('should pass WHATWG spec examples', () => {
+    const a = new URL('https:example.org');
+    expect(a.href).toBe('https://example.org/');
+    const b = new URL('https://////example.com///');
+    expect(b.href).toBe('https://example.com///');
+    const c = new URL('https://example.com/././foo');
+    expect(c.href).toBe('https://example.com/foo');
+    const d = new URL('hello:world', 'https://example.com/');
+    expect(d.href).toBe('hello:world');
+    const e = new URL('https:example.org', 'https://example.com/');
+    expect(e.href).toBe('https://example.com/example.org');
+    const f = new URL('\\example\\..\\demo/.\\', 'https://example.com/');
+    expect(f.href).toBe('https://example.com/demo/');
+    const g = new URL('example', 'https://example.com/demo');
+    expect(g.href).toBe('https://example.com/example');
+  });
+
+  it('should support unicode', () => {
+    const a = new URL('https://r3---sn-p5qlsnz6.googlevideo.com');
+    expect(a.href).toBe('https://r3---sn-p5qlsnz6.googlevideo.com/');
+  });
+
+  // https://github.com/facebook/react-native/issues/25717
+  it('should pass issue #25717 example', () => {
+    const a = new URL('about', 'https://www.mozilla.org');
+    expect(a.href).toBe('https://www.mozilla.org/about');
+
+    const b = new URL('dev', 'https://google.dev');
+    expect(b.href).toBe('https://google.dev/dev');
+  });
+
+  // https://github.com/facebook/react-native/issues/24428
+  it('should pass issue #24428 example', () => {
+    const url = new URL(
+      'https://facebook.github.io/react-native/img/header_logo.png',
+    );
+    expect(url.href).toBe(
+      'https://facebook.github.io/react-native/img/header_logo.png',
+    );
+  });
+});

Diff for: js/__tests__/URLSearchParams-test.js

@@ -0,0 +1,24 @@
+import {URLSearchParams} from '../URLSearchParams';
+
+describe('URL', function() {
+  // https://developer.mozilla.org/en-US/docs/Web/API/URLSearchParams#Examples
+  it('should pass Mozilla Dev Network examples', () => {
+    const paramsString = 'q=URLUtils.searchParams&topic=api';
+    const searchParams = new URLSearchParams(paramsString);
+
+    expect(searchParams.has('topic')).toBe(true);
+    expect(searchParams.get('topic')).toBe('api');
+    expect(searchParams.getAll('topic')).toEqual(['api']);
+    expect(searchParams.get('foo')).toBe(null);
+    searchParams.append('topic', 'webdev');
+    expect(searchParams.toString()).toBe(
+      'q=URLUtils.searchParams&topic=api&topic=webdev',
+    );
+    searchParams.set('topic', 'More webdev');
+    expect(searchParams.toString()).toBe(
+      'q=URLUtils.searchParams&topic=More+webdev',
+    );
+    searchParams.delete('topic');
+    expect(searchParams.toString()).toBe('q=URLUtils.searchParams');
+  });
+});

Diff for: package.json

@@ -13,14 +13,28 @@
   },
   "main": "index.js",
   "scripts": {
-    "test": "echo \"Error: no test specified\" && exit 1"
+    "test": "jest"
   },
   "author": "Nicolas Charpentier <[email protected]>",
   "license": "MIT",
+  "dependencies": {
+    "buffer": "^5.4.3",
+    "whatwg-url-without-unicode": "^7.0.0"
+  },
   "devDependencies": {
     "@react-native-community/eslint-config": "^0.0.5",
     "eslint": "^6.6.0",
     "eslint-plugin-prettier": "^3.1.1",
-    "prettier": "^1.19.1"
+    "jest": "^24.9.0",
+    "metro-react-native-babel-preset": "^0.57.0",
+    "prettier": "^1.19.1",
+    "react": "^16.12.0",
+    "react-native": "^0.61.4"
+  },
+  "peerDependencies": {
+    "react-native": "*"
+  },
+  "jest": {
+    "preset": "react-native"
   }
 }