dotansimha / dotansimha/graphql-code-generator-community

[typescript-react-query] Generated fetch method not specifying Content-Type header

Open
#195 0 comments 4 reactions 0 assignees View on GitHub
Dominant language
TypeScript
Stars
137
Forks
195
Avg merge
6h 20m
Merged PRs (30d)
16

Description

### Issue workflow progress

_Progress of the issue based on the [Contributor Workflow](https://github.com/the-guild-org/Stack/blob/master/CONTRIBUTING.md#a-typical-contributor-workflow)_

- [ ] 1. The issue provides a reproduction available on [GitHub](https://github.com/dotansimha/graphql-code-generator-issue-sandbox-template), [Stackblitz](https://stackblitz.com/github/dotansimha/graphql-code-generator-issue-sandbox-template) or [CodeSandbox](https://codesandbox.io/s/github/dotansimha/graphql-code-generator-issue-sandbox-template)

> Make sure to fork this template and run `yarn generate` in the terminal.
>
> Please make sure the Codegen and plugins version under `package.json` matches yours.

- [ ] 2. A failing test has been provided
- [ ] 3. A local solution has been provided
- [ ] 4. A pull request is pending review

---

**Describe the bug**

The environment fetch method in `@graphql-codegen/typescript-react-query` is not specifying the `Content-Type` header even though the payload is always JSON which can be seen from the code snippets below. This may result incorrect parsing of the body and thus invalid request.

https://github.com/dotansimha/graphql-code-generator/blob/5685e5f521cd3f2edf44b7331fbfa6c7e361977a/packages/plugins/typescript/react-query/src/fetcher-fetch.ts#L19-L23

https://github.com/dotansimha/graphql-code-generator/blob/5685e5f521cd3f2edf44b7331fbfa6c7e361977a/packages/plugins/typescript/react-query/src/fetcher-fetch-hardcoded.ts#L43-L46

**To Reproduce**
Steps to reproduce the behavior:

Use any GraphQL server which requires proper Content-Type header, e.g. Next.JS + @graphql-yoga/node

3. My `codegen.yml` config file:

```yaml
overwrite: true
schema: http://localhost:3000/api/graphql
documents: './{pages,utils}/**/*.{ts,tsx}'
generates:
graphql/generated.ts:
plugins:
- typescript
- typescript-operations
- typescript-resolvers
- typescript-react-query
config:
fetcher:
endpoint: 'http://localhost:3000/api/graphql'
```

**Expected behavior**

Request header should specify proper Content-Type. This can be done by modifying the config property in `codegen.yml`

```yaml
config:
fetcher:
endpoint: 'http://localhost:3000/api/graphql'
fetchParams:
headers:
Content-Type: application/json
```

Since the request body is always JSON it would be better to add that to the generated file. I'd be happy to create a PR if this change proposal is accepted.

Contributor guide

No contributing guide indexed for this repository

Assessment

This issue has not been assessed yet.

Get new issues in your inbox

A short digest of beginner-friendly GitHub issues.