Skip to content

Commit

Permalink
fix(VFileInput): conditionally return single File instead of File[]
Browse files Browse the repository at this point in the history
  • Loading branch information
johnleider committed Mar 28, 2024
1 parent f66d83f commit 581bbbc
Showing 1 changed file with 8 additions and 2 deletions.
10 changes: 8 additions & 2 deletions packages/vuetify/src/components/VFileInput/VFileInput.tsx
Expand Up @@ -66,7 +66,7 @@ export const makeVFileInputProps = propsFactory({
...makeVInputProps({ prependIcon: '$file' }),

modelValue: {
type: Array as PropType<File[]>,
type: [Array, File] as PropType<File[] | File>,
default: () => ([]),
validator: (val: any) => {
return wrapInArray(val).every(v => v != null && typeof v === 'object')
Expand All @@ -92,7 +92,13 @@ export const VFileInput = genericComponent<VFileInputSlots>()({

setup (props, { attrs, emit, slots }) {
const { t } = useLocale()
const model = useProxiedModel(props, 'modelValue')
const model = useProxiedModel(
props,
'modelValue',
props.modelValue,
val => wrapInArray(val),
val => (props.multiple || Array.isArray(props.modelValue)) ? val : val[0],
)
const { isFocused, focus, blur } = useFocus(props)
const base = computed(() => typeof props.showSize !== 'boolean' ? props.showSize : undefined)
const totalBytes = computed(() => (model.value ?? []).reduce((bytes, { size = 0 }) => bytes + size, 0))
Expand Down

4 comments on commit 581bbbc

@donalmurtagh
Copy link

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Prior to this change, <VFileInput> always returned an array of files. Now it returns a single file when the multiple prop is false.
Therefore, this is a breaking change to the API of a very widely used component that should not be made in a patch release and should have been clearly signalled as such in the release notes.

@johnleider
Copy link
Member Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

You'll need to show how this is breaking. The only change is if you provide a non-array model.

@KaelWD
Copy link
Member

@KaelWD KaelWD commented on 581bbbc Apr 4, 2024

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

I can see how this could change if you were initialising it to null, but this is a bug fix.

https://xkcd.com/1172/

@donalmurtagh
Copy link

@donalmurtagh donalmurtagh commented on 581bbbc Apr 4, 2024

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

You'll need to show how this is breaking.

It's a breaking change because if I use

<VFileInput v-model="foo" />

Then if foo is initially null, then when a file is uploaded, it was previously set to a File array, but now it will be set to a File. I'm surprised you're disputing this, given that your commit message says:

fix(VFileInput): conditionally return single File instead of File[]

I also know it's a breaking change, because when I upgraded to this version, the file inputs stopped working, causing a bunch of e2e tests to fail.

Please sign in to comment.