Skip to content

Adding an onRequest interceptor to ofetch instance causes registerEndpoint to not be reached #1402

@MikeBellika

Description

@MikeBellika

Environment

  • Operating System: Darwin
  • Node Version: v22.17.0
  • Nuxt Version: 4.1.0
  • CLI Version: 3.28.0
  • Nitro Version: 2.12.5
  • Package Manager: [email protected]
  • Builder: -
  • User Config: compatibilityDate, devtools, modules
  • Runtime Modules: @nuxt/[email protected]
  • Build Modules: -

Reproduction

https://github.com/MikeBellika/nuxt-test-utils-ofetch-repro

pnpm i && pnpm test

Describe the bug

Using an ofetch instance with an onRequest interceptor prevents registerEndpoint from being called.

<script setup lang="ts">
async function fetcher() {
  const fetcher = $fetch.create({});
  await fetcher("/test/");
}
async function customFetcher() {
  const fetcher = $fetch.create({
    onRequest() {},
  });
  await fetcher("/test/");
}
</script>
<template>
  <div>
    <button data-testid="normal-fetcher" @click="fetcher">fetch</button>
    <button data-testid="custom-fetcher" @click="customFetcher">fetch</button>
  </div>
</template>
import { mountSuspended, registerEndpoint } from "@nuxt/test-utils/runtime";
import { it, expect, vi } from "vitest";
import app from "../../app/app.vue";

it("/test/ called without onRequest intercepted", async () => {
  // ✅ This test passes. It clicks the button that uses a fetcher without `onRequest`
  const endpoint = vi.fn(() => "hello");
  registerEndpoint("/test/", () => endpoint());
  const component = await mountSuspended(app);
  component
    .find<HTMLButtonElement>('[data-testid="normal-fetcher"]')
    .element.click();
  expect(endpoint).toHaveBeenCalled();
  component.unmount();
});

it("/test/ called WITH onRequest intercepted", async () => {
  // ❌ This test fails. Calls the fetcher that has a custom `onRequest`
  const endpoint = vi.fn(() => "hello");
  registerEndpoint("/test/", () => endpoint());
  const component = await mountSuspended(app);
  component
    .find<HTMLButtonElement>('[data-testid="custom-fetcher"]')
    .element.click();
  expect(endpoint).toHaveBeenCalled();
  component.unmount();
});

Additional context

Probably related to #798

Logs

Metadata

Metadata

Assignees

No one assigned

    Type

    No type

    Projects

    No projects

    Milestone

    No milestone

    Relationships

    None yet

    Development

    No branches or pull requests

    Issue actions