Closed
Description
Laravel Precognition Plugin Version
0.5.14
Laravel Version
11.36.1
Plugin
Vue w/ Inertia
Description
When validating a specific field in a form, files that are nested within objects inside arrays are still being sent with the request payload. This behaviour is unexpected, as all Files should be removed unless specified with form.validateFiles
.
This issue originates from the forgetFiles
function (in validator.ts
), which does not handle files nested in arrays of objects properly.
Expected behaviour:
Files within an object in an array should also be filtered to avoid sending unnecessary (large) data multiple times.
As forgetFiles
is a core function this problem probably exists in all environments. (Vue, React, Blade, ...)
Steps To Reproduce
<script setup lang="ts">
import { useForm } from 'laravel-precognition-vue-inertia';
const form = useForm('post', 'my-api-route', {
files: [
{ file: new File(['content'], 'file1.txt'), name: 'text1' },
{ file: new File(['content'], 'file2.txt'), name: 'text2' },
],
otherProp: '123',
});
</script>
<template>
<input v-model="form.otherProp" @change="form.validate('otherProp')">
</template>
<style scoped>
</style>
When an input is made, the whole form data is sent, including the files:
-----------------------------1078484437383686068291059444
Content-Disposition: form-data; name="files[0][file]"; filename="file1.txt"
Content-Type: application/octet-stream
content
-----------------------------1078484437383686068291059444
Content-Disposition: form-data; name="files[0][name]"
text1
-----------------------------1078484437383686068291059444
Content-Disposition: form-data; name="files[1][file]"; filename="file2.txt"
Content-Type: application/octet-stream
content
-----------------------------1078484437383686068291059444
Content-Disposition: form-data; name="files[1][name]"
text2
-----------------------------1078484437383686068291059444
Content-Disposition: form-data; name="otherProp"
1
-----------------------------1078484437383686068291059444--