fix: allow credentials option in Image (#2130)

Co-authored-by: Diego Muracciole <diegomuracciole@gmail.com>
Co-authored-by: Dmitry Ivakhnenko <jeetiss@yandex.ru>

.changeset/four-shirts-refuse.md

@@ -0,0 +1,6 @@
+---
+"@react-pdf/image": patch
+"@react-pdf/types": patch
+---
+
+fix: allow credentials option in Image

packages/image/src/resolve.js

@@ -144,12 +144,17 @@ const getImageFormat = body => {
 };
 
 const resolveImageFromUrl = async src => {
- const { uri, body, headers, method = 'GET' } = src;
+ const { uri, body, headers, method = 'GET', credentials } = src;
 
  const data =
  !BROWSER && getAbsoluteLocalPath(uri)
  ? await fetchLocalFile(uri)
- : await fetchRemoteFile(uri, { body, headers, method });
+ : await fetchRemoteFile(uri, {
+ body,
+ headers,
+ method,
+ credentials,
+ });
 
  const extension = getImageFormat(data);
 

packages/image/tests/resolve.test.js

@@ -50,6 +50,23 @@ describe('image resolveImage', () => {
  expect(fetch.mock.calls[0][1].body).toEqual(body);
  });
 
+ test('Should fetch remote image using passed credentials', async () => {
+ fetch.once(localJPGImage);
+
+ const credentials = 'include';
+ await resolveImage({ uri: jpgImageUrl, credentials });
+
+ expect(fetch.mock.calls[0][1].credentials).toBe(credentials);
+ });
+
+ test('Should not include credentials if not exist', async () => {
+ fetch.once(localJPGImage);
+
+ await resolveImage({ uri: jpgImageUrl });
+
+ expect(fetch.mock.calls[0][1].credentials).toBeUndefined();
+ });
+
  test('Should render a jpeg image over http', async () => {
  fetch.once(localJPGImage);
 

packages/types/image.d.ts

@@ -6,7 +6,7 @@ type SourceBuffer = Buffer
 
 type SourceDataBuffer = { data: Buffer; format: 'png' | 'jpg' }
 
-type SourceURLObject = { uri: string; method: HTTPMethod; body: any; headers: any }
+type SourceURLObject = { uri: string; method: HTTPMethod; body: any; headers: any; credentials?: 'omit' | 'same-origin' | 'include' }
 
 type Source =
  | SourceURL