204 No content generated code throws JSON parsing error

[zZHorizonZz]

What are the steps to reproduce this issue?

1. Create new project with fetch client from openapi scheme which returns 204 (No content).
2. Try calling the generated method.
3. You should get error Unexpected end of JSON input error.

What happens?

Basically when there is no response in fetch client response there is no content. Which mean the res.json() will throw error.

Generated code looks like this:

const data = await res.json()

return { status: res.status, data }

What were you expecting to happen?

There shouldn't be a error.

Any logs, error output, etc?

SyntaxError: Unexpected end of JSON input
    at JSON.parse (<anonymous>)
    at parseJSONFromBytes (node:internal/deps/undici/undici:4306:19)
    at successSteps (node:internal/deps/undici/undici:4288:27)
    at consumeBody (node:internal/deps/undici/undici:4294:9)
    at _Response.json (node:internal/deps/undici/undici:4239:18)

Any other comments?

I think when there is 204 in specs or there is no content in openapi specification the const data should not be generated and data should not be required in generated responses as there are none.

What versions are you using?

  System:
    OS: Linux 6.9 Pop!_OS 22.04 LTS
    CPU: (24) x64 AMD Ryzen 9 7900X 12-Core Processor
    Memory: 9.64 GB / 31.08 GB
    Container: Yes
    Shell: 5.1.16 - /bin/bash
  npmPackages:
    orval: ^7.1.1 => 7.1.1 
    react: rc => 19.0.0-rc-0751fac7-20241002 
    zod: 3.23.8 => 3.23.8 

[soartec-lab]

@zZHorizonZz

There is no solution for this yet, but you can work-around it by using a custom fetch like below:

const getBody = async <T>(c: Response | Request): Promise<T> => {
	const text = await c.text();

	if (!text) {
		return {} as T;
	}

	const contentType = c.headers.get("content-type");

	if (contentType?.includes("application/json")) {
		return JSON.parse(text);
	}

	return text as unknown as T;
};

export const customFetch = async <T>(
	url: string,
	options: RequestInit,
): Promise<T> => {
		const response = await fetch();
		const data = await getBody<T>(response);

		return { status: response.status, data } as T;
};