SolidJSS
SolidJS•2y ago•
25 replies
danchez

Getting ReferenceError: React is not defined with Vitest + Solid Testing Library

I honestly have no idea how I am receiving this error but I am despite testing using @solidjs/testing-library. Moreover, I am using Vitest by itself (not Vite) and my vitest.config.ts is as follows:

import { defineConfig } from "vitest/config";

export default defineConfig({
  test: {
    globals: true,
    environment: "jsdom",
    setupFiles: ["./setupTests.ts"],
    deps: {
      optimizer: {
        web: { enabled: true },
        ssr: { enabled: true },
      },
    },
    isolate: false,
    coverage: {
      provider: "istanbul",
    },
  },
});

The test that is causing the error to appear is a custom Solid hook test where I am attempting to pass a wrapper to my renderHook invocation.

import { renderHook } from "@solidjs/testing-library";
import { describe, expect, it } from "vitest";

import { createDbQuery } from "../createDbQuery";

function FakeComponent() {
  return <div />
}

describe("HOOK: createDbQuery", () => {
  it("can be used as expected", async () => {
    const { result } = renderHook(() => createDbQuery((d) => d), { wrapper: FakeComponent });
    const db = createDbQuery.database();

    expect(result()).toEqual({ rows: [], docs: [] });
    await db.put({ good: true });
    expect(result().docs.length).toBe(1);
  });
});


ReferenceError: React is not defined
 ❯ Object.FakeComponent [as wrapper] src/__tests__/createDbQuery.test.tsx:7:3
      5| 
      6| function FakeComponent() {
      7|   return <div />
       |   ^
      8| }
      9|


Anybody seen that before?
Was this page helpful?