QUploader `headers` and `form-fields`: wrong type defintion

[1312rene]

What happened?

The docs suggest that the headers and form-fields props both take a { name: string; value: string }[], but according to the docs they should also accept a function. In the docs going by both the description of the props themselves as a note in the docs themselves, this function has shape (files: readonly any[]) => { name: string; value: string }[]

However, this gives errors that a string is expected as the return type. This tracks with the type definition:

headers?:
    | {
        /**
         * Header name
         */
        name: string;
        /**
         * Header value
         */
        value: string;
      }[]
    | ((files: readonly any[]) => string)
    | undefined;

It seems the type definition is wrong. I can ignore this by just doing as unknown as string in my code, and it works as expected. It seems that there is an error in the (generated) types

What did you expect to happen?

I expected headers type to be:

headers?:
    | {
        /**
         * Header name
         */
        name: string;
        /**
         * Header value
         */
        value: string;
      }[]
    | (files: readonly any[]) => { name: string; value: string }[]
    | undefined;

Reproduction URL

https://codepen.io/Ren-Brandt/pen/QwbeJVp

How to reproduce?

You can take any implementation of QUploader and make the headers prop a function which returns { name: string; value: string }[]. Or take the reproduction URL and copy-paste into any TS-enabled app running the latest Quasar

Flavour

Quasar CLI with Vite (@quasar/cli | @quasar/app-vite)

Areas

TypeScript Support

Platforms/Browsers

No response

Quasar info output

Operating System - Windows_NT(10.0.19045) - win32/x64
NodeJs - 22.14.0

Global packages
  NPM - 11.4.2
  yarn - 1.22.22
  pnpm - Not installed
  bun - Not installed
  @quasar/cli - 2.5.0
  @quasar/icongenie - 4.0.0
  cordova - Not installed

Important local packages
  quasar - 2.18.1 -- Build high-performance VueJS user interfaces (SPA, PWA, SSR, Mobile and Desktop) in record time
  @quasar/app-vite - 2.2.1 -- Quasar Framework App CLI with Vite
  @quasar/extras - 1.17.0 -- Quasar Framework fonts, icons and animations
  eslint-plugin-quasar - Not installed
  vue - 3.5.16 -- The progressive JavaScript framework for building modern web UI.
  vue-router - 4.5.1
  pinia - 3.0.3 -- Intuitive, type safe and flexible Store for Vue
  vite - 6.3.5 -- Native-ESM powered web dev build tool
  vite-plugin-checker - Not installed
  eslint - 9.28.0 -- An AST-based pattern checker for JavaScript.
  esbuild - 0.25.3 -- An extremely fast JavaScript and CSS bundler and minifier.
  typescript - 5.8.3 -- TypeScript is a language for application scale JavaScript development
  workbox-build - Not installed
  register-service-worker - Not installed
  electron - Not installed
  @electron/packager - Not installed
  electron-builder - Not installed
  @capacitor/core - Not installed
  @capacitor/cli - Not installed
  @capacitor/android - Not installed
  @capacitor/ios - Not installed

Quasar App Extensions
  @quasar/quasar-app-extension-testing-unit-vitest - 1.2.3 -- A Quasar App Extension for running 
tests with Vitest

Networking
  Host - G3H16G3
  vEthernet (Default Switch) - 172.20.208.1
  Wi-Fi - 10.14.12.4

Relevant log output

Additional context

No response

[github-actions]

Hi @1312rene! 👋

It looks like you provided an invalid or unsupported reproduction URL.
Do not use any service other than Codepen, jsFiddle, StackBlitz, CodeSandbox, and GitHub.
Make sure the URL you provided is correct and reachable. You can test it by visiting it in a private tab, another device, etc.
Please edit your original post above and provide a valid reproduction URL as explained.

Without a proper reproduction, your issue will have to get closed.

Thank you for your collaboration. 👏