When I fetch with any method (POST, DELETE, etc), on any url, an additional GET request gets triggered on said url. This is a problem in the case of a DELETE /items/:id which followed by a GET /items/:id causes an error because it tries to process the related svelte page with undefined as the input data.
I tried with several pages and several methods, with console.logs at the beginning of endpoints, this behavior is always the same.
I have no hook and I don't reload the page after requests. All my fetch calls are contained within functions that can only be called via events on the DOM, so nothing is on the script's root.
Here's an example of a DELETE endpoint (I'm mainly testing against this one) :
export const DELETE = async ({params}) => {
await meta.findOneAndDelete({url: params.url})
return {}
}
It even occurs with this :
export const POST = async () => {
return {}
}
I call this endpoint with a fetch(/items/${url}, {method: 'POST'}) behind a click event, and it triggers a GET /items/:url everytime. I should point out that these GET requests are not visible in the dev tools, I only see the console.logs I put in the GET endpoints and the potential errors on the server console.
It looks like these endpoints redirect to GET /items, probably to make them work nicely with HTML forms (which is funny for DELETE endpoint, since forms only support GET and POST).
You can use redirect option in your fetch call:
fetch(url, {
method: 'POST',
redirect: 'manual',
});
This will automatically cancel the following request.