From 572dd76ba01bda58db75e5aabdc48cf5e5957fa7 Mon Sep 17 00:00:00 2001 From: Cody Bennett Date: Tue, 31 Oct 2023 11:58:27 -0700 Subject: [PATCH] Revert "BlobManager: implement Blob from ArrayBuffer (#39276)" (#41170) Summary: As per https://github.com/facebook/react-native/issues/41079, we're outputting ASCII encoded data URIs to `FileReader.readAsDataURL` due to lack of native `ArrayBuffer` support and unclear use of encoding to align with web. I'll revisit this at a later point with a better testing strategy once we have a good idea of how this should behave internally. Aside from purely reverting https://github.com/facebook/react-native/issues/39276, I've kept the use of `ArrayBuffer.isView(part)` to the previous `part instanceof global.ArrayBufferView` since it is more correct. ## Changelog: [INTERNAL] [REMOVED] - Revert Blob from ArrayBuffer Pull Request resolved: https://github.com/facebook/react-native/pull/41170 Test Plan: Run the following at the project root to selectively test changes: `jest packages/react-native/Libraries/Blob` Reviewed By: cipolleschi Differential Revision: D50601036 Pulled By: dmytrorykun fbshipit-source-id: 0ef5c960c253db255c2f8532ea1f44111093706c --- packages/react-native/Libraries/Blob/Blob.js | 5 +---- .../react-native/Libraries/Blob/BlobManager.js | 14 ++++++-------- packages/react-native/Libraries/Blob/File.js | 2 +- .../Libraries/Blob/__tests__/Blob-test.js | 13 +++---------- 4 files changed, 11 insertions(+), 23 deletions(-) diff --git a/packages/react-native/Libraries/Blob/Blob.js b/packages/react-native/Libraries/Blob/Blob.js index 98ae81ba840..886e2573364 100644 --- a/packages/react-native/Libraries/Blob/Blob.js +++ b/packages/react-native/Libraries/Blob/Blob.js @@ -57,10 +57,7 @@ class Blob { * Currently we only support creating Blobs from other Blobs. * Reference: https://developer.mozilla.org/en-US/docs/Web/API/Blob/Blob */ - constructor( - parts: Array<$ArrayBufferView | ArrayBuffer | Blob | string> = [], - options?: BlobOptions, - ) { + constructor(parts: Array = [], options?: BlobOptions) { const BlobManager = require('./BlobManager'); this.data = BlobManager.createFromParts(parts, options).data; } diff --git a/packages/react-native/Libraries/Blob/BlobManager.js b/packages/react-native/Libraries/Blob/BlobManager.js index 73deaf6f9ff..f4c5ed37499 100644 --- a/packages/react-native/Libraries/Blob/BlobManager.js +++ b/packages/react-native/Libraries/Blob/BlobManager.js @@ -11,7 +11,6 @@ import type {BlobCollector, BlobData, BlobOptions} from './BlobTypes'; import NativeBlobModule from './NativeBlobModule'; -import {fromByteArray} from 'base64-js'; import invariant from 'invariant'; const Blob = require('./Blob'); @@ -60,7 +59,7 @@ class BlobManager { * Create blob from existing array of blobs. */ static createFromParts( - parts: Array<$ArrayBufferView | ArrayBuffer | Blob | string>, + parts: Array, options?: BlobOptions, ): Blob { invariant(NativeBlobModule, 'NativeBlobModule is available.'); @@ -68,12 +67,11 @@ class BlobManager { const blobId = uuidv4(); const items = parts.map(part => { if (part instanceof ArrayBuffer || ArrayBuffer.isView(part)) { - return { - // $FlowFixMe[incompatible-cast] - data: fromByteArray(new Uint8Array((part: ArrayBuffer))), - type: 'string', - }; - } else if (part instanceof Blob) { + throw new Error( + "Creating blobs from 'ArrayBuffer' and 'ArrayBufferView' are not supported", + ); + } + if (part instanceof Blob) { return { data: part.data, type: 'blob', diff --git a/packages/react-native/Libraries/Blob/File.js b/packages/react-native/Libraries/Blob/File.js index c89744190ad..6f643307c5d 100644 --- a/packages/react-native/Libraries/Blob/File.js +++ b/packages/react-native/Libraries/Blob/File.js @@ -23,7 +23,7 @@ class File extends Blob { * Constructor for JS consumers. */ constructor( - parts: Array<$ArrayBufferView | ArrayBuffer | Blob | string>, + parts: Array, name: string, options?: BlobOptions, ) { diff --git a/packages/react-native/Libraries/Blob/__tests__/Blob-test.js b/packages/react-native/Libraries/Blob/__tests__/Blob-test.js index f33667c9ed6..303fe1d9fb6 100644 --- a/packages/react-native/Libraries/Blob/__tests__/Blob-test.js +++ b/packages/react-native/Libraries/Blob/__tests__/Blob-test.js @@ -15,7 +15,6 @@ jest.setMock('../../BatchedBridge/NativeModules', { }); const Blob = require('../Blob'); -const {fromByteArray} = require('base64-js'); describe('Blob', function () { it('should create empty blob', () => { @@ -27,7 +26,7 @@ describe('Blob', function () { expect(blob.type).toBe(''); }); - it('should create blob from ArrayBuffer, other blobs, strings', () => { + it('should create blob from other blobs and strings', () => { const blobA = new Blob(); const blobB = new Blob(); const textA = 'i \u2665 dogs'; @@ -44,20 +43,14 @@ describe('Blob', function () { blobA.data.size = 34540; blobB.data.size = 65452; - const buffer = new ArrayBuffer(4); - - const blob = new Blob([blobA, blobB, textA, textB, textC, buffer]); + const blob = new Blob([blobA, blobB, textA, textB, textC]); expect(blob.size).toBe( blobA.size + blobB.size + global.Buffer.byteLength(textA, 'UTF-8') + global.Buffer.byteLength(textB, 'UTF-8') + - global.Buffer.byteLength(textC, 'UTF-8') + - global.Buffer.byteLength( - fromByteArray(new Uint8Array(buffer)), - 'UTF-8', - ), + global.Buffer.byteLength(textC, 'UTF-8'), ); expect(blob.type).toBe(''); });