Filepond validate

Question

(links placed correct )

<link href="https://unpkg.com/filepond@^4/dist/filepond.css" rel="stylesheet" />
<script src="https://unpkg.com/filepond@^4/dist/filepond.js"></script>
<script src="https://unpkg.com/filepond-plugin-image-resize/dist/filepond-plugin-image-resize.js"></script>

<script src="https://unpkg.com/filepond-plugin-file-validate-type/dist/filepond-plugin-file-validate-type.js"></script>
<script src="https://unpkg.com/filepond-plugin-image-exif-orientation/dist/filepond-plugin-image-exif-orientation.min.js"></script>

<script src="https://unpkg.com/filepond/dist/filepond.js"></script>

   
 <script>
        FilePond.registerPlugin(FilePondPluginImageResize);
        FilePond.registerPlugin(FilePondPluginFileValidateType);


        const inputElement = document.querySelector('input[id="photo"]');
        FilePond.setOptions({
          server: {
            url: '/upload',
            headers: {
              'X-CSRF-TOKEN': '{{ csrf_token() }}'
            }
          },
          validate: {
            acceptedFileTypes: ['image/jpeg', 'image/png', 'image/webp'],
            maxFileSize: 2 * 1024 * 1024 // 2 MB
        }
        });
      </script>

Is there anyone who can help me with filepond file validation? I've added it this way and if it doesn't work it sends on to the server with no problem. I have also tried adding validation in the backend but without success (the backend is written in Laravel) I want the user to be able to upload an image that does not weigh more than 2 MB and has the extensions jpg and png. I have no errors in the console