fix: update file-type dependency and fix dependency version mismatch (#6638)

Author: AlessioGr

.idea/runConfigurations/_template__of_JavaScriptTestRunnerJest.xml

@@ -41,5 +41,6 @@
       "source.fixAll.eslint": "explicit"
     }
   },
-  "files.insertFinalNewline": true
+  "files.insertFinalNewline": true,
+  "jestrunner.jestCommand": "pnpm exec cross-env NODE_OPTIONS=\"--experimental-vm-modules --no-deprecation\" node 'node_modules/jest/bin/jest.js'"
 }

.vscode/settings.json

@@ -1,24 +1,7 @@
-/**
- * Ignores all ESM packages that make Jest mad.
- *
- * "Jest encountered an unexpected token"
- *
- * Direct packages:
- * - file-type
- */
-const esModules = [
-  // file-type and all dependencies: https://github.com/sindresorhus/file-type
-  'file-type',
-  'strtok3',
-  'readable-web-to-node-stream',
-  'token-types',
-  'peek-readable',
-].join('|')
-
-/** @type {import('jest').Config} */
-const baseJestConfig = {
+/** @type {import('jest').Config} */ const baseJestConfig = {
   extensionsToTreatAsEsm: ['.ts', '.tsx'],
-  setupFilesAfterEnv: ['<rootDir>/test/jest.setup.ts'],
+  setupFiles: ['<rootDir>/test/jest.setup.env.js'],
+  setupFilesAfterEnv: ['<rootDir>/test/jest.setup.js'],
   moduleNameMapper: {
     '\\.(css|scss)$': '<rootDir>/test/helpers/mocks/emptyModule.js',
     '\\.(jpg|jpeg|png|gif|eot|otf|webp|svg|ttf|woff|woff2|mp4|webm|wav|mp3|m4a|aac|oga)$':
@@ -31,10 +14,6 @@ const baseJestConfig = {
   transform: {
     '^.+\\.(t|j)sx?$': ['@swc/jest'],
   },
-  transformIgnorePatterns: [
-    `/node_modules/(?!.pnpm)(?!(${esModules})/)`,
-    `/node_modules/.pnpm/(?!(${esModules.replace(/\//g, '\\+')})@)`,
-  ],
   verbose: true,
 }
 

jest.config.js

@@ -13,7 +13,7 @@
 /** @type {import('jest').Config} */
 const customJestConfig = {
   extensionsToTreatAsEsm: ['.ts', '.tsx'],
-  // setupFilesAfterEnv: ['<rootDir>/jest.setup.ts'],
+  // setupFilesAfterEnv: ['<rootDir>/jest.setup.js'],
   moduleNameMapper: {
     '\\.(css|scss)$': '<rootDir>/helpers/mocks/emptyModule.js',
     '\\.(jpg|jpeg|png|gif|eot|otf|webp|svg|ttf|woff|woff2|mp4|webm|wav|mp3|m4a|aac|oga)$':

packages/create-payload-app/jest.config.js

@@ -47,7 +47,7 @@
     "@payloadcms/translations": "workspace:*",
     "@payloadcms/ui": "workspace:*",
     "busboy": "^1.6.0",
-    "file-type": "19.0.0 || 19.0.0-rc-f994737d14-20240522",
+    "file-type": "17.1.6",
     "graphql-http": "^1.22.0",
     "graphql-playground-html": "1.6.30",
     "http-status": "1.6.2",

packages/next/package.json

@@ -89,7 +89,7 @@
     "console-table-printer": "2.11.2",
     "dataloader": "2.2.2",
     "deepmerge": "4.3.1",
-    "file-type": "16.5.4",
+    "file-type": "17.1.6",
     "find-up": "7.0.0",
     "get-tsconfig": "^4.7.2",
     "http-status": "1.6.2",

packages/payload/package.json

@@ -1,7 +1,6 @@
 import type { OutputInfo, Sharp, SharpOptions } from 'sharp'
 
-import fileType from 'file-type'
-const { fromBuffer } = fileType
+import { fileTypeFromBuffer } from 'file-type'
 import fs from 'fs'
 import mkdirp from 'mkdirp'
 import sanitize from 'sanitize-filename'
@@ -161,7 +160,7 @@ export const generateFileData = async <T>({
     if (sharpFile) {
       const metadata = await sharpFile.metadata()
       fileBuffer = await sharpFile.toBuffer({ resolveWithObject: true })
-      ;({ ext, mime } = await fromBuffer(fileBuffer.data)) // This is getting an incorrect gif height back.
+      ;({ ext, mime } = await fileTypeFromBuffer(fileBuffer.data)) // This is getting an incorrect gif height back.
       fileData.width = fileBuffer.info.width
       fileData.height = fileBuffer.info.height
       fileData.filesize = fileBuffer.info.size

packages/payload/src/uploads/generateFileData.ts

@@ -1,7 +1,6 @@
-import fileType from 'file-type'
+import { fileTypeFromFile } from 'file-type'
 import fs from 'fs'
 import path from 'path'
-const { fromFile } = fileType
 
 import type { PayloadRequestWithData } from '../types/index.js'
 
@@ -12,7 +11,7 @@ const mimeTypeEstimate = {
 export const getFileByPath = async (filePath: string): Promise<PayloadRequestWithData['file']> => {
   if (typeof filePath === 'string') {
     const data = fs.readFileSync(filePath)
-    const mimetype = fromFile(filePath)
+    const mimetype = fileTypeFromFile(filePath)
     const { size } = fs.statSync(filePath)
 
     const name = path.basename(filePath)

packages/payload/src/uploads/getFileByPath.ts

@@ -1,8 +1,6 @@
 import type { OutputInfo, Sharp, SharpOptions } from 'sharp'
 
-import fileType from 'file-type'
-const { fromBuffer } = fileType
-
+import { fileTypeFromBuffer } from 'file-type'
 import fs from 'fs'
 import sanitize from 'sanitize-filename'
 
@@ -343,7 +341,7 @@ export async function resizeAndTransformImageSizes({
         req.payloadUploadSizes[imageResizeConfig.name] = bufferData
       }
 
-      const mimeInfo = await fromBuffer(bufferData)
+      const mimeInfo = await fileTypeFromBuffer(bufferData)
 
       const imageNameWithDimensions = createImageName(
         sanitizedImage.name,