From e35ca71bca6231138eadbc281177a8ff7948c071 Mon Sep 17 00:00:00 2001
From: trashcoder <dennis@audiomixing.de>
Date: Tue, 27 Jun 2023 09:10:13 -0700
Subject: [PATCH] Trashcoder/blob slice content type (#38078)
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

Summary:
I added the contentType parameter to Blob.slice like it's in the MDN Web docs.
This PR fixes https://github.com/facebook/react-native/issues/38058

When i slice a Blob for chunked uploads with react native i lost the content type, e.g. "image/jpeg", so the server doesn't know what kind of file he gets. In the docs of MDN the slice method was described with a third contentType parameter which was missing in Metas implementation.
## Changelog:
 [GENERAL] [ADDED] added a third parameter "contentType" to method slice of class Blob.

<!-- Help reviewers and the release process by writing your own changelog entry.

Pick one each for the category and type tags:

[ANDROID|GENERAL|IOS|INTERNAL] [BREAKING|ADDED|CHANGED|DEPRECATED|REMOVED|FIXED|SECURITY] - Message

For more details, see:
https://reactnative.dev/contributing/changelogs-in-pull-requests

Pull Request resolved: https://github.com/facebook/react-native/pull/38078

Test Plan:
I tested it with the unit-tests:
yarn run test Blob-test.js
yarn run v1.22.19
$ jest Blob-test.js
 PASS  packages/react-native/Libraries/Blob/__tests__/Blob-test.js
  Blob
    ✓ should create empty blob (5 ms)
    ✓ should create blob from other blobs and strings
    ✓ should slice a blob (1 ms)
    ✓ should slice a blob and sets a contentType
    ✓ should close a blob (4 ms)

My added unit test results "✓ should slice a blob and sets a contentType".

Reviewed By: hoxyq

Differential Revision: D47057162

Pulled By: blakef

fbshipit-source-id: 0931b0b828f81b9b90562ffd51d4111c81034ffc
---
 packages/react-native/Libraries/Blob/Blob.js         |  3 ++-
 .../Libraries/Blob/__tests__/Blob-test.js            | 12 ++++++++++++
 2 files changed, 14 insertions(+), 1 deletion(-)

diff --git a/packages/react-native/Libraries/Blob/Blob.js b/packages/react-native/Libraries/Blob/Blob.js
index a75fb1b3688..886e2573364 100644
--- a/packages/react-native/Libraries/Blob/Blob.js
+++ b/packages/react-native/Libraries/Blob/Blob.js
@@ -81,7 +81,7 @@ class Blob {
     return this._data;
   }
 
-  slice(start?: number, end?: number): Blob {
+  slice(start?: number, end?: number, contentType: string = ''): Blob {
     const BlobManager = require('./BlobManager');
     let {offset, size} = this.data;
 
@@ -109,6 +109,7 @@ class Blob {
       blobId: this.data.blobId,
       offset,
       size,
+      type: contentType,
       /* Since `blob.slice()` creates a new view onto the same binary
        * data as the original blob, we should re-use the same collector
        * object so that the underlying resource gets deallocated when
diff --git a/packages/react-native/Libraries/Blob/__tests__/Blob-test.js b/packages/react-native/Libraries/Blob/__tests__/Blob-test.js
index e5308c0d2c5..303fe1d9fb6 100644
--- a/packages/react-native/Libraries/Blob/__tests__/Blob-test.js
+++ b/packages/react-native/Libraries/Blob/__tests__/Blob-test.js
@@ -78,6 +78,18 @@ describe('Blob', function () {
     expect(sliceC.size).toBe(Math.min(blob.data.size, 34569) - 34543);
   });
 
+  it('should slice a blob and sets a contentType', () => {
+    const blob = new Blob();
+
+    blob.data.size = 34546;
+
+    const slice = blob.slice(0, 2354, 'text/plain');
+
+    expect(slice.data.offset).toBe(0);
+    expect(slice.size).toBe(2354);
+    expect(slice.type).toBe('text/plain');
+  });
+
   it('should close a blob', () => {
     const blob = new Blob();