Тесты случайно не проходят при использовании graphql-request и MSW

Я пытаюсь настроить тесты для проверки загрузчика Remix и заметил, что requestфункция из graphql-request случайно не работает при использовании MSW. Если я заменю это и использую простой fetchдля запросов, которые проходят тесты.

Есть ли какая-либо конфигурация, которую мне нужно изменить? Я создал образец репо, демонстрирующий ошибку. Ошибка становится хуже, чем больше у вас тестов, использующих один и тот же фиктивный запрос.

Пример репозитория: https://github.com/charklewis/sb9or3

Вот краткое изложение кода, который я использую:

      //modules/database.server
import { GraphQLClient } from "graphql-request";
const client = new GraphQLClient("http://some-graphql-api.com/api/graphql", {});

export const fetchQuery = async (query: any, variables: any) => {
  try {
    const response = await client.request(query, variables || {});
    return response;
  } catch (error) {
    return {};
  }
};

      //routes/index
import type { LoaderFunction } from "remix";
import { json } from "remix";
import { gql } from "graphql-request";
import { fetchQuery } from "~/modules/database.server";

export const loader: LoaderFunction = async () => {
  const query = gql`
    query MyQuery {
      demoQuery {
        value
      }
    }
  `;
  const response = await fetchQuery(query, {});
  return json({ value: response.demoQuery.value });
};
      //routes/__tests__/index
import { graphql } from "msw";
import { setupServer } from "msw/node";
import { loader } from "~/routes/index";

const createServer = (handlers: any[] = []) => {
  const server = setupServer(...handlers);
  beforeAll(() => server.listen({ onUnhandledRequest: "bypass" }));
  afterAll(() => server.close());
  afterEach(() => server.resetHandlers());
  return server;
};


const createDemoQueryHandler = ({ value = true } = {}) => {
  return graphql.query("MyQuery", (req, res, ctx) => {
    return res(ctx.data({ demoQuery: { value } }));
  });
};

createServer([createDemoQueryHandler()]);

test("the loader returns data (round 1)", async () => {
  const response = await loader({
    request: new Request("/", { method: "GET" }),
    params: {},
    context: {},
  });
  const data = await response.json();
  expect(data.value).toBe(true);
});

Моя конфигурация vitest:

      /// <reference types="vitest" />
/// <reference types="vite/client" />

import { defineConfig } from "vite";
import react from "@vitejs/plugin-react";
import tsconfigPaths from "vite-tsconfig-paths";

export default defineConfig({
  plugins: [react(), tsconfigPaths()],
  test: {
    globals: true,
    environment: "jsdom",
    setupFiles: "./app/test-utils.ts",
    testTimeout: 20000
  }
});

0 ответов

Другие вопросы по тегам