`useFetch()`TS error when using `useRequestHeader()`

Environment

---

• Operating System: Darwin
• Node Version: v16.16.0
• Nuxt Version: 3.0.0-rc.10
• Nitro Version: 0.5.3
• Package Manager: yarn@1.22.19
• Builder: vite
• User Config: -
• Runtime Modules: -
• Build Modules: -

---

Reproduction

I tried to reproduce in stackblitz but didnt get any TS errors so not sure if its an environment thing. I did spin up a completely clean app with nuxi init and the error was there.

<template>
  <div>
    {{ items }}
  </div>
</template>

<script setup lang="ts">
useHead({
  title: "Items",
});

const { data: items } = await useFetch("/api/items", {
  headers: useRequestHeaders(["cookie"]),
});
</script>

Describe the bug

TS error on the header field of userFetch()

Argument of type '{ headers: Record<"cookie", string>; }' is not assignable to parameter of type 'UseFetchOptions<unknown, (res: unknown) => unknown, KeyOfRes<(res: unknown) => unknown>>'.
  Object literal may only specify known properties, but 'headers' does not exist in type 'UseFetchOptions<unknown, (res: unknown) => unknown, KeyOfRes<(res: unknown) => unknown>>'. Did you mean to write 'aheaders'?ts(2345)

Additional context

No response

Logs

No response

[GerryWilko]

This appears to be an issue related to this change https://github.com/nuxt/framework/pull/5748

The useRequestHeaders composable was changed to allow for headers not being found and returning undefined

All the fetch composables have the type definition of headers set to Record<string, string> so the current return type of Record<string, string | undefined> from useRequestHeaders is incompatible.

A simple workaround for now is to as Record<string, string> the result of useRequestHeaders.

[then3rdman]

It is being caused by some external factor. Not sure what yet, or even how… but I will need to add in things bit by bit to see what is causing the issue