chore(storage-s3): add int tests for filename encoding (#14970)

Adds some int tests as a follow up to
#14438

---------

Co-authored-by: Jens Becker <info@jhb.software>

Author: paulpopus

test/storage-s3/collections/MediaWithDirectAccess.ts

@@ -0,0 +1,15 @@
+import type { CollectionConfig } from 'payload'
+
+export const MediaWithDirectAccess: CollectionConfig = {
+  slug: 'media-with-direct-access',
+  upload: {
+    disableLocalStorage: true,
+  },
+  fields: [
+    {
+      name: 'alt',
+      label: 'Alt Text',
+      type: 'text',
+    },
+  ],
+}

test/storage-s3/config.ts

@@ -6,12 +6,14 @@ import path from 'path'
 import { buildConfigWithDefaults } from '../buildConfigWithDefaults.js'
 import { devUser } from '../credentials.js'
 import { Media } from './collections/Media.js'
+import { MediaWithDirectAccess } from './collections/MediaWithDirectAccess.js'
 import { MediaWithDynamicPrefix } from './collections/MediaWithDynamicPrefix.js'
 import { MediaWithPrefix } from './collections/MediaWithPrefix.js'
 import { MediaWithSignedDownloads } from './collections/MediaWithSignedDownloads.js'
 import { Users } from './collections/Users.js'
 import {
   mediaSlug,
+  mediaWithDirectAccessSlug,
   mediaWithDynamicPrefixSlug,
   mediaWithPrefixSlug,
   mediaWithSignedDownloadsSlug,
@@ -33,7 +35,14 @@ export default buildConfigWithDefaults({
       baseDir: path.resolve(dirname),
     },
   },
-  collections: [Media, MediaWithDynamicPrefix, MediaWithPrefix, MediaWithSignedDownloads, Users],
+  collections: [
+    Media,
+    MediaWithDirectAccess,
+    MediaWithDynamicPrefix,
+    MediaWithPrefix,
+    MediaWithSignedDownloads,
+    Users,
+  ],
   onInit: async (payload) => {
     await payload.create({
       collection: 'users',
@@ -47,6 +56,9 @@ export default buildConfigWithDefaults({
     s3Storage({
       collections: {
         [mediaSlug]: true,
+        [mediaWithDirectAccessSlug]: {
+          disablePayloadAccessControl: true,
+        },
         [mediaWithDynamicPrefixSlug]: true,
         [mediaWithPrefixSlug]: {
           prefix,

test/storage-s3/int.spec.ts

@@ -9,6 +9,7 @@ import type { NextRESTClient } from '../helpers/NextRESTClient.js'
 import { initPayloadInt } from '../helpers/initPayloadInt.js'
 import {
   mediaSlug,
+  mediaWithDirectAccessSlug,
   mediaWithDynamicPrefixSlug,
   mediaWithPrefixSlug,
   mediaWithSignedDownloadsSlug,
@@ -121,6 +122,49 @@ describe('@payloadcms/storage-s3', () => {
     expect(response.status).toBe(404)
   })
 
+  describe('disablePayloadAccessControl', () => {
+    it('should return direct S3 URL with encoded filename when uploading file with spaces', async () => {
+      const upload = await payload.create({
+        collection: mediaWithDirectAccessSlug,
+        data: {},
+        filePath: path.resolve(dirname, '../uploads/image with spaces.png'),
+      })
+
+      expect(upload.id).toBeTruthy()
+      expect(upload.filename).toBe('image with spaces.png')
+
+      // When disablePayloadAccessControl is true, URL should point directly to S3
+      // and the filename should be URL-encoded
+      expect(upload.url).toContain(process.env.S3_ENDPOINT)
+      expect(upload.url).toContain(TEST_BUCKET)
+      expect(upload.url).toContain('image%20with%20spaces.png')
+
+      // Verify the file can be fetched using the URL
+      const response = await fetch(upload.url)
+      expect(response.status).toBe(200)
+      expect(response.headers.get('Content-Type')).toBe('image/png')
+    })
+
+    it('should return direct S3 URL without encoding issues for normal filenames', async () => {
+      const upload = await payload.create({
+        collection: mediaWithDirectAccessSlug,
+        data: {},
+        filePath: path.resolve(dirname, '../uploads/image.png'),
+      })
+
+      expect(upload.id).toBeTruthy()
+
+      // URL should point directly to S3
+      expect(upload.url).toContain(process.env.S3_ENDPOINT)
+      expect(upload.url).toContain(TEST_BUCKET)
+      expect(upload.url).toContain('image.png')
+
+      // Verify the file can be fetched
+      const response = await fetch(upload.url)
+      expect(response.status).toBe(200)
+    })
+  })
+
   describe('R2', () => {
     it.todo('can upload')
   })

test/storage-s3/payload-types.ts

@@ -68,6 +68,7 @@ export interface Config {
   blocks: {};
   collections: {
     media: Media;
+    'media-with-direct-access': MediaWithDirectAccess;
     'media-with-dynamic-prefix': MediaWithDynamicPrefix;
     'media-with-prefix': MediaWithPrefix;
     'media-with-signed-downloads': MediaWithSignedDownload;
@@ -80,6 +81,7 @@ export interface Config {
   collectionsJoins: {};
   collectionsSelect: {
     media: MediaSelect<false> | MediaSelect<true>;
+    'media-with-direct-access': MediaWithDirectAccessSelect<false> | MediaWithDirectAccessSelect<true>;
     'media-with-dynamic-prefix': MediaWithDynamicPrefixSelect<false> | MediaWithDynamicPrefixSelect<true>;
     'media-with-prefix': MediaWithPrefixSelect<false> | MediaWithPrefixSelect<true>;
     'media-with-signed-downloads': MediaWithSignedDownloadsSelect<false> | MediaWithSignedDownloadsSelect<true>;
@@ -92,6 +94,7 @@ export interface Config {
   db: {
     defaultIDType: string;
   };
+  fallbackLocale: null;
   globals: {};
   globalsSelect: {};
   locale: null;
@@ -158,6 +161,25 @@ export interface Media {
     };
   };
 }
+/**
+ * This interface was referenced by `Config`'s JSON-Schema
+ * via the `definition` "media-with-direct-access".
+ */
+export interface MediaWithDirectAccess {
+  id: string;
+  alt?: string | null;
+  updatedAt: string;
+  createdAt: string;
+  url?: string | null;
+  thumbnailURL?: string | null;
+  filename?: string | null;
+  mimeType?: string | null;
+  filesize?: number | null;
+  width?: number | null;
+  height?: number | null;
+  focalX?: number | null;
+  focalY?: number | null;
+}
 /**
  * This interface was referenced by `Config`'s JSON-Schema
  * via the `definition` "media-with-dynamic-prefix".
@@ -267,6 +289,10 @@ export interface PayloadLockedDocument {
         relationTo: 'media';
         value: string | Media;
       } | null)
+    | ({
+        relationTo: 'media-with-direct-access';
+        value: string | MediaWithDirectAccess;
+      } | null)
     | ({
         relationTo: 'media-with-dynamic-prefix';
         value: string | MediaWithDynamicPrefix;
@@ -367,6 +393,24 @@ export interface MediaSelect<T extends boolean = true> {
             };
       };
 }
+/**
+ * This interface was referenced by `Config`'s JSON-Schema
+ * via the `definition` "media-with-direct-access_select".
+ */
+export interface MediaWithDirectAccessSelect<T extends boolean = true> {
+  alt?: T;
+  updatedAt?: T;
+  createdAt?: T;
+  url?: T;
+  thumbnailURL?: T;
+  filename?: T;
+  mimeType?: T;
+  filesize?: T;
+  width?: T;
+  height?: T;
+  focalX?: T;
+  focalY?: T;
+}
 /**
  * This interface was referenced by `Config`'s JSON-Schema
  * via the `definition` "media-with-dynamic-prefix_select".

test/storage-s3/shared.ts

@@ -4,3 +4,4 @@ export const mediaWithDynamicPrefixSlug = 'media-with-dynamic-prefix'
 export const prefix = 'test-prefix'
 
 export const mediaWithSignedDownloadsSlug = 'media-with-signed-downloads'
+export const mediaWithDirectAccessSlug = 'media-with-direct-access'